:root{--bg:#0a0d14;--panel:#111621;--panel2:#171d2a;--line:#293142;--text:#eef2f8;--muted:#9aa6ba;--violet:#8b7cff;--cyan:#39d4e8;--amber:#f3bb59;--green:#4cdb8f;--red:#fb7185;--side:264px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.65 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit}.skip{position:fixed;top:-50px;left:12px;z-index:99;background:#fff;color:#000;padding:8px 14px}.skip:focus{top:10px}.topbar{height:70px;position:fixed;inset:0 0 auto;z-index:30;background:rgba(10,13,20,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 28px;gap:28px}.brand{width:calc(var(--side) - 28px);display:flex;align-items:center;gap:11px;text-decoration:none;font-weight:800;letter-spacing:.08em}.brand small{font-weight:500;color:var(--muted)}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--violet),#5142ca);font-size:18px}.menu{display:none;background:none;border:0;color:white;font-size:22px}.search:focus-within{border-color:var(--violet);box-shadow:0 0 0 3px #8b7cff33}.search{margin:auto;max-width:520px;width:45%;height:40px;border:1px solid var(--line);border-radius:10px;background:var(--panel);display:flex;align-items:center;padding:0 12px;color:var(--muted)}.search input{border:0;outline:0;background:transparent;color:var(--text);width:100%;padding:0 10px;font:inherit}.search kbd{border:1px solid var(--line);border-radius:5px;padding:0 7px}.status{font-size:13px;color:var(--muted)}.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:7px}.sidebar{position:fixed;z-index:20;left:0;top:70px;bottom:0;width:var(--side);border-right:1px solid var(--line);background:#0c1018;padding:24px 18px;display:flex;flex-direction:column}.sidebar nav p{margin:18px 12px 6px;text-transform:uppercase;letter-spacing:.13em;font-size:10px;color:#8494ad;font-weight:800}.sidebar nav p:first-child{margin-top:0}.sidebar nav a{display:block;padding:8px 12px;border-radius:7px;text-decoration:none;color:var(--muted);font-weight:600}.sidebar nav a:hover,.sidebar nav a.active{background:#191f2e;color:#fff}.sidebar nav a.active{box-shadow:inset 3px 0 var(--violet)}.side-note{margin-top:auto;border:1px solid var(--line);background:var(--panel);padding:13px;border-radius:10px;display:flex;flex-direction:column}.side-note span{font-size:12px;color:var(--muted)}main{margin-left:var(--side);max-width:1280px;padding:0 5vw}section{padding:92px 0;border-bottom:1px solid var(--line)}.hero{padding-top:128px}.eyebrow,.section-head p{text-transform:uppercase;letter-spacing:.15em;color:var(--cyan);font-size:12px;font-weight:800;margin:0 0 10px}h1{font-size:clamp(44px,6vw,78px);line-height:1.04;letter-spacing:-.045em;margin:12px 0 26px;max-width:900px}h1 em{font-style:normal;color:var(--violet)}h2{font-size:clamp(32px,4vw,48px);line-height:1.1;letter-spacing:-.035em;margin:0}h3{font-size:18px;margin:28px 0 8px}.lead{font-size:20px;color:#bac4d4;max-width:790px}.lead.small{font-size:18px}.actions{display:flex;gap:12px;margin:34px 0}.actions a{padding:11px 18px;border-radius:9px;text-decoration:none;font-weight:700}.primary{background:var(--violet)}.secondary{border:1px solid var(--line);background:var(--panel)}.hero-map,.diagram{display:block;width:100%;border:1px solid var(--line);border-radius:16px;margin:42px 0;background:var(--panel)}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden}.stats div{padding:20px;border-right:1px solid var(--line);display:flex;flex-direction:column}.stats div:last-child{border:0}.stats b{font-size:28px}.stats span{color:var(--muted)}.section-head{display:flex;align-items:flex-start;gap:20px;margin-bottom:40px}.section-head>span{font-size:12px;color:var(--violet);border:1px solid #4a426d;padding:4px 8px;border-radius:6px}.callout{border-left:3px solid var(--cyan);background:linear-gradient(90deg,#10252c,transparent);padding:18px 22px;margin:26px 0}.callout p{margin:4px 0;color:#c1cad8}.callout.ai{border-color:var(--violet);background:linear-gradient(90deg,#211d3a,transparent)}.grid{display:grid;gap:16px;margin:26px 0}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.two{grid-template-columns:repeat(2,1fr)}.grid article,.cap-grid article{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px}.grid article p{color:var(--muted);margin:6px 0}.icon{display:grid;place-items:center;width:36px;height:36px;border-radius:9px}.violet{background:#29244c;color:#b2a8ff}.cyan{background:#11343d;color:#69e7f5}.amber{background:#392b14;color:#ffd688}.principles{display:flex;flex-wrap:wrap;gap:9px}.principles b{border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:#cbd3df}.steps article{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}.steps article>b{display:grid;place-items:center;width:40px;height:40px;background:#211d3b;border:1px solid #4a426d;border-radius:50%;color:#b7afff}.steps h3,.steps p{margin:0 0 6px}.steps p{color:var(--muted)}code{background:#1d2432;border:1px solid #333d50;border-radius:5px;padding:2px 6px;color:#d8e1ef}.warning{margin-top:28px;border:1px solid #5e4622;background:#201a11;border-radius:12px;padding:18px;display:flex;gap:16px}.warning b{color:var(--amber)}.timeline{display:grid;grid-template-columns:repeat(2,1fr);gap:2px}.timeline article{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:22px;background:var(--panel);border:1px solid var(--line)}.timeline article>b{color:var(--violet)}.timeline h3,.timeline p{margin:0}.timeline p{color:var(--muted)}.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cap-grid article{display:grid;grid-template-columns:42px 1fr;align-items:center}.cap-grid i{grid-row:span 2;font-style:normal;font-size:22px}.cap-grid span{color:var(--muted);font-size:13px}.source{color:#8e8cff}.reason{color:#38d5bb}.act{color:#68d8ab}.govern{color:#f2be68}.control{color:#c7a9ff}.learn{color:#58d995}.checklist{padding:0;list-style:none;counter-reset:item}.checklist li{counter-increment:item;padding:10px 0 10px 38px;position:relative;border-bottom:1px solid #202838}.checklist li:before{content:"✓";position:absolute;left:5px;color:var(--green);font-weight:800}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow:auto}.tabs button{background:transparent;border:0;color:var(--muted);padding:12px 15px;font:700 13px inherit;white-space:nowrap;cursor:pointer}.tabs button.selected{color:#fff;border-bottom:2px solid var(--violet)}.tab-panel{display:none;grid-template-columns:repeat(2,1fr);gap:12px}.tab-panel.selected{display:grid}.tab-panel article{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px}.tab-panel h3,.tab-panel p{margin:0 0 7px}.tab-panel span{color:var(--muted)}.roles{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden}.roles div{padding:18px;border-right:1px solid var(--line);display:flex;flex-direction:column}.roles div:last-child{border:0}.roles span{font-size:13px;color:var(--muted)}.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;list-style:none;padding:0}.rules li{padding:14px 16px 14px 38px;border:1px solid var(--line);border-radius:9px;background:var(--panel);position:relative}.rules li:before{content:"!";position:absolute;left:14px;color:var(--amber);font-weight:900}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.gallery figure{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}.gallery img{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#0b0e14}.gallery figcaption{padding:14px;display:flex;flex-direction:column}.gallery figcaption span{color:var(--muted);font-size:13px}footer{height:112px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:15px}footer>span{font-weight:600}footer a{color:#fff;font-size:19px;font-weight:800;letter-spacing:-.01em;text-decoration:none;padding:10px 18px;border-radius:11px;border:1px solid #4a426d;background:linear-gradient(120deg,#211d3b,#171d2a);transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}footer a:hover{border-color:var(--violet);box-shadow:0 6px 22px -8px var(--violet);transform:translateX(3px)}#empty{position:fixed;inset:70px 0 0 var(--side);background:var(--bg);z-index:10;display:grid;place-content:center;text-align:center}#empty[hidden]{display:none}#empty span{color:var(--muted)}.filtered{display:none}@media(max-width:800px){:root{--side:0px}.topbar{padding:0 16px;gap:12px}.menu{display:block}.brand{width:auto}.brand small,.status,.search kbd{display:none}.search{width:auto;flex:1}.sidebar{transform:translateX(-100%);width:270px;transition:.2s}.sidebar.open{transform:none}.sidebar.open:after{content:"";position:fixed;inset:0 0 0 270px;background:#0008}.hero{padding-top:110px}main{padding:0 20px}.grid.three,.grid.two,.cap-grid,.timeline,.tab-panel.selected,.rules,.gallery{grid-template-columns:1fr}.stats,.roles{grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2),.roles div:nth-child(2){border-right:0}.hero-map{margin-top:25px}section{padding:70px 0}}@media print{.topbar,.sidebar,.actions,.tabs{display:none}main{margin:0;max-width:none;padding:0 24px}section{page-break-before:always}.tab-panel{display:grid}.hero{page-break-before:auto}body{background:#fff;color:#111}.grid article,.cap-grid article,.tab-panel article{break-inside:avoid;color:#111}.diagram,.hero-map{border-color:#ccc}}
.matrix{width:100%;border-collapse:separate;border-spacing:0;min-width:760px;margin-top:14px;border:1px solid #293142;border-radius:12px;overflow:hidden;background:#0d1119}.matrix th,.matrix td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid #202838;line-height:1.45}.matrix th{color:#9aa6ba;background:#121824;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.matrix td{color:#c1cad8;font-size:13px}.matrix tr:last-child td{border-bottom:0}.matrix tbody tr:hover td{background:#111827}
/* Flow diagrams — subtle motion so the arrows carry the eye through the pipeline.
   Reduced-motion users get the static version. */
@keyframes forgeFlowDash{to{stroke-dashoffset:-10}}
@keyframes forgeArrowWave{0%,100%{opacity:.45;transform:translateX(0)}50%{opacity:1;transform:translateX(3px)}}
@media(prefers-reduced-motion:no-preference){
  svg.flow g[marker-end] line,svg.flow g[marker-end] path{stroke-dasharray:5 5;animation:forgeFlowDash .85s linear infinite}
  .flow-steps i{display:inline-block;animation:forgeArrowWave 2.4s ease-in-out infinite}
  .flow-steps i:nth-of-type(1){animation-delay:0s}
  .flow-steps i:nth-of-type(2){animation-delay:.2s}
  .flow-steps i:nth-of-type(3){animation-delay:.4s}
  .flow-steps i:nth-of-type(4){animation-delay:.6s}
  .flow-steps i:nth-of-type(5){animation-delay:.8s}
  .flow-steps i:nth-of-type(6){animation-delay:1s}
}
/* ---- Sidebar — modern, audience colour-coded navigation ---- */
.sidebar nav{display:flex;flex-direction:column}
.nav-group{--acc:var(--violet);display:flex;flex-direction:column;gap:1px;margin:0 0 15px}
.sidebar nav .nav-group p{display:flex;align-items:center;gap:9px;margin:14px 10px 8px;text-transform:uppercase;letter-spacing:.14em;font-size:10px;font-weight:800;color:#7a8698}
.nav-group:first-child p{margin-top:0}
.sidebar nav .nav-group p::before{content:"";width:16px;height:2px;border-radius:2px;background:var(--acc);opacity:.65}
.sidebar nav a{position:relative;display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:10px;text-decoration:none;color:#9aa6ba;font-weight:600;transition:background .15s ease,color .15s ease,transform .15s ease}
.sidebar nav a::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--acc);opacity:.32;transition:opacity .15s ease,box-shadow .15s ease,transform .15s ease}
.sidebar nav a:hover{background:#141b28;color:#eef2f8;transform:translateX(3px)}
.sidebar nav a:hover::before{opacity:.95;box-shadow:0 0 9px var(--acc)}
.sidebar nav a.active{color:#fff;background:#141b28;background:linear-gradient(90deg,color-mix(in srgb,var(--acc) 20%,transparent),transparent);box-shadow:none}
.sidebar nav a.active::before{opacity:1;box-shadow:0 0 10px var(--acc);transform:scale(1.18)}
.sidebar nav a.active::after{content:"";position:absolute;left:2px;top:20%;bottom:20%;width:3px;border-radius:3px;background:var(--acc);box-shadow:0 0 8px var(--acc)}
/* bottom identity card */
.side-note{position:relative;overflow:hidden;border-radius:12px;background:linear-gradient(180deg,#131a27,#0f141d)}
.side-note::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--violet),var(--cyan),var(--green))}
/* ---- Tabs — modern segmented control (systems reference, workspace, positioning) ---- */
.tabs{display:flex;gap:5px;width:fit-content;max-width:100%;border-bottom:0;background:#0f1420;border:1px solid var(--line);border-radius:13px;padding:5px;margin-bottom:24px;overflow-x:auto}
.tabs button{position:relative;background:transparent;border:0;color:var(--muted);padding:11px 20px;border-radius:9px;font:700 14px inherit;white-space:nowrap;cursor:pointer;transition:color .16s ease,background .16s ease}
.tabs button:hover{color:#eef2f8;background:#161f2e}
.tabs button.selected{color:#fff;border-bottom:0;background:linear-gradient(135deg,color-mix(in srgb,var(--violet) 34%,#161f2e),color-mix(in srgb,var(--cyan) 22%,#161f2e));box-shadow:inset 0 1px 0 #ffffff14,0 6px 16px #0007}