:root{
  --bg:#ffffff; --ink:#0b0b0f; --red:#e4002b; --red-glow:rgba(228,0,43,0.14);
  --t70:rgba(11,11,15,0.66); --t50:rgba(11,11,15,0.48); --t32:rgba(11,11,15,0.30); --t18:rgba(11,11,15,0.16);
  --line:rgba(11,11,15,0.10); --line-soft:rgba(11,11,15,0.055);
  --glass:rgba(255,255,255,0.55); --glass-strong:rgba(255,255,255,0.72); --glass-border:rgba(11,11,15,0.08);
  --glass-shadow:0 24px 60px -28px rgba(11,11,15,0.22), 0 2px 8px -4px rgba(11,11,15,0.10);
  --sans:'Inter', system-ui, -apple-system, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; position:relative;
}
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 35%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 35%, transparent 78%);
}
body::after{
  content:""; position:fixed; top:-240px; right:-180px; width:720px; height:720px;
  z-index:0; pointer-events:none;
  background: radial-gradient(circle, var(--red-glow) 0%, transparent 62%);
  filter: blur(8px);
}
.page{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 5vw 140px; }

/* ---- nav ---- */
nav{
  position:sticky; top:0; z-index:20; height:64px; display:flex; align-items:center;
  justify-content:space-between; padding:0 5vw; background:rgba(255,255,255,0.7);
  backdrop-filter:blur(20px) saturate(1.5); -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border-bottom:1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:10px; }
.mark{ width:14px; height:14px; background:var(--red); box-shadow:0 0 14px var(--red-glow); flex:none; }
.wordmark{ font-family:var(--sans); font-weight:600; font-size:14px; letter-spacing:-0.01em; white-space:nowrap; }
.tabs{ display:flex; gap:24px; }
.tab{
  font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--t50); text-decoration:none; padding-bottom:4px; border-bottom:2px solid transparent; cursor:pointer;
  background:none; border-top:none; border-left:none; border-right:none;
}
.tab:hover{ color:var(--ink); }
.tab.active{ color:var(--ink); border-bottom-color:var(--red); }
.navstat{ display:flex; align-items:center; gap:8px; }
.dot{ width:6px; height:6px; border-radius:50%; background:var(--red); animation:li-breathe 2.4s ease-in-out infinite; }
.build{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.12em; color:var(--t32); white-space:nowrap; }
@media (max-width:900px){ .tabs{ gap:14px; } .build{ display:none; } }
@media (max-width:680px){ .tabs{ display:none; } }

/* ---- type ---- */
.eyebrow{ font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:var(--t50); }
.eyebrow.red{ color:var(--red); }
.standfirst{ font-family:var(--sans); font-weight:400; font-size:18px; line-height:1.6; color:var(--t70); max-width:680px; margin:14px 0 0; }
.section-mark{ display:flex; align-items:center; gap:14px; margin:0 0 40px; }
.section-mark .idx{ font-family:var(--mono); font-weight:500; font-size:13px; color:var(--red); flex:none; }
.section-mark .lbl{ font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--t50); flex:none; }
.section-mark .rule{ flex:1 1 auto; height:1px; background:var(--line); }
.tabpanel{ padding:56px 0; display:none; }
.tabpanel.active{ display:block; }
.li-fade{ animation: li-fade 0.5s cubic-bezier(0.22,1,0.36,1) both; }
@keyframes li-fade{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
@keyframes li-breathe{ 0%,100%{ transform:scale(1); opacity:0.9; } 50%{ transform:scale(1.06); opacity:1; } }

/* ---- stats row ---- */
.stats{ display:flex; flex-wrap:wrap; gap:0; margin-top:12px; }
.stat{ flex:1 1 220px; padding:20px 28px 0 0; border-left:1px solid var(--line); padding-left:24px; }
.stat:first-child{ border-left:none; padding-left:0; }
.stat .figure{ font-family:var(--mono); font-weight:500; font-size:clamp(32px,4.6vw,48px); letter-spacing:-0.02em; line-height:0.9; font-variant-numeric:tabular-nums; }
.stat .figure .unit{ font-size:0.4em; color:var(--t50); margin-left:4px; letter-spacing:0.05em; }
.stat .label{ margin-top:10px; font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--t50); }
.stat .sub{ margin-top:4px; font-family:var(--sans); font-size:13.5px; color:var(--t50); }

/* ---- schematic ---- */
.schematic-wrap{ margin-top:52px; }
.schematic-caption{ font-family:var(--mono); font-size:12px; color:var(--t50); letter-spacing:0.05em; margin-bottom:18px; }
svg.instrument{ width:100%; height:auto; overflow:visible; }
.lvl-label{ font-family:var(--mono); font-weight:500; font-size:13px; letter-spacing:0.06em; fill:var(--ink); }
.lvl-num{ font-family:var(--mono); font-weight:500; font-size:14px; fill:var(--t32); }
.lane-line{ stroke:var(--t18); stroke-width:0.8px; }
.lane-line.on{ stroke:var(--red); stroke-width:1.1px; }
.node-start{ fill:rgba(11,11,15,0.28); }
.node-end{ fill:var(--ink); }
.node-end.on{ fill:var(--red); }
.node-name{ font-family:var(--sans); font-weight:500; font-size:12px; fill:var(--ink); opacity:0; transition:opacity .18s ease; }
.lane-group:hover .node-name, .lane-group:focus .node-name, .lane-group.on .node-name{ opacity:1; }
.lane-group{ cursor:pointer; }
.lane-group:focus{ outline:none; }
.lane-group:focus .node-end{ stroke:var(--red); stroke-width:2px; }
.axis-line{ stroke:var(--line); stroke-width:1px; }

/* ---- bar chart (insights) ---- */
.barchart{ margin-top:8px; }
.bar-row{ display:flex; align-items:center; gap:14px; padding:9px 0; border-top:1px solid var(--line-soft); }
.bar-row:first-child{ border-top:none; }
.bar-row .bl{ font-family:var(--mono); font-size:13px; color:var(--t70); width:170px; flex:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bar-track{ flex:1 1 auto; height:9px; background:var(--line-soft); position:relative; }
.bar-fill{ height:100%; background:var(--t32); }
.bar-fill.flag{ background:var(--red); }
.bar-val{ font-family:var(--mono); font-size:12.5px; color:var(--t50); width:40px; flex:none; text-align:right; font-variant-numeric:tabular-nums; }

/* ---- roster ---- */
.row{ border-bottom:1px solid var(--line); }
.row:first-child{ border-top:1px solid var(--line); }
.row-head{ display:flex; align-items:center; gap:20px; padding:22px 0; cursor:pointer; width:100%; background:none; border:none; text-align:left; font:inherit; color:inherit; }
.row-head .idx{ font-family:var(--mono); font-weight:500; font-size:13px; color:var(--red); width:24px; flex:none; }
.row-head .name{ font-family:var(--sans); font-weight:500; font-size:clamp(17px,2vw,21px); letter-spacing:-0.015em; width:190px; flex:none; }
.row-head .move{ font-family:var(--mono); font-size:13px; color:var(--t70); flex:1 1 auto; }
.row-head .move .arrow{ color:var(--t32); margin:0 8px; }
.row-head .risk-chip{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; padding:3px 8px; border:1px solid var(--t18); color:var(--t50); flex:none; display:none; }
.row-head .risk-chip.on{ border-color:var(--red); color:var(--red); }
.row-head .meta{ font-family:var(--mono); font-size:12px; color:var(--t50); text-align:right; flex:none; display:none; }
.row-head .toggle{ width:16px; height:16px; position:relative; flex:none; }
.row-head .toggle::before, .row-head .toggle::after{ content:""; position:absolute; background:var(--ink); transition:transform .25s ease; }
.row-head .toggle::before{ left:0; top:7px; width:16px; height:1.4px; }
.row-head .toggle::after{ left:7px; top:0; width:1.4px; height:16px; }
.row.open .row-head .toggle{ transform:rotate(45deg); }
.row.open .row-head .name, .row.open .row-head .idx{ color:var(--red); }
@media (min-width:760px){ .row-head .risk-chip{ display:block; } }
@media (min-width:940px){ .row-head .meta{ display:block; } }

.row-body{ max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(0.22,1,0.36,1); }
.row.open .row-body{ max-height:2600px; }
.read{
  background:var(--glass); backdrop-filter:blur(18px) saturate(1.4); -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid var(--glass-border); box-shadow:var(--glass-shadow); border-radius:14px;
  margin:0 0 28px; padding:32px clamp(20px,3vw,40px);
}
.read-cols{ display:flex; flex-wrap:wrap; gap:36px; }
.col{ flex:1 1 320px; }
.col + .col{ border-left:1px solid var(--line); padding-left:36px; }
@media (max-width:760px){ .col + .col{ border-left:none; padding-left:0; } }
.sublabel{ font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--red); margin:0 0 10px; }
.sublabel.ink{ color:var(--t50); }
.prose{ font-family:var(--sans); font-size:16px; line-height:1.65; color:var(--t70); margin:0 0 18px; }
.achv{ margin:0 0 20px; }
.achv-item{ margin:0 0 14px; }
.achv-item .tag{ font-family:var(--mono); font-weight:500; font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink); display:block; margin-bottom:4px; }
.achv-item p{ margin:0; font-family:var(--sans); font-size:15px; line-height:1.6; color:var(--t70); }
ul.blt{ margin:0 0 20px; padding-left:18px; }
ul.blt li{ font-family:var(--sans); font-size:15px; line-height:1.65; color:var(--t70); margin-bottom:6px; }
.quote{ border-left:2px solid var(--red); padding-left:16px; margin:0 0 16px; }
.quote p{ margin:0 0 4px; font-family:var(--sans); font-size:15px; line-height:1.6; color:var(--ink); }
.quote cite{ font-family:var(--mono); font-style:normal; font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t50); }
.minirow{ display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-top:1px solid var(--line); }
.minirow:first-of-type{ border-top:none; }
.minirow .k{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--t50); flex:none; width:150px; }
.minirow .v{ font-family:var(--sans); font-size:15px; color:var(--t70); }

/* ---- manager / department groups ---- */
.grp{ padding:26px 0; border-bottom:1px solid var(--line); }
.grp:first-child{ border-top:1px solid var(--line); }
.grp-head{ display:flex; align-items:baseline; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.grp-head .name{ font-family:var(--sans); font-weight:500; font-size:18px; }
.grp-head .title{ font-family:var(--mono); font-size:12px; color:var(--t50); }
.grp-head .count{ margin-left:auto; font-family:var(--mono); font-size:12px; color:var(--red); }
.grp-list{ display:flex; flex-wrap:wrap; gap:10px 28px; }
.grp-list button{ font-family:var(--mono); font-size:14px; color:var(--t70); text-decoration:none; border:none; border-bottom:1px solid var(--t18); cursor:pointer; background:none; padding:0 0 1px; }
.grp-list button:hover{ color:var(--red); border-color:var(--red); }
.grp{ transition:box-shadow .3s ease; }
.grp.flash{ box-shadow:inset 3px 0 0 var(--red); padding-left:14px; margin-left:-14px; }

/* ---- cross-links and blank-field notes (roster minirows) ---- */
.xlink{
  font-family:var(--mono); font-size:15px; color:var(--ink); background:none; border:none;
  border-bottom:1px solid var(--t18); cursor:pointer; padding:0 0 1px;
}
.xlink:hover{ color:var(--red); border-color:var(--red); }
.xlink.chip{ margin:0 10px 6px 0; display:inline-block; }
.minirow .v{ display:flex; flex-wrap:wrap; align-items:baseline; gap:0; }
.note-toggle{
  font-family:var(--sans); font-size:15px; color:var(--t70); background:none; border:none; padding:0;
  cursor:pointer; text-decoration:underline; text-decoration-style:dotted; text-underline-offset:2px;
}
.note-toggle:hover{ color:var(--red); }
.note-text{ display:none; margin-left:8px; font-family:var(--sans); font-size:13.5px; color:var(--t50); }
.note-toggle.open + .note-text{ display:inline; }

/* ---- insights: at-a-glance strip ---- */
.stats.glance{ margin-top:4px; margin-bottom:48px; }

/* ---- insights: expandable metric panels ---- */
.metric-panel{ border-bottom:1px solid var(--line); }
.metric-panel:first-of-type{ border-top:1px solid var(--line); }
.metric-head{
  display:flex; align-items:center; gap:24px; width:100%; padding:24px 0; cursor:pointer;
  background:none; border:none; text-align:left; font:inherit; color:inherit;
}
.metric-title{ font-family:var(--sans); font-weight:500; font-size:18px; letter-spacing:-0.01em; width:230px; flex:none; }
.metric-takeaway{ font-family:var(--sans); font-size:15px; color:var(--t70); flex:1 1 auto; line-height:1.5; }
.metric-head .toggle{ width:16px; height:16px; position:relative; flex:none; }
.metric-head .toggle::before, .metric-head .toggle::after{ content:""; position:absolute; background:var(--ink); transition:transform .25s ease; }
.metric-head .toggle::before{ left:0; top:7px; width:16px; height:1.4px; }
.metric-head .toggle::after{ left:7px; top:0; width:1.4px; height:16px; }
.metric-panel.open .metric-head .toggle{ transform:rotate(45deg); }
.metric-panel.open .metric-title{ color:var(--red); }
.metric-body{ max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(0.22,1,0.36,1); }
.metric-panel.open .metric-body{ max-height:1600px; }
.metric-body-inner{ padding:0 0 32px; }
@media (max-width:760px){ .metric-head{ flex-wrap:wrap; gap:6px 24px; } .metric-takeaway{ width:100%; order:3; } }

.risk-list .risk-item{ display:flex; gap:16px; padding:14px 0; border-top:1px solid var(--line-soft); align-items:baseline; }
.risk-list .risk-item:first-child{ border-top:none; }
.risk-list button.rname{ font-family:var(--sans); font-weight:500; font-size:15px; color:var(--ink); background:none; border:none; cursor:pointer; padding:0; width:180px; flex:none; text-align:left; }
.risk-list button.rname:hover{ color:var(--red); }
.risk-list .rtype{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--red); width:100px; flex:none; }
.risk-list .rnote{ font-family:var(--sans); font-size:14px; color:var(--t70); line-height:1.5; }

/* ---- filter bar ---- */
.filter-bar{
  position:sticky; top:64px; z-index:19; display:flex; align-items:center; gap:28px; flex-wrap:wrap;
  padding:14px 5vw; background:rgba(255,255,255,0.7);
  backdrop-filter:blur(20px) saturate(1.5); -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border-bottom:1px solid var(--line);
}
.filter-group{ display:flex; align-items:center; gap:10px; }
.filter-label{ font-family:var(--mono); font-weight:500; font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--t50); }
.filter-select{
  font-family:var(--mono); font-size:13px; color:var(--ink); background:rgba(255,255,255,0.6);
  border:1px solid var(--line); border-radius:6px; padding:6px 10px; cursor:pointer;
}
.filter-select:focus{ outline:none; border-color:var(--red); }
.filter-reset{
  font-family:var(--mono); font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t50);
  background:none; border:1px solid var(--t18); border-radius:4px; padding:6px 10px; cursor:pointer;
}
.filter-reset:hover{ color:var(--red); border-color:var(--red); }
.filter-count{ margin-left:auto; font-family:var(--mono); font-size:11.5px; color:var(--t32); letter-spacing:0.06em; white-space:nowrap; }
@media (max-width:680px){ .filter-bar{ top:0; } }

/* ---- ladder legend ---- */
.ladder-legend{ display:flex; gap:24px; margin:0 0 18px; }
.legend-item{ display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12.5px; color:var(--t50); letter-spacing:0.04em; }
.legend-dot{ width:9px; height:9px; border-radius:50%; flex:none; }
.legend-dot.start{ background:rgba(11,11,15,0.28); }
.legend-dot.end{ background:var(--ink); }

/* ---- level breakdown ---- */
.level-block{ margin-top:44px; }

footer{ padding:56px 0 0; border-top:1px solid var(--line); margin-top:40px; }
footer p{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em; color:var(--t32); }

a:focus-visible, .row-head:focus-visible, .lane-group:focus-visible, .grp-list button:focus-visible, .tab:focus-visible, .risk-list button:focus-visible, .metric-head:focus-visible{
  outline:2px solid var(--red); outline-offset:3px;
}
::selection{ background:var(--red); color:#fff; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
  .dot{ animation:none; opacity:0.9; }
}