:root{
  /* matched to Obsidian "Mesenchyme" theme */
  --paper:#0c0c0c;--paper-2:#111111;--paper-3:#1a1a1a;
  --ink:#d4d4d4;--ink-2:#969696;--ink-3:#6b6b6b;--ink-soft:#c2c2c2;
  --read:#c8c5bc;--read-em:#f6f6f6; 
  --head:"Newsreader",Georgia,serif; 
  --body:"Newsreader",Georgia,serif; 
  --line:#232323;--line-2:#2a2a2a;
  --accent:#7fb2e8;--accent-2:#93c1f2;--gold:#c08a4a;--cta-ink:#0d1319;
  --sel:rgba(90,142,199,.12);
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --serif:"Newsreader",Georgia,serif;
  --display:"Fraunces","Newsreader",Georgia,serif;
}
:root[data-theme="light"]{
  --paper:#f4f1ea;--paper-2:#ece7dd;--paper-3:#e3dccd;
  --ink:#1d1b18;--ink-2:#55504a;--ink-3:#827b6f;--ink-soft:#3c372f;
  --line:#dcd4c5;--line-2:#cdc4b1;
  --read:#1d1b18;--read-em:#0f0d0a; /* light mode reads dark-on-light, no halation — body stays full ink */
  --accent:#3f6ea5;--accent-2:#2f578a;--gold:#9a6a28;--cta-ink:#ffffff;
  --sel:rgba(63,110,165,.10);
}
:root[data-theme="light"] .app::before{mix-blend-mode:multiply;opacity:.05}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper)}

.app{display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.app::before{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:screen}

/* titlebar */
.titlebar{display:flex;align-items:center;gap:18px;height:42px;padding:0 16px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper),var(--paper-2));font-family:var(--mono);font-size:12px;color:var(--ink-2);flex:0 0 auto}
.tb-dots{display:flex;gap:7px}
.tb-dots i{width:10px;height:10px;border-radius:50%;border:1px solid var(--line-2);display:block}
.tb-dots i:nth-child(1){background:var(--accent);border-color:var(--accent-2)}
.tb-dots i:nth-child(2){background:var(--gold);border-color:#8a6428}
.tb-dots i:nth-child(3){background:var(--ink-3)}
.path{font-size:15.5px;letter-spacing:.01em;font-weight:500}
.path .sl{color:var(--ink-3);margin:0 .15em}
.path .tilde{color:var(--accent)}
.path .cur{color:var(--ink);font-weight:500}
.path a{color:inherit;text-decoration:none}
.path a:hover{color:var(--ink)}
.tb-spacer{flex:1}
.kbd{border:1px solid var(--line-2);border-bottom-width:2px;border-radius:5px;padding:2px 7px;color:var(--ink-2);background:var(--paper)}
.tb-right{display:flex;align-items:center;gap:14px}.tb-right span{color:var(--ink-3)}
.nav-toggle{display:none;align-items:center;gap:9px;background:none;border:0;color:var(--ink-2);font-family:var(--mono);font-size:12px;cursor:pointer;padding:4px 8px;letter-spacing:.04em}
.nav-toggle .cv{display:inline-block;width:9px;height:9px;margin-right:3px;border:solid var(--accent);border-width:0 2.6px 2.6px 0;transform:rotate(-45deg);transition:transform .2s}
.nav-toggle.open .cv{transform:rotate(45deg)}

.panes{flex:1;display:grid;grid-template-columns:248px 1fr 232px;min-height:0}

/* explorer */
.explorer{border-right:1px solid var(--line);background:var(--paper-2);overflow-y:auto;padding:18px 0 40px;font-family:var(--mono);font-size:12.5px;display:flex;flex-direction:column}
.ex-head{padding:0 18px 12px;color:var(--ink-3);letter-spacing:.14em;text-transform:uppercase;font-size:10px}
.tree{list-style:none;flex:1;display:flex;flex-direction:column}
.tree .folder{padding:5px 18px;color:var(--ink-2);display:flex;gap:7px;align-items:center}
.tree .folder .tw{color:var(--gold);width:9px;display:inline-block}
.tree .file{padding:5px 18px 5px 0;color:var(--ink-2);cursor:pointer;position:relative;display:flex;gap:8px;align-items:baseline;transition:color .15s,background .15s;text-decoration:none}
.tree .file .dot{color:var(--line-2);font-size:10px;transition:color .15s}
.tree .file:hover{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
.tree .file.active{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
.tree .file.active::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:2px;background:var(--accent)}
.tree .file.active .dot{color:var(--accent)}
.tree .sub{list-style:none;padding-bottom:2px}
.tree .sub .file{padding-left:32px}
.tree>.file.home{padding:6px 18px;color:var(--ink);font-size:14.5px;font-weight:600;letter-spacing:.02em}
.tree>.file.top{padding-left:18px;color:var(--ink);text-transform:capitalize}
.tree .section+.file.top{margin-top:auto;padding-top:5px;position:relative}
.tree .section+.file.top::before{content:"";position:absolute;left:22px;right:22px;top:-12px;border-top:1px solid var(--line)}
.tree .section{margin:18px 0 2px}
.tree .sec-title{padding:6px 18px;color:var(--ink);font-size:14.5px;font-weight:600;letter-spacing:.02em;cursor:pointer;position:relative;transition:color .15s;text-transform:capitalize;display:block;text-decoration:none}
.tree .sec-title:hover{color:#fff}
.tree .sec-title.active{color:var(--accent-2)}
.tree .sec-title.active::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:2px;background:var(--accent)}
.ex-foot{padding:22px 18px 0;color:var(--ink-3);font-size:10.5px;line-height:1.7;border-top:1px solid var(--line);margin-top:18px}
.theme-toggle{margin:14px 0 0;padding:12px 18px;background:none;border:0;color:var(--ink-3);font-family:var(--mono);font-size:12px;text-align:left;cursor:pointer;display:flex;align-items:center;gap:8px;transition:color .15s;width:100%;position:relative}
.theme-toggle:hover{color:var(--ink)}
.theme-toggle::before{content:"";position:absolute;left:22px;right:22px;top:0;border-top:1px solid var(--line)}
.theme-toggle .tt-ico{color:var(--accent);font-size:13px}

/* document */
.doc{overflow-y:auto;position:relative}
.doc-inner{max-width:880px;margin:0 auto;padding:60px 72px 56px}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:24px}
.doc-inner>h1{font-family:var(--head);font-weight:500;font-size:clamp(38px,4.8vw,58px);line-height:1.06;letter-spacing:.04em;margin:0 0 6px;font-optical-sizing:auto}
.doc-inner>h1 em{font-style:italic;color:var(--accent-2)}
.doc-inner>h1+p{font-family:var(--body);font-size:20px;line-height:1.5;color:var(--ink-soft);font-weight:400;margin:18px 0 6px;max-width:35em}
.doc-inner>h1+p strong{color:var(--ink);font-weight:500}
.doc-inner p{margin:0 0 26px;font-family:var(--body);font-size:18px;line-height:1.58;color:var(--read)}
.doc-inner p strong{font-weight:600;color:var(--read-em)}
.doc-inner>hr+p::first-letter{font-family:var(--head);float:left;font-size:60px;line-height:.76;padding:7px 10px 0 0;color:var(--accent);font-weight:500}
.doc-inner h2{font-family:var(--head);font-weight:500;font-size:26px;letter-spacing:.04em;margin:52px 0 14px;scroll-margin-top:24px}
.doc-inner h3{font-family:var(--head);font-weight:500;font-size:19px;letter-spacing:.04em;margin:30px 0 7px}
.doc-inner hr{height:1px;background:var(--line);border:0;margin:38px 56px}
.doc-inner blockquote{font-family:var(--head);font-weight:400;font-style:italic;font-size:27px;line-height:1.3;color:var(--ink);margin:34px 0;padding-left:22px;border-left:2px solid var(--accent)}
.doc-inner blockquote p{margin:0}
.doc-inner blockquote strong{font-style:normal;font-weight:500;color:var(--accent-2)}
.doc-inner ul{list-style:none;margin:18px 0;padding:0}
.doc-inner ul li{padding:8px 0 8px 24px;border-bottom:1px solid var(--line);position:relative;font-family:var(--body);font-size:18px;line-height:1.58;color:var(--read)}
.doc-inner ul li::before{content:"—";position:absolute;left:0;color:var(--accent)}
.doc-inner ul li strong{color:var(--read-em)}
.doc-inner ol{margin:18px 0 18px 22px}
.doc-inner ol li{margin:0 0 10px;font-family:var(--body);font-size:18px;line-height:1.58;color:var(--read)}
.doc-inner a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--line-2);transition:.15s}
.doc-inner a:hover{color:var(--accent-2);border-color:var(--accent-2)}
.doc-inner code{font-family:var(--mono);font-size:.85em;background:var(--paper-2);border:1px solid var(--line);padding:1px 5px;border-radius:3px;color:var(--ink)}
.doc-inner img{max-width:100%;border:1px solid var(--line-2);filter:grayscale(.25) contrast(.96);margin:26px 0}

/* footer (every page, inside the scroll) */
.doc-foot{max-width:880px;margin:0 auto;padding:24px 72px 80px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--ink-3);display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.doc-foot .foot-row{display:flex;flex-wrap:wrap;gap:18px}
.doc-foot a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid transparent;transition:.15s}
.doc-foot a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.doc-foot .foot-copy{margin-left:auto;color:var(--ink-3)}

/* embedded components (lanes / plate) */
.lanes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:30px 0}
.lane{border:1px solid var(--line-2);padding:14px 13px;background:var(--paper-2)}
.lane .tag{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.lane.ai .tag{color:var(--accent)}
.lane h4{font-family:var(--display);font-weight:500;font-size:16px;margin-bottom:5px}
.lane p{font-size:14px;line-height:1.45;color:var(--ink-2);margin:0}
.lane .stamp{font-family:var(--mono);font-size:10.5px;border:1px solid var(--line-2);border-radius:3px;padding:1px 5px;display:inline-block;margin-top:9px;color:var(--ink-3)}
.lane.no .stamp{color:var(--gold);border-color:var(--gold)}
figure.plate{margin:36px 0}
.plate .frame{position:relative;height:240px;border:1px solid var(--line-2);background:repeating-linear-gradient(115deg,transparent 0 6px,rgba(212,212,212,.035) 6px 7px),repeating-linear-gradient(25deg,transparent 0 9px,rgba(90,142,199,.06) 9px 10px),radial-gradient(120% 140% at 20% 10%,#1c1c1c 0%,#141414 55%,#0c0c0c 130%);overflow:hidden}
.plate .frame::after{content:"plate — image";position:absolute;right:10px;bottom:8px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.plate .frame .glyph{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:120px;color:rgba(90,142,199,.16);font-weight:300}
figcaption{font-family:var(--mono);font-size:11px;color:var(--ink-2);margin-top:9px;display:flex;gap:8px}
figcaption .fno{color:var(--accent)}

/* interactive widgets (sales) */
.widget{width:calc(100% + 80px);margin:38px -40px;border:1px solid var(--line-2);background:var(--paper-2);font-family:var(--mono)}
.w-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line);background:var(--paper-3)}
.w-title{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.widget button{font-family:var(--mono);font-size:11px;color:var(--ink-2);background:var(--paper);border:1px solid var(--line-2);border-radius:5px;padding:4px 10px;cursor:pointer;transition:.15s}
.widget button:hover{color:var(--ink);border-color:var(--accent)}
.widget button.on{color:var(--accent);border-color:var(--accent)}
/* startup terminal */
.w-term{padding:16px 18px;font-size:14px;line-height:1.95;min-height:172px}
.w-term .ln{opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s}
.w-term .ln.show{opacity:1;transform:none}
.w-term .cmd{color:var(--ink)}
.w-term .dim{color:var(--ink-3)}
.w-term .ok{color:var(--ink-2)}.w-term .ok b{color:var(--accent);font-weight:500;display:inline-block;min-width:128px}
.w-term .accent{color:var(--accent-2)}
.w-term .caret{color:var(--accent)}
@keyframes blink{50%{opacity:0}}
/* rerank */
.w-chips{display:flex;gap:6px}
.w-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.w-col{background:var(--paper-2);padding:14px 16px}
.w-col.gov{background:var(--paper)}
.w-col-h{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;display:flex;justify-content:space-between}
.w-col-h span{color:var(--line-2)}
.w-col.gov .w-col-h{color:var(--accent)}
.w-list{list-style:none;margin:0;padding:0;transition:opacity .2s}
.w-list li{display:flex;align-items:baseline;gap:9px;padding:7px 0;font-size:13.5px;color:var(--ink-2);border-bottom:1px solid var(--line)}
.w-list li:last-child{border-bottom:0}
.w-list li .rk{color:var(--ink-3);width:14px;flex:0 0 14px}
.w-list li.retired{color:var(--ink-3);text-decoration:line-through;opacity:.55}
.w-list li.settled .bd{color:var(--ink)}
.w-list li .badge{margin-left:auto;font-size:10.5px;border:1px solid var(--line-2);border-radius:3px;padding:0 5px;color:var(--ink-3);text-decoration:none}
.w-list li.settled .badge{color:var(--accent);border-color:var(--accent)}
.w-list li.retired .badge{color:var(--gold);border-color:var(--gold)}
/* provenance */
.w-lanes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line)}
.w-lane{background:var(--paper-2);padding:15px 14px;cursor:pointer;position:relative;transition:.25s;border-top:2px solid transparent}
.w-lane:hover{background:var(--paper-3)}
.w-lane.sel{border-top-color:var(--accent)}
.w-lane .lt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:7px}
.w-lane h5{font-family:var(--display);font-weight:500;font-size:16px;margin:0 0 6px;color:var(--ink)}
.w-lane p{font-size:13.5px;line-height:1.45;color:var(--ink-2);margin:0}
.w-lane .lock{position:absolute;top:13px;right:12px;font-size:10.5px;border:1px solid var(--line-2);border-radius:3px;padding:1px 5px;color:var(--ink-3)}
.w-lane.safe .lock{color:var(--accent);border-color:rgba(90,142,199,.4)}
.w-lane.gen .lock{color:var(--gold);border-color:var(--gold)}
.w-prov.reveal .w-lane.safe{opacity:.45}
.w-prov.reveal .w-lane.gen{box-shadow:inset 0 0 0 1px var(--gold);background:rgba(192,138,74,.07)}
.w-cap{padding:12px 16px;border-top:1px solid var(--line);font-size:13px;line-height:1.5;color:var(--ink-2);min-height:20px}
.w-cap b{color:var(--accent);font-weight:500}
/* chips pile */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0 8px}
.chip{font-family:var(--mono);font-size:11.5px;color:var(--ink-2);background:var(--paper-2);border:1px solid var(--line-2);border-radius:4px;padding:4px 9px}
.pilecap{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-bottom:8px}
/* register console */

.w-reg2{width:calc(100% + 80px);margin:38px -40px;font-family:var(--mono)}
.w-reg2 .term-line{display:flex;align-items:baseline;gap:14px;font-size:13px;color:var(--ink-2);margin:0 0 16px}
.w-reg2 .term-line .ok{color:var(--accent)}
.w-reg2 .term-line .st-c{flex:1}
.w-reg2 .term-line button{font-family:var(--mono);font-size:11px;color:var(--ink-2);background:var(--paper);border:1px solid var(--line-2);border-radius:5px;padding:4px 10px;cursor:pointer;transition:.15s}
.w-reg2 .term-line button:hover,.w-reg2 .term-line button:focus-visible{color:var(--ink);border-color:var(--accent);outline:0}
.w-reg2 .wins{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;align-items:start}
.w-reg2 .win{background:var(--paper-2);border:1px solid var(--line-2);box-shadow:0 10px 26px rgba(0,0,0,.22)}
.w-reg2 .win:nth-child(2){margin-top:18px}
.w-reg2 .win:nth-child(3){margin-top:8px}
.w-reg2 .win-tb{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2))}
.w-reg2 .win-tb .fname{font-size:12.5px;color:var(--ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-reg2 .win-tb .tense{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.w-reg2 .win.open .win-tb .tense{color:var(--accent)}
.w-reg2 .win-ctl{margin-left:auto;display:flex;gap:1px;flex:0 0 auto}
.w-reg2 .win-ctl button{font-family:var(--mono);width:22px;height:18px;display:grid;place-items:center;background:none;border:0;border-radius:3px;padding:0;color:var(--ink-3);font-size:11px;line-height:1;cursor:pointer;transition:.15s}
.w-reg2 .win-ctl button:hover,.w-reg2 .win-ctl button:focus-visible{background:var(--sel);color:var(--ink);outline:0}
.w-reg2 .win-ctl .cl:hover,.w-reg2 .win-ctl .cl:focus-visible{color:var(--gold)}
.w-reg2 .win-body{padding:12px 13px 14px;display:flex;flex-direction:column;gap:10px}
.w-reg2 .win.min .win-body{display:none}
.w-reg2 .fm{font-size:11.5px;line-height:1.65;color:var(--ink-3);border-bottom:1px dashed var(--line-2);padding-bottom:9px}
.w-reg2 .fm .fence{color:var(--line-2)}
.w-reg2 .fm .v{color:var(--ink-2)}
.w-reg2 .entry{font-size:13.5px;line-height:1.55;color:var(--ink)}
.w-reg2 .entry .eid{color:var(--accent);font-weight:500}
.w-reg2 .entry .sid{color:var(--ink-3);font-size:11.5px}
.w-reg2 .rows{list-style:none;margin:0;padding:0;max-width:none}
.w-reg2 .rows li{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-family:var(--mono);font-size:13px;line-height:1.5;color:var(--ink-2);border-bottom:1px solid var(--line)}
.w-reg2 .rows li::before{content:none}
.w-reg2 .rows li:last-child{border-bottom:0}
.w-reg2 .rows li.done{color:var(--ink-3)}
.w-reg2 .rows .st{font-size:11px;color:var(--ink-3)}
.w-reg2 .rows li.done .st{color:var(--accent)}
.w-reg2 .so{margin-top:auto;font-size:12.5px;line-height:1.5;color:var(--ink-3);border-left:2px solid var(--line-2);padding-left:10px}
.w-reg2 .win.open .so{border-left-color:var(--accent)}
.w-reg2.anim .win{opacity:0;transform:translateY(8px) scale(.985)}
.w-reg2.anim .win.open{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
@media (prefers-reduced-motion:reduce){.w-reg2.anim .win{opacity:1;transform:none;transition:none}}
@media(max-width:760px){.w-reg2{width:100%;margin:38px 0}.w-reg2 .wins{grid-template-columns:1fr}.w-reg2 .win{margin-top:0 !important}}
/* copy test */
.w-copy{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.w-copy .cc{background:var(--paper-2);padding:16px}
.w-copy .cl{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
.w-copy .cr{font-size:13px;color:var(--ink-2);padding:5px 0;border-bottom:1px solid var(--line)}
.w-copy .cbtn{margin-top:13px;width:100%}
.w-copy .msg{margin-top:11px;font-size:12.5px;min-height:16px;line-height:1.4}
.w-copy .ok2{color:var(--accent)}.w-copy .bad{color:var(--gold)}
/* faq accordion */
.w-faq{padding:4px 16px}
.w-faq .qa{border-bottom:1px solid var(--line)}
.w-faq .qa:last-child{border-bottom:0}
.w-faq .q{width:100%;text-align:left;border:0;border-radius:0;background:transparent;padding:15px 2px;color:var(--ink);font-family:var(--serif);font-size:16px;cursor:pointer;display:flex;justify-content:space-between;gap:14px}
.w-faq .q .pl{color:var(--accent);font-family:var(--mono);font-size:15px;flex:0 0 auto}
.w-faq .a{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--ink-2);font-family:var(--serif);font-size:14.5px;line-height:1.6}
.w-faq .qa.open .a{max-height:360px}
.w-faq .a div{padding:0 2px 16px}
/* notify (static panel) */
.w-notify{display:flex;gap:8px;padding:14px 16px;border:1px solid var(--line-2);background:var(--paper-2);margin:22px 0}
.w-notify input{flex:1;background:var(--paper);border:1px solid var(--line-2);border-radius:6px;padding:9px 12px;color:var(--ink);font-family:var(--mono);font-size:13px}
.w-notify input::placeholder{color:var(--ink-3)}
.w-notify button{font-family:var(--mono);font-size:13px;color:var(--accent);background:var(--paper);border:1px solid var(--accent);border-radius:6px;padding:9px 16px;cursor:pointer}
.lanes.g4{grid-template-columns:1fr 1fr 1fr 1fr}
/* contact form */
.w-form{padding:16px;display:flex;flex-direction:column;gap:10px}
.w-form input,.w-form textarea{background:var(--paper);border:1px solid var(--line-2);border-radius:6px;padding:10px 12px;color:var(--ink);font-family:var(--mono);font-size:13.5px;width:100%}
.w-form textarea{resize:vertical;line-height:1.5}
.w-form input::placeholder,.w-form textarea::placeholder{color:var(--ink-3)}
.w-form input:focus,.w-form textarea:focus{outline:0;border-color:var(--accent)}
.w-form .cf-send{align-self:stretch;font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.04em;color:var(--cta-ink);background:var(--accent);border:1px solid var(--accent);border-radius:6px;padding:12px 22px;cursor:pointer;transition:.15s}
.w-form .cf-send:hover{background:var(--accent-2);border-color:var(--accent-2)}
.w-form .cf-send:disabled{opacity:.55;cursor:default}
.w-form .cf-out{font-size:12.5px;min-height:14px;line-height:1.45}
.w-form .cf-out.ok{color:var(--accent)}
.w-form .cf-out.err{color:var(--gold)}
.w-form .cf-consent{font-size:11.5px;color:var(--ink-3);line-height:1.45}
.w-form .cf-consent a{color:var(--ink-2);border-bottom:1px solid var(--line-2)}
/* run-the-system playable demo */
.w-sess{display:flex;flex-direction:column}
.w-sess .w-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold);border-radius:3px;padding:1px 6px}
.sess-tools{display:flex;gap:10px;align-items:center}
.sess-fs{font-family:var(--mono);font-size:12px}
.sess-grid{display:grid;grid-template-columns:240px 1fr;gap:1px;background:var(--line);flex:1;min-height:60vh}
.sess-vault{background:var(--paper-3);padding:14px}
.sv-h{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:11px}
.sv-tree{list-style:none;margin:0;padding:0;font-family:var(--mono);font-size:13px}
.sv-tree li{display:flex;justify-content:space-between;gap:8px;padding:6px 0;color:var(--ink-2);border-bottom:1px solid var(--line)}
.sv-tree li:last-child{border-bottom:0}
.sv-tree li .ct{color:var(--ink-3);font-size:11px}
.sv-tree li.hot{color:var(--accent)}.sv-tree li.hot .ct{color:var(--accent)}
.sess-main{background:var(--paper-2);display:flex;flex-direction:column;min-height:0}
.sess-con{padding:16px 20px;font-family:var(--mono);font-size:14px;line-height:1.85;flex:1;min-height:170px;overflow-y:auto}
.sess-con .cl{opacity:0;animation:rise .3s forwards}
.sess-con .cmd{color:var(--ink)}
.sess-con .dim{color:var(--ink-3)}
.sess-con .ok{color:var(--ink-2)}
.sess-con .acc{color:var(--accent)}
.sess-con .div{color:var(--ink-3);border-top:1px dashed var(--line-2);margin:9px 0 4px;padding-top:9px}
.sess-stage{padding:14px 16px;border-top:1px solid var(--line);background:var(--paper-3)}
.sess-q{font-family:var(--serif);font-size:16px;color:var(--ink);margin-bottom:12px;line-height:1.4}
.sess-choices{display:flex;gap:8px;flex-wrap:wrap}
.sess-ans{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);margin:4px 0}
.sess-ans .a{background:var(--paper-2);padding:13px}
.sess-ans .a .al{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.sess-ans .a.blind{opacity:.72}.sess-ans .a.blind .al{color:var(--ink-3)}
.sess-ans .a.loaded .al{color:var(--accent)}
.sess-ans .a p{font-size:14px;line-height:1.5;color:var(--ink-2);margin:0}
.sess-ans .a.loaded p b{color:var(--ink)}
.sess-punch{font-family:var(--display);font-style:italic;font-size:19px;color:var(--ink);margin:14px 0 6px}
/* fullscreen mode */
.w-sess.fs{position:fixed;inset:0;z-index:2000;margin:0;width:auto;border:0;background:var(--paper)}
.w-sess.fs .sess-grid{min-height:0;height:calc(100vh - 44px);grid-template-columns:320px 1fr}
.w-sess.fs .sess-con{font-size:14.5px;padding:24px 30px;line-height:1.95}
.w-sess.fs .sess-stage{padding:24px 30px}
.w-sess.fs .sess-vault{padding:22px}
.w-sess.fs .sv-tree{font-size:13px}
.w-sess.fs .sess-q{font-size:21px}
.w-sess.fs .sess-ans .a{padding:20px}
.w-sess.fs .sess-ans .a p{font-size:15px}
.w-sess.fs .sess-punch{font-size:27px}
@media(max-width:760px){.w-cols,.w-lanes,.w-copy,.sess-grid,.sess-ans{grid-template-columns:1fr}.lanes,.lanes.g4{grid-template-columns:1fr 1fr}}

/* contents / margin */
.contents{border-left:1px solid var(--line);background:var(--paper-2);overflow-y:auto;padding:24px 22px 34px;font-family:var(--mono);display:flex;flex-direction:column}
.contents .ttl{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:16px}
.toc{list-style:none}.toc li{margin:0 0 2px}
.toc a{display:block;text-decoration:none;color:var(--ink-2);font-size:12px;padding:4px 8px 4px 12px;border-left:2px solid transparent;transition:.15s;line-height:1.35}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ink);border-left-color:var(--accent);background:linear-gradient(90deg,var(--sel),transparent)}
.toc a .n{color:var(--ink-3);margin-right:7px}
.margin{margin-top:auto;padding-top:22px;border-top:1px solid var(--line);text-align:left}
.margin .note{font-size:12px;line-height:1.6;color:var(--ink-2);margin:0}
.margin .note .lbl{color:var(--accent);display:block;letter-spacing:.1em;margin-bottom:7px;font-size:10px;text-transform:uppercase}

/* statusbar */
.statusbar{flex:0 0 auto;height:30px;border-top:1px solid var(--line);background:var(--paper-2);display:flex;align-items:center;gap:20px;padding:0 16px;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.statusbar .live{color:var(--accent)}.statusbar .sp{flex:1}

/* motion */
.doc-inner>*{opacity:0;transform:translateY(10px)}
.doc.in .doc-inner>*{animation:rise .5s cubic-bezier(.2,.7,.2,1) forwards}
.doc.in .doc-inner>*:nth-child(1){animation-delay:.02s}
.doc.in .doc-inner>*:nth-child(2){animation-delay:.06s}
.doc.in .doc-inner>*:nth-child(3){animation-delay:.1s}
.doc.in .doc-inner>*:nth-child(4){animation-delay:.14s}
.doc.in .doc-inner>*:nth-child(5){animation-delay:.18s}
.doc.in .doc-inner>*:nth-child(n+6){animation-delay:.22s}
@keyframes rise{to{opacity:1;transform:none}}

.doc::-webkit-scrollbar,.explorer::-webkit-scrollbar,.contents::-webkit-scrollbar{width:10px}
.doc::-webkit-scrollbar-thumb,.explorer::-webkit-scrollbar-thumb,.contents::-webkit-scrollbar-thumb{background:var(--line-2);border:3px solid var(--paper-2)}
@media(max-width:1080px){.panes{grid-template-columns:200px 1fr}.contents{display:none}}
@media(max-width:760px){
  /* let the page itself scroll so the browser's pull-to-refresh arms;
     desktop keeps the fixed app-shell with internally-scrolling panes. */
  .app{height:auto;min-height:100vh;overflow:visible}
  .panes{display:block;min-height:0}
  .doc{overflow:visible;position:static}
  .titlebar{position:sticky;top:0;z-index:1600}
  .nav-toggle{display:inline-flex}
  .explorer{position:fixed;top:42px;left:0;right:0;max-height:calc(100dvh - 43px);-webkit-overflow-scrolling:touch;z-index:1500;display:none;border-right:0;border-bottom:1px solid var(--line);box-shadow:0 18px 36px rgba(0,0,0,.55)}
  .explorer.open{display:block}
  .doc-inner{padding:34px 20px 44px}
  .doc-foot{padding:22px 20px 48px;flex-direction:column;align-items:flex-start;gap:14px}
  .doc-foot .foot-copy{margin-left:0}
}

/* dial 1 — Georgia body kills serif halation; headings stay Newsreader */
:root{--body:Georgia,"Times New Roman",serif}

/* dial 2 — measure cap at 36em (~72ch was ~85ch) */
.doc-inner p{max-width:36em}
.doc-inner ul{max-width:36em}
/* lead keeps the display serif per the approved mock */
.doc-inner>h1+p{font-family:var(--head)}

/* dial 4 — no boundary bars: blend all chrome into the field (desktop;
   the mobile drawer keeps its boxed styling for legibility) */
@media(min-width:761px){
  .titlebar{border-bottom:0;background:transparent}
  .tb-dots{display:none}
  .explorer{border-right:0;background:transparent}
  .contents{border-left:0;background:transparent}
  .ex-foot{border-top:0}
  .theme-toggle::before{content:none}
  .tree .section+.file.top::before{content:none}
  .margin{border-top:0}
  .statusbar{border-top:0;background:transparent}
  .doc-foot{border-top:0}
  .doc-inner ul li{border-bottom:0}
  .doc-inner hr{background:transparent}
}

.tree .file .dot{color:var(--accent);opacity:.55}
.tree .file.active .dot,.tree .file:hover .dot{opacity:1}
.toc a .n{color:var(--accent);opacity:.75}

/* dial 6 — type scale matched to the A anchor (sandbox read small against it):
   body 18→18.5/1.62, lead 20→23, h1 ceiling 58→60 */
.doc-inner p{font-size:18.5px;line-height:1.62}
.doc-inner ul li,.doc-inner ol li{font-size:18.5px;line-height:1.62}
.doc-inner>h1{font-size:clamp(40px,5vw,60px)}
.doc-inner>h1+p{font-size:23px;line-height:1.42}

/* dial 7 — left nav one notch larger */
.explorer{font-size:13.5px}
.tree>.file.home,.tree .sec-title{font-size:15.5px}

/* dial 8 — bold: Georgia has no 600, it snaps to a heavy 700 blob. Emphasis
   is carried by the bright color alone; weight stays 400 (uniform stroke) */
.doc-inner p strong,.doc-inner ul li strong,.doc-inner ol li strong{font-weight:400;color:var(--read-em)}

.tree .file{font-size:14px}
.toc a{font-size:14px;line-height:1.4}
.toc li{margin:0 0 8px}
.margin .note{font-size:14px}

/* dial 10 — page-level scroll on desktop: the scrollbar lives at the window's
   right edge instead of drawing a line between the doc and the right pane.
   TocSpy listens on window as well as .doc, so scrollspy survives. */
:root{color-scheme:dark}
:root[data-theme="light"]{color-scheme:light}
@media(min-width:761px){
  .app{height:auto;min-height:100vh;overflow:visible}
  .panes{align-items:start}
  .doc{overflow:visible}
  /* locked chrome: sticky breadcrumb bar + panes sized to the viewport
     remainder, so the side menus are always fully on screen. The tree's
     flex:1 pushes Services/Contact/light-mode to the pane bottom, and the
     margin's margin-top:auto pins the abstract — same anchoring as the
     old fixed shell. Bar gets a paper background so text doesn't scroll
     through it (flat color, no border = still no bars). */
  .titlebar{position:sticky;top:0;z-index:100;background:var(--paper)}
  .explorer{position:sticky;top:42px;height:calc(100vh - 42px)}
  .contents{position:sticky;top:42px;height:calc(100vh - 42px)}
  body::-webkit-scrollbar{width:10px}
  body::-webkit-scrollbar-thumb{background:var(--line-2);border:3px solid var(--paper)}
}

.w-tdhero{text-align:center;padding:6px 0 8px}
.w-tdhero .td-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:600}
.w-tdhero .td-h1{font-family:var(--head);font-weight:500;font-size:clamp(30px,4.2vw,46px);letter-spacing:.02em;line-height:1.1;color:var(--ink);margin:14px auto 12px;max-width:20em}
.w-tdhero .td-sub{font-family:var(--mono);font-size:13.5px;line-height:1.65;color:var(--ink-2);max-width:46em;margin:0 auto 22px}
.td-form{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:0 auto 10px}
.td-form input{background:var(--paper);border:1px solid var(--line-2);border-radius:5px;padding:11px 13px;font-family:var(--mono);font-size:12.5px;color:var(--ink);width:200px}
.td-form input::placeholder{color:var(--ink-3)}
.td-form .td-go{background:var(--accent);border:0;border-radius:5px;color:var(--cta-ink);font-family:var(--mono);font-weight:600;font-size:12.5px;padding:11px 18px;cursor:pointer}
.td-form .td-go:hover{background:var(--accent-2)}
.td-form .td-go:disabled{opacity:.6;cursor:default}
.td-micro{font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.td-out{font-family:var(--mono);font-size:11.5px;min-height:16px;margin-top:8px}
.td-out.ok{color:var(--accent)}
.td-out.err{color:var(--gold)}
.w-tdform{text-align:center;margin:6px 0 26px}

.ciflow{position:relative;height:440px;margin:30px auto 0;max-width:920px;text-align:left}
.ciflow svg.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ciflow .wires path{fill:none;stroke:var(--line-2);stroke-width:1.5}
.ciflow .cap-mini{position:absolute;left:0;width:216px;background:var(--paper-2);border:1px solid var(--line-2);box-shadow:0 6px 16px rgba(0,0,0,.16);z-index:1}
.ciflow .cap-mini .tb{display:flex;align-items:center;gap:6px;padding:4px 9px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2));font-family:var(--mono);font-size:12.5px;color:var(--ink);font-weight:500}
.ciflow .cap-mini .tb .dot{color:var(--line-2);font-size:7px}
.ciflow .cap-mini .bd{padding:6px 9px 7px;font-family:var(--mono);font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.ciflow .cap-mini .bd b{color:var(--ink-2);font-weight:500}
.ciflow .cap-mini.c1{top:0}
.ciflow .cap-mini.c2{top:110px}
.ciflow .cap-mini.c3{top:220px}
.ciflow .cap-mini.c4{top:330px}
.ciflow .readnode{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;background:var(--paper-3);border:1px solid var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.25);width:160px}
.ciflow .readnode .tb{display:flex;align-items:center;gap:6px;padding:5px 10px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:12.5px;color:var(--accent);font-weight:600}
.ciflow .readnode .bd{padding:7px 10px 8px;font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.ciflow .mapdoc{position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:1;width:256px}
.ciflow .mapdoc .mdoc{box-shadow:0 10px 28px rgba(0,0,0,.35)}
.ciflow .mapdoc .mbar{font-size:11px}
.ciflow .mapdoc .mbody{padding:10px 12px 12px}
.ciflow .mapdoc h4{font-size:12.5px;margin:0 0 6px}
.ciflow .mapdoc table{font-size:9px}
.ciflow .mapdoc th{font-size:8px;padding:3px 6px 3px 0}
.ciflow .mapdoc td{padding:4px 6px 4px 0}
.ciflow .mapdoc .fmove{margin:7px 0 0;font-size:12.5px;color:#8a5a20;font-weight:600}
@media(max-width:820px){
  .ciflow{height:auto;max-width:none}
  .ciflow svg.wires{display:none}
  .ciflow .cap-mini,.ciflow .readnode,.ciflow .mapdoc{position:static;transform:none;width:100%;margin:0 0 10px}
}

.mdoc{background:#fdfdfc;border-radius:6px;box-shadow:0 16px 40px rgba(0,0,0,.4);overflow:hidden;color:#444;font-family:"Segoe UI",system-ui,sans-serif;width:100%;max-width:680px;text-align:left}
.mdoc .mbar{display:flex;align-items:center;gap:8px;background:#ececea;border-bottom:1px solid #d8d8d4;padding:7px 12px;font-size:9.5px;color:#666}
.mdoc .mbar .md-dots{display:flex;gap:4px}
.mdoc .mbar .md-dots i{width:7px;height:7px;border-radius:50%;background:#c9c9c4;display:block}
.mdoc .mbar b{color:#333;font-weight:600}
.mdoc .mbody{padding:16px 20px 18px}
.mdoc h4{font-size:14px;margin:0 0 8px;color:#191919;font-weight:700;font-family:inherit;letter-spacing:0;line-height:1.3}
.mdoc table{width:100%;border-collapse:collapse;font-size:8.5px;line-height:1.45;margin:0}
.mdoc th{text-align:left;font-size:7.5px;letter-spacing:.05em;text-transform:uppercase;color:#888;border-bottom:1.5px solid #d8d8d4;padding:4px 8px 4px 0;background:none}
.mdoc td{border-bottom:1px solid #e8e8e4;padding:6px 8px 6px 0;vertical-align:top;color:#555;background:none}
.mdoc td:first-child{font-weight:600;color:#222}
.mdoc td b{color:#191919}

.ci-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:6px 0 26px}
.ci-chip{border:1px solid var(--line-2);border-radius:6px;background:var(--paper-2);padding:14px 16px;font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--ink-2)}
.ci-chip strong{color:var(--ink);font-weight:600}
@media(max-width:820px){.ci-strip{grid-template-columns:1fr}}

.ci-proof{margin:10px 0 8px}
.ci-proof img{max-width:100%;height:auto;border:1px solid var(--line-2);border-radius:6px;box-shadow:0 14px 34px rgba(0,0,0,.25);display:block}
.ci-transcript{font-family:var(--mono);font-size:12px;color:var(--ink-2);margin:0 0 22px}
.ci-transcript summary{cursor:pointer;color:var(--ink-3);padding:4px 0}
.ci-transcript pre{overflow-x:auto;background:var(--paper-2);border:1px solid var(--line);border-radius:6px;padding:14px 16px;font-size:12px;line-height:1.5;white-space:pre}

.panes:has(.w-tdhero) .explorer{opacity:.45;transition:opacity .25s}
.panes:has(.w-tdhero) .explorer:hover,.panes:has(.w-tdhero) .explorer:focus-within{opacity:1}

.doc-inner .cta-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:26px 0 10px}
.doc-inner .cta-btn{display:inline-block;background:var(--accent);color:var(--cta-ink);font-family:var(--mono);font-weight:600;font-size:12.5px;padding:11px 18px;border-radius:5px;text-decoration:none;border-bottom:0;transition:.15s}
.doc-inner .cta-btn:hover{background:var(--accent-2);color:var(--cta-ink);border-bottom:0}
.doc-inner .cta-sub{font-family:var(--mono);font-size:12px}
.doc-inner .cta-mid{margin:30px 0 8px}
.doc-inner .cta-mid .cta-q{font-family:var(--mono);font-size:12.5px;color:var(--ink-2)}

.w-hub{width:calc(100% + 144px);margin:40px -72px 34px;font-family:var(--mono)}
.w-hub .stage{position:relative}
.w-hub svg.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.w-hub .wires path{fill:none;stroke:var(--line-2);stroke-width:1.5}
.w-hub .hub-app{background:var(--paper-2);border:1px solid var(--line-2);box-shadow:0 8px 20px rgba(0,0,0,.18);z-index:1;width:178px}
.w-hub .hub-app .tb{display:flex;align-items:center;gap:7px;padding:5px 10px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2))}
.w-hub .hub-app .tb .dot{color:var(--line-2);font-size:8px}
.w-hub .hub-app .tb .name{font-size:12.5px;color:var(--ink);font-weight:500}
.w-hub .hub-app .abody{padding:8px 10px 9px;display:flex;flex-direction:column;gap:4px}
.w-hub .hub-app .row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:11.5px;color:var(--ink-2)}
.w-hub .hub-app .chipx{font-size:10px;border:1px solid var(--line-2);border-radius:3px;padding:0 4px;color:var(--ink-3);white-space:nowrap}
.w-hub .hub-app .chipx.acc{color:var(--accent);border-color:var(--accent)}
.w-hub .hub-app .statl{font-size:10.5px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:5px;margin-top:2px}
.w-hub .hub-app .l{font-size:11.5px;color:var(--ink-2)}
.w-hub .hub-app .ok3{color:var(--accent)}
.w-hub .hub-app .q{color:var(--gold)}
.w-hub .hub-app .dots i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--line-2);margin-left:3px}
.w-hub .hub-app .dots i.on{background:var(--accent)}
.w-hub .hub-app .wave{font-size:11px;color:var(--accent);letter-spacing:1.5px}
.w-hub .score{width:500px;max-width:100%;background:var(--paper-2);border:1px solid var(--line-2);box-shadow:0 10px 26px rgba(0,0,0,.22)}
.w-hub .win-tb{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2))}
.w-hub .win-tb .fname{font-size:13px;color:var(--ink);font-weight:500}
.w-hub .win-tb .tense{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.w-hub .win-ctl{margin-left:auto;display:flex;gap:1px}
.w-hub .win-ctl button{font-family:var(--mono);width:22px;height:18px;display:grid;place-items:center;background:none;border:0;border-radius:3px;padding:0;color:var(--ink-3);font-size:11px;line-height:1;cursor:default}
.w-hub .gov{padding:5px 12px;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.06em;color:var(--ink-3)}
.w-hub .gov b{color:var(--accent);font-weight:500}
.w-hub .core-panes{display:grid;grid-template-columns:1fr 1.15fr;gap:1px;background:var(--line)}
.w-hub .core-panes .rail{background:var(--paper-2);padding:9px 11px 11px}
.w-hub .core-panes .rh{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.w-hub .core-panes .rh .tl{color:var(--accent);text-transform:none}
.w-hub .rows{list-style:none;margin:0;padding:0}
.w-hub .rows li{display:flex;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:0;font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.w-hub .rows li::before{content:none}
.w-hub .rows .st{font-size:10px;color:var(--ink-3)}
.w-hub .core-panes .more{margin-top:7px;font-size:10.5px;color:var(--ink-3)}
.w-hub .core-panes .term{background:var(--paper);padding:10px 12px;font-size:12.5px;line-height:1.75;color:var(--ink-2)}
.w-hub .core-panes .term .cmd{color:var(--ink)}
.w-hub .core-panes .term .okl{color:var(--accent)}
.w-hub .core-panes .term .caret{color:var(--accent)}
@media (prefers-reduced-motion:reduce){.w-hub .core-panes .term .caret{animation:none}}
@media (min-width:821px){
  .w-hub .stage{height:560px}
  .w-hub .hub-app{position:absolute}
  .w-hub .hub-app.b1{top:100px}
  .w-hub .hub-app.b2{top:40px}
  .w-hub .hub-app.b3{top:0}
  .w-hub .hub-app.b4{top:40px}
  .w-hub .hub-app.b5{top:100px}
  .w-hub .corebox{position:absolute;left:50%;top:300px;transform:translateX(-50%);z-index:1}
}
@media (max-width:820px){
  .w-hub{width:100%;margin:34px 0}
  .w-hub svg.wires{display:none}
  .w-hub .hub-app{position:static;width:100%;margin:0 0 12px;left:auto !important}
  .w-hub .corebox{position:static;transform:none;margin-top:6px}
  .w-hub .score{width:100%}
}

@media (min-width:821px){
  .w-ways .stage{height:580px}
  .w-ways .hub-app{width:214px}
  .w-ways .hub-app.k1{left:0;top:22px}
  .w-ways .hub-app.k2{right:0;left:auto;top:0}
  .w-ways .hub-app.k3{left:0;top:auto;bottom:18px}
  .w-ways .hub-app.k4{right:0;left:auto;top:auto;bottom:0}
  .w-ways .corebox{left:50%;top:50%;transform:translate(-50%,-50%)}
  .w-ways .score{width:500px}
}

.wrap-shot{float:right;width:459px;margin:6px 0 14px 32px}
.wrap-shot + p{padding-top:12px}
.wrap-shot .termwin{border:1px solid var(--line-2);border-radius:9px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.38)}
.wrap-shot .tbar{display:flex;align-items:center;gap:7px;background:var(--paper-2);border-bottom:1px solid var(--line-2);padding:9px 13px;font-family:var(--mono);font-size:11.5px;color:var(--ink-3);letter-spacing:.08em}
.wrap-shot .tbar i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.wrap-shot .tbar span{margin-left:4px}
.wrap-shot img{margin:0;filter:none;border:0;border-radius:0;box-shadow:none;display:block;width:100%}
.wrap-shot figcaption{padding-top:10px}
.clr{clear:both}
@media (max-width:880px){.wrap-shot{margin-right:0;width:min(459px,54vw)}}
@media (max-width:760px){.wrap-shot{float:none;width:100%;margin:16px 0 18px}}

.count-call{font-family:var(--mono);font-size:14px;color:var(--ink-2);border-left:2px solid var(--gold);padding:4px 0 4px 16px;margin:30px 0}
.count-call b{color:var(--ink);font-size:20px;font-weight:600}

/* proof-shot caption */
.ci-proof figcaption{font-family:var(--mono);font-size:11px;color:var(--ink-3);padding:8px 2px 0}

.cta-btn{display:inline-block;padding:13px 28px;border:1px solid var(--accent);border-radius:6px;color:var(--accent);font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;background:transparent;transition:background .15s ease,color .15s ease}
.cta-btn:hover{background:var(--accent);color:var(--paper)}
.doc-inner a.cta-btn{border:1px solid var(--accent)}
.doc-inner a.cta-btn:hover{background:var(--accent);border-color:var(--accent);color:var(--paper)}
.cta-row{display:flex;align-items:center;gap:16px;margin:8px 0 26px}
.cta-aside{color:var(--ink-3);font-size:14px}
.cta-block{margin:46px 0 38px}
.cta-block .cta-sub{margin:12px 0 0;color:var(--ink-3);font-size:14px}

.doc-inner .tn{color:var(--accent);font-weight:600}

.w-verdict{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line-2);font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-3)}
.w-verdict b{color:var(--gold);font-weight:600}
.w-col.gov .w-verdict b{color:var(--accent)}
.w-cap{padding:10px 16px 12px;font-family:var(--mono);font-size:12px;color:var(--ink-3);border-top:1px solid var(--line)}

.w-gate{display:flex;align-items:center;justify-content:center;gap:20px;padding:22px 18px;flex-wrap:wrap}
.w-gate .g-cands{display:flex;flex-direction:column;gap:7px}
.w-gate .g-c{font-family:var(--mono);font-size:16px;color:var(--ink-3);border:1px dashed var(--line-2);border-radius:4px;padding:4px 14px}
.w-gate .g-arr{color:var(--ink-3);font-family:var(--mono);font-size:19px}
.w-gate .g-box{display:flex;flex-direction:column;gap:5px;border:1px solid var(--line-2);background:var(--paper);border-radius:6px;padding:13px 20px}
.w-gate .g-you{font-family:var(--mono);font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.w-gate .g-q{font-family:var(--serif);font-style:italic;font-size:16.5px;color:var(--ink-2)}
.w-gate .g-rule{font-family:var(--mono);font-size:16px;color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:7px 16px}

.corewin{width:calc(100% + 80px);margin:38px -40px;font-family:var(--mono)}
.corewin .termwin{border:1px solid var(--line-2);border-radius:9px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.38);background:var(--paper-2)}
.corewin .tbar{display:flex;align-items:center;gap:7px;background:var(--paper-2);border-bottom:1px solid var(--line-2);padding:9px 13px;font-size:11.5px;color:var(--ink-3);letter-spacing:.08em}
.corewin .tbar i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.corewin .tbar span{margin-left:4px}
.corewin .tbar .rp{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ink-2);background:var(--paper);border:1px solid var(--line-2);border-radius:5px;padding:3px 9px;cursor:pointer;transition:.15s}
.corewin .tbar .rp:hover,.corewin .tbar .rp:focus-visible{color:var(--ink);border-color:var(--accent);outline:0}
.core-split{position:relative;display:grid;grid-template-columns:1fr 1.22fr;gap:1px;background:var(--line)}
.core-split svg.inwires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.core-split .inwires path{fill:none;stroke:var(--line-2);stroke-width:1.25}
.core-split .inwires path.dash{stroke-dasharray:3 4}
.corewin .vault-pane{background:var(--paper-2);padding:14px 15px 16px}
.corewin .pane-h{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.corewin .pane-h .tl{color:var(--accent);text-transform:none}
.corewin .mini{background:var(--paper-3);border:1px solid var(--line-2);box-shadow:0 8px 20px rgba(0,0,0,.2);margin-bottom:10px;opacity:0;transform:translateY(8px) scale(.985)}
.corewin .mini.open{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
.corewin .mini .win-tb{display:flex;align-items:center;gap:8px;padding:5px 8px 5px 11px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2))}
.corewin .mini .fname{font-size:12px;color:var(--ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.corewin .mini .tense{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);flex:0 0 auto}
.corewin .mini.open .tense{color:var(--accent)}
.corewin .mini .win-ctl{margin-left:auto;display:flex;gap:5px;color:var(--ink-3);font-size:10px;flex:0 0 auto}
.corewin .mini .win-ctl s{text-decoration:none}
.corewin .mini .mbody{padding:8px 11px 9px;font-size:12px;line-height:1.55;color:var(--ink-2)}
.corewin .mini .eid{color:var(--accent);font-weight:500}
.corewin .mini .sid{color:var(--ink-3);font-size:10.5px}
.corewin .mini .rows{list-style:none;margin:0;padding:0;max-width:none}
.corewin .mini .rows li{display:flex;justify-content:space-between;gap:10px;padding:2px 0;font-size:11.5px;line-height:1.5;color:var(--ink-2);border-bottom:0}
.corewin .mini .rows li::before{content:none}
.corewin .mini .rows .st{font-size:10px;color:var(--ink-3)}
.corewin .vault-more{font-size:10.5px;color:var(--ink-3);margin-top:9px}
.corewin .term-pane{background:var(--paper);padding:16px 18px 14px;font-size:13.5px;line-height:1.95;min-height:250px;display:flex;flex-direction:column}
.corewin .term-pane .ln{opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s}
.corewin .term-pane .ln.show{opacity:1;transform:none}
.corewin .term-pane .cmd{color:var(--ink)}
.corewin .term-pane .mk{display:inline-block;min-width:18px;color:var(--accent)}
.corewin .term-pane .ln.na .mk{color:var(--ink-3)}
.corewin .term-pane .ln.warn .mk{color:var(--gold)}
.corewin .term-pane .ln.nx .mk{color:var(--accent-2)}
.corewin .term-pane .fn{display:inline-block;min-width:132px;color:var(--accent);font-weight:500}
.corewin .term-pane .ln.na .fn{color:var(--ink-2)}
.corewin .term-pane .tx{color:var(--ink-2)}
.corewin .term-pane .ln.na .tx{color:var(--ink-3)}
.corewin .term-pane .ln.warn .em2{color:var(--gold)}
.corewin .term-pane .accent{color:var(--accent-2)}
.corewin .term-pane .botlines{margin-top:auto;padding-top:12px}
.corewin .inbox{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:6px;padding:7px 12px;color:var(--ink-2);line-height:1.5;background:var(--paper)}
.corewin .inbox:focus-within{border-color:rgba(90,142,199,.45)}
.corewin .inbox .inp{flex:1;min-width:0;background:transparent;border:0;outline:0;font-family:var(--mono);font-size:13.5px;color:var(--ink);caret-color:transparent}
.corewin .inbox.filled .phc{display:none}
.corewin .inbox.filled .inp{caret-color:var(--accent)}
.corewin .inbox.shake{animation:shakex .32s}
@keyframes shakex{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.corewin .inbox .caret{color:var(--accent)}
.corewin .hintline{font-size:11.5px;color:var(--ink-3);margin-top:5px;padding-left:3px}
@media (prefers-reduced-motion:reduce){
  .corewin .inbox .caret{animation:none}
  .corewin .mini{opacity:1;transform:none;transition:none}
  .corewin .term-pane .ln{opacity:1;transform:none;transition:none}
  .corewin .inbox.shake{animation:none}
}
@media (max-width:760px){
  .corewin{width:100%;margin:30px 0}
  .core-split{grid-template-columns:1fr}
  .core-split svg.inwires{display:none}
  .corewin .term-pane{min-height:0}
}

.cta-band{display:flex;align-items:center;gap:18px;flex-wrap:wrap;border:1px solid var(--line-2);background:var(--paper-2);border-radius:8px;padding:16px 20px;margin:30px 0 14px}
.cta-band .band-q{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--ink-2);text-align:right}
@media (max-width:760px){.cta-band .band-q{margin-left:0;text-align:left}}

.w-svc{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:14px;margin:34px 0 8px}
.doc-inner a.svc-card{display:flex;flex-direction:column;color:inherit;border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);overflow:hidden;transition:border-color .15s}
.doc-inner a.svc-card:hover{color:inherit;border-color:var(--accent)}
.doc-inner a.svc-card.lead{border-top:2px solid var(--accent)}
.w-svc .svc-head{display:flex;align-items:baseline;gap:8px;padding:13px 15px 6px;font-family:var(--mono)}
.w-svc .svc-num{font-size:11px;color:var(--ink-3)}
.w-svc .svc-name{font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink);font-weight:600}
.w-svc .svc-viz{padding:8px 15px 4px}
.w-svc .svc-body{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--ink-soft);padding:6px 15px 4px}
.w-svc .svc-link{margin-top:auto;padding:10px 15px 14px;font-family:var(--mono);font-size:12.5px;color:var(--accent)}
.w-svc .svc-card:hover .svc-link{color:var(--accent-2)}
.w-svc .mini-hub{font-family:var(--mono)}
.w-svc .mh-apps{display:flex;gap:6px}
.w-svc .mh-chip{flex:1;text-align:center;font-size:10.5px;color:var(--ink-2);border:1px solid var(--line-2);border-radius:4px;padding:3px 2px;background:var(--paper)}
.w-svc .mh-wires{position:relative;height:22px;display:flex;justify-content:space-around}
.w-svc .mh-wires i{width:0;border-left:1px dashed var(--line-2)}
.w-svc .mh-pulse{position:absolute;left:50%;top:0;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--accent);animation:svcDrop 2.8s ease-in infinite}
@keyframes svcDrop{0%{transform:translateY(-2px);opacity:0}18%{opacity:1}82%{opacity:1}100%{transform:translateY(19px);opacity:0}}
.w-svc .mh-core{border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:var(--paper)}
.w-svc .mh-tb{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:1px solid var(--line);background:linear-gradient(var(--paper-3),var(--paper-2));font-size:11px}
.w-svc .mh-dot{color:var(--accent);font-size:7px}
.w-svc .mh-name{color:var(--ink);font-size:11.5px;font-weight:500}
.w-svc .mh-tense{margin-left:auto;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.w-svc .mh-gov{padding:6px 8px;font-size:10.5px;color:var(--ink-2)}
.w-svc .mh-gov .ok{color:var(--accent)}
.w-svc .mini-pipe{position:relative;font-family:var(--mono);padding-left:16px}
.w-svc .mini-pipe::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;border-left:1px dashed var(--line-2)}
.w-svc .mp-pulse{position:absolute;left:3px;top:6px;width:5px;height:5px;border-radius:50%;background:var(--gold);animation:svcDropTall 3.4s ease-in-out infinite}
@keyframes svcDropTall{0%{top:6px;opacity:0}12%{opacity:1}82%{opacity:1}100%{top:calc(100% - 12px);opacity:0}}
.w-svc .mp-row{display:flex;align-items:baseline;gap:8px;padding:4px 0;position:relative}
.w-svc .mp-row::before{content:"";position:absolute;left:-11px;top:50%;width:7px;border-top:1px solid var(--line-2)}
.w-svc .mp-stg{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line-2);border-radius:4px;padding:2px 7px;background:var(--paper);min-width:58px;text-align:center}
.w-svc .mp-note{font-size:10.5px;color:var(--ink-3)}
.w-svc .mini-field{font-family:var(--mono)}
.w-svc .mf-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 0;font-size:11px;color:var(--ink-2)}
.w-svc .mf-dots{display:inline-flex;gap:3px}
.w-svc .mf-dots i{width:6px;height:6px;border-radius:50%;border:1px solid var(--line-2);background:transparent}
.w-svc .mf-dots i.on{background:var(--accent);border-color:var(--accent)}
.w-svc .mf-delta{font-size:10.5px;color:var(--gold);padding:5px 0 1px}
.w-svc .mf-open{font-size:10.5px;color:var(--ink);border:1px dashed var(--gold);border-radius:4px;padding:4px 7px;margin-top:5px;background:var(--paper)}

.doc-inner .svc-cap{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--ink-2);text-align:center;margin:6px 0 4px}
.fact-strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin:26px 0 8px}
.fact-strip>div{border:1px solid var(--line-2);border-left:2px solid var(--accent);border-radius:6px;background:var(--paper-2);padding:12px 14px;font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
.fact-strip b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink);margin-bottom:4px;font-weight:600}
@media (max-width:900px){.w-svc{grid-template-columns:1fr 1fr}.doc-inner a.svc-card.lead{grid-column:1/-1}}
@media (max-width:640px){.w-svc{grid-template-columns:1fr}.fact-strip{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.w-svc .mh-pulse,.w-svc .mp-pulse{display:none}}

.w-homenav a.hub-app,.w-homenav a.score{color:inherit;display:block;transition:border-color .15s}
.w-homenav a.hub-app:hover,.w-homenav a.score:hover{border-color:var(--accent);color:inherit}
.w-homenav .hub-app .tb .name{font-size:14px}
.w-homenav .hub-app .abody{padding:9px 12px 10px;gap:5px}
.w-homenav .hub-app .l{font-size:13px;line-height:1.5}
.w-homenav .hub-app .l.demo{color:var(--accent)}
.w-homenav .hub-app .statl{font-size:12px;color:var(--accent)}
.w-homenav .win-tb .fname{font-size:15px}
.w-homenav .win-tb .tense{font-size:10px}
.w-homenav .gov{font-size:12.5px;letter-spacing:.03em}
.w-homenav .reg-rows{list-style:none;margin:0;padding:8px 12px;display:flex;flex-direction:column;gap:5px;border-bottom:1px solid var(--line)}
.w-homenav .reg-rows li{display:flex;gap:12px;font-family:var(--mono);font-size:13px;line-height:1.5;color:var(--ink-2);padding:0}
.w-homenav .reg-rows li::before{content:none}
.w-homenav .reg-rows .rt{flex:0 0 96px;color:var(--gold)}
.w-homenav .core-open{padding:8px 12px 10px;font-family:var(--mono);font-size:13px;color:var(--accent)}
@media (min-width:821px){
  .w-homenav .stage{height:440px}
  .w-homenav .hub-app{width:242px}
  .w-homenav .hub-app.b1,.w-homenav .hub-app.b3{top:70px}
  .w-homenav .hub-app.b2{top:0}
  .w-homenav .corebox{top:266px}
  .w-homenav .score{width:505px}
}

.doc-inner .env-cap{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--ink-2);text-align:center;margin:8px 0 6px}
.env-surface{display:grid;grid-template-columns:1fr;gap:8px;margin:18px 0 8px}
.env-shot{border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);min-height:210px;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;font-family:var(--mono);font-size:12.5px;color:var(--ink-3);letter-spacing:.02em}
.env-shot.env-todo{border-style:dashed;background:repeating-linear-gradient(135deg,var(--paper-2),var(--paper-2) 10px,var(--paper) 10px,var(--paper) 20px)}
.doc-inner .env-note{font-family:var(--mono);font-size:12px;color:var(--ink-2);margin:0}
.doc-inner .env-note b{color:var(--ink)}
.surf-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0 8px}
.doc-inner .surf-card{border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);padding:14px 16px}
.surf-card .surf-h{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);font-weight:600;margin-bottom:6px}
.doc-inner .surf-card p{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0}
@media (max-width:640px){.surf-grid{grid-template-columns:1fr}}
.doc-inner a.map-preview{display:block;position:relative;border:1px solid var(--line-2);border-radius:10px;overflow:hidden;background:var(--paper-2);margin:22px 0 8px;color:inherit;transition:border-color .15s}
.doc-inner a.map-preview:hover{border-color:var(--accent);color:inherit}
.doc-inner a.map-preview img{display:block;width:100%}
.map-preview-cta{display:block;font-family:var(--mono);font-size:13px;color:var(--accent);padding:11px 16px;border-top:1px solid var(--line-2);background:var(--paper)}
.doc-inner a.map-preview:hover .map-preview-cta{color:var(--accent-2)}

.w-cockpit,.rg,.w-pane{--ck-mint:#8fd3ad;--ck-mint-bg:#16302a;--ck-green:#7ec77e;--ck-yellow:#d6b25e;--ck-red:#c77e7e;--ck-purple:#a394d4}
:root[data-theme="light"] .w-cockpit,:root[data-theme="light"] .rg,:root[data-theme="light"] .w-pane{--ck-mint:#1f6b45;--ck-mint-bg:#d9eee1;--ck-green:#2f8a5a;--ck-yellow:#8d6f0c;--ck-red:#b5443f;--ck-purple:#6f5fb0}
.w-cockpit{margin:22px 0 4px;container-type:inline-size}
@media (min-width:1300px){.w-cockpit{width:calc(100% + 140px);margin-left:-70px}}
.ck-stage{position:relative;display:grid;grid-template-columns:.92fr 1fr 1.28fr;gap:14px;align-items:stretch}
.ck-leaf{display:flex;flex-direction:column;min-width:0;height:440px;border:1px solid var(--line-2);border-radius:8px;background:var(--paper);overflow:hidden;font-family:-apple-system,"Segoe UI",Inter,system-ui,sans-serif}
.w-cockpit [hidden],.w-pane [hidden]{display:none!important}
/* Obsidian's tab header: inactive tabs flat on the container, the active tab lifted onto the body */
.ck-tabbar{display:flex;align-items:flex-end;justify-content:space-between;background:var(--paper-2);border-bottom:1px solid var(--line-2);padding:6px 6px 0;height:36px;flex:none}
.ck-tabs{display:flex;align-items:flex-end;gap:2px;min-width:0}
.ck-tab{display:flex;align-items:center;gap:6px;height:28px;padding:0 7px 0 10px;font-size:12.5px;color:var(--ink-3);border:1px solid transparent;border-bottom:0;border-radius:6px 6px 0 0;white-space:nowrap;cursor:pointer;user-select:none;margin-bottom:-1px}
.ck-tab.on{background:var(--paper);color:var(--ink);border-color:var(--line-2);height:30px}
.ck-tab:not(.on):hover{color:var(--ink-2)}
.ck-ti{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.ck-tab.on .ck-ti{color:var(--ink-2)}
.ck-x{font-weight:400;color:var(--ink-3);font-size:14px;line-height:1;visibility:hidden}
.ck-tab.on .ck-x,.ck-tab:hover .ck-x{visibility:visible}
.ck-tplus{color:var(--ink-3);font-size:13px;height:28px;padding:0 5px;display:flex;align-items:center}
.ck-tplus svg{display:block}
.ck-tright{color:var(--ink-3);font-size:14px;padding:0 4px 6px;flex:none}
/* the seat body: Claude Code in an xterm, as it prints. ⏺ tool lines, ⎿ results, ⏺ prose, the prompt box, the status line */
.ck-term{flex:1;display:flex;flex-direction:column;padding:10px 12px 8px;font-family:var(--mono);font-size:11.5px;line-height:1.5;color:var(--ink-2);min-height:0;overflow:hidden}
/* output lines never shrink; if they outgrow the pane the oldest scroll off the top, as a terminal's do */
.ck-term>.ck-out{display:flex;flex-direction:column;justify-content:flex-end;flex:0 1 auto;min-height:0;overflow:hidden}
.ck-term>span:not(.ck-out),.ck-out>span{display:block;min-width:0;flex:none}
.ck-gap{height:.75em}
.ck-u{color:var(--ink);font-weight:600;overflow-wrap:anywhere;background:color-mix(in srgb,var(--ink) 17%,transparent);margin:0 -12px;padding:1px 12px}
.ck-u i{font-style:normal;font-weight:400;color:var(--ink-3)}
.ck-tool,.ck-p,.ck-res{display:flex!important;gap:.55em;align-items:flex-start}
.ck-tool i,.ck-p i,.ck-res i{flex:none;font-style:normal}
.ck-tool{color:var(--ink)}
.ck-tool i{color:var(--ck-green)}
.ck-p{color:var(--ink)}
.ck-res{padding-left:1.15em;color:var(--ink-3)}
.ck-l{padding-left:1.5em;color:var(--ink)}
.ck-id{font-family:var(--mono);font-weight:600;color:var(--ck-mint);cursor:pointer;outline:none;border-radius:2px;padding:0 1px;transition:background .12s,box-shadow .12s}
.ck-id:hover,.ck-id:focus,.ck-id.tied{background:var(--ck-mint-bg);box-shadow:0 0 0 2px var(--ck-mint-bg)}
.ck-prompt{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;gap:6px}
.ck-rule{display:block;height:1px;background:var(--line-2)}
.ck-in{display:flex;align-items:center;gap:7px;color:var(--ink-2);padding:2px 0}
.ck-caret{width:7px;height:14px;background:var(--ink)}
@keyframes ckblink{50%{opacity:0}}
.ck-status{color:var(--ink-3);font-size:11px;padding-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-status b{color:var(--ck-mint);font-weight:600}
/* the file leaf: Obsidian's reading view of the roadmap file the seat read */
.doc-inner .ck-note{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;padding:14px 18px 20px;font-size:12.5px;line-height:1.5;color:var(--ink)}
.doc-inner .ck-note h1{font-family:inherit;font-size:19px;font-weight:700;letter-spacing:0;line-height:1.25;margin:0 0 10px;color:var(--ink)}
.doc-inner .ck-note h2{font-family:inherit;font-size:14.5px;font-weight:700;letter-spacing:0;margin:12px 0 4px;color:var(--ink)}
.doc-inner .ck-note h3{font-family:inherit;font-size:13px;font-weight:700;letter-spacing:0;margin:14px 0 3px;color:var(--ink)}
.doc-inner .ck-note .ck-id{color:inherit;font-family:inherit;font-weight:inherit}
.doc-inner .ck-note .ck-st code{white-space:nowrap}
.doc-inner .ck-note p{font-family:inherit;font-size:12.5px;line-height:1.5;margin:0 0 6px;max-width:none;color:var(--ink-soft)}
.doc-inner .ck-note p.ck-st{color:var(--ink-3);font-size:11.5px;margin-bottom:5px}
.doc-inner .ck-note hr{height:1px;background:var(--line-2);margin:12px 0}
.doc-inner .ck-note code{font-size:11px;background:var(--paper-3);border:0;padding:1px 4px;color:var(--ink-2)}
.doc-inner .ck-note ul{list-style:none;margin:0 0 4px;padding:0;max-width:none}
.doc-inner .ck-note li{display:flex;gap:7px;align-items:flex-start;margin:0;padding:2px 0;border:0;font-family:inherit;font-size:12.5px;line-height:1.5;color:var(--ink)}
.doc-inner .ck-note li::before{content:"";position:static;flex:none;width:12px;height:12px;margin-top:4px;border:1px solid var(--ink-3);border-radius:3px;background:none;color:transparent}
.doc-inner .ck-note li.done{color:var(--ink-3);text-decoration:line-through}
.doc-inner .ck-note li.done::before{background:var(--accent) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2.6 6.3l2.3 2.3 4.5-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/9px no-repeat;border-color:var(--accent)}
/* tie wires: through the gutters only, mint like the tied ids */
svg.ck-wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:3}
svg.ck-wires path{fill:none;stroke:var(--ck-mint);stroke-width:1.5;stroke-dasharray:4 3;stroke-linejoin:round}
svg.ck-wires circle{fill:var(--ck-mint)}
.doc-inner .ck-cap{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--ink-2);text-align:center;margin:12px 0 6px;max-width:none}
/* ---- the dashboard pane: vault-dashboard's .op-panel rules (styles.css, thread board v3.0.0), Obsidian vars mapped ---- */
.w-cockpit .op-panel,.w-pane .op-panel{--background-primary:var(--paper);--background-secondary:var(--paper-2);--background-modifier-border:var(--line-2);--background-modifier-hover:var(--paper-3);--text-normal:var(--ink);--text-muted:var(--ink-2);--text-faint:var(--ink-3);--interactive-accent:var(--accent);--interactive-accent-hover:var(--accent-2);--text-on-accent:var(--cta-ink);--color-red:var(--ck-red);--color-yellow:var(--ck-yellow);--color-green:var(--ck-green);--color-purple:var(--ck-purple);--font-text:-apple-system,"Segoe UI",Inter,system-ui,sans-serif;--font-monospace:var(--mono);flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;font-family:var(--font-text);font-size:12.5px;color:var(--text-normal);background:var(--background-primary);container-type:inline-size}
.op-panel *{box-sizing:border-box}
.op-panel [hidden]{display:none!important}
.op-panel .op-wrap{padding:4px 12px 14px}
.op-panel .op-top{display:flex;align-items:center;justify-content:space-between;color:var(--text-faint);font-size:11px;padding:4px 0 2px;font-variant-numeric:tabular-nums}
.op-panel .op-btn{background:none;border:1px solid var(--background-modifier-border);color:var(--text-muted);border-radius:4px;padding:0 6px;cursor:pointer;font-size:12px;line-height:18px;font-family:inherit}
.op-panel .op-btn:hover{color:var(--text-normal);border-color:var(--interactive-accent)}
.op-panel .op-tabs{display:flex;flex-wrap:wrap;gap:2px;border-bottom:1px solid var(--background-modifier-border);margin:2px 0 10px}
.op-panel .tab{padding:7px 12px;cursor:pointer;font-size:12px;font-weight:600;color:var(--text-muted);border-bottom:2px solid transparent;white-space:nowrap;user-select:none;display:flex;align-items:center;gap:6px;margin-bottom:-1px}
.op-panel .tab:hover{color:var(--text-normal)}
.op-panel .tab.on{color:var(--text-normal);border-bottom-color:var(--interactive-accent)}
.op-panel .tab .n{padding:0 6px;border-radius:8px;background:var(--background-modifier-border);color:var(--text-muted);font-size:10px;font-weight:700}
.op-panel .tab.on .n{background:var(--interactive-accent);color:var(--text-on-accent)}
.op-panel .tab .dot{width:6px;height:6px;border-radius:50%;background:var(--interactive-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--interactive-accent) 22%,transparent)}
.op-panel .tid{font-family:var(--font-monospace);font-weight:600;cursor:pointer;white-space:nowrap;border-radius:3px;transition:background .12s}
.op-panel .tid:hover{text-decoration:underline}
.op-panel .tid.tied{background:var(--ck-mint-bg);box-shadow:0 0 0 2px var(--ck-mint-bg)}
.op-panel .c-active{color:var(--color-green)}
.op-panel .c-ready{color:var(--interactive-accent)}
.op-panel .c-needs-testing{color:var(--color-yellow)}
.op-panel .c-blocked{color:var(--color-red)}
.op-panel .c-waiting{color:var(--color-purple)}
.op-panel .op-board{display:flex;flex-direction:column}
.op-panel .thr-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"main main" "chain meta" "last last";gap:3px 10px;padding:7px 8px 8px 10px;border-radius:6px;border-left:3px solid transparent}
.op-panel .thr-row+.thr-row{border-top:1px solid color-mix(in srgb,var(--background-modifier-border) 55%,transparent)}
.op-panel .thr-row:hover,.op-panel .thr-row.tied{background:var(--background-modifier-hover)}
.op-panel .thr-main{grid-area:main;display:flex;align-items:baseline;gap:8px;min-width:0}
.op-panel .thr-lbl{font-weight:600;color:var(--text-normal);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;cursor:default}
.op-panel .thr-lane{flex:none;font-size:10px;padding:0 6px;border-radius:8px;background:var(--background-modifier-border);color:var(--text-muted);font-weight:600;line-height:16px}
.op-panel .thr-meta{grid-area:meta;align-self:center;justify-self:end;display:flex;align-items:baseline;gap:6px;white-space:nowrap;font-size:11px;color:var(--text-faint);font-variant-numeric:tabular-nums}
.op-panel .thr-meta .tid{font-size:10.5px;font-weight:600}
.op-panel .thr-age{color:var(--text-faint)}
.op-panel .thr-btn{opacity:0;background:none;border:0;color:var(--text-faint);cursor:pointer;padding:0 2px;font-size:12px;line-height:1;font-family:var(--font-text)}
.op-panel .thr-row:hover .thr-btn,.op-panel .thr-crow:hover .thr-btn{opacity:1}
.op-panel .thr-btn:hover{color:var(--interactive-accent)}
.op-panel .thr-chain{grid-area:chain;display:flex;align-items:center;flex-wrap:wrap;gap:3px 4px;font-family:var(--font-monospace);font-size:11px;color:var(--text-muted)}
.op-panel .thr-s{padding:0 6px;border-radius:9px;border:1px solid var(--background-modifier-border);cursor:default;line-height:17px}
.op-panel .thr-s.ev-shipped{border-color:color-mix(in srgb,var(--color-green) 55%,transparent)}
.op-panel .thr-s.ev-waiting_on_operator{border-color:color-mix(in srgb,var(--color-purple) 65%,transparent)}
.op-panel .thr-s.live{color:var(--text-normal);border-color:var(--interactive-accent);display:inline-flex;align-items:center;gap:5px}
.op-panel .thr-dot{width:6px;height:6px;border-radius:50%;background:var(--interactive-accent);display:inline-block}
.op-panel .thr-s.live.hot .thr-dot{background:var(--color-green);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-green) 22%,transparent)}
.op-panel .thr-typed{font-style:normal;color:var(--text-faint);font-family:var(--font-text);font-size:10px}
.op-panel .thr-arrow{color:var(--text-faint);font-size:10px}
.op-panel .thr-last{grid-area:last;display:flex;gap:7px;align-items:baseline;min-width:0;font-size:11.5px;color:var(--text-muted)}
.op-panel .thr-ev{flex:none;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);font-weight:600}
.op-panel .thr-ev.shipped{color:var(--color-green)}
.op-panel .thr-ev.waiting_on_operator{color:var(--color-purple)}
.op-panel .thr-ev.handoff,.op-panel .thr-ev.next{color:var(--interactive-accent)}
.op-panel .thr-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.op-panel .thr-was{flex:none;margin-left:6px;color:var(--text-faint);font-size:9px;font-style:italic;text-transform:uppercase;letter-spacing:.04em}
.op-panel .thr-note-wrap{grid-column:1/-1}
.op-panel .tid .tb{font-family:var(--font-text);font-style:normal;font-weight:700;font-size:9px;margin-left:3px;padding:0 4px;border-radius:7px;line-height:13px;vertical-align:1px;display:inline-block;letter-spacing:0}
.op-panel .tb.over{background:color-mix(in srgb,var(--color-red) 18%,transparent);color:var(--color-red)}
.op-panel .tb.due{background:color-mix(in srgb,var(--color-yellow) 20%,transparent);color:var(--color-yellow)}
.op-panel .tb.flip{background:color-mix(in srgb,var(--color-green) 20%,transparent);color:var(--color-green)}
.op-panel .op-attn{margin:10px 0 4px;padding:5px 0 3px;border-top:1px solid var(--background-modifier-border)}
.op-panel .attn-head{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-weight:600;margin:2px 0 3px;display:flex;align-items:center;gap:6px}
.op-panel .attn-head .n{padding:0 6px;border-radius:8px;background:color-mix(in srgb,var(--color-red) 18%,transparent);color:var(--color-red);font-size:10px;font-weight:700;letter-spacing:0}
.op-panel .attn-row{display:flex;align-items:baseline;gap:7px;padding:3px 6px 3px 4px;border-radius:5px;font-size:11.5px;min-width:0}
.op-panel .attn-row:hover,.op-panel .attn-row.tied{background:var(--background-modifier-hover)}
.op-panel .attn-k{flex:none;width:14px;text-align:center;font-style:normal;font-weight:700;font-size:11px;color:var(--color-red)}
.op-panel .attn-row .tid{font-size:10.5px;flex:none}
.op-panel .attn-txt{flex:1 1 auto;min-width:0;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-panel .attn-since{flex:none;font-size:10.5px;color:var(--text-faint);font-variant-numeric:tabular-nums}
.op-panel .attn-since.over{color:var(--color-red);font-weight:700}
.op-panel .thr-closed{margin-top:14px;color:var(--text-faint);font-size:11px}
.op-panel .thr-closed summary{cursor:pointer;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;font-weight:600;user-select:none}
.op-panel .thr-closed summary .n{letter-spacing:0;text-transform:none;font-weight:500;margin-left:4px}
.op-panel .thr-crow{display:flex;align-items:baseline;gap:8px;padding:4px 10px;min-width:0}
.op-panel .thr-crow .thr-lbl{font-weight:500;color:var(--text-muted)}
.op-panel .thr-why{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.op-panel .op-foot{margin-top:18px;padding-top:8px;border-top:1px solid var(--background-modifier-border);color:var(--text-faint);font-size:11px;display:flex;align-items:baseline;gap:8px}
/* the plugin's own narrow-pane rule: meta gets its own line under the chain (a real side pane is this narrow) */
@container (max-width:540px){.op-panel .thr-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"main" "chain" "meta" "last"}.op-panel .thr-meta{justify-self:start;flex-wrap:wrap;white-space:normal}}
/* 03 · the Process Status view: one Obsidian leaf, the process table beside the sessions table, the plugin's own layout */
.ps-wrap{margin:20px 0 10px;container-type:inline-size}
@media (min-width:1300px){.ps-wrap{width:calc(100% + 140px);margin-left:-70px}}
.ps-leaf{height:auto}
.ps-body{display:grid;grid-template-columns:1.05fr 1fr;font-family:-apple-system,"Segoe UI",Inter,system-ui,sans-serif;font-size:12px;color:var(--ink)}
.ps-panel{padding:12px 14px 14px;min-width:0}
.ps-panel+.ps-panel{border-left:1px solid var(--line-2)}
.ps-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ps-hd i{font-style:normal;color:var(--ink-3);font-size:12px}
.ps-hd b{font-size:12.5px;font-weight:600;color:var(--ink);flex:1}
.ps-total{font-size:10.5px;font-variant-numeric:tabular-nums;padding:2px 8px;border-radius:10px;font-weight:600;color:var(--ink-2);background:var(--paper-3);white-space:nowrap}
.ps-total.ok{color:var(--ck-green)}
.ps-tbl{display:flex;flex-direction:column;gap:2px}
.ps-row{display:grid;grid-template-columns:minmax(0,1fr) 42px 52px 54px 98px;align-items:center;gap:8px;padding:4px 8px;border-radius:4px;font-size:11.5px;font-variant-numeric:tabular-nums;min-width:0}
.ps-sess .ps-row{grid-template-columns:40px minmax(0,1fr) minmax(0,.7fr) 40px 52px}
.ps-head{color:var(--ink-3);font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;padding-bottom:2px;border-bottom:1px solid var(--line-2);margin-bottom:2px}
.ps-row>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ps-row.stop{color:var(--ink-3);opacity:.7}
.ps-lbl{display:flex;align-items:center;gap:6px}
.ps-lbl i{font-style:normal;font-size:14px;line-height:1;color:var(--ink-3)}
.ps-lbl i.run,.ps-lbl i.att{color:var(--ck-green)}
.ps-lbl i.live{color:var(--ck-yellow)}
.ps-pid,.ps-zone,.ps-up,.ps-port{color:var(--ink-2)}
.ps-port i{font-style:normal;font-size:9px;color:var(--ck-green);margin-left:3px}
.ps-up{text-align:right;display:flex;justify-content:flex-end;align-items:center;gap:5px}
.doc-inner .ps-btn{font:600 10px/1 -apple-system,"Segoe UI",Inter,system-ui,sans-serif;padding:3px 7px;border-radius:4px;border:0;background:var(--accent);color:var(--cta-ink);cursor:pointer}
.ps-act{display:flex;gap:4px;justify-content:flex-end}
.doc-inner .ps-sbtn{font:500 9.5px/1 -apple-system,"Segoe UI",Inter,system-ui,sans-serif;padding:3px 6px;border-radius:4px;border:1px solid var(--line-2);background:var(--paper-2);color:var(--ink-2);cursor:pointer}
.ps-focus{color:var(--ink)}
@container (max-width:759px){.ps-body{grid-template-columns:1fr}.ps-panel+.ps-panel{border-left:0;border-top:1px solid var(--line-2)}}
/* 04 · the record moments (DL entry / AP field note / roadmap heading) */
/* v7: each card spans three subgrid rows (heading / mock / copy) so the mocks and the copy start level across the row */
.mo-grid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-auto-rows:auto;gap:14px;margin:22px 0 8px}
.doc-inner .mo-card{border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);padding:14px 16px;display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:0;align-content:start}
.mo-card .surf-h{display:block;font-family:var(--serif);font-size:17px;color:var(--ink);margin-bottom:8px}
.mo-mock{display:flex;flex-direction:column;gap:3px;border:1px solid var(--line-2);border-left:2px solid var(--accent);border-radius:7px;background:var(--paper);padding:9px 11px;margin:2px 0 10px;font-family:var(--mono);font-size:11.5px;line-height:1.45}
.mo-mock .mo-k{color:var(--accent);font-size:10.5px;letter-spacing:.06em}
.mo-mock .mo-t{color:var(--ink)}
.mo-mock .mo-d{color:var(--ink-3);font-size:10.5px}
.doc-inner .mo-card p{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0}
@media (max-width:760px){.mo-grid{grid-template-columns:1fr}}
/* 06 · reach: the CRM row the outreach lane reads, beside its copy */
/* v7: the row and its copy share a centre line and the copy runs at the card register, so neither column trails the other */
.reach-row{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:26px;align-items:center;margin:18px 0 4px}
.doc-inner .reach-row .surf-h{display:block;font-family:var(--serif);font-size:17px;color:var(--ink);margin:0 0 6px}
.doc-inner .reach-row p{margin:0}
@media (max-width:640px){.reach-row{grid-template-columns:1fr}}
.rg{font-family:var(--mono);font-size:10.5px;line-height:1.5;color:var(--ink-2);border:1px solid var(--line-2);border-radius:7px;background:var(--paper);padding:9px 11px;margin:0;min-width:0;overflow:hidden}
.rg-hd{display:flex;justify-content:space-between;gap:8px;color:var(--ink);font-weight:600;margin-bottom:3px;min-width:0}
.rg-hd span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rg-st{flex:none;font-weight:600;color:var(--ck-green);font-size:9.5px;text-transform:uppercase;letter-spacing:.08em}
.rg-kv{display:flex;gap:10px;min-width:0}
.rg-kv span:first-child{color:var(--ink-3);width:40px;flex:none}
.rg-kv span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rg-log{margin-top:6px;border-top:1px solid var(--line-2);padding-top:5px;display:flex;flex-direction:column;gap:2px}
.rg-log div{display:flex;gap:8px;align-items:baseline;min-width:0}
.rg-log i{font-style:normal;color:var(--ink-3);flex:none}
.rg-log em{font-style:normal;flex:none;width:36px;color:var(--ink-3)}
.rg-log em.in{color:var(--accent)}
.rg-log span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2)}
.rg-log .new span{color:var(--ink)}
.rg-log b{flex:none;color:var(--ck-mint);font-weight:600}
/* 05 · the phone: tools/remote's screens at phone proportions, always their own dark ground */
.ph-pair{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin:18px 0 12px}
.ph{width:216px;flex:none;border:1px solid #2c2c2c;border-radius:18px;background:#0c0c0c;color:#d4d4d4;font-family:-apple-system,"SF Pro Text","Segoe UI",system-ui,sans-serif;font-size:9.5px;line-height:1.35;overflow:hidden;display:flex;flex-direction:column}
.ph-top{display:flex;justify-content:space-between;align-items:baseline;padding:10px 12px 6px;border-bottom:1px solid #232323}
.ph-top b{font-size:13px;font-weight:700}
.ph-top span{color:#8a8a8a;font-size:9px}
.ph-back{font-style:normal;color:#5a8ec7;font-weight:600;font-size:11px;margin-right:5px}
.ph-fill{flex:1}
/* the question card: a seat's question, answered by a tap */
.ph-qc{margin:9px 9px 6px;border:1px solid #5a8ec7;border-radius:9px;padding:8px 8px 7px}
.ph-qk{font-size:7.5px;letter-spacing:.08em;text-transform:uppercase;color:#5a8ec7;font-weight:700}
.ph-qq{font-size:10.5px;font-weight:600;color:#e6e6e6;margin:2px 0 6px;line-height:1.3}
.ph-opt{display:flex;flex-direction:column;gap:1px;background:#141414;border:1px solid #232323;border-radius:7px;padding:6px 8px;margin-bottom:4px}
.ph-opt b{font-size:10px;font-weight:600;color:#e6e6e6}
.ph-opt span{color:#8a8a8a;font-size:8.5px}
.ph-opt.on{border-color:#5a8ec7}
.ph-qf{color:#8a8a8a;font-size:8px;margin-top:3px}
.ph-wait{display:flex;align-items:center;gap:5px;margin:2px 9px 8px;font-family:var(--mono);font-size:8.5px;color:#d4d4d4}
.ph-wait i{width:6px;height:6px;border-radius:50%;background:#c08a4a}
.ph-comp{display:flex;align-items:center;gap:5px;padding:7px 8px 9px;border-top:1px solid #232323;background:#0c0c0c}
.ph-comp span{flex:1;border:1px solid #2c2c2c;border-radius:8px;padding:6px 8px;color:#8a8a8a;font-size:9px}
.ph-comp b{width:24px;height:24px;border:1px solid #2c2c2c;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#d4d4d4;font-size:11px;flex:none;font-weight:700;letter-spacing:.05em}
.ph-comp b.on{border-color:#5a8ec7;color:#5a8ec7}
.ph-comp svg{display:block}
.ph-band{margin:9px 9px 4px;font-size:8px;letter-spacing:.06em;text-transform:uppercase;color:#8a8a8a;font-weight:600}
.ph-card{margin:0 9px 12px;background:#141414;border:1px solid #232323;border-radius:9px;overflow:hidden}
.ph-row{padding:8px 9px;border-top:1px solid #232323}
.ph-row:first-child{border-top:0}
.ph-row.needs{border-left:3px solid #c08a4a}
.ph-need{display:inline-block;background:#c08a4a;color:#0c0c0c;font-weight:700;font-size:7.5px;letter-spacing:.05em;text-transform:uppercase;padding:1px 5px;border-radius:4px;margin-bottom:4px}
.ph-t{font-size:11px;font-weight:600;color:#e6e6e6;line-height:1.3}
.ph-t i{font-style:normal;font-family:var(--mono);color:#5a8ec7;font-weight:700;margin-right:3px}
.ph-x{color:#8a8a8a;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ph-m{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:5px;color:#8a8a8a;font-size:8.5px}
.ph-st{display:inline-flex;align-items:center;gap:4px;font-weight:600}
.ph-st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.ph-st.waiting{color:#c08a4a}
.ph-st.working{color:#7ec77e}
.ph-chip{font-size:8px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:1px 5px;border-radius:4px;background:#1a1a1a;color:#8a8a8a}
.ph-nav{display:flex;border-top:1px solid #232323;background:#141414;padding:7px 0 9px}
.ph-nav span{flex:1;text-align:center;font-size:8.5px;font-weight:600;color:#8a8a8a}
.ph-nav span.on{color:#5a8ec7}
/* the doc column is 574px at a 1120 viewport, 734 at 1280, 814 from 1440 (914 with the breakout above 1300).
   Below 760 the dashboard drops under the file and the seat at full width, its natural shape; below 480 everything stacks. */
@container (max-width:759px){.ck-stage{grid-template-columns:1fr 1fr}.ck-dash{grid-column:1/-1;height:auto}.ck-dash .op-panel{overflow:visible}}
@container (max-width:479px){.ck-stage{grid-template-columns:1fr}.ck-file,.ck-seat{height:380px}svg.ck-wires{display:none}}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:center;margin:20px 0 8px;container-type:inline-size}
@media (min-width:1300px){.split{width:calc(100% + 140px);margin-left:-70px}}
.split .w-pane{min-width:0}
.split .ck-leaf{height:400px}
.split .w-pane-dash .ck-leaf{height:590px} /* v6: the whole board shows, overdue strip and closed fold included */
.doc-inner .split ul{margin:0;max-width:none}
.doc-inner .split ul li{font-size:17px;line-height:1.5;padding:7px 0 7px 22px}
.doc-inner .split ul li:last-child{border-bottom:0}
.doc-inner .split ul li code{white-space:nowrap}
.split .split-copy{min-width:0}
/* v7: the seat split hangs from the top so the pane sits under its heading, no float gap; the taller dashboard split stays centred */
.split:has(.w-pane-seat){align-items:start}
/* v7: the WI hover card on the 01 seat, the plugin's card at the site's tokens; lives on .w-pane so the leaf's overflow does not clip it */
.w-pane{position:relative}
/* the plugin's .ws-wi-card at the site's tokens: mono, accent edge, title / status / body / foot; 12px off the pointer */
.ck-card{position:absolute;z-index:6;width:320px;max-width:calc(100% - 16px);border:1px solid var(--accent);border-radius:6px;background:var(--paper-2);box-shadow:0 6px 24px rgba(0,0,0,.5);padding:10px 12px;font-family:var(--mono);font-size:12px;line-height:1.45;color:var(--ink);pointer-events:none}
:root[data-theme="light"] .ck-card{box-shadow:0 6px 24px rgba(0,0,0,.16)}
.ck-card .ck-ch{display:block;font-weight:600;margin-bottom:4px}
.ck-card .ck-cs{display:block;color:var(--accent);font-size:11px;margin-bottom:6px}
.ck-card .ck-cb{display:block;color:var(--ink-2);font-size:11px;line-height:1.45}
.ck-card .ck-cf{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:11px;color:var(--ink-3)}
.doc-inner .split-copy p{margin:0 0 10px;max-width:none;font-size:18px;line-height:1.5}
/* below 1300 the doc column has no room for a board beside its bullets (313px at 1280): the pane goes
   full width above the list, the dashboard at its natural height so the whole board shows */
@media (max-width:1299px){.split{grid-template-columns:1fr;gap:14px}.split .w-pane-dash .ck-leaf{height:auto}.split .w-pane-dash .op-panel{overflow:visible}}
.route-strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin:26px 0 8px}
.route-strip.two{grid-template-columns:1fr 1fr}
.doc-inner .route-strip a{display:block;border:1px solid var(--line-2);border-left:2px solid var(--accent);border-radius:6px;background:var(--paper-2);padding:12px 14px;font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--ink-soft);transition:border-color .15s}
.doc-inner .route-strip.two a{padding:14px 16px;font-size:14.5px}
.route-strip.two b{font-size:12px}
.doc-inner .route-strip a:hover{border-color:var(--accent);color:var(--ink-soft)}
.route-strip b{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin-bottom:4px;font-weight:600}
@media (max-width:640px){.route-strip,.route-strip.two{grid-template-columns:1fr}}

.w-b2b .b2b-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.w-b2b .b2b-svcs{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;font-family:var(--mono);font-size:12.5px;color:var(--ink-2);padding:2px 0}
.w-b2b .b2b-svcs-label{color:var(--ink-3);letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.w-b2b .b2b-svcs label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;border:1px solid var(--line-2);border-radius:5px;padding:5px 9px;background:var(--paper);transition:border-color .15s}
.w-b2b .b2b-svcs label:hover{border-color:var(--accent)}
.w-b2b .b2b-svcs input{width:auto;accent-color:var(--accent)}
.w-b2b .b2b-svcs label.b2b-allchk{border-style:dashed;color:var(--accent)}
.w-b2b .b2b-cond{display:none}
.w-b2b .b2b-cond.on{display:block}
@media (max-width:640px){.w-b2b .b2b-grid{grid-template-columns:1fr}}

.w-lgpipe{padding:0}
.w-lgpipe .lg-flow{display:flex;align-items:stretch;padding:22px 18px;gap:0}
.w-lgpipe .lg-node{flex:1;border:1px solid var(--line);border-radius:6px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;min-width:0;background:var(--paper)}
.w-lgpipe .lg-node.lg-crm{border-color:var(--gold)}
.w-lgpipe .lg-tag{font-family:var(--mono);font-size:11.5px;color:var(--accent);letter-spacing:.08em;text-transform:uppercase}
.w-lgpipe .lg-node.lg-crm .lg-tag{color:var(--gold)}
.w-lgpipe .lg-node b{font-family:var(--serif);font-size:15px}
.w-lgpipe .lg-sub{font-family:var(--mono);font-size:12.5px;color:var(--ink-2);line-height:1.5}
.w-lgpipe .lg-wire{flex:0 0 26px;position:relative;align-self:center;height:1px;background:var(--line)}
.w-lgpipe .lg-dot{position:absolute;top:-2px;left:0;width:5px;height:5px;border-radius:50%;background:var(--gold);animation:lgTravel 2.4s linear infinite}
.w-lgpipe .lg-wire:nth-of-type(4) .lg-dot{animation-delay:.8s}
.w-lgpipe .lg-wire:nth-of-type(6) .lg-dot{animation-delay:1.6s}
@keyframes lgTravel{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:calc(100% - 5px);opacity:0}}
.w-lgpipe .lg-foot{border-top:1px solid var(--line);padding:10px 18px;font-family:var(--mono);font-size:13px;color:var(--ink-2)}
@media (max-width:820px){
.w-lgpipe .lg-flow{flex-direction:column}
.w-lgpipe .lg-wire{flex:0 0 22px;width:1px;height:22px;align-self:center;background:var(--line)}
.w-lgpipe .lg-dot{left:-2px;top:0;animation:lgTravelV 2.4s linear infinite}
}
@keyframes lgTravelV{0%{top:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:calc(100% - 5px);opacity:0}}

.w-qtrace{padding:0}
.w-qtrace .qt-body{padding:18px;display:flex;flex-direction:column;gap:11px}
.w-qtrace .qt-q{font-family:var(--mono);font-size:14px;color:var(--ink)}
.w-qtrace .qt-step{display:flex;gap:12px;align-items:baseline;opacity:0;transform:translateY(4px);animation:rise .5s ease forwards}
.w-qtrace .qt-step:nth-of-type(2){animation-delay:.25s}
.w-qtrace .qt-step:nth-of-type(3){animation-delay:.55s}
.w-qtrace .qt-step:nth-of-type(4){animation-delay:.85s}
.w-qtrace .qt-tag{flex:0 0 86px;font-family:var(--mono);font-size:11.5px;color:var(--accent);letter-spacing:.08em;text-transform:uppercase;text-align:right}
.w-qtrace .qt-val{font-family:var(--mono);font-size:13.5px;color:var(--ink-2);line-height:1.55}
.w-qtrace .qt-ans{margin-top:3px;border:1px solid var(--gold);border-radius:6px;padding:11px 14px;display:flex;flex-direction:column;gap:4px;opacity:0;transform:translateY(4px);animation:rise .5s ease forwards;animation-delay:1.2s}
.w-qtrace .qt-ans b{font-family:var(--serif);font-size:16px}
.w-qtrace .qt-src{font-family:var(--mono);font-size:12px;color:var(--ink-2)}
.w-qtrace .qt-foot{border-top:1px solid var(--line);padding:10px 18px;font-family:var(--mono);font-size:13px;color:var(--ink-2)}
@media (max-width:640px){.w-qtrace .qt-step{flex-direction:column;gap:3px}.w-qtrace .qt-tag{text-align:left;flex:none}}

.w-bsteps{padding:0}
.w-bsteps .bs-rail{position:relative;padding:20px 18px 22px 18px;display:flex;flex-direction:column;gap:18px}
.w-bsteps .bs-rail::before{content:"";position:absolute;left:31px;top:34px;bottom:34px;width:1px;background:var(--line)}
.w-bsteps .bs-step{position:relative;display:flex;gap:14px;align-items:flex-start}
.w-bsteps .bs-n{position:relative;z-index:1;flex:0 0 27px;height:27px;border:1px solid var(--accent);border-radius:50%;background:var(--paper);color:var(--accent);font-family:var(--mono);font-size:11.5px;display:inline-flex;align-items:center;justify-content:center}
.w-bsteps .bs-body{display:flex;flex-direction:column;gap:2px;padding-top:3px}
.w-bsteps .bs-body b{font-family:var(--serif);font-size:15px}
.w-bsteps .bs-body span{font-family:var(--mono);font-size:13.5px;color:var(--ink-2);line-height:1.55}
.w-bsteps .bs-body em{font-style:normal;color:var(--gold)}

.w-gates{padding:0}
.w-gates .g-body{padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.w-gates .g-fail,.w-gates .g-gate{display:flex;align-items:baseline;gap:10px;font-family:var(--mono);font-size:13.5px;line-height:1.55}
.w-gates .g-fail{color:var(--ink-3)}
.w-gates .g-fx{color:var(--ink-3);flex:0 0 12px}
.w-gates .g-ft{flex:1}
.w-gates .g-tag{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.w-gates .g-turn{margin:6px 0;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);text-align:center}
.w-gates .g-gate{color:var(--ink-2);border:1px solid var(--line-2);border-left:2px solid var(--accent);border-radius:5px;padding:8px 12px;background:var(--paper)}
.w-gates .g-gx{color:var(--accent);flex:0 0 12px}
.w-gates .g-gt{flex:1;color:var(--ink)}
.w-gates .g-mech{font-size:12px;color:var(--accent);white-space:nowrap}
.w-gates .g-foot{border-top:1px solid var(--line);padding:10px 18px;font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--ink-2)}
@media (max-width:640px){.w-gates .g-fail,.w-gates .g-gate{flex-wrap:wrap}.w-gates .g-tag,.w-gates .g-mech{margin-left:22px;flex-basis:100%}}

.w-prodrack{padding:0}
.w-prodrack .pr-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line)}
.w-prodrack .pr-card{background:var(--paper);padding:14px 16px 12px;display:flex;flex-direction:column;gap:8px}
.w-prodrack .pr-top{display:flex;align-items:center;gap:8px}
.w-prodrack .pr-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:prPulse 2.6s ease-in-out infinite}
.w-prodrack .pr-card:nth-child(2) .pr-dot{animation-delay:.9s}
.w-prodrack .pr-card:nth-child(3) .pr-dot{animation-delay:1.8s}
.w-prodrack .pr-name{font-family:var(--serif);font-size:16px;color:var(--ink)}
.w-prodrack .pr-body{font-family:var(--mono);font-size:13.5px;line-height:1.6;color:var(--ink-2);flex:1}
.w-prodrack .pr-run,.doc-inner .w-prodrack a.pr-run{display:block;border-top:1px solid var(--line);padding-top:8px;font-family:var(--mono);font-size:12px;color:var(--ink-3)}
.doc-inner .w-prodrack a.pr-run{color:var(--accent)}
@keyframes prPulse{0%,100%{box-shadow:0 0 0 0 rgba(90,142,199,.45)}50%{box-shadow:0 0 0 6px rgba(90,142,199,0)}}
@media (max-width:820px){.w-prodrack .pr-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.w-prodrack .pr-dot{animation:none}}

/* ============================================================ extended system
   The map page, inset in the site shell. Three pieces: the theme toggle now in
   the titlebar, the map's groups hanging off its leaf in the explorer, and the
   map's own panel mirrored into the contents rail.

   The rail markup is written by the map, not by this codebase, so the class
   names below (.pane .floor, .inv-item, .cls.mech) are its vocabulary. They are
   restyled here rather than reproduced: same structure, the site's type. */

/* titlebar toggle — lifted out of the foot of the explorer, which is the space
   the extended-system groups needed */
.tb-theme{margin-left:auto;background:none;border:0;color:var(--ink-3);font-family:var(--mono);font-size:12px;cursor:pointer;display:flex;align-items:center;gap:7px;padding:4px 6px;letter-spacing:.04em;transition:color .15s}
.tb-theme:hover{color:var(--ink)}
.tb-theme .tt-ico{color:var(--accent);font-size:13px}

/* explorer: the map's groups, one open at a time */
.mapnav{padding:2px 0 6px}
.mn-g{display:block}
.mn-h{display:flex;align-items:baseline;gap:7px;width:100%;background:none;border:0;cursor:pointer;font-family:var(--mono);font-size:12px;color:var(--ink-2);text-align:left;padding:4px 14px 4px 46px;transition:color .15s,background .15s}
.mn-h:hover{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
.mn-h.on{color:var(--ink)}
.mn-h .tw{color:var(--gold);width:9px;flex:0 0 9px;font-size:10px}
.mn-h .mn-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mn-h .mn-n{color:var(--ink-3);font-size:10px}
.mn-items{padding-bottom:4px}
.mn-i{display:flex;align-items:baseline;gap:8px;width:100%;background:none;border:0;cursor:pointer;font-family:var(--mono);font-size:11.5px;color:var(--ink-2);text-align:left;padding:3px 14px 3px 62px;position:relative;transition:color .15s,background .15s}
.mn-i:hover{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
.mn-i .dot{color:var(--line-2);font-size:9px;transition:color .15s}
.mn-i.on{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
.mn-i.on .dot{color:var(--accent)}
.mn-i.on::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:2px;background:var(--accent)}
.mn-i .mn-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* the canvas pane. .doc scrolls; this one must not — the map pans inside it. */
.mapdoc{overflow:hidden;display:flex;flex-direction:column;background:var(--paper)}
.mapFrame{flex:1;width:100%;border:0;display:block;background:var(--paper);min-height:0}

/* the map is a drag-to-pan canvas with a rail beside it and never had a small
   layout. Say so rather than serving a broken canvas someone has to pinch at. */
.mapSmall{display:none}
@media (max-width:720px){
  .mapFrame{display:none}
  .mapSmall{display:flex;flex-direction:column;justify-content:center;gap:12px;padding:28px 22px;font-family:var(--body);font-size:16px;line-height:1.55;color:var(--ink-2)}
  .mapSmall strong{font-family:var(--display);font-weight:600;font-size:20px;color:var(--ink)}
  .mapSmall a{font-family:var(--mono);font-size:12px;color:var(--accent)}
}

/* the rail. Wider than the contents rail on a document page: this one carries a
   whole panel, not a table of contents. */
/* Above 761px the site hands scrolling to the document: .app goes height:auto,
   .doc goes overflow:visible, and the two rails become sticky columns. That is
   right for a page of prose and wrong for a canvas, which has to be exactly as
   tall as what is left of the viewport and must not push the page down. So the
   map page opts back into the locked shell. Scoped with :has() rather than a
   body class because the page already announces itself through the rail.

   align-items matters as much as the rows here: .panes is align-items:start in
   that same block, so a grid item keeps its content height, and an iframe's
   content height is the CSS default 150px. That was a 150px strip of city in a
   958px pane. */
.app:has(.mapcontents){height:100vh;min-height:0;overflow:hidden}
.panes:has(.mapcontents){grid-template-columns:248px 1fr 336px;grid-template-rows:100%;align-items:stretch;height:calc(100vh - 42px)}
.mapcontents{padding:0;overflow:hidden}
.mapcontents .mp-tabs{display:flex;flex:0 0 auto;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line)}
.mapcontents .mp-tabs button{flex:1;position:relative;background:none;border:1px solid transparent;border-radius:4px;padding:9px 10px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);cursor:pointer;transition:color .15s,background .15s,border-color .15s}
.mapcontents .mp-tabs button:hover{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel))}
/* the same treatment an active leaf gets in the explorer: sel wash, hairline,
   a 2px accent bar at the left edge. A grey outline belongs to no other
   control on this site. */
.mapcontents .mp-tabs button.on{color:var(--ink);background:linear-gradient(90deg,transparent,var(--sel));border-color:var(--line)}
.mapcontents .mp-tabs button.on::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:2px;border-radius:2px;background:var(--accent)}
.mapcontents .margin{flex:0 0 auto;margin:0;padding:16px 20px 18px}
/* the map's legend moved off the canvas and into the home pane, so the pane
   markup now carries it and it gets the site's type here */
.mapcontents .pane .legend{display:grid;grid-template-columns:1fr 1fr;gap:7px 14px;margin:8px 0 2px;font-family:var(--mono);font-size:9.5px;line-height:1.35;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.mapcontents .pane .legend span{display:inline-flex;align-items:center;gap:8px}
.mapcontents .pane .legend i{display:inline-block;width:26px;height:0;flex:0 0 26px;border-top:2px solid var(--accent)}
.mapcontents .pane .legend i.behav{border-top:2px dashed var(--gold)}
.mapcontents .pane .legend i.human{border-top:2px dotted var(--ink-3)}
.mapcontents .pane .legend b{display:inline-block;width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:var(--accent)}
.mapcontents .pane .legend i.persist{width:14px;height:9px;flex:0 0 14px;border:1px solid var(--line-2);background:var(--sel)}
.mapcontents .pane .legend i.cog{width:14px;height:9px;flex:0 0 14px;border:1px solid var(--line-2);background:var(--gold);opacity:.5}
.mapcontents .margin .note a{color:var(--accent);text-decoration:none;white-space:nowrap}
.mapcontents .margin .note a:hover{text-decoration:underline}

/* Tokens the mirrored markup expects that the site does not carry. Everything
   else (--ink, --paper, --line, --serif, --mono, --display) already lines up,
   which is why the port is a restyle and not a rewrite. */
.mapcontents{--flow:var(--accent);--flow-soft:var(--sel);--behav:var(--gold);--human:#d47a6a;--persist:#1a2b3a;--persist-ink:#8fb5d6;--cog:#3d2f16;--cog-ink:#d0a55a;--top-hi:var(--paper-3)}
:root[data-theme="light"] .mapcontents{--human:#a3352b;--persist:#dfe7ee;--persist-ink:#3f6ea5;--cog:#eadfc2;--cog-ink:#7a5f1e}

.mapcontents .pane{flex:1;min-height:0;overflow-y:auto;padding:20px 20px 34px;font-family:var(--body);font-size:15px;line-height:1.6;color:var(--read)}
.mapcontents .pane .eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}
.mapcontents .pane h1{font-family:var(--head);font-size:27px;line-height:1.1;margin:0 0 10px;font-weight:500;letter-spacing:.02em;color:var(--ink)}
.mapcontents .pane h2{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:22px 0 7px;font-weight:500}
.mapcontents .pane p{margin:0 0 11px}
.mapcontents .pane .sub{color:var(--ink-2);margin-bottom:15px}
.mapcontents .pane .muted{color:var(--ink-3);font-size:13.5px}
.mapcontents .pane b,.mapcontents .pane strong{color:var(--read-em);font-weight:600}
.mapcontents .pane mark{background:var(--sel);color:var(--ink);padding:0 3px;border-bottom:1px solid var(--accent)}
.mapcontents .pane ol{padding-left:18px;margin:0 0 11px}
.mapcontents .pane ul.bul{list-style:none;padding:0;margin:12px 0 4px;border-top:1px solid var(--line)}
.mapcontents .pane ul.bul li{padding:7px 0 7px 15px;border-bottom:1px solid var(--line);position:relative;font-size:14px;color:var(--ink-2);margin:0}
.mapcontents .pane ul.bul li:before{content:"•";font-family:var(--mono);position:absolute;left:0;top:8px;font-size:12px;color:var(--accent)}
.mapcontents .pane li{margin:0 0 5px}
.mapcontents .pane a{color:var(--accent)}

.mapcontents .pane .kv{font-family:var(--mono);font-size:11px;border-top:1px solid var(--line);padding-top:9px;color:var(--ink-2)}
.mapcontents .pane .kv div{display:flex;gap:10px;padding:2px 0}
.mapcontents .pane .kv .k{color:var(--ink-3);min-width:88px}

.mapcontents .pane .cls{display:inline-block;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;padding:2px 6px;border:1px solid var(--line-2);color:var(--ink-2);margin:0 4px 6px 0}
.mapcontents .pane .cls.mech{background:var(--flow);border-color:var(--flow);color:var(--cta-ink)}
.mapcontents .pane .cls.behav{border-color:var(--behav);color:var(--behav)}
.mapcontents .pane .cls.human{border-color:var(--human);color:var(--human)}
.mapcontents .pane .cls.persist{border-color:var(--persist-ink);color:var(--persist-ink);background:var(--persist)}
.mapcontents .pane .cls.cog{border-color:var(--cog-ink);color:var(--cog-ink);background:var(--cog)}
.mapcontents .pane .cls[data-go]{cursor:pointer}
.mapcontents .pane .cls[data-go]:hover{border-color:var(--ink);color:var(--ink)}

.mapcontents .pane .up{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line-2);padding:2px 8px;margin:6px 0 10px;cursor:pointer;color:var(--ink-2)}
.mapcontents .pane .up:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}

.mapcontents .pane .floors{border-top:1px solid var(--line);margin-top:6px}
/* Contents block. Stacked rather than two columns, because at rail width any
   name over two words wrapped and the rows stopped agreeing on a height. The
   selected row is marked with the same left accent bar the tabs use. */
.mapcontents .pane .floors.toc{border:1px solid var(--line);margin:8px 0 16px}
.mapcontents .pane .floors.toc .floor:last-child{border-bottom:none}
.mapcontents .pane .floor{position:relative;display:grid;grid-template-columns:16px 1fr;gap:1px 9px;padding:8px 10px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s}
.mapcontents .pane .floor:hover{background:var(--sel)}
.mapcontents .pane .floor .fn{font-family:var(--mono);font-size:10px;color:var(--ink-3);line-height:1.7}
.mapcontents .pane .floor .nm{font-weight:600;color:var(--ink);line-height:1.35}
.mapcontents .pane .floor .ds{grid-column:2;font-size:12.5px;color:var(--ink-3);line-height:1.4}
.mapcontents .pane .floor.on{background:linear-gradient(90deg,var(--sel),transparent)}
.mapcontents .pane .floor.on::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;border-radius:2px;background:var(--accent)}

.mapcontents .pane .step{font-family:var(--mono);font-size:11px;padding:6px 8px;border:1px solid var(--line);margin:0 0 6px;color:var(--ink-2)}
.mapcontents .pane .step.now{border-color:var(--flow);background:var(--flow-soft)}
.mapcontents .pane .step .n{color:var(--flow);margin-right:6px}

.mapcontents .pane .inv{border-top:1px solid var(--line);margin-top:8px}
.mapcontents .pane .inv-sub{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:14px 0 5px;display:flex;justify-content:space-between}
.mapcontents .pane .inv-ov{font-family:var(--body);font-size:13.5px;color:var(--ink-2);margin:0 0 8px;line-height:1.5}
.mapcontents .pane .inv-item{border:1px solid var(--line);margin:0 0 4px;padding:6px 8px;cursor:pointer;transition:border-color .15s,background .15s}
.mapcontents .pane .inv-item:hover{border-color:var(--line-2)}
.mapcontents .pane .inv-item.open{border-color:var(--flow);background:var(--sel)}
.mapcontents .pane .inv-head{display:flex;gap:8px;align-items:baseline;font-family:var(--mono);font-size:11px}
.mapcontents .pane .inv-head .t{font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);min-width:34px}
.mapcontents .pane .inv-head .t.skill{color:var(--behav)}
.mapcontents .pane .inv-head .t.rule{color:var(--human)}
.mapcontents .pane .inv-head .t.store{color:var(--flow)}
.mapcontents .pane .inv-head .nm{font-weight:600;color:var(--ink)}
.mapcontents .pane .inv-doc{font-family:var(--body);font-size:13px;color:var(--ink-2);margin-top:3px}
.mapcontents .pane .inv-body{margin-top:8px;font-size:14px}
.mapcontents .pane .inv-body p{margin:0 0 8px}
.mapcontents .pane .inv-con{font-family:var(--mono);font-size:10.5px;color:var(--ink-2);margin:0 0 8px}
.mapcontents .pane .inv-path{font-family:var(--mono);font-size:9.5px;color:var(--ink-3);margin-top:6px;word-break:break-all}

/* below the map's own breakpoint the canvas is already hidden, so the rail is
   the whole page and should read like one */
@media (max-width:1180px){
  .panes:has(.mapcontents){grid-template-columns:248px 1fr 300px}
}

.sh{margin:22px 0 10px;container-type:inline-size}
@media (min-width:1300px){.sh{width:calc(100% + 140px);margin-left:-70px}}
.sh .ck-leaf{height:auto}
.sh-folder-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:14px}
.sh-folder-grid .ck-leaf{height:460px}
.ft-body{flex:1;overflow:hidden;padding:8px 4px;font-family:-apple-system,"Segoe UI",Inter,system-ui,sans-serif;font-size:12.5px;color:var(--ink-2)}
.ft-row{display:flex;align-items:center;gap:5px;height:24px;border-radius:4px;white-space:nowrap;overflow:hidden}
.ft-row i{font-style:normal;width:10px;color:var(--ink-3);font-size:12px;flex:none}
.ft-dir,.ft-open{color:var(--ink)}
.ft-on{background:var(--paper-3);color:var(--ink);font-weight:600}
.sh-id-stack{display:flex;flex-direction:column;gap:10px;max-width:760px;margin:0 auto}
.sh-strip{height:auto}
.sh-strip-body{padding:10px 14px 12px;font-size:12.5px;line-height:1.5;color:var(--ink)}
.sh-strip-note .sh-strip-body{font-family:-apple-system,"Segoe UI",Inter,system-ui,sans-serif}
.doc-inner .sh-strip-body p{font-family:inherit;font-size:12.5px;line-height:1.5;margin:0 0 4px;max-width:none;color:var(--ink-soft)}
.doc-inner .sh-strip-body p:last-child{margin-bottom:0}
.sh-strip-term .sh-strip-body{font-family:var(--mono);font-size:11.5px;color:var(--ink-2)}
.sh-strip-term .ck-out>span{display:block}
.sh-strip-term .ck-l{padding-left:0;color:var(--ink)}
.sh-git i{font-style:normal;color:var(--ck-yellow);margin-right:.5em}
.sh-h3{display:block;font-weight:700;font-size:13px;margin-bottom:3px}
.sh-st{display:block;color:var(--ink-3);font-size:11.5px}
.sh-st code{font-size:11px;background:var(--paper-3);border:0;padding:1px 4px;color:var(--ink-2);white-space:nowrap}
.doc-inner .sh-strip-note .ck-id{color:inherit;font-family:inherit;font-weight:inherit}
.sh-three-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.sh-three-grid .ck-seat{height:400px}
.sh-three-grid .ck-dash{grid-column:1/-1;height:auto}
.sh-three-grid .ck-dash .op-panel{overflow:visible}
@container (min-width:1500px){.sh-three-grid{grid-template-columns:1fr 1fr 1fr 1.3fr}.sh-three-grid .ck-dash{grid-column:auto;height:400px}.sh-three-grid .ck-dash .op-panel{overflow:auto;height:100%}}
@container (max-width:759px){.sh-three-grid{grid-template-columns:1fr}.sh-three-grid .ck-seat{height:340px}.sh-folder-grid{grid-template-columns:1fr}.sh-folder-grid .ft-leaf{height:auto}.ft-body{overflow:auto}}
.sh-row-stage{position:relative;display:grid;padding:8px 0;grid-template-columns:200px minmax(0,1fr) 200px;grid-template-rows:auto auto;gap:18px 22px;align-items:center}
.sh-rowleaf{grid-column:2;grid-row:1/3;height:auto}
.sh-rowleaf .op-panel{overflow:visible}
.sh-callout{font-family:var(--mono);font-size:11px;line-height:1.45;color:var(--ink-2);padding:8px 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--paper-2)}
.sh-callout b{display:block;color:var(--ck-mint);font-weight:600;margin-bottom:2px}
.sh-c1{grid-column:1;grid-row:1}.sh-c3{grid-column:1;grid-row:2}.sh-c2{grid-column:3;grid-row:1}.sh-c4{grid-column:3;grid-row:2}
@container (max-width:859px){.sh-row-stage{grid-template-columns:1fr 1fr}.sh-rowleaf{grid-column:1/-1;grid-row:1}.sh-c1{grid-column:1;grid-row:2}.sh-c2{grid-column:2;grid-row:2}.sh-c3{grid-column:1;grid-row:3}.sh-c4{grid-column:2;grid-row:3}.sh-row-stage svg.ck-wires{display:none}}
.sh-loop svg{display:block;width:100%;max-width:900px;height:auto;margin:0 auto;font-family:-apple-system,"Segoe UI",Inter,system-ui,sans-serif}
.sh-loop .lp-node rect{fill:var(--paper-2);stroke:var(--line-2)}
.sh-loop .lp-title{fill:var(--ink);font-size:14px;font-weight:600}
.sh-loop .lp-sub{fill:var(--ink-3);font-size:11.5px}
.sh-loop .lp-ring{fill:none;stroke:var(--ck-mint);stroke-width:1.8}
.sh-loop .lp-spoke{stroke:var(--ink-3);stroke-width:1.2;stroke-dasharray:3 3}
.sh-loop .lp-lab{fill:var(--ink-3);font-family:var(--mono);font-size:10.5px}
.sh-loop .lp-vault rect{fill:var(--paper);stroke:var(--accent);stroke-width:1.5}
.sh-loop .lp-vault text{fill:var(--ink)}
.sh-loop .lp-vault .lp-f{fill:var(--ink-3);font-family:var(--mono);font-size:10.5px}
.sh-loop marker path{fill:var(--ck-mint)}