/* Aidaptive content-page stylesheet.
   Design system LOCKED: Direction B "Operations" + B2 Heritage Gold.
   Token block below is copied verbatim from src/index.html :root — that file is the
   source of truth. If a token changes there, change it here in the same commit.
   The homepage keeps its own inline CSS on purpose (single-request first paint);
   this sheet serves every guide page. */

@font-face{font-family:"Space Grotesk";src:url("/fonts/SpaceGrotesk.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/Inter.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("/fonts/JetBrainsMono.woff2") format("woff2");font-weight:100 800;font-display:swap}

:root{
  --bg:#15120C; --panel:#1E1910; --panel2:#191510; --line:#332B1C;
  --text:#F0EBDF; --muted:#A89D88;
  --accent:#D2A649; --accent-contrast:#171204; --accent-dim:#3A2F14;
  --pass:#6FAE8B; --amber:#C97F54; --amber-dim:#3A281B;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:400 16px/1.7 "Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
.mono{font-family:"JetBrains Mono",monospace}
.skip{position:absolute;left:-9999px}
.skip:focus{left:24px;top:12px;z-index:20;background:var(--accent);color:var(--accent-contrast);padding:10px 16px;border-radius:6px;font-weight:600}

/* nav — matches the homepage lockup exactly */
nav{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.lockup{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--accent);flex-shrink:0}
.lockup .name{font:600 17px/1 "Space Grotesk",sans-serif;letter-spacing:-.01em;color:var(--text)}
.lockup .name span{color:var(--muted);font-weight:500}
.nav-links{display:flex;align-items:center;gap:22px;font:500 14px/1 "Inter"}
.nav-links a{color:var(--muted);text-decoration:none}
.nav-links a:hover{color:var(--text)}
.nav-cta{font:600 13px/1 "Inter";text-decoration:none;border:1px solid var(--accent);color:var(--accent);padding:10px 16px;border-radius:6px;white-space:nowrap}
.nav-cta:hover{background:var(--accent-dim)}
@media (max-width:820px){.nav-links{display:none}}
@media (max-width:430px){
  .lockup .name{font-size:15px}
  .nav-cta{padding:9px 12px;font-size:12px}
  .wrap{padding:0 18px}
}

/* article shell */
.crumb{font:500 12px/1 "JetBrains Mono";letter-spacing:.06em;color:var(--muted);padding:26px 0 0}
.crumb a{color:var(--muted);text-decoration:none}
.crumb a:hover{color:var(--accent)}
.crumb span{margin:0 8px;opacity:.5}
.doc{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:56px;align-items:start;padding:22px 0 90px}
/* Grid items default to min-width:auto, so a wide table inside would push the
   whole column past the viewport instead of scrolling inside its own .tw box.
   The page body must never scroll horizontally; the table may. */
.doc > main{min-width:0}
@media (max-width:980px){.doc{grid-template-columns:minmax(0,1fr);gap:0}.toc{display:none}}

.toc{position:sticky;top:88px;border-left:1px solid var(--line);padding-left:20px}
.toc p{font:500 11px/1 "JetBrains Mono";letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.toc a{display:block;color:var(--muted);text-decoration:none;font-size:13.5px;line-height:1.45;margin-bottom:11px}
.toc a:hover{color:var(--text)}

article{max-width:74ch;min-width:0}
.eyebrow{font:500 12px/1 "JetBrains Mono";letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
article h1{font:700 clamp(30px,4.4vw,46px)/1.1 "Space Grotesk",sans-serif;letter-spacing:-.028em;margin-bottom:20px}
.standfirst{font-size:18.5px;color:var(--muted);line-height:1.6;margin-bottom:22px}
.meta{font:400 12.5px/1 "JetBrains Mono";color:var(--muted);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin-bottom:40px;display:flex;gap:18px;flex-wrap:wrap}

article h2{font:700 clamp(22px,3vw,30px)/1.18 "Space Grotesk",sans-serif;letter-spacing:-.02em;margin:52px 0 16px;scroll-margin-top:84px}
article h3{font:600 18.5px/1.35 "Space Grotesk",sans-serif;margin:32px 0 10px;scroll-margin-top:84px}
article p{margin-bottom:18px}
article ul,article ol{margin:0 0 20px 22px}
article li{margin-bottom:9px}
article li::marker{color:var(--accent)}
article strong{color:var(--text);font-weight:600}
article p,article li{color:#DED7C8}
code{font:400 .88em "JetBrains Mono",monospace;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:1px 5px;color:var(--accent)}

.tw{overflow-x:auto;max-width:100%;margin:0 0 26px;border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:14px}
th{background:var(--panel);text-align:left;font:600 12px/1.3 "JetBrains Mono";letter-spacing:.05em;text-transform:uppercase;color:var(--accent);padding:13px 15px;border-bottom:1px solid var(--line);vertical-align:bottom}
td{padding:13px 15px;border-bottom:1px solid var(--line);color:#DED7C8;vertical-align:top}
tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:rgba(255,255,255,.014)}
td .id{font:600 12px "JetBrains Mono";color:var(--accent)}

.note{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--panel2);border-radius:8px;padding:20px 22px;margin:0 0 26px}
.note p:last-child{margin-bottom:0}
.note .lbl{font:600 11px/1 "JetBrains Mono";letter-spacing:.12em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:9px}

.callout{border:1px solid var(--accent);background:linear-gradient(180deg,var(--accent-dim),transparent 120%);border-radius:12px;padding:30px;margin:48px 0 0}
.callout h2{margin:0 0 10px;font-size:23px}
.callout p{color:var(--muted);margin-bottom:20px;max-width:60ch}
.btn{display:inline-block;font:600 15px/1 "Inter";text-decoration:none;padding:14px 24px;border-radius:6px}
.btn.primary{background:var(--accent);color:var(--accent-contrast)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{border:1px solid var(--line);color:var(--text)}
.btn.ghost:hover{border-color:var(--muted)}
.risk-note{margin-top:13px;font-size:13px;color:var(--muted)}

details{background:var(--panel);border:1px solid var(--line);border-radius:10px;margin-bottom:10px}
summary{cursor:pointer;font:600 15.5px "Space Grotesk";padding:17px 20px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:500 18px "JetBrains Mono";color:var(--accent)}
details[open] summary::after{content:"\2013"}
details div{padding:0 20px 17px}
details p{color:var(--muted);font-size:14.5px;margin-bottom:12px}
details p:last-child{margin-bottom:0}

.rel{margin:52px 0 0;border-top:1px solid var(--line);padding-top:30px}
.rel h2{font:600 15px/1 "Space Grotesk";margin:0 0 18px}
.rel ul{list-style:none;margin:0;display:grid;gap:10px}
.rel li{margin:0}
.rel a{text-decoration:none;display:block;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:15px 18px}
.rel a:hover{border-color:var(--accent)}
.rel .t{display:block;color:var(--text);font:600 15px "Space Grotesk";margin-bottom:3px}
.rel .d{display:block;color:var(--muted);font-size:13.5px;line-height:1.5}

footer{border-top:1px solid var(--line);padding:40px 0;color:var(--muted);font-size:13px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px}
.foot h3{font:600 12px/1 "JetBrains Mono";letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.foot a{color:var(--muted);text-decoration:none;display:block;margin-bottom:9px}
.foot a:hover{color:var(--text)}
.foot .blurb{max-width:34ch;line-height:1.6}
.foot-base{border-top:1px solid var(--line);margin-top:32px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
@media (max-width:720px){.foot{grid-template-columns:1fr;gap:26px}}