:root{
  --bg:#f5f6f3;
  --surface:#ffffff;
  --surface-2:#eef1ec;
  --ink:#12201d;
  --ink-2:#56635d;
  --muted:#8b968f;
  --border:#e0e3dd;
  --brand:#b5722e;
  --brand-strong:#8f5620;
  --brand-tint:#f4e7d8;
  --axis-org:#2a78d6;
  --axis-collab:#eb6834;
  --good:#0ca30c;
  --warn:#c97e00;
  --critical:#d03b3b;
  --good-tint:#e3f3e0;
  --warn-tint:#fbedd3;
  --critical-tint:#fae0df;
  --shadow: 0 1px 2px rgba(18,32,29,0.06), 0 8px 24px -12px rgba(18,32,29,0.16);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0e1412; --surface:#161f1c; --surface-2:#1c2622; --ink:#f3f5f2; --ink-2:#b9c2bc; --muted:#7c8a83;
    --border:#28332e; --brand:#dd9a53; --brand-strong:#eab06c; --brand-tint:#2a2015;
    --axis-org:#5b9ce6; --axis-collab:#f08454; --good:#39c239; --warn:#e0a530; --critical:#e97676;
    --good-tint:#122a16; --warn-tint:#2c2312; --critical-tint:#2c1616;
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px -12px rgba(0,0,0,0.5);
  }
}
:root[data-theme="dark"]{
  --bg:#0e1412; --surface:#161f1c; --surface-2:#1c2622; --ink:#f3f5f2; --ink-2:#b9c2bc; --muted:#7c8a83;
  --border:#28332e; --brand:#dd9a53; --brand-strong:#eab06c; --brand-tint:#2a2015;
  --axis-org:#5b9ce6; --axis-collab:#f08454; --good:#39c239; --warn:#e0a530; --critical:#e97676;
  --good-tint:#122a16; --warn-tint:#2c2312; --critical-tint:#2c1616;
  --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px -12px rgba(0,0,0,0.5);
}

*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body{background:var(--bg); color:var(--ink); font-family:'Inter',system-ui,-apple-system,sans-serif; -webkit-font-smoothing:antialiased;}
h1,h2,h3,.display{font-family:'Fraunces',Georgia,serif; text-wrap:balance;}
.tabular{font-variant-numeric:tabular-nums;}
a{color:inherit;}

.shell{max-width:1080px; margin:0 auto; padding:0 20px 64px;}
.topbar{position:sticky; top:0; z-index:20; background:var(--bg); border-bottom:1px solid var(--border); backdrop-filter: blur(6px);}
.topbar-inner{max-width:1080px; margin:0 auto; padding:12px 20px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.brand{display:flex; align-items:center; gap:12px; min-width:0;}
.brand img.logo{height:34px; width:auto; display:block; flex-shrink:0; border-radius:6px;}
.brand-text{display:flex; flex-direction:column; min-width:0;}
.brand-mark{font-family:'Fraunces',serif; font-weight:700; font-size:18px; letter-spacing:-0.01em; white-space:nowrap;}
.brand-tag{color:var(--muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.nav{display:flex; gap:6px; background:var(--surface-2); padding:4px; border-radius:12px;}
.nav a, .nav button{border:none; background:transparent; padding:9px 16px; border-radius:9px; font-family:inherit; font-size:14px; font-weight:600; color:var(--ink-2); cursor:pointer; text-decoration:none; transition:background .15s, color .15s; display:inline-flex; align-items:center;}
.nav a.active, .nav button.active{background:var(--surface); color:var(--ink); box-shadow:var(--shadow);}
.nav a:hover:not(.active), .nav button:hover:not(.active){color:var(--ink);}

.btn{font-family:inherit; font-weight:600; font-size:14.5px; border-radius:10px; padding:11px 18px; border:1px solid transparent; cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:transform .1s, background .15s, border-color .15s; text-decoration:none;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--brand); color:#fff;}
.btn-primary:hover{background:var(--brand-strong);}
.btn-ghost{background:transparent; color:var(--ink-2); border-color:var(--border);}
.btn-ghost:hover{color:var(--ink); border-color:var(--muted);}
.btn-danger{background:transparent; color:var(--critical); border-color:var(--critical);}
.btn:disabled{opacity:.45; cursor:not-allowed;}

.section-head{margin:40px 0 16px;}
.eyebrow{font-size:12.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--brand-strong);}
.section-head h2{font-size:22px; margin:4px 0 4px; font-weight:600;}
.section-head p{color:var(--ink-2); font-size:14.5px; margin:0; max-width:60ch;}

.stat-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-top:20px;}
.tile{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px 18px;}
.tile .label{font-size:12.5px; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.04em;}
.tile .value{font-family:'Fraunces',serif; font-size:32px; font-weight:600; margin-top:6px;}
.tile .value.org{color:var(--axis-org);}
.tile .value.collab{color:var(--axis-collab);}

.card{background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow);}
.grid-card{padding:22px; margin-top:20px;}
.grid-card h3{font-size:16px; margin:0 0 2px; font-weight:600;}
.grid-card .sub{color:var(--muted); font-size:13px; margin-bottom:8px;}

.list{display:flex; flex-direction:column; gap:10px; margin-top:20px;}
.etab-card{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:14px 16px; display:flex; align-items:center; gap:14px; cursor:pointer; transition:border-color .15s, transform .1s; flex-wrap:wrap;}
.etab-card:hover{border-color:var(--brand);}
.etab-card .meta{flex:1; min-width:160px;}
.etab-card .name{font-weight:600; font-size:15px;}
.etab-card .sub{color:var(--muted); font-size:13px; margin-top:2px;}
.etab-card .scores{display:flex; gap:8px; flex-shrink:0;}
.score-pill{display:flex; flex-direction:column; align-items:center; min-width:52px;}
.score-pill .n{font-family:'Fraunces',serif; font-weight:600; font-size:18px;}
.score-pill .l{font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.03em;}

.badge{display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:12.5px; font-weight:600;}
.badge .dot{width:7px; height:7px; border-radius:50%;}
.badge.good{background:var(--good-tint); color:var(--good);}
.badge.warn{background:var(--warn-tint); color:var(--warn);}
.badge.critical{background:var(--critical-tint); color:var(--critical);}
.badge .dot.good{background:var(--good);} .badge .dot.warn{background:var(--warn);} .badge .dot.critical{background:var(--critical);}

.empty{padding:40px 20px; text-align:center; color:var(--ink-2);}
.empty h3{margin:0 0 6px; font-size:17px;}
.empty p{margin:0 auto; max-width:44ch; font-size:14px; color:var(--muted);}

/* Wizard */
.progress{display:flex; gap:5px; margin:18px 0 6px;}
.progress i{flex:1; height:5px; border-radius:3px; background:var(--border);}
.progress i.done{background:var(--brand);}
.progress i.now{background:var(--brand); opacity:.55;}
.step-label{color:var(--muted); font-size:13px; margin-bottom:22px;}

.field{margin-bottom:18px;}
.field label{display:block; font-size:13.5px; font-weight:600; margin-bottom:7px; color:var(--ink);}
.field input[type=text], .field input[type=password], .field select, .field textarea{width:100%; font-family:inherit; font-size:14.5px; padding:11px 13px; border:1px solid var(--border); border-radius:10px; background:var(--surface); color:var(--ink);}
.field textarea{resize:vertical; min-height:64px;}
.hint{color:var(--muted); font-size:12.5px; margin-top:5px;}
.error-text{color:var(--critical); font-size:13px; margin-top:8px;}

.item{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:18px 18px 16px; margin-bottom:14px;}
.item .q{font-size:14.5px; line-height:1.5; margin-bottom:14px;}
.likert{display:flex; gap:8px;}
.likert button{flex:1; padding:10px 4px; border-radius:10px; border:1px solid var(--border); background:var(--surface-2); font-family:inherit; font-weight:600; font-size:14px; color:var(--ink-2); cursor:pointer;}
.likert button.sel{background:var(--brand); border-color:var(--brand); color:#fff;}
.likert-labels{display:flex; justify-content:space-between; font-size:11px; color:var(--muted); margin-top:6px;}

.wizard-nav{display:flex; justify-content:space-between; margin-top:24px; gap:10px;}

.review-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0 24px;}
@media (max-width:560px){ .review-grid{grid-template-columns:1fr;} }

.pilier-bars{display:flex; flex-direction:column; gap:10px; margin-top:10px;}
.pbar-row{display:grid; grid-template-columns:150px 1fr 34px; align-items:center; gap:10px; font-size:13px;}
@media (max-width:480px){ .pbar-row{grid-template-columns:110px 1fr 30px; font-size:12px;} }
.pbar-track{height:8px; background:var(--surface-2); border-radius:5px; overflow:hidden;}
.pbar-fill{height:100%; background:var(--brand); border-radius:5px;}

.detail-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-top:8px;}
.kv-list{display:flex; flex-direction:column; gap:6px; margin-top:14px; padding-left:18px;}
.kv-list li{font-size:14px;}
.kv-list b{color:var(--ink); font-weight:600;}

svg text{font-family:'Inter',sans-serif;}
.quad-label{font-size:13px; fill:var(--muted); font-style:italic;}
.quad-legend{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:14px;}
@media (max-width:520px){ .quad-legend{grid-template-columns:1fr;} }
.quad-legend .qi{display:flex; gap:9px; align-items:flex-start; font-size:12.5px; color:var(--ink-2); background:var(--surface-2); border-radius:10px; padding:9px 11px;}
.quad-legend .qi b{color:var(--ink); font-weight:600; display:block; margin-bottom:1px;}
.pt{cursor:pointer;}
.pt:hover circle{r:8;}

a.link{color:var(--brand); font-weight:600; text-decoration:none; font-size:13.5px; cursor:pointer;}
a.link:hover{text-decoration:underline;}

.login-shell{max-width:380px; margin:14vh auto 0; padding:0 20px;}
.login-card{padding:28px 26px;}
.login-card h2{margin:0 0 4px; font-size:20px;}
.login-card p{color:var(--ink-2); font-size:13.5px; margin:0 0 22px;}

.toolbar{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:8px;}

::selection{background:var(--brand-tint);}
footer.note{margin-top:56px; padding-top:18px; border-top:1px solid var(--border); color:var(--muted); font-size:12.5px;}

.spinner-line{display:flex; align-items:center; gap:10px; color:var(--ink-2); font-size:14px; padding:24px 0;}

@media (max-width:640px){
  .shell{padding:0 14px 48px;}
  .topbar-inner{padding:10px 14px;}
  .brand-tag{display:none;}
  .likert button{padding:10px 2px; font-size:13px;}
}
