/* Sabit Trumov, V3 (release 2): executive profile, industrial editorial, interactive knowledge system.
   Dark by default, optional light theme. One accent (brass) used sparingly. One radius (4px). No glass.
   Archivo for text, JetBrains Mono for years, metrics, codes, tags and small labels only. */

@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(../fonts/archivo-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo";font-style:italic;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(../fonts/archivo-italic.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/jbmono-normal.woff2) format("woff2")}
/* R6 languages: same families, extra glyph ranges only (English keeps the files above).
   Archivo latin-ext covers Turkish; Archivo has no Cyrillic, so Russian and Kazakh use Roboto Flex (also a variable
   grotesque with a width axis). JetBrains Mono adds its own Cyrillic and latin-ext. All OFL, self-hosted in static/fonts. */
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/archivo-latin-ext.woff2) format("woff2");unicode-range:U+0100-0130,U+0132-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:italic;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/archivo-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-0130,U+0132-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/robotoflex-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/robotoflex-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/jbmono-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/jbmono-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/jbmono-latin-ext.woff2) format("woff2");unicode-range:U+0100-0130,U+0132-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2C60-2C7F,U+A720-A7FF}
/* JetBrains Mono lacks some Kazakh letters (Ә Ғ Қ Ң Ұ Һ): only those come from Roboto Mono (OFL) */
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/robotomono-cyrillic-ext.woff2) format("woff2");unicode-range:U+0492-0493,U+049A-049B,U+04A2-04A3,U+04BA-04BB,U+04D8-04D9}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/robotomono-cyrillic.woff2) format("woff2");unicode-range:U+04B0-04B1}

:root{
  --bg:#0d0e10;
  --bg-2:#131418;
  --bg-3:#1a1c21;
  --line:rgba(236,234,228,.11);
  --line-2:rgba(236,234,228,.22);
  --text:#ecebe6;
  --muted:#b1afa8;
  --dim:#87857e;
  --accent:#c9a86a;
  --accent-soft:rgba(201,168,106,.13);
  --top-bg:rgba(13,14,16,.95);
  --hover:rgba(236,234,228,.05);
  --solid-hover:#fff;
  --tip-bg:#ecebe6;
  --tip-text:#0d0e10;
  --r:4px;
  --sans:"Archivo",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --max:1240px;
  --gutter:clamp(18px,3.2vw,44px);
  --top-h:64px;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#f5f3ee;
  --bg-2:#ebe8e1;
  --bg-3:#e0ddd4;
  --line:rgba(22,23,26,.12);
  --line-2:rgba(22,23,26,.26);
  --text:#17181b;
  --muted:#45443f;
  --dim:#66645d;
  --accent:#8b6a2b;
  --accent-soft:rgba(139,106,43,.12);
  --top-bg:rgba(245,243,238,.95);
  --hover:rgba(22,23,26,.05);
  --solid-hover:#000;
  --tip-bg:#17181b;
  --tip-text:#f5f3ee;
  color-scheme:light;
}
@media (min-width:1700px){:root{--max:1400px}html{font-size:18px}}
@media (min-width:2200px){:root{--max:1560px}html{font-size:19px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;font-size:17px;scroll-padding-top:calc(var(--top-h) + 20px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:1rem;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:clip;transition:background-color .25s,color .25s}
::selection{background:var(--accent);color:var(--bg)}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.015em;line-height:1.14;text-wrap:balance}
ul,ol{margin:0;padding:0;list-style:none}
dl,dd,figure,blockquote{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:var(--gutter);top:-80px;z-index:300;background:var(--text);color:var(--bg);padding:10px 14px;border-radius:var(--r)}
.skip:focus{top:10px}
.mono-num{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ---------- type helpers ---------- */
.eyebrow,.meta,.yr,.sec-label,.crumbs,.fine,.cls,.num-label{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em}
.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;margin:0 0 18px}
.meta{color:var(--dim);text-transform:uppercase;letter-spacing:.1em;margin:0 0 8px}
.yr{color:var(--dim);display:block}
.fine{color:var(--dim);font-size:.76rem;line-height:1.6}
.fine a{color:var(--muted)}
.lead{color:var(--muted);font-size:clamp(1.06rem,1.25vw,1.2rem);line-height:1.6;max-width:62ch}
.narrow{max-width:56ch}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid var(--line-2);border-radius:var(--r);background:transparent;font-size:.88rem;font-weight:600;text-decoration:none;white-space:nowrap;transition:background-color .2s,border-color .2s,color .2s,transform .2s var(--ease)}
.btn:hover{border-color:var(--text);background:var(--hover)}
.btn-solid{background:var(--text);color:var(--bg);border-color:var(--text)}
.btn-solid:hover{background:var(--solid-hover);border-color:var(--solid-hover);color:var(--bg)}
.btn-plain{border-color:transparent;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-2)}
.btn-plain:hover{background:transparent;text-decoration-color:var(--text)}
.btn-sm{min-height:36px;padding:0 14px;font-size:.82rem}
.linklike{text-decoration:underline;text-underline-offset:3px;color:var(--muted)}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.more{display:inline-block;margin-top:14px;font-size:.9rem;font-weight:600;text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:2px}
.more::after{content:" \2192"}
.more:hover{color:var(--accent)}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:100;background:var(--top-bg);border-bottom:1px solid var(--line);transition:border-color .2s}
.top.is-scrolled{border-bottom-color:var(--line-2)}
.top-in{display:flex;align-items:center;gap:28px;height:var(--top-h)}
.brand{font-weight:650;font-stretch:112%;letter-spacing:-.01em;text-decoration:none;white-space:nowrap;font-size:1.02rem}
.menu{display:flex;gap:22px;margin-left:auto}
.menu a{font-size:.86rem;color:var(--muted);text-decoration:none;padding:6px 0;border-bottom:1px solid transparent;white-space:nowrap}
.menu a:hover{color:var(--text)}
.menu a[aria-current]{color:var(--text);border-bottom-color:var(--accent)}
.menu-extra{display:none}
.top-actions{display:flex;align-items:center;gap:8px}
.icon-link{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r);color:var(--muted)}
.icon-link:hover{color:var(--text);background:var(--hover)}
.theme-toggle .i-moon{display:none}
:root[data-theme="light"] .theme-toggle .i-sun{display:none}
:root[data-theme="light"] .theme-toggle .i-moon{display:block}
.theme-toggle{display:none}
.js .theme-toggle{display:grid}
.top-actions .btn{margin-left:4px}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line-2);border-radius:var(--r);position:relative}
.menu-toggle i{position:absolute;left:11px;right:11px;height:1.5px;background:var(--text);transition:transform .2s}
.menu-toggle i:first-of-type{top:16px}.menu-toggle i:last-of-type{top:24px}
.menu-toggle[aria-expanded="true"] i:first-of-type{transform:translateY(4px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] i:last-of-type{transform:translateY(-4px) rotate(-45deg)}
/* language selector (R6): compact code + chevron; native <details>, so it also works without JS */
.lang-sel{position:relative}
.lang-sel summary{list-style:none;display:flex;align-items:center;gap:5px;height:38px;padding:0 9px;border-radius:var(--r);font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;color:var(--muted);cursor:pointer;user-select:none;white-space:nowrap}
.lang-sel summary::-webkit-details-marker{display:none}
.lang-sel summary:hover,.lang-sel[open] summary{color:var(--text);background:var(--hover)}
.lang-cur{color:var(--text)}
.lang-chev{transition:transform .2s}
.lang-sel[open] .lang-chev{transform:rotate(180deg)}
.lang-menu{position:absolute;right:0;top:calc(100% + 6px);min-width:190px;margin:0;padding:6px;list-style:none;background:var(--bg-2);border:1px solid var(--line-2);border-radius:var(--r);z-index:120}
.lang-menu a{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 10px;border-radius:var(--r);text-decoration:none;color:var(--muted);font-size:.92rem}
.lang-menu a:hover{background:var(--hover);color:var(--text)}
.lang-menu a[aria-current]{color:var(--text)}
.lang-code{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:var(--dim);min-width:22px}
.lang-menu a[aria-current] .lang-code{color:var(--accent)}
.lang-menu a[aria-current]::after{content:"";margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--accent)}
@media (prefers-reduced-motion:reduce){.lang-chev{transition:none}}
/* English shown inside another language version: an honest, quiet label */
.lang-note{display:inline-flex;align-items:center;gap:8px;margin:12px 0 0;padding:4px 10px;border:1px solid var(--line);border-radius:var(--r);font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--dim)}
.lang-note span{color:var(--accent)}
.admin-bar{background:var(--accent);color:var(--bg);font-size:.82rem;font-weight:600;text-align:center;padding:8px var(--gutter)}
.admin-bar a{color:var(--bg)}

/* ---------- sections ---------- */
.section{padding:clamp(56px,7vw,104px) 0;border-top:1px solid var(--line)}
.section.tight{padding:clamp(28px,3.4vw,44px) 0}
.page-head + .section,.page-head + .wrap + .section{border-top:0}
.page-head{max-width:var(--max);margin:0 auto;padding:clamp(52px,7vw,104px) var(--gutter) clamp(32px,4vw,52px)}
.page-head h1{font-size:clamp(2.4rem,4.8vw,4.4rem);font-stretch:106%;letter-spacing:-.03em;line-height:1.02;margin-bottom:22px;max-width:17ch}
/* R6 languages: longer words (Cyrillic, Kazakh and Turkish suffixes) get more width and may break, never overflow */
html:not([lang="en"]) .page-head h1,html:not([lang="en"]) .book-in h1{max-width:22ch}
html:not([lang="en"]) h1,html:not([lang="en"]) h2,html:not([lang="en"]) h3,html:not([lang="en"]) .btn{overflow-wrap:break-word;hyphens:auto}
.sec-head{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px;margin-bottom:clamp(32px,4vw,52px)}
.sec-label{color:var(--dim);text-transform:uppercase;letter-spacing:.12em;margin:8px 0 0}
.sec-label span{color:var(--accent);margin-right:12px}
.sec-head h2{font-size:clamp(1.65rem,2.7vw,2.5rem);font-stretch:104%;letter-spacing:-.025em;margin-bottom:14px}
.sec-head .lead{margin:0}
.offset{padding-left:calc((100% - 24px) * 3 / 12 + 24px)}
h3.sub{font-size:1.28rem;margin:56px 0 18px}

/* ---------- reveal (only with JS; content is always visible without it) ---------- */
.js .rv{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

/* ---------- hero ---------- */
.hero{padding:clamp(40px,5.6vw,88px) 0 clamp(48px,6vw,88px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,13fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
.hero-name{font-size:clamp(3rem,6.4vw,6.4rem);font-stretch:110%;font-weight:600;letter-spacing:-.04em;line-height:.92;margin-bottom:24px}
.hero-name span{display:block}
.hero-headline{font-size:clamp(1.08rem,1.5vw,1.36rem);font-weight:600;margin-bottom:14px}
.hero-lead{color:var(--muted);font-size:clamp(1.02rem,1.2vw,1.14rem);max-width:56ch;margin:0}
.hero .cta{margin-top:26px}
/* portrait is an accent: fixed 320x400 (4:5), top aligned with the name line */
.hero-side{display:grid;gap:14px;justify-items:end;padding-top:clamp(0px,2.6vw,40px)}
.hero-side .portrait{width:100%;max-width:320px}
.hero-meta{width:100%;max-width:320px;display:grid;border-top:1px solid var(--line)}
.hero-meta div{display:grid;grid-template-columns:82px 1fr;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.hero-meta dt{font-family:var(--mono);font-size:.62rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;padding-top:3px}
.hero-meta dd{font-size:.84rem;color:var(--muted)}
.hero-ctx{display:none}
.portrait{aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--bg-2);position:relative}
.portrait img{width:100%;height:100%;object-fit:cover;will-change:transform}
.portrait-mono{border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2.4vw,32px);background:linear-gradient(180deg,var(--bg-2),var(--bg))}
.portrait-mono span{font-size:clamp(7rem,14vw,12rem);font-stretch:125%;font-weight:200;letter-spacing:-.06em;line-height:.8;color:transparent;-webkit-text-stroke:1px var(--line-2)}
.portrait-mono figcaption{font-family:var(--mono);font-size:.72rem;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;line-height:1.7}
.portrait.small{max-width:220px;justify-self:end;width:100%}
.portrait.small.portrait-mono span{font-size:5rem}

/* ---------- metrics ---------- */
.band{border-top:1px solid var(--line);padding:0}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.metric{padding:clamp(22px,2.6vw,36px) clamp(14px,1.8vw,24px) clamp(22px,2.6vw,32px) 0;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start}
.metric + .metric{padding-left:clamp(14px,1.8vw,24px)}
.metric:last-child{border-right:0}
.metric .num{display:block;font-size:clamp(2rem,3.2vw,3.2rem);font-stretch:105%;font-weight:600;letter-spacing:-.04em;line-height:1;margin-bottom:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.metric strong{display:block;font-size:.98rem;margin-bottom:6px;line-height:1.3}
.metric p{color:var(--muted);font-size:.92rem;line-height:1.5;margin:0 0 12px}
.metric small{font-family:var(--mono);font-size:.68rem;color:var(--dim);letter-spacing:.04em;line-height:1.5;display:block}
.ev-link{display:none;margin-top:auto;font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;color:var(--accent);text-align:left;line-height:1.45;text-decoration:underline dotted;text-underline-offset:4px;padding:6px 0 2px}
.ev-link:hover{text-decoration-style:solid}
.js .ev-link{display:inline-block}
.js .ev-src{display:none}
.metrics.compact{margin-top:clamp(30px,3.6vw,46px);grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.metrics.compact .metric{padding:20px 20px 18px 0;border-right:1px solid var(--line)}
.metrics.compact .metric:nth-child(2n){border-right:0;padding-left:22px;padding-right:0}
.metrics.compact .metric:nth-child(2n+1){padding-left:0}
.metrics.compact .metric:nth-child(n+3){border-top:1px solid var(--line)}
.metrics.compact .num{font-size:clamp(2.1rem,3.1vw,3rem);margin-bottom:10px}
.metrics.compact strong{font-size:.92rem;font-weight:500;color:var(--muted);margin-bottom:4px}
.metrics.compact .ev-link{padding-top:4px}
/* hero markers (R5): words and numbers share one size and weight; label secondary; evidence only on click */
.metrics.markers .marker{text-align:left;color:inherit;text-decoration:none;justify-content:flex-start}
.metrics.markers .num{font-stretch:96%;letter-spacing:-.02em;transition:color .2s var(--ease)}
.metrics.markers strong{margin-bottom:0}
.markers .mk-line{display:block;margin-top:8px;font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;line-height:1.5;color:var(--dim)}
a.marker:hover .num,button.marker:hover .num{color:var(--accent)}
/* R6 languages: markers share one size that fits the widest word (--mk-em from views.hero_markers); English unchanged */
html:not([lang="en"]) .metrics.markers .marker{container-type:inline-size}
html:not([lang="en"]) .metrics.markers .num{font-size:min(clamp(2.1rem,3.1vw,3rem),calc((100cqw - 4px) / var(--mk-em,6)))}
.marker:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
/* ---------- evidence drawer ---------- */
.drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(460px,100vw);max-width:100vw;height:100%;max-height:100%;padding:0;border:0;border-left:1px solid var(--line-2);background:var(--bg-2);color:var(--text);overflow:auto}
.drawer::backdrop{background:rgba(5,5,6,.6)}
.drawer[open]{animation:drawer-in .35s var(--ease)}
@keyframes drawer-in{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.drawer[open]{animation:none}}
.drawer-in{padding:36px 32px 40px;position:relative}
.drawer h2{font-size:1.5rem;margin-bottom:14px;padding-right:72px}
.drawer h2 .mono-num{display:block;font-size:2.4rem;font-family:var(--sans);font-stretch:105%;letter-spacing:-.04em;margin-bottom:6px;color:var(--accent)}
.drawer .lead{font-size:1rem}
.drawer .kv{margin-top:20px}
.drawer .kv div{grid-template-columns:120px 1fr}
.drawer .kv dd{font-size:.94rem;color:var(--muted)}
.drawer-close{position:absolute;top:24px;right:24px}
.drawer .cta{margin-top:24px}

/* ---------- identity ---------- */
.identity{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,72px)}
.statement{align-self:start;font-size:clamp(1.42rem,2.3vw,2.05rem);line-height:1.3;font-weight:400;letter-spacing:-.015em;padding-left:clamp(18px,2vw,28px);border-left:2px solid var(--accent)}
.identity-side p{color:var(--muted)}
.areas{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:20px}
.areas li{font-size:.8rem;border:1px solid var(--line);border-radius:var(--r);padding:4px 9px;color:var(--muted)}

/* ---------- capability map (home) ---------- */
.capmap{display:grid;grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr);grid-template-areas:"q1 hub q2" "q3 hub q4";border:1px solid var(--line);border-radius:var(--r);position:relative}
.cap-hub{grid-area:hub;display:grid;place-items:center;position:relative;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.cap-hub::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--line)}
.cap-hub span{position:relative;z-index:1;width:116px;height:116px;display:grid;place-items:center;text-align:center;border:1px solid var(--accent);border-radius:var(--r);background:var(--bg);font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);line-height:1.5}
.cap-quad{padding:clamp(22px,2.6vw,34px)}
.cap-quad.q1{grid-area:q1;border-bottom:1px solid var(--line)}
.cap-quad.q2{grid-area:q2;border-bottom:1px solid var(--line)}
.cap-quad.q3{grid-area:q3}
.cap-quad.q4{grid-area:q4}
.cap-label{font-family:var(--mono);font-size:.76rem;text-transform:uppercase;letter-spacing:.14em;margin:0 0 16px;color:var(--text)}
.cap-label span{color:var(--accent);margin-right:12px}
.topics{display:flex;flex-wrap:wrap;gap:8px}
.topic{border:1px solid var(--line-2);border-radius:var(--r);padding:8px 12px;font-size:.9rem;line-height:1.2;transition:border-color .2s,background-color .2s,color .2s}
.topic:hover{border-color:var(--text)}
.topic[aria-expanded="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}
.topic-panel{margin-top:16px;border-left:2px solid var(--accent);padding:2px 0 2px 16px;animation:fade-up .35s var(--ease)}
.topic-panel strong{display:block;font-size:1rem;margin-bottom:4px}
.topic-panel p{color:var(--muted);font-size:.94rem;margin:0 0 10px}
.topic-links li{font-size:.9rem;margin-bottom:5px;line-height:1.4}
.topic-links span{font-family:var(--mono);font-size:.66rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-right:10px}
.topic-links a{text-decoration-color:var(--line-2);text-underline-offset:3px}
.topic-links a:hover{text-decoration-color:var(--accent)}
@keyframes fade-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.topic-panel{animation:none}}

/* ---------- career line (home + career) ---------- */
.careerline{position:relative}
.cl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) 56px;position:relative}
.cl::before{content:"";position:absolute;left:0;right:28px;top:38px;height:1px;background:var(--line-2);transform-origin:left;transition:transform 1.2s var(--ease)}
.cl::after{content:"";position:absolute;left:0;right:28px;top:37px;height:3px;background:linear-gradient(90deg,transparent,var(--accent));opacity:.55;transform-origin:left;transition:transform 1.4s var(--ease) .2s}
.js .careerline.rv:not(.is-in) .cl::before,.js .careerline.rv:not(.is-in) .cl::after{transform:scaleX(0)}
.cl-item,.cl-end{position:relative;padding-right:18px}
.cl-year{display:block;font-family:var(--mono);font-size:.82rem;color:var(--muted);letter-spacing:.06em;height:28px}
.cl-dot{display:block;width:13px;height:13px;border:1px solid var(--accent);background:var(--bg);border-radius:50%;position:relative;z-index:1;margin-bottom:22px}
.cl-item:last-of-type .cl-dot{background:var(--accent)}
.cl-end .cl-dot{border-color:var(--line-2)}
.cl-card{display:block;text-decoration:none;padding-right:8px}
.cl-ch{display:block;font-family:var(--mono);font-size:.7rem;color:var(--accent);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}
.cl-card strong{display:block;font-size:clamp(1.05rem,1.4vw,1.26rem);line-height:1.22;margin-bottom:8px}
.cl-card:hover strong{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--accent)}
.cl-focus{display:block;color:var(--muted);font-size:.9rem;line-height:1.5;margin-bottom:14px}
.cl-scope{display:block}
.cl-scope i{display:block;height:3px;background:var(--line);position:relative;margin-bottom:6px}
.cl-scope i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--w) * 100%);background:var(--accent);transform-origin:left;transition:transform 1s var(--ease) .5s}
.js .careerline.rv:not(.is-in) .cl-scope i::after{transform:scaleX(0)}
.cl-scope em{font-style:normal;font-family:var(--mono);font-size:.68rem;color:var(--dim);letter-spacing:.06em;text-transform:uppercase}

/* ---------- principles ---------- */
.principles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,64px);counter-reset:p}
.principles li{counter-increment:p;border-top:1px solid var(--line);padding:22px 0 22px 48px;position:relative}
.principles li::before{content:counter(p,decimal-leading-zero);position:absolute;left:0;top:25px;font-family:var(--mono);font-size:.74rem;color:var(--accent)}
.principles strong{display:block;font-size:1.1rem;margin-bottom:4px}
.principles p{color:var(--muted);margin:0;font-size:.96rem}

/* ---------- cases ---------- */
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px) clamp(20px,2.6vw,36px)}
.case-card{border-top:1px solid var(--line-2);padding-top:18px;display:flex;flex-direction:column;transition:border-color .25s}
.case-card:hover{border-top-color:var(--accent)}
.case-card h3{font-size:1.24rem;margin:4px 0 10px}
.case-card h3 a{text-decoration:none}
.case-card h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.case-card > p:not(.meta):not(.flow-mini){color:var(--muted);font-size:.95rem;margin:0 0 14px}
.flow-mini{margin:auto 0 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--dim);padding-top:12px;border-top:1px dashed var(--line)}
.flow-mini i{width:28px;height:1px;background:var(--accent);position:relative}
.flow-mini i::after{content:"";position:absolute;right:0;top:-3px;border:3.5px solid transparent;border-left:5px solid var(--accent);border-right:0}
.flow-mini span{color:var(--muted)}
.flow-mini em{font-style:normal;margin-left:auto}
.cls{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;letter-spacing:.1em;color:var(--text);margin-bottom:12px}
.cls::before{content:"";width:9px;height:9px;flex:none}
.cls-operational::before{background:var(--accent)}
.cls-framework::before{border:1.5px solid var(--accent)}
.cls-concept::before{border:1.5px dashed var(--accent);border-radius:50%}
.legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.legend li{border-left:1px solid var(--line);padding-left:18px}
.legend p{color:var(--muted);font-size:.92rem;margin:0}
.filter{display:flex;flex-wrap:wrap;gap:6px 22px;margin-bottom:36px;border-bottom:1px solid var(--line)}
.filter a{text-decoration:none;color:var(--muted);font-size:.9rem;padding:10px 0;border-bottom:2px solid transparent;margin-bottom:-1px}
.filter a span{font-family:var(--mono);font-size:.7rem;color:var(--dim);margin-left:4px}
.filter a:hover{color:var(--text)}
.filter a[aria-current]{color:var(--text);border-bottom-color:var(--accent)}
.filter.small{border:0;margin:14px 0 0;gap:6px 16px}
.filter.small a{padding:4px 0;font-size:.82rem}
.coverage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.coverage h3{font-size:1rem;padding-bottom:12px;border-bottom:1px solid var(--line-2);margin-bottom:6px}
.coverage li{padding:14px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.93rem;line-height:1.5}
.coverage strong{display:block;color:var(--text);font-size:.98rem;margin-bottom:2px}

/* ---------- process diagram (case page) ---------- */
.flow-wrap{border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);padding:clamp(22px,3vw,40px);margin:0 0 40px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,56px);align-items:start}
.flow-wrap .eyebrow{grid-column:1 / -1;margin:0}
.flow-q{font-size:clamp(1.3rem,2.2vw,1.85rem);line-height:1.28;letter-spacing:-.015em;margin:0;font-weight:500}
.flow-q span{display:block;font-family:var(--mono);font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.12em;margin-bottom:12px;font-weight:400}
.flow-wrap:not(:has(.flow-q)) .flow{grid-column:1 / -1;max-width:560px}
.flow{display:grid;gap:0;counter-reset:f}
.flow > li{position:relative;padding-bottom:26px}
.flow > li:last-child{padding-bottom:0}
.flow > li:not(:last-child)::after{content:"";position:absolute;left:23px;bottom:4px;height:18px;width:1px;background:var(--accent)}
.flow > li:not(:last-child)::before{content:"";position:absolute;left:19.5px;bottom:2px;border:4px solid transparent;border-top:5px solid var(--accent);border-bottom:0;z-index:1}
.flow-step{display:flex}
.flow-step > .flow-n,.flow-step > .flow-t{display:inline-flex;align-items:center}
.flow-step{border:0}
.flow-step .flow-n{flex:none;width:47px;justify-content:center;font-family:var(--mono);font-size:.72rem;color:var(--accent);border:1px solid var(--line-2);border-right:0;border-radius:var(--r) 0 0 var(--r);background:var(--bg)}
.flow-step .flow-t{flex:1;padding:12px 16px;border:1px solid var(--line-2);border-radius:0 var(--r) var(--r) 0;background:var(--bg);font-weight:500;font-size:.98rem;line-height:1.3}
.flow-step.is-outcome .flow-n,.flow-step.is-outcome .flow-t{border-color:var(--accent)}
.flow-step.is-outcome .flow-t{background:var(--accent-soft)}
.flow-merge .flow-inputs{display:flex;flex-wrap:wrap;gap:8px;padding:12px;border:1px dashed var(--line-2);border-radius:var(--r)}
.flow-inputs li{font-size:.9rem;border:1px solid var(--line-2);border-radius:var(--r);padding:6px 10px;background:var(--bg)}
.flow-join{display:none}
.js .flow-wrap.rv .flow > li{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.js .flow-wrap.rv.is-in .flow > li{opacity:1;transform:none}
.flow > li:nth-child(2){transition-delay:.08s}.flow > li:nth-child(3){transition-delay:.16s}.flow > li:nth-child(4){transition-delay:.24s}
.flow > li:nth-child(5){transition-delay:.32s}.flow > li:nth-child(6){transition-delay:.4s}.flow > li:nth-child(7){transition-delay:.48s}
.flow > li:nth-child(8){transition-delay:.56s}.flow > li:nth-child(n+9){transition-delay:.64s}
@media (prefers-reduced-motion:reduce){.js .flow-wrap.rv .flow > li{opacity:1;transform:none;transition:none}}
.case-structure{margin:0 0 32px}
.case-structure ol{display:flex;flex-wrap:wrap;gap:8px 0}
.case-structure li{font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em}
.case-structure li + li::before{content:"\2192";color:var(--accent);margin:0 12px}
.case-structure a{color:var(--muted);text-decoration:none}
.case-structure a:hover{color:var(--text)}

/* ---------- tags ---------- */
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.tags li,.tag{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--muted);border:1px solid var(--line);border-radius:var(--r);padding:3px 8px;text-decoration:none}
a.tag:hover{border-color:var(--line-2);color:var(--text)}

/* ---------- article lists ---------- */
.art-list{display:grid;gap:0}
.art-list.two{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,64px)}
.art-list.three{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(20px,3vw,40px)}
.art{border-top:1px solid var(--line);padding:20px 0 22px}
.art h3{font-size:1.2rem;margin-bottom:8px}
.art h3 a{text-decoration:none}
.art h3 a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--accent)}
.art-sum{color:var(--muted);font-size:.96rem;margin:0 0 10px}
.art-no{color:var(--accent);margin-right:12px}
.art-badges{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.art-badges > span{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);border-radius:var(--r);padding:2px 7px}
.art-badges > span:not(:last-child){color:var(--accent);border-color:var(--accent-soft)}

/* ---------- credentials strip (home) ---------- */
.cred-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 clamp(16px,2.4vw,32px)}
.cred-strip li{border-top:1px solid var(--line);padding:18px 0}
.cred-strip strong{display:block;font-size:1.02rem;margin:6px 0 4px;line-height:1.3}
.cred-strip span:last-child{color:var(--muted);font-size:.9rem}

/* ---------- voices ---------- */
.voices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.voice{border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,2.6vw,32px);height:100%;display:flex;flex-direction:column;background:var(--bg-2)}
.voice-mark::before{content:"\201C";display:block;font-size:4rem;line-height:.7;height:28px;color:var(--accent);font-weight:300}
.voice blockquote{font-size:1.1rem;line-height:1.62;margin:12px 0 22px;flex:1}
.voice blockquote p{margin:0 0 .8em}
.voice figcaption strong{display:block;font-size:1.02rem}
.voice figcaption span{display:block;color:var(--muted);font-size:.9rem}
.voice figcaption .meta{margin:6px 0 0}
.voice figcaption a{font-size:.84rem;color:var(--muted)}
.voices-empty{border:1px dashed var(--line-2);border-radius:var(--r);padding:clamp(24px,3vw,40px);max-width:760px}
.voices-empty .lead{margin:14px 0 10px;color:var(--text)}
.voices-track .vt-bar{display:flex;align-items:center;gap:8px;margin-bottom:18px}
.vt-count{font-family:var(--mono);font-size:.74rem;color:var(--dim);margin-right:auto;text-transform:uppercase;letter-spacing:.08em}
.vt-list{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 24px) / 2);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
.vt-list > li{scroll-snap-align:start}

/* ---------- photos ---------- */
.mosaic{columns:3 260px;column-gap:16px}
.ph{break-inside:avoid;margin:0 0 16px}
.ph a{display:block;border-radius:var(--r);overflow:hidden}
.ph img{width:100%;transition:opacity .2s}
.ph a:hover img{opacity:.88}
.ph figcaption{padding:8px 0 4px;font-size:.86rem;color:var(--muted)}
.ph figcaption strong{display:block;color:var(--text);font-weight:600}
.ph figcaption span{font-family:var(--mono);font-size:.68rem;color:var(--dim)}
.album{font-size:1.3rem;margin:40px 0 18px}
.photo-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:28px}
.photo-strip img{border-radius:var(--r);aspect-ratio:4/3;object-fit:cover;width:100%}
.photo-strip figcaption{font-size:.82rem;color:var(--muted);padding-top:6px}
.journey{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
.jp-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:20px;position:relative;padding-top:34px}
.jp-track::before{content:"";position:absolute;left:0;right:0;top:12px;height:1px;background:var(--line-2)}
.jp{scroll-snap-align:start;position:relative}
.jp-year{position:absolute;top:-34px;left:0;font-family:var(--mono);font-size:.76rem;color:var(--accent);background:var(--bg);padding-right:10px}
.jp a{display:block;border-radius:var(--r);overflow:hidden}
.jp img{aspect-ratio:4/3;object-fit:cover;width:100%}
.jp .meta{margin:10px 0 4px}
.jp p:last-child{font-size:.92rem;margin:0}

/* ---------- interests (home) and About tiles ---------- */
.interests{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(20px,3vw,40px)}
.interest{border-top:1px solid var(--line);padding:20px 0 24px}
.interest h3{font-size:1.12rem;margin-bottom:8px}
.interest p:last-child{color:var(--muted);font-size:.95rem;margin:0}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tile{border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);overflow:hidden;display:flex;flex-direction:column;min-height:220px;transition:transform .25s var(--ease),border-color .25s}
.tile:hover{transform:translateY(-3px);border-color:var(--line-2)}
.tiles .tile:nth-child(1),.tiles .tile.is-langs,.tiles .tile:nth-child(6){grid-column:span 2}
.tile-in{padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;flex:1}
.tile h3{font-size:1.24rem;margin-bottom:10px}
.tile p:not(.meta){color:var(--muted);font-size:.97rem;margin:0}
.tile-ph img{width:100%;aspect-ratio:16/9;object-fit:cover}
.langs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:auto;padding-top:22px}
.langs li{border-top:1px solid var(--accent);padding-top:10px}
.langs strong{display:block;font-size:clamp(1.6rem,2.6vw,2.3rem);font-stretch:108%;letter-spacing:-.02em;line-height:1}
.langs span{font-family:var(--mono);font-size:.68rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}

/* ---------- roadmap ---------- */
.roadmap{position:relative}
.rm-axis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;position:relative;margin-bottom:20px}
.rm-axis::before{content:"";position:absolute;left:0;right:0;top:22px;height:1px;background:var(--line-2)}
.rm-node{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;position:relative;padding:0 0 4px;width:100%}
.rm-yr{display:grid;place-items:center;min-width:46px;height:46px;padding:0 10px;border:1px solid var(--accent);border-radius:var(--r);background:var(--bg);font-family:var(--mono);font-size:.78rem;color:var(--accent);transition:background-color .2s,color .2s}
.rm-node > span:last-child{font-family:var(--mono);font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.rm-node:hover .rm-yr,.rm-node[aria-pressed="true"] .rm-yr{background:var(--accent);color:var(--bg)}
.rm-node[aria-pressed="true"] > span:last-child{color:var(--text)}
.rm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rm-col{border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2vw,26px);background:var(--bg-2);transition:opacity .3s,border-color .3s}
.rm-h{display:none}
.roadmap.has-focus .rm-col{opacity:.4}
.roadmap.has-focus .rm-col.is-focus{opacity:1;border-color:var(--accent)}
.rm-track + .rm-track{margin-top:22px;padding-top:20px;border-top:1px dashed var(--line-2)}
.rm-kind{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);margin:0 0 12px}
.rm-personal .rm-kind{color:var(--muted)}
.rm-track li{margin-bottom:14px}
.rm-track li:last-child{margin-bottom:0}
.rm-track strong{display:block;font-size:1rem;line-height:1.3;margin-bottom:3px}
.rm-track span{display:block;color:var(--muted);font-size:.92rem;line-height:1.5}

/* ---------- contact ---------- */
.contact{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,72px)}
.contact .cta{margin-top:0}
.contact .lead{margin-bottom:24px}
.kv div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.kv dt{font-family:var(--mono);font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;padding-top:3px}
.kv dd a{text-decoration-color:var(--line-2);text-underline-offset:4px}

/* ---------- career page ---------- */
.table-wrap{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-weight:600;border-bottom:1px solid var(--line-2)}
.g-legend{display:flex;flex-wrap:wrap;gap:8px 28px;margin:0 0 18px;font-size:.9rem;color:var(--muted)}
.g-legend li{display:flex;align-items:center;gap:10px}
.growth-wrap{border:1px solid var(--line);border-radius:var(--r)}
.growth-map{min-width:700px}
.growth-map thead th{font-size:.86rem;line-height:1.3;width:17%;vertical-align:bottom;text-align:center;padding:16px 10px}
.growth-map thead th .yr{margin-bottom:4px}
.growth-map thead th:first-child{width:32%;text-align:left}
.growth-map tbody tr:last-child th,.growth-map tbody tr:last-child td{border-bottom:0}
.growth-map th:first-child{position:sticky;left:0;background:var(--bg);z-index:2}
.growth-map tbody th{font-weight:400;padding:0}
.growth-map td{padding:0;text-align:center;vertical-align:middle;position:relative}
.g-row{display:block;width:100%;text-align:left;padding:13px 14px;color:var(--muted);font-size:.94rem;line-height:1.35}
.g-row:hover{color:var(--text)}
.g-cell{display:grid;place-items:center;width:100%;min-height:48px;position:relative;z-index:1}
.g-mark{display:inline-block;width:13px;height:13px;border-radius:50%;flex:none}
.g-full .g-mark,.g-mark.g-full{background:var(--accent)}
.g-part .g-mark,.g-mark.g-part{border:1.5px solid var(--accent);background:linear-gradient(90deg,var(--accent) 50%,transparent 50%)}
.g-none .g-mark,.g-mark.g-none{border:1px solid var(--line-2)}
.g-cell:hover .g-mark{transform:scale(1.25)}
.g-mark{transition:transform .2s var(--ease)}
td.g-link::before{content:"";position:absolute;top:50%;left:-50%;right:50%;height:2px;margin-top:-1px;background:var(--accent);opacity:.7}
.g-tip{position:absolute;z-index:400;max-width:280px;background:var(--tip-bg);color:var(--tip-text);font-size:.84rem;line-height:1.45;padding:10px 12px;border-radius:var(--r);pointer-events:none}
.ch-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.ch-rail{position:sticky;top:calc(var(--top-h) + 28px)}
.ch-rail ol{border-left:1px solid var(--line)}
.ch-rail a{display:block;padding:10px 0 10px 18px;margin-left:-1px;border-left:2px solid transparent;text-decoration:none;transition:border-color .2s,color .2s}
.ch-rail .yr{color:var(--dim);font-size:.72rem}
.rail-ch{display:block;font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin:2px 0}
.rail-t{display:block;font-size:.92rem;color:var(--muted);line-height:1.3}
.ch-rail a:hover .rail-t{color:var(--text)}
.ch-rail a[aria-current]{border-left-color:var(--accent)}
.ch-rail a[aria-current] .rail-ch{color:var(--accent)}
.ch-rail a[aria-current] .rail-t{color:var(--text)}
.chapters{display:grid;gap:0}
.chapter{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px;border-top:1px solid var(--line-2);padding:clamp(28px,3.6vw,48px) 0}
.chapters .chapter:first-child{border-top:0;padding-top:0}
.chapter-meta .num{display:block;font-family:var(--mono);font-size:.74rem;color:var(--accent);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}
.chapter-meta .yr{font-size:.8rem}
.ch-focus{color:var(--muted);font-size:.9rem;line-height:1.5;margin:12px 0 0}
.chapter h2{font-size:clamp(1.6rem,2.6vw,2.3rem);font-stretch:104%;letter-spacing:-.02em;margin-bottom:6px}
.org{color:var(--dim);font-size:.92rem;margin:0 0 14px}
.details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px clamp(20px,3vw,40px);margin-top:24px}
.details h3{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.details p{color:var(--muted);font-size:.95rem}
.dash li{position:relative;padding-left:18px;margin-bottom:7px;color:var(--muted);font-size:.95rem;line-height:1.5}
.dash li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--dim)}
.related{margin-top:28px;padding-top:20px;border-top:1px dashed var(--line)}
.related .eyebrow{margin-bottom:12px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px 28px}
.related h3{font-size:.82rem;font-weight:600;color:var(--dim);margin-bottom:8px}
.related li{margin-bottom:6px;font-size:.92rem;line-height:1.4}
.related a{text-decoration-color:var(--line-2);text-underline-offset:3px}
.related a:hover{text-decoration-color:var(--accent)}
.practice li{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px;border-top:1px solid var(--line);padding:18px 0}
.practice li .yr{grid-column:1}
.practice li strong{grid-column:1;font-size:1rem}
.practice li p{grid-column:2;grid-row:1 / span 2;color:var(--muted);margin:0}
.ref-minis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.ref-mini{border-top:1px solid var(--line);padding-top:16px}

/* ---------- knowledge ---------- */
.book-cover{margin-top:clamp(32px,5vw,72px);display:grid;grid-template-columns:10px minmax(0,1fr);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:var(--bg-2)}
.book-spine{background:var(--accent)}
.book-in{padding:clamp(28px,4.6vw,64px) clamp(22px,4vw,56px)}
.book-in h1{font-size:clamp(2.3rem,4.6vw,4.2rem);font-stretch:106%;letter-spacing:-.03em;line-height:1.02;margin-bottom:20px;max-width:16ch}
.book-chain{display:flex;flex-wrap:wrap;gap:6px 0;margin:22px 0 0;font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.book-chain span + span::before{content:"\2192";color:var(--accent);margin:0 10px}
.book-stats{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.book-stats div{display:flex;align-items:baseline;gap:10px}
.book-stats dt{font-size:2rem;font-weight:600;font-stretch:105%;letter-spacing:-.03em;line-height:1}
.book-stats dd{font-family:var(--mono);font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
.kb-search{display:flex;gap:10px;max-width:720px;margin-bottom:28px}
.kb-search input{flex:1}
.sortline{font-size:.84rem;color:var(--dim);margin:-16px 0 0}
.sortline a{color:var(--muted);margin-left:12px;text-underline-offset:3px;text-decoration-color:transparent}
.sortline a[aria-current]{color:var(--text);text-decoration-color:var(--accent)}
.tagcloud{margin-top:18px;font-size:.88rem}
.tagcloud summary{cursor:pointer;color:var(--muted);font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.1em}
.tagcloud p{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px}
.tagcloud a{color:var(--muted);text-underline-offset:3px}
.tagcloud a[aria-current]{color:var(--accent)}
.featured{margin-bottom:clamp(40px,5vw,64px)}
.book-contents{margin-bottom:clamp(40px,5vw,64px)}
.book-contents ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,64px)}
.book-contents a{display:flex;align-items:baseline;gap:14px;padding:14px 0;border-top:1px solid var(--line);text-decoration:none}
.toc-no{font-family:var(--mono);font-size:.78rem;color:var(--accent)}
.toc-t{font-size:1.08rem;font-weight:600}
.toc-n{margin-left:auto;font-family:var(--mono);font-size:.74rem;color:var(--dim);flex:none}
.toc-t::after{content:"";display:inline-block}
.book-contents a:hover .toc-t{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--accent)}
.kb-chapter{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px;border-top:1px solid var(--line-2);padding:clamp(28px,3.4vw,44px) 0}
.ch-big{display:block;font-size:clamp(3rem,5vw,4.6rem);font-weight:200;font-stretch:120%;letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1px var(--accent);margin-bottom:14px}
.kb-chapter h2{font-size:clamp(1.5rem,2.4vw,2.1rem);margin-bottom:8px}
.kb-chapter .lead{font-size:1rem;margin-bottom:12px}
.result-count{font-family:var(--mono);font-size:.76rem;color:var(--dim);margin-bottom:12px}

/* ---------- article ---------- */
.read-progress{position:fixed;left:0;right:0;top:var(--top-h);height:2px;z-index:90;pointer-events:none}
.read-progress span{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--p,0))}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;color:var(--dim);padding-top:clamp(32px,4vw,56px);text-transform:uppercase;letter-spacing:.1em}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--text)}
.article-head{max-width:840px;padding:28px 0 32px}
.art-chapter{display:flex;flex-wrap:wrap;gap:4px 0;font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 0 18px}
.art-chapter span:first-child{color:var(--accent)}
.art-chapter > *:not(:first-child)::before{content:"\00b7";margin:0 10px;color:var(--dim)}
.article-head h1{font-size:clamp(2rem,3.8vw,3.3rem);font-stretch:104%;letter-spacing:-.03em;line-height:1.06;margin-bottom:20px}
.article-head .lead{font-size:clamp(1.1rem,1.4vw,1.28rem);margin-bottom:18px}
.article-head .meta{margin:0 0 12px}
.cls-note{color:var(--dim);font-size:.9rem;max-width:60ch}
.cover{margin:0 0 40px;border-radius:var(--r);overflow:hidden}
.cover img{width:100%;max-height:560px;object-fit:cover}
.article-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:start}
.article-grid > .article-main:only-child{grid-column:1 / -1;margin:0 auto 0 calc(230px + clamp(28px,5vw,80px))}
.article-main{min-width:0;max-width:72ch}
.toc{position:sticky;top:calc(var(--top-h) + 28px);font-size:.88rem}
.toc ol{border-left:1px solid var(--line)}
.toc li a{display:flex;gap:10px;padding:6px 0 6px 14px;color:var(--muted);text-decoration:none;margin-left:-1px;border-left:2px solid transparent;line-height:1.35;transition:color .2s,border-color .2s}
.toc li a span{font-family:var(--mono);font-size:.7rem;color:var(--dim);padding-top:2px}
.toc li.l2 a{padding-left:40px;font-size:.84rem}
.toc li a:hover,.toc li a.is-active{color:var(--text);border-left-color:var(--accent)}
.toc li a.is-active span{color:var(--accent)}
.prose{font-size:1.1rem;line-height:1.7}
.prose > :first-child{margin-top:0}
.prose h2{font-size:1.6rem;margin:2.1em 0 .7em;padding-top:.9em;border-top:1px solid var(--line);letter-spacing:-.02em}
.prose h3{font-size:1.24rem;margin:1.8em 0 .6em}
.prose h4,.prose h5{font-size:1.04rem;margin:1.4em 0 .5em}
.prose p{margin:0 0 1.15em}
.prose a{color:var(--text);text-decoration-color:var(--accent);text-underline-offset:3px}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li{margin-bottom:.45em;padding-left:.2em}
.prose li::marker{color:var(--dim)}
.prose strong{font-weight:650}
.prose code{font-family:var(--mono);font-size:.84em;background:var(--bg-3);padding:.1em .35em;border-radius:3px}
.prose pre{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;overflow-x:auto;font-size:.86rem;line-height:1.6;margin:0 0 1.3em}
.prose pre code{background:none;padding:0}
.prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.prose blockquote{border-left:2px solid var(--line-2);padding-left:20px;color:var(--muted);margin:0 0 1.2em}
.prose figure{margin:1.6em 0}
.prose figure img{border-radius:var(--r);width:100%}
.prose figcaption{font-size:.86rem;color:var(--dim);padding-top:8px}
.prose table{font-size:.94rem;margin:0}
.prose .table-wrap{margin:0 0 1.4em;border:1px solid var(--line);border-radius:var(--r)}
.prose th{background:var(--bg-2)}
.prose tr:last-child td{border-bottom:0}
.formula{font-size:1.02rem;line-height:1.7;background:var(--bg-2);border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:var(--r);padding:18px 22px;margin:0 0 1.3em;overflow-x:auto}
.formula-line{display:block;font-family:var(--mono);font-size:.94rem}
.formula-line + .formula-line{margin-top:8px}
.formula-line.is-tex{font-family:inherit;font-size:1rem}
.formula-line.is-tex .katex-display{margin:.2em 0;text-align:left}
.formula-line.is-tex .katex-display > .katex{text-align:left}
.formula .katex{color:var(--text)}
.callout{border:1px solid var(--line);background:var(--bg-2);border-radius:var(--r);padding:18px 22px 6px;margin:1.6em 0;position:relative}
.callout .callout-title{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.callout .callout-title::before{content:"";width:8px;height:8px;flex:none;background:var(--accent)}
.callout-experience{border-left:2px solid var(--accent)}
.callout-field{border-left:2px solid var(--accent)}
.callout-field .callout-title::before{background:none;border:1.5px solid var(--accent)}
.callout-lesson{border-left:2px solid var(--text)}
.callout-lesson .callout-title{color:var(--text)}
.callout-lesson .callout-title::before{background:var(--text)}
.callout-mistake{border-left:2px dashed var(--accent)}
.callout-mistake .callout-title::before{background:none;border:1.5px dashed var(--accent);border-radius:50%}
.callout p{font-size:1.02rem}
.sources{margin-top:2.4em}
.evidence{margin-top:40px}
.share{margin-top:36px;padding-top:18px;border-top:1px solid var(--line);font-size:.88rem;color:var(--dim);display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center}
.share a{color:var(--muted)}
.more-arts{margin-top:64px}
.reading,.article{padding-bottom:clamp(56px,7vw,104px)}
.case-sec{margin-bottom:1em}
.case-page .prose{margin-top:0;max-width:72ch}

/* ---------- calculators ---------- */
.tool{margin:2.2em 0;border:1px solid var(--line-2);border-radius:var(--r);background:var(--bg-2);padding:clamp(20px,2.6vw,30px);font-size:1rem;line-height:1.55}
.tool .eyebrow{margin-bottom:8px}
.prose .tool h2.tool-h{font-size:1.4rem;margin:0 0 8px;padding:0;border:0}
.tool-lead{color:var(--muted);font-size:.95rem;margin:0 0 20px}
.tool-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,3vw,32px);align-items:start}
.tool-inputs{display:grid;gap:12px}
.tool-field{display:grid;gap:6px}
.tool-field > span:first-child{font-size:.9rem;font-weight:600}
.tool-field small{display:block;font-weight:400;color:var(--dim);font-size:.76rem}
.tool-input{display:flex;align-items:stretch}
.tool-input input{flex:1;min-width:0;border-radius:var(--r) 0 0 var(--r);font-family:var(--mono);font-size:.98rem;min-height:42px;font-variant-numeric:tabular-nums}
.tool-input em{display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:.72rem;color:var(--dim);border:1px solid var(--line-2);border-left:0;border-radius:0 var(--r) var(--r) 0;padding:0 10px;min-width:62px;flex:none;white-space:nowrap;background:var(--bg-3)}
.tool-out{border-left:1px solid var(--line);padding-left:clamp(18px,3vw,32px)}
.prose .tool-out p{margin:0 0 14px}
.tool-eq{font-family:var(--mono);font-size:.98rem;color:var(--text);padding:12px 14px;border:1px dashed var(--line-2);border-radius:var(--r);overflow-wrap:anywhere}
.tool-dl div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.tool-dl dt{font-size:.9rem;color:var(--muted)}
.tool-dl dd{font-family:var(--mono);font-size:.96rem;font-variant-numeric:tabular-nums;text-align:right}
.tool-dl div:last-child dd{color:var(--accent);font-weight:600}
.prose .tool-verdict{margin-top:16px;border-left:2px solid var(--accent);padding-left:14px;font-size:.98rem}
.prose .tool-note{font-size:.92rem;color:var(--muted);border-left:2px dashed var(--line-2);padding-left:14px}
.prose .tool .fine{margin:18px 0 0}

/* ---------- credentials ---------- */
.subnav{display:flex;flex-wrap:wrap;gap:6px 22px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:0}
.subnav a{font-size:.9rem;color:var(--muted);text-decoration:none}
.subnav a:hover{color:var(--text)}
.edu-list{display:grid}
.edu{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr) minmax(0,2fr);gap:24px;border-top:1px solid var(--line-2);padding:28px 0}
.edu h3{font-size:1.36rem;margin-bottom:6px}
.edu p{color:var(--muted);margin:0 0 6px}
.edu .cta{margin-top:14px}
.edu-photo img{border-radius:var(--r)}
.cert-filter{display:flex;flex-wrap:wrap;gap:14px;align-items:end;margin-bottom:22px}
.cert-filter label{display:grid;gap:6px;font-family:var(--mono);font-size:.7rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.cert-filter select{min-width:180px}
.js .js-hide{display:none}
.cred-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.cred-card{border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);padding:20px 22px 22px;display:flex;flex-direction:column;transition:transform .25s var(--ease),border-color .25s}
.cred-card:hover{transform:translateY(-3px);border-color:var(--line-2)}
.cred-card:target{border-color:var(--accent)}
.cred-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.cred-top .cat{font-family:var(--mono);font-size:.7rem;color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.cred-top .yr{font-size:.74rem}
.cred-card h3{font-size:1.12rem;line-height:1.3;margin-bottom:6px}
.cred-card .org{margin-bottom:10px}
.cred-card > p:not(.org):not(.fine){color:var(--muted);font-size:.94rem;margin:0 0 10px}
.cred-dl{margin:6px 0 0;display:grid;gap:6px}
.cred-dl div{font-size:.9rem;line-height:1.4;padding-top:8px;border-top:1px dashed var(--line)}
.cred-dl dt{font-family:var(--mono);font-size:.66rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}
.cred-dl a{color:var(--muted);text-underline-offset:3px;text-decoration-color:var(--line-2)}
.cred-dl a:hover{color:var(--text);text-decoration-color:var(--accent)}
.cred-actions{margin-top:auto;padding-top:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:.88rem}
.cred-actions:empty{display:none}
.cred-actions a:not(.btn){color:var(--muted)}
.empty-note{color:var(--muted);padding:18px 0}
.refs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.ref{border-top:1px solid var(--line-2);padding-top:22px}
.ref h3{font-size:1.4rem;margin-bottom:4px}
.ref > p:not(.meta):not(.org):not(.fine){color:var(--muted)}
.ref .fine{margin:16px 0 8px}
.ref .cta{margin-top:16px}
.ref:target{border-top-color:var(--accent)}
.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.doc{display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;border-top:1px solid var(--line);padding-top:18px}
.doc-thumb{aspect-ratio:3/4;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--bg-2);display:grid;place-items:center}
.doc-thumb img{width:100%;height:100%;object-fit:cover;object-position:top}
.doc-mark{width:28px;height:36px;border:1.5px solid var(--line-2);border-radius:2px;position:relative}
.doc-mark::after{content:"";position:absolute;left:6px;right:6px;top:9px;height:12px;border-top:1.5px solid var(--line-2);border-bottom:1.5px solid var(--line-2)}
.doc h3{font-size:1.02rem;margin-bottom:6px;line-height:1.3}
.doc p{color:var(--muted);font-size:.9rem;margin:0 0 8px}
.on-request{display:inline-block;font-family:var(--mono);font-size:.7rem;color:var(--dim);border:1px dashed var(--line-2);border-radius:var(--r);padding:6px 10px;letter-spacing:.04em}
.doc-pages{display:grid;gap:20px;max-width:900px}
.doc-pages img{width:100%;border-radius:var(--r);background:#fff}

/* ---------- forms ---------- */
input,select,textarea{font:inherit;color:var(--text);background:var(--bg-2);border:1px solid var(--line-2);border-radius:var(--r);padding:10px 12px;min-height:44px;width:100%}
textarea{line-height:1.55;resize:vertical}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.voice-form{max-width:860px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
.field{margin-bottom:20px;border:0;padding:0}
.field label,.field legend{display:block;font-size:.9rem;font-weight:600;margin-bottom:6px}
.field .hint{color:var(--dim);font-size:.82rem;margin:0 0 6px}
.req{font-family:var(--mono);font-size:.66rem;font-weight:400;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-left:6px}
.has-error input,.has-error select,.has-error textarea{border-color:#d07b6b}
.err{color:#d9806f;font-size:.84rem;margin:6px 0 0}
.checks{display:flex;flex-wrap:wrap;gap:10px 18px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400 !important;font-size:.92rem !important;line-height:1.45}
.check input{width:18px;height:18px;min-height:0;margin:2px 0 0;flex:none;accent-color:var(--accent)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{border:1px solid var(--line-2);border-left:2px solid var(--accent);border-radius:var(--r);padding:14px 18px;margin-bottom:24px;background:var(--bg-2)}
.notice-err{border-left-color:#d07b6b}
.voice-form .fine{margin-top:12px}

/* ---------- search ---------- */
.search-results li{border-top:1px solid var(--line);padding:18px 0}
.search-results h3{font-size:1.14rem;margin-bottom:6px}
.search-results p:last-child{color:var(--muted);margin:0;font-size:.95rem}

/* ---------- 3-minute profile ---------- */
.brief{padding:clamp(32px,4vw,56px) var(--gutter) clamp(56px,6vw,96px)}
.brief-head{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:32px;align-items:start;padding-bottom:28px}
.brief-head h1{font-size:clamp(2.4rem,5vw,4.2rem);font-stretch:108%;letter-spacing:-.03em;margin-bottom:10px}
.brief .metrics{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brief-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px;margin:28px 0}
.brief-grid div{border-top:1px solid var(--line);padding:16px 0}
.brief-grid strong{display:block;margin-bottom:4px}
.brief-grid p:last-child{color:var(--muted);font-size:.93rem;margin:0}
.brief-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,56px)}
.brief-cols h2{font-size:1.06rem;margin:22px 0 12px}
.brief-cols h2:first-child{margin-top:0}
.brief-roles li{border-top:1px solid var(--line);padding:14px 0}
.brief-roles strong{display:block}
.brief-roles span:last-child{color:var(--muted);font-size:.9rem}
.brief .dash a{color:var(--text)}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line);padding:44px 0 56px;margin-top:0}
.foot-in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:20px 32px}
.foot-in strong{display:block}
.foot-in div span{color:var(--dim);font-size:.88rem}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:flex-end}
.foot nav a{color:var(--muted);text-decoration:none;font-size:.86rem}
.foot nav a:hover{color:var(--text)}
.foot small{grid-column:1 / -1;font-size:.76rem;color:var(--dim)}

/* ---------- viewer and lightbox ---------- */
.viewer{position:fixed;inset:0;z-index:500;background:rgba(8,8,9,.97);color:#ecebe6;display:flex;flex-direction:column}
.viewer[hidden]{display:none}
.viewer .btn{border-color:rgba(236,234,228,.22);color:#ecebe6}
.viewer .btn-solid{background:#ecebe6;color:#0d0e10}
.viewer-bar{display:flex;align-items:center;gap:10px;padding:10px var(--gutter);border-bottom:1px solid rgba(236,234,228,.11);flex-wrap:wrap}
.viewer-title{font-weight:600;margin-right:auto;font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50vw}
.viewer-count{font-family:var(--mono);font-size:.74rem;color:#b1afa8;min-width:90px;text-align:center}
.viewer-bar .btn{min-height:38px;padding:0 12px}
.viewer-scroll{flex:1;overflow:auto;padding:24px var(--gutter) 48px;-webkit-overflow-scrolling:touch}
.viewer-pages{width:min(100%,var(--vw,900px));margin:0 auto;display:grid;gap:18px}
.viewer-pages img{width:100%;background:#fff;border-radius:2px}
.lightbox{position:fixed;inset:0;z-index:500;background:rgba(8,8,9,.97);display:grid;grid-template-rows:1fr auto;padding:56px var(--gutter) 20px}
.lightbox[hidden]{display:none}
.lightbox img{max-width:100%;max-height:100%;margin:auto;object-fit:contain;align-self:center;justify-self:center}
.lightbox p{text-align:center;color:#b1afa8;margin:12px 0 0}
.lightbox .btn{position:absolute;top:12px;right:var(--gutter);background:#ecebe6;color:#0d0e10;border-color:#ecebe6}
body.locked{overflow:hidden}

/* ---------- responsive ---------- */
/* ---------- external links and context bars (release 3) ---------- */
.ext{color:inherit;text-decoration:underline;text-decoration-color:var(--line-2);text-decoration-thickness:1px;text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
.ext:hover{color:var(--text);text-decoration-color:var(--accent)}
.ext-i{display:inline-block;width:.72em;height:.72em;margin-left:.22em;vertical-align:.02em;color:var(--accent);transition:transform .2s var(--ease)}
.ext:hover .ext-i{transform:translate(1.5px,-1.5px)}
.btn.ext{text-decoration:none}
.btn .ext-i{margin-left:0}
.ctx{overflow:hidden;padding:3px;margin:-3px -3px 14px}
.ctx ul{display:flex;flex-wrap:wrap;row-gap:4px;list-style:none;margin:0 0 0 -13px;padding:0}
.ctx li{border-left:1px solid var(--line-2);padding:0 12px;font-size:.88rem;line-height:1.5;color:var(--muted)}
.ctx li:first-child .ext,.ctx li > .ext:only-child{color:var(--text)}
.chapter .ctx{margin-bottom:18px}
.voice .ctx{margin-top:8px;margin-bottom:0}
.voice figcaption .ctx li{font-size:.84rem}
.li-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-left:6px;vertical-align:-6px;border:1px solid var(--line);border-radius:var(--r);color:var(--muted);transition:color .2s,border-color .2s}
.li-icon:hover{color:var(--text);border-color:var(--accent)}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 0;font-size:.86rem}
.foot-links a{color:var(--muted)}
.foot-links a:not(.ext){text-decoration:none}
.foot-links a:hover{color:var(--text)}
.src-list{margin:0;padding-left:1.4em}
.src-list li{margin:0 0 .7em}
.src-t{display:block}
.src-m{display:block;font-size:.86rem;color:var(--dim)}
.brief-head .ctx{margin-top:14px}
@media (prefers-reduced-motion:reduce){.ext-i,.ext:hover .ext-i{transition:none;transform:none}}

@media (max-width:1180px){
  .menu{position:fixed;top:var(--top-h);left:0;right:0;bottom:0;background:var(--bg);flex-direction:column;gap:0;padding:12px var(--gutter) 40px;display:none;overflow:auto;margin:0}
  .menu.is-open{display:flex}
  .menu a{font-size:1.2rem;padding:14px 0;border-bottom:1px solid var(--line);color:var(--text)}
  .menu a[aria-current]{color:var(--accent);border-bottom-color:var(--line)}
  .menu-extra{display:flex;flex-direction:column;margin-top:18px}
  .menu-extra a{font-size:1rem;color:var(--muted)}
  .menu-toggle{display:block}
  .top-actions{margin-left:auto}
  .ch-layout{grid-template-columns:minmax(0,1fr)}
  .ch-rail{min-width:0}
  .ch-rail{position:sticky;top:var(--top-h);z-index:20;background:var(--top-bg);margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter);border-bottom:1px solid var(--line)}
  .ch-rail ol{display:flex;border-left:0;overflow-x:auto;scrollbar-width:none;gap:4px}
  .ch-rail ol::-webkit-scrollbar{display:none}
  .ch-rail li{flex:none}
  .ch-rail a{border-left:0;border-bottom:2px solid transparent;margin:0;padding:10px 12px 10px 0}
  .ch-rail a[aria-current]{border-bottom-color:var(--accent)}
  .ch-rail .yr,.rail-t{display:none}
  .rail-ch{margin:0;white-space:nowrap}
  .chapters .chapter:first-child{padding-top:28px}
}
@media (max-width:980px){
  .hero-grid,.identity,.contact{grid-template-columns:1fr}
  .hero-side{justify-items:start;padding-top:0}
  .hero-side .portrait{max-width:304px}
  .hero-side .portrait-mono{aspect-ratio:auto;max-width:none;min-height:0;flex-direction:row;align-items:flex-end;gap:24px}
  .hero-side .portrait-mono span{font-size:5rem}
  .hero-meta{max-width:none}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metrics:not(.compact) .metric:nth-child(2){border-right:0}
  .metrics:not(.compact) .metric:nth-child(3){padding-left:0}
  .metrics:not(.compact) .metric:nth-child(n+3){border-top:1px solid var(--line)}
  .sec-head,.chapter,.kb-chapter,.practice li{grid-template-columns:1fr;gap:10px}
  .practice li p{grid-column:1;grid-row:auto}
  .case-grid,.coverage,.legend,.interests,.art-list.three,.brief-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article-grid{grid-template-columns:1fr}
  .article-grid > .article-main:only-child{margin:0}
  .toc{position:static;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
  .edu{grid-template-columns:1fr;gap:8px}
  .offset{padding-left:0}
  .foot-in{grid-template-columns:1fr}
  .foot nav{justify-content:flex-start}
  .capmap{grid-template-columns:1fr;grid-template-areas:"hub" "q1" "q2" "q3" "q4"}
  .cap-hub{border:0;border-bottom:1px solid var(--line);padding:16px}
  .cap-hub::before{display:none}
  .cap-hub span{width:auto;height:auto;padding:10px 16px}
  .cap-hub span br{display:none}
  .cap-quad.q1,.cap-quad.q2,.cap-quad.q3{border-bottom:1px solid var(--line)}
  .cl{grid-template-columns:1fr;padding-left:30px}
  .cl::before,.cl::after{left:6px;right:auto;top:6px;bottom:6px;width:1px;height:auto;transform-origin:top}
  .cl::after{width:3px;left:5px;background:linear-gradient(180deg,transparent,var(--accent))}
  .js .careerline.rv:not(.is-in) .cl::before,.js .careerline.rv:not(.is-in) .cl::after{transform:scaleY(0)}
  .cl-item,.cl-end{padding:0 0 28px}
  .cl-end{padding-bottom:0}
  .cl-year{height:auto;margin-bottom:6px}
  .cl-dot{position:absolute;left:-30px;top:4px;margin:0}
  .cl-scope i{max-width:320px}
  .flow-wrap{grid-template-columns:1fr}
  .tool-grid{grid-template-columns:1fr}
  .tool-out{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:18px}
  .book-contents ol{grid-template-columns:1fr}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tiles .tile:nth-child(n){grid-column:auto}
  .tiles .tile.is-langs{grid-column:1 / -1}
  .rm-axis{display:none}
  .rm-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(86%,420px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
  .rm-col{scroll-snap-align:start}
  .rm-h{display:block;font-family:var(--mono);font-size:.76rem;color:var(--accent);text-transform:uppercase;letter-spacing:.12em;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
  .roadmap.has-focus .rm-col{opacity:1}
  .vt-list{grid-auto-columns:min(86%,460px)}
}
@media (max-width:640px){
  html{font-size:16px}
  .top-actions .btn{display:none}
  .metrics{grid-template-columns:1fr 1fr}
  .metrics:not(.compact){grid-template-columns:1fr}
  .metrics:not(.compact) .metric,.metrics:not(.compact) .metric + .metric{border-right:0;padding-left:0;border-top:1px solid var(--line)}
  .metrics:not(.compact) .metric:first-child{border-top:0}
  .case-grid,.coverage,.legend,.interests,.art-list.two,.art-list.three,.principles,.voices,.refs,.details,.form-grid,.brief-grid,.brief-cols,.ref-minis,.tiles{grid-template-columns:1fr}
  .brief-head{grid-template-columns:1fr}
  .portrait.small{justify-self:start;max-width:160px}
  .kb-search{flex-direction:column}
  .doc{grid-template-columns:72px minmax(0,1fr)}
  .viewer-title{max-width:100%;flex-basis:100%}
  .hero-name{font-size:clamp(2.9rem,14vw,4.2rem)}
  .cta .btn{flex:1 1 auto}
  .langs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .drawer-in{padding:28px 20px 36px}
  .book-stats{gap:12px 24px}
  .prose{font-size:1.06rem}
  .formula-line.is-tex{font-size:.84rem}
}

/* ---------- print (3-minute profile, articles, credentials) ---------- */
@media print{
  :root,:root[data-theme]{--bg:#fff;--bg-2:#fff;--bg-3:#f2f2f2;--text:#111;--muted:#333;--dim:#555;--line:#ccc;--line-2:#999;--accent:#6b5220}
  body{background:#fff;color:#111;font-size:11pt}
  .top,.foot,.skip,.no-print,.admin-bar,.read-progress,.toc,.share,.ev-link,.tool,.drawer,.theme-toggle{display:none !important}
  .rv{opacity:1 !important;transform:none !important}
  .js .ev-src{display:block}
  .brief{padding:0}
  .metric .num{font-size:22pt}
  a{text-decoration:none}
  .portrait-mono{display:none}
  .article-grid{grid-template-columns:1fr}
}

/* ---------- team performance framework (Career > How I lead, release 4) ----------
   Layers widen from foundation to outcome; the brass edge strengthens with each layer.
   No JS: every layer open in one column. JS: tabs with a detail panel (>980px) or an accordion. */
.tpf{margin-top:64px;padding-top:40px;border-top:1px solid var(--line-2)}
.tpf-head h3{font-size:clamp(1.5rem,2.4vw,2.05rem);font-stretch:104%;letter-spacing:-.02em;margin:0 0 12px}
.tpf-sub{font-family:var(--mono);font-size:.76rem;letter-spacing:.08em;color:var(--accent);margin:0 0 16px}
.tpf-intro{color:var(--muted);max-width:70ch;margin:0 0 32px}
.tpf-model{--step:12px;display:grid;gap:12px}
.tpf-layer{margin-left:calc((var(--n) - 1 - var(--i)) * var(--step))}
.tpf-h{position:relative;margin:0;font:inherit}
.tpf-layer:not(:last-child) .tpf-h::after{content:"";position:absolute;right:30px;bottom:-12px;width:1px;height:12px;background:var(--accent);z-index:1}
.tpf-btn{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 18px;width:100%;text-align:left;padding:18px 48px 18px 20px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--bg-2);transition:border-color .2s,background-color .2s}
.tpf-btn::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;border-radius:var(--r) 0 0 var(--r);background:var(--accent);opacity:calc(.3 + var(--i) * .23)}
.tpf-btn:hover{border-color:var(--accent)}
.tpf-n{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;color:var(--accent)}
.tpf-btn > .tpf-n{grid-row:1 / span 2;padding-top:5px;min-width:5.2em}
.tpf-n em{display:block;font-style:normal;color:var(--dim);font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;margin-top:6px}
.tpf-t{font-size:1.2rem;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.tpf-t small,.tpf-pt small{font-family:var(--mono);font-size:.68rem;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-left:10px}
.tpf-s{grid-column:2;color:var(--muted);font-size:.93rem;line-height:1.45}
.tpf-ind{position:absolute;right:18px;top:24px;width:12px;height:12px;display:none}
.tpf-panel{padding:6px 20px 22px calc(20px + 5.2em + 18px)}
.tpf-panel[hidden]{display:none}
.tpf-pt{display:none;margin:0 0 4px;font-size:1.3rem;font-weight:600;letter-spacing:-.01em}
.tpf-pt .tpf-n{margin-right:10px;vertical-align:.2em}
.tpf-desc{margin-top:14px;color:var(--muted)}
.tpf-part{margin-top:18px}
.tpf-k{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin:0 0 9px}
.tpf-els{display:flex;flex-wrap:wrap;gap:8px}
.tpf-els li{border:1px solid var(--line-2);border-radius:var(--r);padding:5px 10px;font-size:.87rem;line-height:1.3}
.tpf-mgmt p:not(.tpf-k){margin:0;border-left:2px solid var(--accent);padding-left:14px;font-size:1rem;line-height:1.5}
.tpf-links{display:flex;flex-wrap:wrap;gap:6px 22px}
.tpf-links li{position:relative;padding-left:16px;font-size:.92rem;color:var(--muted)}
.tpf-links li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--accent)}
.tpf-career li{padding:9px 0;border-top:1px dashed var(--line);font-size:.92rem;line-height:1.45}
.tpf-career strong{display:block;font-weight:600}
.tpf-career a{text-decoration-color:var(--line-2);text-underline-offset:3px}
.tpf-career a:hover{text-decoration-color:var(--accent)}
.tpf-career span{color:var(--muted)}
.tpf-note{margin:20px 0 0;max-width:86ch}
/* enhanced states */
.tpf-model.is-ready .tpf-btn[aria-expanded="true"]{border-color:var(--accent);background:var(--accent-soft)}
.tpf-model.is-acc .tpf-ind{display:block}
.tpf-ind::before,.tpf-ind::after{content:"";position:absolute;background:var(--accent)}
.tpf-ind::before{left:0;right:0;top:5.5px;height:1px}
.tpf-ind::after{top:0;bottom:0;left:5.5px;width:1px;transition:transform .2s}
.tpf-btn[aria-expanded="true"] .tpf-ind::after{transform:scaleY(0)}
.tpf-model.is-acc .tpf-panel{border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r) var(--r);margin-top:-1px;padding-top:12px}
.tpf-model.is-acc .tpf-btn[aria-expanded="true"]{border-radius:var(--r) var(--r) 0 0}
.tpf-model.is-tabs{--step:7%;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:repeat(var(--n),auto);gap:12px clamp(28px,3.4vw,56px);align-items:start}
.tpf-model.is-tabs .tpf-layer{display:contents}
.tpf-model.is-tabs .tpf-h{grid-column:1;grid-row:var(--r);margin-left:calc((var(--n) - 1 - var(--i)) * var(--step))}
.tpf-model.is-tabs .tpf-panel{grid-column:2;grid-row:1 / -1;align-self:stretch;border:1px solid var(--line-2);border-radius:var(--r);background:var(--bg-2);padding:clamp(22px,2.4vw,34px)}
.tpf-model.is-tabs .tpf-pt{display:block}
.tpf-model.is-tabs .tpf-btn[aria-expanded="true"]::after{content:"";position:absolute;right:-9px;top:50%;margin-top:-6px;border:6px solid transparent;border-left:8px solid var(--accent);border-right:0}
.tpf-model.is-ready .tpf-panel:not([hidden]){animation:tpfIn .28s var(--ease)}
@keyframes tpfIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.tpf-model.is-ready .tpf-panel:not([hidden]){animation:none}.tpf-btn,.tpf-ind::after{transition:none}}
.tpf-prac{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(20px,3vw,40px)}
.tpf-prac li{border-top:1px solid var(--line-2);padding:18px 0}
.tpf-prac .tpf-n{display:block;margin-bottom:10px}
.tpf-prac strong{display:block;font-size:1.05rem;margin-bottom:6px}
.tpf-prac p{color:var(--muted);font-size:.93rem;margin:0}
@media (max-width:980px){.tpf-prac{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .tpf-model{--step:8px}
  .tpf-btn{grid-template-columns:minmax(0,1fr);padding:16px 44px 16px 18px}
  .tpf-btn > .tpf-n{grid-row:auto;padding-top:0;min-width:0}
  .tpf-n em{display:inline;margin:0 0 0 8px}
  .tpf-s{grid-column:1}
  .tpf-ind{top:18px}
  .tpf-panel{padding:6px 18px 20px}
  .tpf-layer:not(:last-child) .tpf-h::after{right:23px}
  .tpf-prac{grid-template-columns:1fr}
}

/* ---------- R7.1 case intelligence ---------- */
/* Experience: editorial rows instead of identical cards; the whole row opens the case */
.case-list{border-top:1px solid var(--line-2)}
.case-row{position:relative;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,3fr);gap:16px clamp(20px,3vw,44px);padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--line)}
.cr-meta{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.cr-n{font-family:var(--mono);font-size:.74rem;color:var(--dim);letter-spacing:.1em}
.case-row.is-core .cr-n{color:var(--accent)}
.cr-meta .cls{margin:0}
.core-mark{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border:1px solid var(--line-2);border-radius:var(--r);padding:3px 8px;line-height:1.4;white-space:nowrap}
.core-mark::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}
.case-row h3{font-size:clamp(1.2rem,1.7vw,1.5rem);font-stretch:104%;letter-spacing:-.02em;margin:0 0 10px}
.case-row h3 a{text-decoration:none}
.case-row h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.case-row h3 a:focus-visible{outline:none}
.case-row:has(h3 a:focus-visible){outline:2px solid var(--accent);outline-offset:6px}
.case-row:hover h3 a{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;text-decoration-color:var(--accent)}
.cr-q{font-size:1.06rem;line-height:1.42;margin:0 0 8px;padding-left:12px;border-left:2px solid var(--accent)}
.cr-sum{color:var(--muted);font-size:.92rem;margin:0}
.cr-side{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.cr-side .meta{margin:0}
.cr-logic{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--muted);margin:0}
.cr-logic i{width:14px;height:1px;background:var(--accent);position:relative}
.cr-logic i::after{content:"";position:absolute;right:0;top:-3px;border:3px solid transparent;border-left:4px solid var(--accent);border-right:0}
.cr-go{margin-top:auto;font-size:.86rem;font-weight:600;border-bottom:1px solid var(--accent);padding-bottom:2px}
.cr-go::after{content:" \2192"}
.case-row:hover .cr-go{color:var(--accent)}

/* Case page: first viewport = type, title, business question, summary, why it matters */
.case-study{padding-bottom:clamp(40px,6vw,96px)}
.cs-head{padding-bottom:clamp(28px,3.4vw,48px)}
.cs-eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:26px 0 16px}
.cs-eyebrow .cls{margin:0}
.cs-no{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.cs-head h1{font-size:clamp(1.9rem,3.2vw,2.8rem);font-stretch:104%;letter-spacing:-.025em;line-height:1.08;max-width:24ch;margin:0 0 clamp(22px,2.6vw,36px)}
.cs-label{display:block;font-family:var(--mono);font-size:.72rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;line-height:1.5}
.cs-q{margin:0 0 26px}
.cs-qt{display:block;font-size:clamp(1.75rem,3.5vw,3.2rem);max-width:24ch;font-weight:330;line-height:1.14;letter-spacing:-.025em;padding-left:clamp(16px,2vw,28px);border-left:2px solid var(--accent);text-wrap:balance}
.cs-sum{max-width:64ch;margin:0 0 12px}
.cs-impact{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-2);padding:clamp(22px,2.6vw,32px) 0}
.cs-impact ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px clamp(20px,3vw,40px)}
.cs-impact li{border-left:1px solid var(--line-2);padding-left:16px}
.cs-impact strong{display:block;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px}
.cs-impact span{display:block;color:var(--muted);font-size:.94rem;line-height:1.45}
.cs-toc{padding-top:22px;padding-bottom:4px}
.cs-toc ol{display:flex;flex-wrap:wrap;gap:6px 22px}
.cs-toc a{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-decoration:none;display:inline-block;padding:4px 0}
.cs-toc a span{color:var(--accent);margin-right:8px}
.cs-toc a:hover{color:var(--text)}

/* modules: label 3/12 + content 9/12 */
.cs-mod{padding:clamp(40px,5vw,72px) 0;border-top:1px solid var(--line)}
.cs-toc + .cs-mod,.cs-impact + .cs-mod{border-top:0}
.cs-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:20px clamp(24px,4vw,64px);align-items:start}
.cs-h{font-family:var(--mono);font-size:.76rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);line-height:1.5;margin-top:5px}
.cs-h span{color:var(--accent);margin-right:12px}
.cs-r{min-width:0}
.cs-r .prose{max-width:68ch}
.cs-intro{color:var(--dim);font-size:.9rem;margin:0 0 18px}
.cs-role{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.cs-role h3{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}
.role-mine{border-top:2px solid var(--accent);padding-top:16px}
.role-mine p{font-size:1.06rem;line-height:1.6;margin:0}
.role-wider{border-top:1px solid var(--line-2);padding-top:16px}
.role-wider h3{color:var(--dim)}
.role-wider p{color:var(--muted);font-size:.98rem;margin:0}

/* signal board: a hairline data grid, not a bullet list */
.sig-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.sig-board li{display:flex;flex-direction:column;gap:4px;padding:15px 18px 17px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .2s}
.sig-board li:hover{background:var(--hover)}
.sig-i{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;color:var(--accent)}
.sig-board strong{font-size:.98rem;font-weight:600;line-height:1.3}
.sig-t{color:var(--muted);font-size:.86rem;line-height:1.45}

/* decision logic: sticky context on the left, the path on the right */
.cs-decision{background:var(--bg-2)}
.cs-stick{position:sticky;top:calc(var(--top-h) + 28px)}
.cs-stick-q{font-size:1.14rem;line-height:1.36;margin:18px 0 22px;padding-left:14px;border-left:2px solid var(--accent)}
.dp-legend{display:grid;gap:8px;font-size:.8rem;color:var(--muted);margin:0 0 14px}
.dp-legend li{display:flex;align-items:center;gap:10px}
.dp-legend li::before{content:"";width:10px;height:10px;flex:none;border:1.5px solid var(--accent);border-radius:50%}
.dp-legend .lg-gate::before{border-radius:1px;transform:rotate(45deg) scale(.88)}
.dp-legend .lg-outcome::before{background:var(--accent);border-radius:1px}
.cs-hint{font-size:.8rem;color:var(--dim);margin:0}
.dpath{position:relative;--spine:16px}
.dpath::before,.dpath::after{content:"";position:absolute;left:calc(var(--spine) - .5px);top:12px;width:1px}
.dpath::before{bottom:12px;background:var(--line-2)}
.dpath::after{height:calc(100% - 24px);background:var(--accent)}
.dpath.is-live::after{height:var(--fill-h,0px);transition:height .45s var(--ease)}
.dp-step{position:relative;display:grid;grid-template-columns:calc(var(--spine) * 2 + 6px) minmax(0,1fr);padding-bottom:6px}
.dp-node{position:relative;z-index:1;justify-self:center;margin-top:7px;width:12px;height:12px;border:1.5px solid var(--accent);border-radius:50%;background:var(--bg-2);transition:border-color .3s,background-color .3s}
.dp-step.is-gate .dp-node{border-radius:1px;transform:rotate(45deg) scale(.92)}
.dp-step.is-outcome .dp-node{width:14px;height:14px;border-radius:2px;background:var(--accent)}
.dpath.is-live .dp-step:not(.is-on) .dp-node{border-color:var(--line-2)}
.dpath.is-live .dp-step.is-outcome:not(.is-on) .dp-node{background:var(--bg-2)}
.dp-body{padding:0 0 14px;border-bottom:1px solid var(--line);margin-bottom:10px;min-width:0}
.dp-step:last-child .dp-body{margin-bottom:0}
.dp-top{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 4px;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.dp-n{color:var(--accent)}
.dp-owner{margin-left:auto;padding:2px 8px;border:1px solid var(--line-2);border-radius:var(--r);color:var(--text);letter-spacing:.05em;text-transform:none;font-size:.7rem}
.dp-body h3{font-size:1.1rem;font-weight:600;margin:0 0 4px;letter-spacing:-.01em}
.dp-check{color:var(--muted);font-size:.95rem;margin:0}
.dp-more{margin-top:6px}
.dp-more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:32px;font-size:.8rem;color:var(--dim)}
.dp-more summary::-webkit-details-marker{display:none}
.dp-more summary::before{content:"+";font-family:var(--mono);color:var(--accent);width:10px}
.dp-more[open] summary::before{content:"\2212"}
.dp-more summary:hover{color:var(--text)}
.dp-more dl{display:grid;gap:8px;margin:2px 0 4px 4px;padding:6px 0 4px 18px;border-left:1px solid var(--line-2)}
.dp-more dt{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.dp-more dd{font-size:.92rem}
.dp-esc dt{color:var(--accent)}
.dp-step.is-outcome .dp-body{border:1px solid var(--accent);border-radius:var(--r);background:var(--accent-soft);padding:12px 16px}
/* style variants of the same steps */
.dpath-chain .dp-node{border-radius:1px;transform:none}
.dpath-chain .dp-body h3{font-family:var(--mono);font-size:.92rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.dpath-chain .dp-step:not(:last-child) .dp-body{border-bottom-style:dashed}
.dpath-gates .dp-step:not(.is-outcome) .dp-node{width:20px;height:6px;border-radius:1px;transform:none;margin-top:10px}
.dpath-gates .dp-step:not(.is-outcome) .dp-body{border-left:1px solid var(--line-2);padding-left:14px}
.dpath-layers::before,.dpath-layers::after{display:none}
.dpath-layers .dp-step{grid-template-columns:minmax(0,1fr);margin-left:calc(var(--i,0) * 12px);padding-bottom:10px}
.dpath-layers .dp-node{display:none}
.dpath-layers .dp-body{border:1px solid var(--line-2);border-radius:var(--r);background:var(--bg);padding:12px 16px;margin:0}
.dpath-layers .dp-step.is-gate .dp-body{border-color:var(--accent)}
.dpath-layers .dp-step.is-outcome .dp-body{background:var(--accent-soft)}
/* swimlane overview (desktop); the step list below stays the readable version */
.swim{display:grid;grid-template-columns:minmax(120px,150px) repeat(var(--cols),minmax(0,1fr));grid-template-rows:auto repeat(var(--rows),minmax(54px,auto));border:1px solid var(--line);border-radius:var(--r);background:var(--bg);margin:0 0 30px;overflow:hidden}
.sw-bg{border-top:1px solid var(--line);border-left:1px dashed var(--line)}
.sw-lane{grid-column:1;display:flex;align-items:center;padding:10px 12px;font-size:.78rem;font-weight:600;line-height:1.25;border-top:1px solid var(--line);background:var(--bg-2)}
.sw-col{grid-row:1;text-align:center;font-family:var(--mono);font-size:.64rem;color:var(--accent);padding:8px 0;letter-spacing:.08em}
.sw-cell{display:flex;align-items:center;justify-content:center;padding:7px 5px;z-index:1}
.sw-cell span{display:block;width:100%;text-align:center;font-size:.74rem;line-height:1.25;padding:7px 4px;border:1px solid var(--accent);border-radius:var(--r);background:var(--accent-soft);overflow-wrap:anywhere}
.cs-formula{margin-top:30px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--bg);padding:20px 22px}
.fx{font-family:var(--mono);font-size:clamp(.84rem,1.2vw,1rem);line-height:1.6;margin:0 0 10px;overflow-wrap:anywhere}
.fx-ex{font-family:var(--mono);font-size:.95rem;color:var(--accent);margin:0 0 12px}
.fx-ex span{color:var(--dim);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;margin-right:12px}
.fx-note{color:var(--muted);font-size:.92rem;margin:0}

/* judgement, failure modes, outcomes, value */
.judge-lead{font-size:clamp(1.5rem,2.6vw,2.3rem);font-weight:380;line-height:1.22;letter-spacing:-.02em;margin:0 0 26px;padding-left:clamp(16px,2vw,28px);border-left:2px solid var(--accent);max-width:28ch;text-wrap:balance}
.cs-judge p:not(.judge-lead){color:var(--muted);font-size:1.04rem;line-height:1.66;max-width:64ch}
.fm-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,3vw,48px)}
.fm-list li{padding:16px 0 18px;border-top:1px solid var(--line)}
.fm-list h3{display:flex;align-items:baseline;gap:12px;font-size:1rem;font-weight:600;margin:0 0 6px}
.fm-list h3::before{content:"";width:7px;height:7px;flex:none;border:1.5px solid var(--dim);transform:rotate(45deg);position:relative;top:-1px}
.fm-c{color:var(--muted);font-size:.92rem;margin:0 0 6px;padding-left:19px}
.fm-k{font-size:.9rem;margin:0;padding-left:19px}
.fm-k span{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-right:10px}
.oc-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.oc-list li{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 16px;border-top:1px solid var(--line-2)}
.oc-code{font-family:var(--mono);font-size:.74rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--accent);border-radius:var(--r)}
.oc-t{color:var(--muted);font-size:.88rem;line-height:1.45}
.val-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px clamp(24px,3vw,48px)}
.val-list li{display:grid;grid-template-columns:24px minmax(0,1fr);row-gap:2px}
.val-list li::before{content:"";grid-row:1 / 3;width:12px;height:1.5px;background:var(--accent);margin-top:.78em}
.val-list strong{font-weight:600}
.val-list span{color:var(--muted);font-size:.94rem}
.cs-fieldnote{padding:clamp(40px,5vw,72px) 0;border-top:1px solid var(--line)}
.fn-in{max-width:780px;margin-left:calc((100% - 24px) * 3 / 12 + clamp(24px,4vw,64px));border-left:1px solid var(--accent);padding-left:clamp(18px,2.4vw,32px)}
.fn-t{font-style:italic;font-size:clamp(1.3rem,2.1vw,1.75rem);font-weight:350;line-height:1.38;margin:0 0 14px}
.fn-by{font-family:var(--mono);font-size:.66rem;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin:0}
.ev-list{display:grid;gap:14px;margin-bottom:22px}
.ev-list li{padding:16px 18px;border-left:2px solid var(--accent);background:var(--bg-2)}
.ev-list li > p:first-child{margin:0 0 8px}
.ev-from{margin:0;font-size:.84rem;color:var(--muted)}
.ev-from span{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-right:10px}
.ev-from a{text-underline-offset:3px;text-decoration-color:var(--accent)}
.cs-basis{max-width:68ch}
.ev-list + .cs-basis,.docs + .cs-basis{border-top:1px dashed var(--line-2);padding-top:16px}
.cs-basis .cs-label{color:var(--dim)}
.cs-basis p:last-child{color:var(--muted);font-size:.92rem;margin:0}
/* connected intelligence: a quiet node line that anticipates the knowledge graph */
.cs-connect{padding:clamp(40px,5vw,72px) 0;border-top:1px solid var(--line);background:var(--bg-2)}
.ci-grid{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px clamp(20px,3vw,40px);padding-top:28px}
.ci-grid::before{content:"";position:absolute;left:5px;right:0;top:5px;height:1px;background:var(--line-2)}
.ci-col{position:relative}
.ci-col h3{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.ci-dot{position:absolute;left:0;top:-28px;width:11px;height:11px;border-radius:50%;border:1.5px solid var(--accent);background:var(--bg-2)}
.ci-col li{margin-bottom:8px;font-size:.95rem;line-height:1.35}
.ci-col a{text-decoration-color:var(--line-2);text-underline-offset:3px}
.ci-col a:hover{text-decoration-color:var(--accent)}
.case-nav{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:start;padding-top:clamp(32px,4vw,56px)}
.case-nav a{text-decoration:none}
.cn-prev,.cn-next{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1px solid var(--line-2);font-weight:600;line-height:1.3}
.cn-next{text-align:right;align-items:flex-end}
.cn-prev span,.cn-next span{font-family:var(--mono);font-size:.66rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.cn-prev span::before{content:"\2190\00a0\00a0"}
.cn-next span::after{content:"\00a0\00a0\2192"}
a.cn-prev:hover,a.cn-next:hover{border-top-color:var(--accent)}
span.cn-prev,span.cn-next{border-top-color:transparent}
.cn-back{align-self:center;margin-top:16px;font-size:.86rem;font-weight:600;border-bottom:1px solid var(--accent);padding-bottom:2px;white-space:nowrap}
@media (max-width:980px){
  .case-row{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
  .cr-side{grid-column:2}
  .cs-grid{grid-template-columns:minmax(0,1fr)}
  .cs-stick{position:static}
  .fn-in{margin-left:0}
  .swim{grid-template-columns:110px repeat(var(--cols),minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.dpath.is-live::after,.dp-node{transition:none}}
/* 3-minute profile counters: the real value stays in the HTML; the animation is only drawn on top */
.num.is-counting{position:relative;-webkit-text-fill-color:transparent}
.num.is-counting::after{content:attr(data-live);position:absolute;left:0;top:0;white-space:nowrap;-webkit-text-fill-color:currentColor}
.cs-decision:has(.dpath-gates) .lg-gate::before{width:16px;height:5px;border-radius:1px;transform:none}
.cs-decision:has(.dpath-chain) .lg-check::before{border-radius:1px}
html:not([lang="en"]) .cs-head h1{max-width:32ch;hyphens:manual}
