:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{margin:0;-webkit-font-smoothing:antialiased}img{max-width:100%}[hidden]{display:none!important}

/* Layout: one question travels down the page; six chapters, each a stage of its journey, each with one working model of what Orqestra does at that stage. Orqestra's own Conducted Quiet palette. */
:root{
  --paper:#FAF7F1; --ink:#181A1E; --graphite:#4A4C50; --pencil:#6F6555;
  --bone:#EBE4D7; --thread:#C8BEAF; --cristal:#162A76; --cristal-dim:#4A5B9E;
  --oxide:#A85C40; --moss:#5C6E54; --rose:#9A4A4A; --card:#FFFDF8;
  --f-display:"Italiana","Times New Roman",Georgia,serif;
  --f-mark:"Jura","Helvetica Neue",system-ui,sans-serif;
  --f-ui:"IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Lora",Georgia,"Times New Roman",serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#15161A; --ink:#F4F1EA; --graphite:#C3C2BE; --pencil:#9A9488;
  --bone:#23242B; --thread:#34363D; --cristal:#93A9EC; --cristal-dim:#A8B8F0;
  --oxide:#D98A67; --moss:#93AB87; --rose:#E09A9A; --card:#1B1C21; color-scheme:dark }}
:root[data-theme="dark"]{
  --paper:#15161A; --ink:#F4F1EA; --graphite:#C3C2BE; --pencil:#9A9488;
  --bone:#23242B; --thread:#34363D; --cristal:#93A9EC; --cristal-dim:#A8B8F0;
  --oxide:#D98A67; --moss:#93AB87; --rose:#E09A9A; --card:#1B1C21; color-scheme:dark }

*{box-sizing:border-box}
body{background:var(--paper);color:var(--graphite);font-family:var(--f-ui);font-size:16px;line-height:1.55;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:1040px;margin:0 auto}
h1,h2,h3{color:var(--ink);text-wrap:balance;margin:0}
p{margin:0}
.eyebrow{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--pencil)}
.prose{font-family:var(--f-body);font-size:17.5px;line-height:1.65;max-width:62ch;color:var(--graphite)}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--cristal);outline-offset:2px;border-radius:3px}
.btn{font-family:var(--f-ui);font-size:14px;font-weight:500;border:1px solid var(--ink);background:var(--ink);color:var(--paper);
  border-radius:999px;padding:8px 16px;display:inline-flex;gap:8px;align-items:center}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--thread)}
.btn:hover{opacity:.88}
.note{font-family:var(--f-ui);font-size:12.5px;color:var(--pencil)}

/* header */
.top{display:flex;justify-content:space-between;align-items:center;padding-block:22px 0;flex-wrap:wrap;gap:8px}
.mark{font-family:var(--f-mark);font-weight:600;letter-spacing:.32em;font-size:15px;color:var(--ink)}
.mark i{font-style:normal;color:var(--cristal)}

/* hero */
.hero{padding-block:56px 28px;display:grid;gap:22px}
.hero h1{font-family:var(--f-display);font-weight:400;font-size:clamp(48px,9vw,96px);line-height:1.02;letter-spacing:-.01em}
.brief{margin-top:8px;border:1px solid var(--thread);background:var(--card);border-radius:14px;padding:16px 18px;max-width:640px;display:grid;gap:8px}
.brief q{font-family:var(--f-body);font-style:italic;font-size:19px;color:var(--ink);quotes:"\201C" "\201D"}

/* journey strip */
.journey{margin-block:20px 8px;border-top:1px solid var(--thread);border-bottom:1px solid var(--thread);padding-block:20px;display:grid;gap:14px}
.stages{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;position:relative}
.stages li a{display:grid;gap:4px;text-decoration:none;color:inherit;padding:10px 10px 12px;border-radius:10px;border:1px solid transparent;transition:background .3s,border-color .3s}
.stages li a:hover{background:var(--bone)}
.stages .n{font-family:var(--f-mono);font-size:11px;color:var(--pencil)}
.stages .t{font-weight:600;color:var(--ink);font-size:14.5px}
.stages .d{font-size:12.5px;color:var(--pencil);line-height:1.4}
.stages li.on a{background:var(--bone);border-color:var(--cristal-dim)}
.stages li.on .n{color:var(--cristal)}
.jbar{height:2px;background:var(--thread);border-radius:2px;overflow:hidden}
.jbar span{display:block;height:100%;width:0;background:var(--cristal);transition:width .6s ease}
.jrow{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
@media (max-width:760px){.stages{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* chapters */
.chapter{padding-block:72px 8px;display:grid;gap:26px;scroll-margin-top:12px}
.chead{display:grid;gap:10px}
.chead h2{font-family:var(--f-display);font-weight:400;font-size:clamp(34px,5.4vw,54px);line-height:1.05}
.wide .split{grid-template-columns:minmax(0,1fr)}
.split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:28px;align-items:start}
@media (max-width:820px){.split{grid-template-columns:minmax(0,1fr)}}
.panel{background:var(--card);border:1px solid var(--thread);border-radius:16px;padding:20px;min-width:0}
.under{display:grid;gap:14px;min-width:0}
.under h3{font-family:var(--f-ui);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--pencil);font-weight:500}
.feat{list-style:none;padding:0;margin:0;display:grid;gap:0}
.feat li{padding:12px 0;border-top:1px solid var(--thread);display:grid;gap:3px}
.feat li:last-child{border-bottom:1px solid var(--thread)}
.feat b{color:var(--ink);font-weight:600;font-size:15px}
.feat span{font-size:14px;color:var(--graphite)}
.ctl{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ex{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--oxide)}

/* 1 ask */
.chat{display:grid;gap:12px}
.msg{max-width:88%;padding:11px 14px;border-radius:14px;font-size:14.5px;line-height:1.5;transition:opacity .45s,transform .45s}
.msg.me{justify-self:end;background:var(--ink);color:var(--paper);border-bottom-right-radius:4px}
.msg.orq{justify-self:start;background:var(--bone);color:var(--ink);border-bottom-left-radius:4px}
.msg .who{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.65;margin-bottom:3px}
.plan{border:1px solid var(--thread);border-radius:12px;padding:14px;display:grid;gap:10px;background:var(--paper);transition:opacity .45s,transform .45s}
.plan ol{margin:0;padding-left:20px;display:grid;gap:4px;font-size:14px}
.plan .meta{display:flex;gap:16px;flex-wrap:wrap;font-family:var(--f-mono);font-size:12px;color:var(--pencil)}
.plan .meta strong{color:var(--ink);font-weight:500}
.warn{font-size:12.5px;color:var(--oxide)}
.hide{opacity:0;transform:translateY(6px)}

/* 2 team */
.netwrap{position:relative;border-radius:12px;overflow:hidden;background:var(--paper);border:1px solid var(--thread)}
canvas#net{display:block;width:100%;height:460px;cursor:pointer}
@media (max-width:600px){canvas#net{height:380px}}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:12px;color:var(--pencil)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:50%;display:inline-block}
.legend i.ring{border:1.5px solid var(--pencil);background:transparent}
.legend i.pulse{width:14px;height:3px;border-radius:2px;background:var(--cristal);opacity:.7}
.agentx{display:grid;gap:14px}
.axhead{display:flex;gap:14px;align-items:center}
.avatar{width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-family:var(--f-display);font-size:24px;flex:none}
.axname{font-family:var(--f-display);font-weight:400;font-size:28px;line-height:1.1}
.tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--thread)}
.tabs button{border:none;background:none;padding:8px 12px;font-family:var(--f-mono);font-size:12px;color:var(--pencil);border-bottom:2px solid transparent;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--cristal)}
.axbody{min-width:0}
.kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
@media (max-width:640px){.kv{grid-template-columns:minmax(0,1fr)}}
.kv div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid var(--thread);font-size:13.5px}
.kv dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--pencil);padding-top:2px}
.kv dd{margin:0;color:var(--ink)}
.brief2{font-family:var(--f-body);font-size:15.5px;line-height:1.6;color:var(--ink);border-left:2px solid var(--thread);padding-left:14px;margin-bottom:12px}
.mdfile{background:var(--paper);border:1px solid var(--thread);border-radius:10px;padding:14px 16px;font-family:var(--f-mono);font-size:12.5px;line-height:1.65;color:var(--graphite);white-space:pre-wrap;overflow-x:auto;max-height:340px;overflow-y:auto}
.mdfile .h{color:var(--ink);font-weight:500}
.mdfile .c{color:var(--cristal)}
.netlab{position:absolute;left:12px;bottom:10px;font-family:var(--f-mono);font-size:11.5px;color:var(--pencil);background:var(--paper);padding:2px 6px;border-radius:4px}
.roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.role{border:1px solid var(--thread);border-radius:10px;padding:9px 11px;display:grid;gap:2px;transition:border-color .4s,background .4s}
.role b{font-size:13.5px;color:var(--ink);font-weight:600}
.role span{font-size:12px;color:var(--pencil)}
.role.lit{border-color:var(--cristal-dim);background:var(--bone)}
@media (max-width:420px){.roster{grid-template-columns:minmax(0,1fr)}}

/* 3 board */
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-height:250px}
.lane{display:grid;align-content:start;gap:8px;min-width:0}
.lane>.eyebrow{padding-bottom:6px;border-bottom:1px solid var(--thread)}
.stick{background:var(--bone);border-radius:8px;padding:9px 10px;font-size:13px;line-height:1.4;color:var(--ink);transition:opacity .4s,transform .4s}
.stick small{display:block;font-family:var(--f-mono);font-size:10.5px;color:var(--pencil);margin-top:4px}
.stick.ch{background:transparent;border:1px dashed var(--oxide)}
.stick.bd{background:transparent;border:1px solid var(--cristal-dim)}
@media (max-width:560px){.board{grid-template-columns:minmax(0,1fr)}}
.kill{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--thread);border-radius:12px;padding:10px 14px;margin-top:14px;flex-wrap:wrap}
.kill b{color:var(--ink);font-size:14px}
.switch{width:46px;height:26px;border-radius:13px;border:1px solid var(--thread);background:var(--bone);position:relative;padding:0}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--moss);transition:left .25s,background .25s}
.switch[aria-checked="true"]::after{left:23px;background:var(--rose)}
.runstate{font-family:var(--f-mono);font-size:12px}

/* 4 integrity */
.claims{display:grid;gap:8px}
.claim{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;border:1px solid var(--thread);border-radius:10px;background:var(--paper);padding:10px 12px;color:var(--ink);font-size:14px}
.claim[aria-pressed="true"]{border-color:var(--cristal);background:var(--bone)}
.cid{font-family:var(--f-mono);font-size:11.5px;color:var(--cristal)}
.pill{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:999px;white-space:nowrap;border:1px solid}
.p-ok{color:var(--moss);border-color:var(--moss)}
.p-bad{color:var(--rose);border-color:var(--rose)}
.p-part{color:var(--pencil);border-color:var(--pencil)}
.p-prov{color:var(--cristal-dim);border-color:var(--cristal-dim);border-style:dashed}
@media (max-width:480px){.claim{grid-template-columns:minmax(0,1fr) auto}.claim .cid{grid-column:1/-1}}
.trail{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:0;position:relative}
.trail li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;padding-bottom:14px;position:relative}
.trail li::before{content:"";position:absolute;left:10px;top:20px;bottom:0;width:1px;background:var(--thread)}
.trail li:last-child::before{display:none}
.dot{width:21px;height:21px;border-radius:50%;border:1.5px solid var(--cristal-dim);display:grid;place-items:center;font-family:var(--f-mono);font-size:10px;color:var(--cristal);background:var(--card);transition:background .3s,color .3s}
.trail li.done .dot{background:var(--cristal);color:var(--card);border-color:var(--cristal)}
.trail b{display:block;color:var(--ink);font-size:14px;font-weight:600}
.trail span{font-size:13.5px;color:var(--graphite)}
.gates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:640px){.gates{grid-template-columns:minmax(0,1fr)}}
.gate{border:1px solid var(--thread);border-radius:12px;padding:14px;display:grid;gap:6px;background:var(--card)}
.gate b{color:var(--ink);font-size:14.5px}
.gate span{font-size:13.5px}
.meter{height:6px;border-radius:3px;background:var(--bone);overflow:hidden}
.meter i{display:block;height:100%;background:var(--moss);width:100%}
.reader{display:grid;gap:6px;font-size:13px}
.reader div{display:flex;justify-content:space-between;gap:8px;border-bottom:1px dotted var(--thread);padding-bottom:4px}
.reader em{font-style:normal;font-family:var(--f-mono);font-size:11.5px;color:var(--pencil)}
.chainbox{overflow-x:auto;padding-bottom:6px}
.chain{display:flex;gap:0;align-items:stretch;min-width:max-content}
.blk{width:150px;border:1px solid var(--thread);border-radius:10px;padding:10px;background:var(--paper);display:grid;gap:4px;font-size:12px;transition:border-color .3s,background .3s}
.blk .h{font-family:var(--f-mono);font-size:10.5px;color:var(--pencil);word-break:break-all}
.blk .e{color:var(--ink);font-size:12.5px;line-height:1.35;min-height:34px}
.blk.broken{border-color:var(--rose);background:var(--bone)}
.blk.broken .h{color:var(--rose)}
.link{width:22px;align-self:center;height:2px;background:var(--cristal-dim)}
.link.broken{background:var(--rose)}
.verdict{font-family:var(--f-mono);font-size:12.5px;margin-top:10px}
.verdict.ok{color:var(--moss)} .verdict.bad{color:var(--rose)}

/* 5 deliverable */
.memo{background:var(--card);border:1px solid var(--thread);border-radius:6px;padding:28px 26px;box-shadow:0 18px 40px -28px rgba(24,26,30,.45);display:grid;gap:14px;font-family:var(--f-body);color:var(--ink)}
.memo .mast{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pencil);border-bottom:1px solid var(--thread);padding-bottom:10px}
.memo h3{font-family:var(--f-display);font-weight:400;font-size:28px;line-height:1.15}
.memo .ans{font-size:17px;line-height:1.6}
.sowhat{border-top:2px solid var(--ink);border-bottom:1px solid var(--thread);padding-block:10px;display:grid;gap:4px}
.sowhat .eyebrow{color:var(--ink)}
.sowhat p{font-size:15.5px;line-height:1.55}
.conf{font-family:var(--f-ui);font-size:13px;color:var(--graphite);display:grid;gap:4px}
.conf b{color:var(--moss);font-weight:600}
.memo ol{margin:0;padding-left:20px;font-size:15px;line-height:1.55;display:grid;gap:4px}
.appx{border-top:1px dashed var(--thread);padding-top:12px;font-family:var(--f-ui);font-size:13px;display:grid;gap:8px}
.appx table{border-collapse:collapse;width:100%;font-size:12.5px}
.appx td,.appx th{text-align:left;padding:5px 6px;border-bottom:1px solid var(--thread);vertical-align:top}
.appx th{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--pencil);font-weight:400}
.tbl{overflow-x:auto}

/* 6 proof */
.receipts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:720px){.receipts{grid-template-columns:minmax(0,1fr)}}
.rc{border-top:2px solid var(--ink);padding-top:12px;display:grid;gap:6px}
.rc b{color:var(--ink);font-size:16px}
.rc span{font-size:14px}
/* range */
.fam{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.fam button{border:1px solid var(--thread);background:transparent;border-radius:999px;padding:5px 12px;font-size:13px;color:var(--graphite)}
.fam button[aria-selected="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tpl{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;margin-top:14px}
.tcard{border:1px solid var(--thread);border-radius:10px;padding:10px 12px;display:grid;gap:2px;background:var(--paper);transition:opacity .25s}
.tcard b{color:var(--ink);font-size:14px;font-weight:600}
.tcard span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--pencil)}
.pkgs{margin-top:16px;display:grid;gap:8px}
.pkgs .chip{cursor:default}
.fus{display:grid;gap:12px}
.erp{display:grid;gap:14px}
.erpcols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (max-width:900px){.erpcols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.erpcols{grid-template-columns:minmax(0,1fr)}}
.erpcol{border:1px solid var(--thread);border-radius:12px;padding:12px 14px;background:var(--card);display:grid;gap:8px;align-content:start}
.erpcol h4{font-family:var(--mono,'JetBrains Mono',monospace);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--cristal);font-weight:500;display:flex;justify-content:space-between;gap:8px}
.erpcol ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.erpcol li{font-size:13.5px;line-height:1.35;color:var(--ink)}
.erpcol li.lead{font-weight:600}
.erpind{border-left:3px solid var(--oxide);padding:10px 14px;background:var(--card);border-radius:0 10px 10px 0;font-size:14px}
.fstats{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:760px){.fstats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:420px){.fstats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ftasks{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:4px 16px;margin-top:6px;max-height:420px;overflow-y:auto;padding-right:4px}
.ftask{display:grid;grid-template-columns:26px 12px minmax(0,1fr);gap:8px;align-items:center;font-size:13px;padding:5px 0;border-bottom:1px dotted var(--thread);color:var(--graphite)}
.ftask .o{font-family:var(--f-mono);font-size:11px;color:var(--pencil);font-variant-numeric:tabular-nums;text-align:right}
.ftask i{width:10px;height:10px;border-radius:50%;display:block}
.ftask i.r{background:var(--moss)} .ftask i.p{background:var(--cristal-dim)} .ftask i.c{border:1.5px solid var(--pencil)}
.ftask.m{color:var(--ink);font-weight:500}
.ftask .tag{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--oxide);margin-left:6px}
/* capabilities */
.hero h1{font-size:clamp(44px,7.4vw,88px)}
.caps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid var(--ink)}
@media (max-width:860px){.caps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.caps{grid-template-columns:minmax(0,1fr)}}
.cap{display:grid;align-content:start;gap:6px;padding:18px 20px 20px 0;border-bottom:1px solid var(--thread);text-decoration:none;color:inherit;transition:background .2s}
.cap:hover b{color:var(--cristal)}
.cap b{font-family:var(--f-display);font-weight:400;font-size:27px;line-height:1.15;color:var(--ink)}
.cap>span:not(.eyebrow){font-size:14.5px;color:var(--graphite)}
.cap em{font-style:normal;font-size:13px;color:var(--cristal);margin-top:4px}
.focus{padding-block:64px 8px;display:grid;gap:14px}
.focus h2{font-family:var(--f-display);font-weight:400;font-size:clamp(36px,5.4vw,56px);line-height:1.05}
/* comparison */
.cmpwrap{overflow-x:auto;border-radius:16px}
.cmp{border-collapse:separate;border-spacing:0;font-size:13px;min-width:1500px;width:100%}
.cmp th,.cmp td{padding:9px 6px;border-bottom:1px solid var(--thread);text-align:center;vertical-align:middle;background:var(--card)}
.cmp thead th{vertical-align:bottom;padding-top:14px}
.cmp .cap{position:sticky;left:0;z-index:2;text-align:left;min-width:260px;max-width:300px;padding-left:16px;color:var(--ink);font-weight:500;line-height:1.35;box-shadow:1px 0 0 var(--thread)}
.cmp thead .cap{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pencil);font-weight:400}
.cmp .orq{background:var(--ink);color:var(--paper);min-width:92px;position:sticky;left:300px;z-index:2}
.cmp thead .orq{font-family:var(--f-mark);font-weight:600;letter-spacing:.18em;font-size:12px}
.cmp .mh{min-width:52px;max-width:60px}
.cmp .mh span{display:block;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;margin:0 auto;font-size:12px;color:var(--ink);font-weight:500;max-height:160px}
.cmp .mh small{display:block;writing-mode:vertical-rl;transform:rotate(180deg);margin:4px auto 0;font-family:var(--f-mono);font-size:9.5px;color:var(--pencil);letter-spacing:.04em}
.cmp .mh span.rk{writing-mode:horizontal-tb;transform:none;font-family:var(--f-mono);font-size:10px;color:var(--pencil);font-weight:400;margin-bottom:8px}
.cmp td.y{color:var(--moss);font-weight:600;font-size:15px}
.cmp td.n{color:var(--thread);font-size:15px}
.cmp td.orq.y{color:var(--paper)}
.cmp tr.grp td{background:var(--bone);text-align:left;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pencil);padding:7px 16px}
.cmp tr.grp td.cap{background:var(--bone)}
.cmp tbody tr:last-child td{border-bottom:none}
.cmpnote{display:grid;gap:6px;max-width:80ch}
@media (max-width:600px){.cmp .cap{min-width:190px;max-width:200px;font-size:12px;padding-left:12px}.cmp .orq{left:200px}}
/* 3d stage */
.netwrap.stage{background:#0B0E1C;border-color:#1C2240;border-radius:14px}
.stage canvas#net{height:520px;cursor:grab;touch-action:pan-y}
.stage canvas#net:active{cursor:grabbing}
@media (max-width:600px){.stage canvas#net{height:420px}}
.stage .netlab{background:rgba(11,14,28,.7);color:#A8B8F0;border:1px solid #1C2240}
.ntip{position:absolute;pointer-events:none;background:#F4F1EA;color:#181A1E;border-radius:8px;padding:7px 10px;font-size:12px;line-height:1.35;display:grid;gap:1px;box-shadow:0 8px 24px rgba(0,0,0,.35);max-width:180px}
.ntip b{font-weight:600}
.ntip span{color:#4A4C50;font-size:11.5px}
.ticker{margin-top:10px;display:grid;gap:2px;font-size:12.5px;min-height:96px;font-family:var(--f-ui);color:var(--graphite)}
.ticker .tk{display:grid;grid-template-columns:70px minmax(0,1fr);gap:8px;padding:3px 0;border-bottom:1px dotted var(--thread);animation:tkin .5s ease}
.ticker .tk:first-child{color:var(--ink)}
.ticker .ts{font-family:var(--f-mono);font-size:11px;color:var(--pencil)}
.ticker b{font-weight:600;color:var(--ink)}
.ticker .chx,.ticker .okx{font-style:normal;font-family:var(--f-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em}
.ticker .chx{color:var(--oxide)} .ticker .okx{color:var(--moss)}
@keyframes tkin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* nav + demo */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--paper)}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding-block:14px;border-bottom:1px solid var(--thread);margin-inline:calc(-1*max(16px,env(safe-area-inset-left,0px)));padding-inline:max(16px,env(safe-area-inset-left,0px));flex-wrap:nowrap}
a.mark{text-decoration:none}
.topnav{display:flex;gap:20px;font-size:13.5px}
.topnav a{color:var(--graphite);text-decoration:none}
.topnav a:hover{color:var(--cristal)}
.topact{display:flex;gap:10px;align-items:center}
.prodtab{font-size:13.5px;color:var(--ink);text-decoration:none;border:1px solid var(--thread);border-radius:999px;padding:7px 14px;white-space:nowrap}
.prodtab:hover{border-color:var(--ink)}
.topact .btn{text-decoration:none;white-space:nowrap}
@media (max-width:900px){.topnav{display:none}}
@media (max-width:420px){.prodtab{padding:7px 10px}.topact .btn{padding:8px 12px}}
.btn.big{padding:12px 22px;font-size:15px;text-decoration:none}
a.btn{text-decoration:none}
.ctarow{display:flex;gap:12px;flex-wrap:wrap;padding-top:28px}
.demo{margin-top:56px;padding-block:48px;border-top:2px solid var(--ink);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;scroll-margin-top:90px}
@media (max-width:820px){.demo{grid-template-columns:minmax(0,1fr)}}
.demotext{display:grid;gap:14px;align-content:start}
.demotext h2{font-family:var(--f-display);font-weight:400;font-size:clamp(34px,5vw,50px);line-height:1.05}
.demoform{display:grid;gap:14px;background:var(--card);border:1px solid var(--thread);border-radius:16px;padding:22px}
.frow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:520px){.frow{grid-template-columns:minmax(0,1fr)}}
.demoform label{display:grid;gap:6px;font-size:12.5px;font-family:var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--pencil)}
.demoform input,.demoform textarea{font:inherit;font-family:var(--f-ui);font-size:15px;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--paper);border:1px solid var(--thread);border-radius:10px;padding:10px 12px;width:100%;resize:vertical}
.demoform input:focus,.demoform textarea:focus{outline:2px solid var(--cristal);outline-offset:0;border-color:var(--cristal)}
.demoform .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.demoform a,.foot a{color:var(--cristal)}
.fstatus{font-size:14px;min-height:1.4em}
.fstatus.ok{color:var(--moss)} .fstatus.err{color:var(--rose)}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;padding-block:28px 40px;border-top:1px solid var(--thread)}
.mark.small{font-size:12px}
.chapter,.focus,.hero{scroll-margin-top:84px}
/* replay */
.replay{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px;align-items:start}
@media (max-width:860px){.replay{grid-template-columns:minmax(0,1fr)}}
.rside{display:grid;gap:16px;min-width:0}
.clock{font-family:var(--f-display);font-size:34px;color:var(--ink);font-variant-numeric:tabular-nums}
.rbar{height:2px;background:var(--thread);margin-top:10px}
.rbar span{display:block;height:100%;background:var(--cristal)}
.rlog{list-style:none;margin:12px 0 0;padding:0;display:grid}
.rlog li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;padding:8px 0;border-top:1px solid var(--thread);font-size:13.5px;transition:opacity .3s,color .3s}
.rlog li .t{font-family:var(--f-mono);font-size:11.5px;color:var(--pencil);font-variant-numeric:tabular-nums;padding-top:1px}
.rlog li .k{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--cristal-dim);margin-bottom:2px}
.rlog li.fut{opacity:.28}
.rlog li.now{color:var(--ink)}
.rlog li.now .k{color:var(--cristal)}
.kv.one{grid-template-columns:minmax(0,1fr)}
.kv.one div{grid-template-columns:minmax(0,1fr) auto}
.kv.one dd{font-variant-numeric:tabular-nums;font-weight:600;text-align:right}
.gchecks{list-style:none;padding:0;margin:10px 0 0;display:grid}
.gchecks li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;padding:6px 0;border-top:1px solid var(--thread);font-size:13px}
.gchecks li b{font-family:var(--f-mono);font-size:12px}
.gchecks .pass b{color:var(--moss)} .gchecks .fail b{color:var(--rose)} .gchecks .na b{color:var(--pencil)}
.gchecks .fail{color:var(--ink)}
/* 7 engine */
.stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border-top:2px solid var(--ink);border-bottom:1px solid var(--thread)}
.stats div{padding:14px 10px 14px 0;display:grid;gap:2px}
.stats b{font-family:var(--f-display);font-weight:400;font-size:clamp(30px,4vw,42px);color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
.stats span{font-size:12.5px;color:var(--pencil)}
@media (max-width:760px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:420px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.arch{display:grid;gap:0;margin-top:14px}
.layer{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--thread)}
.layer:first-child{border-top:none}
.layer>span{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.layer.q>span{color:var(--cristal)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--thread);background:var(--paper);color:var(--ink);border-radius:999px;padding:5px 11px;font-size:13px}
.layer.q .chip{border-color:var(--cristal-dim)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
@media (max-width:600px){.layer{grid-template-columns:minmax(0,1fr);gap:6px}}
.archdet{margin-top:12px;border-radius:10px;background:var(--bone);padding:12px 14px;display:grid;gap:3px;min-height:64px}
.archdet b{color:var(--ink);font-size:14.5px}
.archdet span{font-size:14px}
.seal{display:grid;gap:8px;margin-top:12px;justify-items:stretch}
.sbox{border:1px solid var(--thread);border-radius:10px;padding:10px 12px;display:grid;gap:2px;font-size:13.5px;background:var(--paper)}
.sbox.key{border-style:dashed;border-color:var(--oxide)}
.sbox.key .eyebrow{color:var(--oxide)}
.sbox.out{border-color:var(--cristal);background:var(--bone)}
.sbox.out .eyebrow{color:var(--cristal)}
.plus{justify-self:center;font-family:var(--f-mono);color:var(--pencil);font-size:15px;line-height:1}
.close{padding-block:80px 64px;display:grid;gap:18px;border-top:1px solid var(--thread);margin-top:72px}
.close p.big{font-family:var(--f-display);font-size:clamp(30px,5vw,46px);color:var(--ink);line-height:1.12;max-width:20ch}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
