:root{
  --bg:#eef2f7;--surface:#ffffff;--surface2:#f6f8fb;--text:#182135;--muted:#7a8496;
  --line:#e2e7ef;--primary:#103b67;--accent:#10a89f;--accent2:#238cb8;--danger:#c13b31;
  --ok:#14845b;--warning:#a56d13;--sidebar:#172235;--sidebar2:#202c42;--sidebarText:#cbd5e2;
  --shadow:0 12px 34px rgba(23,34,53,.08)
}
body.dark{
  --bg:#0f1520;--surface:#182131;--surface2:#202a3c;--text:#f2f5fb;--muted:#9ca8ba;
  --line:#2c394e;--primary:#329bc8;--accent:#19b7ac;--accent2:#48a9d1;--sidebar:#0e1623;
  --sidebar2:#172133;--sidebarText:#d6deea;--shadow:0 12px 34px rgba(0,0,0,.28)
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{
  margin:0;min-height:100vh;background:var(--bg);color:var(--text);
  font:15px Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
.app-shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr;background:var(--bg)}
.sidebar{
  background:linear-gradient(180deg,var(--sidebar),var(--sidebar2));color:var(--sidebarText);
  padding:22px 15px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:20px
}
.sidebar-logo{width:100%;max-height:66px;object-fit:contain;filter:brightness(0) invert(1);opacity:.95}
.sidebar-project{padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;text-align:center}
.sidebar-project img{max-width:155px;max-height:58px;object-fit:contain}
.side-nav{display:flex;flex-direction:column;gap:6px}
.side-nav a,.side-nav button{
  display:flex;gap:10px;align-items:center;padding:11px 12px;border-radius:9px;
  color:var(--sidebarText);border:0;background:transparent;font-weight:650;text-align:left;cursor:pointer
}
.side-nav a:hover,.side-nav a.active,.side-nav button:hover{background:rgba(24,183,169,.16);color:#fff}
.side-nav a.active{background:var(--accent);color:#fff}
.sidebar-bottom{margin-top:auto}
.main-area{min-width:0;min-height:100vh;background:var(--bg)}
.topbar{
  min-height:72px;background:var(--surface);border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;padding:0 26px;
  position:sticky;top:0;z-index:10
}
.topbar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.user-chip{display:flex;align-items:center;gap:9px}
.user-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:var(--surface2);border:1px solid var(--line)}
.page{padding:26px;max-width:1520px;margin:auto;width:100%}
.page-title{font-size:29px;margin:0 0 5px}.subtitle{color:var(--muted);margin:0}
.panel,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.panel{padding:21px;margin:17px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px;margin:18px 0}
.metric-card{padding:18px;display:flex;gap:14px;align-items:center}
.metric-icon{width:46px;height:46px;border-radius:50%;background:rgba(16,168,159,.13);display:grid;place-items:center;font-size:21px;color:var(--accent)}
.metric-label{color:var(--muted);font-size:12px}.metric{font-size:25px;font-weight:820;margin-top:3px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);gap:17px}
.dashboard-grid.equal{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:13px}
.inline,.nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.nav{justify-content:space-between}
.btn,button{min-height:40px;border:0;border-radius:9px;padding:9px 14px;background:var(--primary);color:#fff;font-weight:700;cursor:pointer}
.btn.secondary,button.secondary{background:#64748b}.btn.danger,button.danger{background:var(--danger)}
.btn.ghost,button.ghost{background:var(--surface2);color:var(--text);border:1px solid var(--line)}
button:disabled{opacity:.52;cursor:not-allowed}
input,select,textarea{
  width:100%;min-height:42px;border:1px solid var(--line);border-radius:9px;padding:9px 11px;
  background:var(--surface);color:var(--text)
}
textarea{min-height:92px;resize:vertical}label{display:flex;flex-direction:column;gap:6px;font-weight:650}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{font-size:12px;text-transform:uppercase;letter-spacing:.035em;color:var(--muted);white-space:nowrap}
th.sortable{cursor:pointer;user-select:none}th.sortable:hover{color:var(--accent)}
.sort-indicator{font-size:10px;margin-left:4px}
.foto{width:62px;height:62px;border-radius:50%;object-fit:cover;background:#d7dce5}
.project-logo{max-width:240px;max-height:84px;object-fit:contain}
.success,.error,.warning{padding:12px 14px;border-radius:10px;margin:12px 0;font-weight:650}
.success{background:rgba(18,132,90,.12);color:var(--ok)}
.error{background:rgba(196,56,43,.12);color:var(--danger)}
.warning{background:rgba(210,139,28,.12);color:var(--warning)}
.hidden{display:none!important}
.bio-pill{font-size:12px;font-weight:800}.bio-pill.ok{color:var(--ok)}.bio-pill.no{color:var(--warning)}
.wizard{width:100%;margin:0}
.steps{display:flex;gap:8px;margin-bottom:22px}.step-dot{height:6px;flex:1;border-radius:99px;background:var(--line)}
.step-dot.active,.step-dot.done{background:var(--accent)}
.wizard-stage{text-align:center;padding:28px 15px}.wizard-stage .grid{text-align:left}.big-icon{font-size:66px}
.camera-frame{
  width:min(680px,100%);aspect-ratio:4/3;margin:16px auto;border-radius:18px;overflow:hidden;
  background:#05070b;border:4px solid var(--surface2);box-shadow:var(--shadow)
}
.camera-frame video{width:100%;height:100%;object-fit:cover}
.scanner-card{text-align:center;padding:30px}.scanner-status{font-size:24px;font-weight:800}
.presence-person{display:flex;align-items:center;justify-content:center;gap:16px;margin:18px}
.presence-person .foto{width:90px;height:90px}
.age-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.age-chip{background:var(--surface2);padding:12px;border-radius:10px}
.brand{max-width:330px;max-height:68px}.container{max-width:1250px;margin:auto;padding:22px;min-height:100vh}
.global-page{min-height:100vh;background:var(--bg)}
.global-header{max-width:1250px;margin:auto;padding:20px}
.license{display:inline-block;padding:4px 8px;border-radius:99px;background:var(--surface2);font-size:12px;font-weight:750}
.check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.check-card{display:flex;align-items:center;gap:9px;background:var(--surface2);padding:10px;border-radius:9px}
.check-card input{width:auto;min-height:auto}
.chart{width:100%;min-height:250px}.chart svg{width:100%;height:auto;display:block}
.chart-legend{display:flex;gap:13px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-top:8px}
.legend-dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:5px;background:var(--accent)}
.legend-dot.alt{background:var(--accent2)}
.progress{height:10px;border-radius:99px;background:var(--surface2);overflow:hidden}.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}
.band-list{display:grid;gap:9px}.band-row{display:flex;justify-content:space-between;background:var(--surface2);padding:10px 12px;border-radius:9px}
.attention-list{display:grid;gap:8px;max-height:360px;overflow:auto}.attention-item{padding:10px;border:1px solid var(--line);border-radius:9px}
.heatmap{display:grid;gap:3px;align-items:stretch}.heat-cell{min-height:44px;border-radius:6px;display:grid;place-items:center;font-size:11px;font-weight:800;color:#0f172a;cursor:default}
.heat-label{font-size:10px;color:var(--muted);text-align:center}.heatmap-scroll{overflow:auto;padding-bottom:7px}
.profile-photo-large{width:130px;height:130px;border-radius:50%;object-fit:cover;background:var(--surface2);border:3px solid var(--line)}
.profile-grid{display:grid;grid-template-columns:220px 1fr;gap:22px}
.project-card-logo{max-height:60px;max-width:170px;object-fit:contain}
.login-card{max-width:540px;margin:55px auto}
.link{color:var(--accent2);font-weight:700;cursor:pointer}
.small{font-size:12px}.muted{color:var(--muted)}
@media(max-width:1050px){
  .app-shell{grid-template-columns:82px 1fr}.sidebar{padding:17px 9px}
  .sidebar-logo,.sidebar-project,.side-nav span.label{display:none}
  .side-nav a,.side-nav button{justify-content:center;font-size:19px}
  .dashboard-grid,.dashboard-grid.equal{grid-template-columns:1fr}
}
@media(max-width:700px){
  .app-shell{display:block}.sidebar{position:static;height:auto;flex-direction:row;overflow:auto;padding:8px}
  .side-nav{flex-direction:row}.sidebar-bottom{margin:0}.topbar{padding:0 12px}.page{padding:14px}
  .cards{grid-template-columns:1fr 1fr}.presence-person{flex-direction:column}.profile-grid{grid-template-columns:1fr}
}
