/* RC Instrument — design system v2.1, "Dexterity family". See DESIGN.md.
   Same brand family as RC Dexterity (dexterity.roboticscenter.ai): Instrument is the factory, Dexterity the store.
   Serif display, grotesk body, mono labels. Hairlines, not boxes. One rust accent, used sparingly.
   Every colour comes from the tokens below. Light (paper) is the default; dark follows the OS unless the visitor
   picked a theme, which shell.js stores as html[data-theme]. Keep the three palette blocks in sync. */

/* ============================ tokens ============================ */
:root{
  color-scheme:light;
  /* surfaces (paper) */
  --bg:#f4f3ef; --bg-2:#ecebe5; --surface:#faf9f6; --surface-2:#ecebe5; --track:#e2e0d9;
  --line:#dcd9d1; --line-2:#bdbab1;
  /* text */
  --ink:#111214; --ink-2:#3b3c40; --muted:#5f6166; --faint-c:#8a8c90;
  /* one accent (rust) + one data companion (attempt rate, slate blue) + semantic (kept apart from rust) */
  --accent:#9c3d22; --accent-ink:#ffffff; --accent-soft:#efe3dc;
  --data-2:#34588c;
  --ok:#255f36; --warn:#735400; --bad:#a3153f;
  /* effects */
  --shadow-c:#000000; --shadow:0 1px 2px rgba(17,18,20,.05),0 10px 30px rgba(17,18,20,.07);
  --glass:color-mix(in srgb,var(--bg) 86%,transparent);
  --grid-line:rgba(17,18,20,.045);
  --logo-filter:brightness(0);                      /* vendor marks: flattened to one monochrome */
  --scene-bg:#f4f3ef; --scene-grid:#dcd9d1;         /* WebGL canvases (Shadow pages) read these */

  /* type: same families as Dexterity (loaded by build.py, font-display:swap), real fallbacks */
  --serif:"Instrument Serif","Iowan Old Style","Times New Roman","Songti SC","Noto Serif SC",serif;
  --sans:"Inter Tight","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"PingFang SC",monospace;
  --fs-hero:clamp(44px,7vw,88px); --fs-h1:clamp(40px,6vw,76px); --fs-h2:clamp(30px,3.6vw,46px);
  --fs-h3:17px; --fs-lead:clamp(17px,1.7vw,20px); --fs-body:16px; --fs-sm:14px; --fs-xs:12px; --fs-label:11px;
  /* spacing (4-based) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:72px; --s9:112px;
  /* shape: Dexterity is square-ish everywhere */
  --r-xs:2px; --r-md:2px; --r-lg:2px; --r-pill:2px;
  --measure:62ch; --wrap:1200px;
  --ease:cubic-bezier(.2,.7,.2,1);

  /* legacy names used by existing pages and Shadow code — aliases, never new values */
  --void:var(--bg); --deep:var(--surface); --deep-2:var(--surface-2);
  --c1:var(--accent); --c1-dim:var(--accent-soft); --c2:var(--data-2); --c3:var(--warn); --c4:var(--bad);
  --glow:none; --disp:var(--sans);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#08090b; --bg-2:#111215; --surface:#0f1012; --surface-2:#16181b; --track:#202226;
    --line:#24262a; --line-2:#3a3d42;
    --ink:#ecebe6; --ink-2:#c9c8c3; --muted:#a2a39f; --faint-c:#74767a;
    --accent:#d27a55; --accent-ink:#140b07; --accent-soft:#2a1912; --data-2:#8eaad8;
    --ok:#6cc08a; --warn:#dcae4a; --bad:#f07896;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.35);
    --grid-line:rgba(236,235,230,.035);
    --logo-filter:brightness(0) invert(1);
    --scene-bg:#08090b; --scene-grid:#24262a;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#08090b; --bg-2:#111215; --surface:#0f1012; --surface-2:#16181b; --track:#202226;
  --line:#24262a; --line-2:#3a3d42;
  --ink:#ecebe6; --ink-2:#c9c8c3; --muted:#a2a39f; --faint-c:#74767a;
  --accent:#d27a55; --accent-ink:#140b07; --accent-soft:#2a1912; --data-2:#8eaad8;
  --ok:#6cc08a; --warn:#dcae4a; --bad:#f07896;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.35);
  --grid-line:rgba(236,235,230,.035);
  --logo-filter:brightness(0) invert(1);
  --scene-bg:#08090b; --scene-grid:#24262a;
}

/* ============================ base ============================ */
*{box-sizing:border-box}
html{scroll-padding-top:80px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--fs-body)/1.6 var(--sans);font-feature-settings:"ss01","cv11";
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;overflow-wrap:break-word}
html[lang^="zh"] body{font-family:"Inter Tight","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",var(--sans)}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:16px}
@media(min-width:720px){.wrap{padding-inline:40px}}
a{color:var(--accent);text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px;transition:text-decoration-color .2s}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:1.5px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--accent-ink)}
img,video,svg{max-width:100%}
p{margin:0 0 var(--s3)}
b,strong{font-weight:600;color:var(--ink)}
.c{color:var(--accent)} .w{color:var(--warn)} .dim{color:var(--muted)}
/* the lab voice: small tracked uppercase mono label */
.label-mono,.eyebrow{font:400 var(--fs-label)/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}

/* ============================ shell (structure mirrors Dexterity's layout.html) ============================ */
/* the shell is also injected into Shadow pages with their own element CSS: pin inherited properties */
.mast.rc-shell,.simbar,.rc-foot{margin:0;padding:0;max-width:none;text-align:left;letter-spacing:normal;font-family:var(--sans)}
.rc-shell p,.simbar p,.rc-foot p{max-width:none}

/* SIM: one quiet line; the long explanation lives in the flag's data-tip */
.simbar{background:var(--bg-2);border-bottom:1px solid var(--line);font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.04em;color:var(--ink-2)}
.simin{display:flex;gap:10px;align-items:center;min-height:30px;padding-block:5px}
.simtx{min-width:0}

/* header: transparent at the top, paper glass once scrolled (shell.js toggles .scrolled) */
.mast{position:sticky;top:0;z-index:40;background:transparent;border-bottom:1px solid transparent;font-size:var(--fs-sm);line-height:1.4;
  transition:background .3s,border-color .3s}
.mast.scrolled,.mast.menu-open{background:var(--glass);-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);border-bottom-color:var(--line)}
.rc-shell .mastin{display:flex;align-items:center;gap:var(--s4);min-height:60px;max-width:var(--wrap);margin:0 auto;padding-inline:16px}
@media(min-width:720px){.rc-shell .mastin{padding-inline:40px}}
.brand{display:inline-flex;flex-direction:column;gap:4px;color:var(--ink);text-decoration:none!important;flex:none;padding:10px 0}
.brand-logo{display:block;width:150px;height:auto}
.brand-logo.on-dark{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brand-logo.on-light{display:none}:root:not([data-theme="light"]) .brand-logo.on-dark{display:block}}
:root[data-theme="dark"] .brand-logo.on-light{display:none}
:root[data-theme="dark"] .brand-logo.on-dark{display:block}
.brand-name{font:400 9.6px/1 var(--mono);text-transform:uppercase;letter-spacing:.3em;color:var(--muted)}
.topnav{display:flex;flex-wrap:wrap;gap:2px 6px;margin-left:auto}
.topnav a{position:relative;display:block;color:var(--muted);padding:6px 8px;text-decoration:none!important;white-space:nowrap;font-size:13.8px;letter-spacing:.01em;transition:color .2s}
.topnav a:hover{color:var(--ink)}
.topnav a[aria-current="page"],.topnav a.on{color:var(--ink)}
.topnav a[aria-current="page"]::after,.topnav a.on::after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:1px;background:var(--accent)}
.tools{display:flex;align-items:center;gap:var(--s2);flex:none}
.themetog{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;flex:none;background:transparent;color:var(--muted);
  border:1px solid transparent;border-radius:50%;cursor:pointer;transition:color .2s,border-color .2s}
.themetog:hover{color:var(--ink);border-color:var(--line-2)}
.themetog svg,.menubtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.themetog .ti{display:none}
html:not([data-theme]) .themetog .ti-sys,html[data-theme="light"] .themetog .ti-light,html[data-theme="dark"] .themetog .ti-dark{display:block}
.langtog{color:var(--muted);font:400 var(--fs-label)/1 var(--mono);letter-spacing:.1em;padding:8px 6px;text-decoration:none!important;flex:none}
.langtog:hover{color:var(--ink)}
.hcontact,.menubtn{font:400 13.4px/1.25 var(--sans);color:var(--ink);background:transparent;border:1px solid var(--line-2);border-radius:var(--r-xs);
  padding:6px 14px;text-decoration:none!important;cursor:pointer;flex:none;transition:background .2s,color .2s,border-color .2s}
.hcontact:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.menubtn{display:none}
@media(max-width:919px){
  .rc-shell .mastin{gap:var(--s2)}
  .tools{margin-left:auto}
  .menubtn{display:inline-block}
  .menubtn[aria-expanded="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .topnav{display:none;position:fixed;left:0;right:0;top:var(--mast-h,60px);bottom:0;overflow-y:auto;margin:0;
    flex-direction:column;flex-wrap:nowrap;gap:0;padding:var(--s2) 16px var(--s7);background:var(--bg)}
  .mast.menu-open .topnav{display:flex}
  .topnav a{font:400 30px/1.2 var(--serif);color:var(--ink);padding:14px 0;border-bottom:1px solid var(--line)}
  .topnav a[aria-current="page"]::after,.topnav a.on::after{display:none}
  .topnav a[aria-current="page"],.topnav a.on{color:var(--accent)}
  body.menu-lock{overflow:hidden}
}
@media(max-width:480px){.brand-logo{width:118px}.hcontact{display:none}}

/* footer: address block + link columns (Dexterity) + the family line */
.rc-foot{border-top:1px solid var(--line);margin-top:var(--s9);padding:36px 0 44px;color:var(--muted);font-size:14px;line-height:1.55}
.rc-foot .wrap{max-width:var(--wrap);margin:0 auto;padding-inline:16px}
@media(min-width:720px){.rc-foot .wrap{padding-inline:40px}}
.footgrid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,3fr);gap:var(--s6)}
.addr strong{color:var(--ink);font-weight:500}
.addr a,.sitemap a,.family a{color:var(--muted);text-decoration:none}
.addr a:hover,.sitemap a:hover,.family a:hover{color:var(--ink)}
.family{margin-top:var(--s4);max-width:36ch}
.family a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2)}
.sitemap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5)}
.smh{font:400 var(--fs-label)/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-2);margin:0 0 var(--s3)}
.sitemap ul{list-style:none;margin:0;padding:0}
.sitemap li{margin:0 0 7px}
.footbase{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--line);font-size:var(--fs-xs)}
.footbase p{margin:0 0 6px}
.footbase a{color:var(--ink-2)}
@media(max-width:860px){.footgrid{grid-template-columns:1fr}.sitemap{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ============================ type ============================ */
/* page head: calm, big serif, a ruler along the bottom edge (Dexterity .page-hero) */
.pagehead{position:relative;padding-block:var(--s8) var(--s7);margin-bottom:var(--s5);border-bottom:1px solid var(--line)}
.pagehead::after,.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;opacity:.8;
  background:repeating-linear-gradient(90deg,var(--line-2) 0 1px,transparent 1px 12px);
  -webkit-mask:linear-gradient(90deg,#000 0 30%,transparent 70%);mask:linear-gradient(90deg,#000 0 30%,transparent 70%)}
@media(min-width:720px){.pagehead{padding-block:112px 64px}}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;line-height:1.04;text-wrap:balance}
h1{font-size:var(--fs-h1);margin:0;max-width:16ch}
.pagehead .sub{color:var(--muted);font-size:var(--fs-lead);line-height:1.55;margin:var(--s5) 0 0;max-width:58ch;text-wrap:pretty}
h2{font-size:var(--fs-h2);margin:var(--s8) 0 var(--s4);color:var(--ink)}
h3{font-size:var(--fs-h3);line-height:1.3;font-weight:600;letter-spacing:-.005em;margin:0 0 var(--s2);display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap}
h4{font-size:var(--fs-sm);font-weight:600;margin:0 0 var(--s2)}
.lede{color:var(--muted);font-size:var(--fs-lead);line-height:1.55;max-width:58ch}
.sm{font-size:var(--fs-sm);color:var(--muted);line-height:1.55}
.mono{font-family:var(--mono);font-size:var(--fs-xs)}
code{font-family:var(--mono);font-size:.86em;background:var(--bg-2);color:var(--ink);padding:1px 6px;border-radius:var(--r-xs)}
.eb{font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.04em;color:var(--muted);display:block;margin-bottom:6px}
.big{font:400 40px/1 var(--serif);color:var(--ink);display:block;font-variant-numeric:tabular-nums}
.big.dim{color:var(--muted)}
.num,.rv,td.num,th.num{font-variant-numeric:tabular-nums}

/* ============================ actions ============================ */
.btn{display:inline-flex;align-items:center;gap:10px;font:500 14.4px/1.25 var(--sans);letter-spacing:.005em;padding:12px 20px;border-radius:var(--r-xs);
  background:var(--ink);color:var(--bg);border:1px solid var(--ink);cursor:pointer;text-decoration:none!important;white-space:nowrap;
  transition:background .2s,color .2s,border-color .2s}
.btn::after{content:"→";font-family:var(--mono);transition:transform .25s var(--ease)}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn:hover::after{transform:translateX(3px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn.ghost:hover{border-color:var(--ink);background:transparent;color:var(--ink)}
.btn.ext::after{content:"↗"}
.btns{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
a.more{font-size:var(--fs-body)}
a.more::after{content:"\00a0→";font-family:var(--mono)}   /* long labels wrap; the arrow never orphans */
.ext::after{content:" ↗";font-size:.85em}

/* ============================ layout + containers ============================ */
.grid{display:grid;gap:var(--s4)}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:860px){.g3,.g2{grid-template-columns:1fr}}
/* cards: hairline cells (Dexterity .card), fill only on hover */
.panel{background:transparent;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 24px;position:relative;transition:background .3s var(--ease)}
.panel .sm:last-child{margin-bottom:0}
.hud{border-color:var(--line-2);border-top:1px solid var(--ink)}
.plate{border:1px solid var(--line);border-top:1px solid var(--ink);border-radius:var(--r-md);background:transparent;overflow:hidden;margin-bottom:var(--s4)}
.ph{border-bottom:1px solid var(--line);padding:10px 16px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;background:transparent}
.pt{font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.04em;color:var(--ink)}
.pr{font-family:var(--mono);font-size:var(--fs-xs);color:var(--ink-2)}   /* ink-2: .ph headers can carry a tint */
.plate dl{margin:0;display:grid;grid-template-columns:auto 1fr}
.plate dt,.plate dd{margin:0;padding:10px 16px;border-bottom:1px solid var(--line);font-size:var(--fs-sm)}
.plate dt{font-family:var(--mono);font-size:var(--fs-xs);color:var(--muted);white-space:nowrap}
.plate dd{color:var(--ink-2)}
.plate dt:last-of-type,.plate dd:last-of-type{border-bottom:0}
@media(max-width:560px){.plate dl{grid-template-columns:1fr}.plate dt{padding-bottom:0;border-bottom:0}}

/* doors: a card that is a link */
.doors{margin-bottom:var(--s4)}
.door{display:block;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 24px;background:transparent;color:var(--ink);text-decoration:none!important;
  transition:background .3s var(--ease)}
.door:hover,.panel:hover{background:var(--surface)}
.dn{font:400 var(--fs-label)/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--muted);display:block}
.dt{font:400 28px/1.1 var(--serif);color:var(--ink);display:block;margin:10px 0 8px}
.door p{color:var(--muted);font-size:15px;margin:0 0 var(--s3)}
.dgo{font-size:var(--fs-sm);color:var(--accent)}

/* lists */
.rules{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.rules li{padding:14px 0;border-bottom:1px solid var(--line);display:flex;gap:var(--s4);align-items:baseline;font-size:var(--fs-body);color:var(--ink-2)}
.rules .k{font-family:var(--mono);font-size:var(--fs-xs);color:var(--accent);flex:none;width:24px}
.idents{list-style:none;padding:0;margin:0}
.ticks{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.ticks li{padding:11px 0 11px 22px;border-bottom:1px solid var(--line);font-size:var(--fs-sm);color:var(--ink-2);position:relative}
.ticks li::before{content:"";position:absolute;left:4px;top:19px;width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* tables: spec sheet (strong rule on top, hairlines, mono heads; no uppercase: heads can hold σ β θ) */
.scroll{overflow-x:auto;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);border-radius:0;background:transparent;margin-bottom:var(--s3)}
table{border-collapse:collapse;width:100%;font-size:var(--fs-sm)}
th,td{padding:11px 12px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
thead th{font:400 var(--fs-label)/1.3 var(--mono);letter-spacing:.04em;color:var(--muted);background:var(--bg);position:sticky;top:0}
td{color:var(--ink-2)}
td.num,th.num{text-align:right;font-family:var(--mono);font-size:13px}
tbody tr:last-child td{border-bottom:0}
tr.sum td{background:var(--surface);color:var(--ink);font-weight:500;border-top:1px solid var(--line-2)}
table.trace td:nth-child(4),table.docs td:nth-child(3){white-space:normal;min-width:260px}
.body-cell{font-size:13px;color:var(--ink)}
.body-cell em{font-style:normal;color:var(--muted);font-size:11px;display:block}
td.mx{cursor:pointer;font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;padding:10px 12px;transition:filter .12s}
td.mx:hover{filter:brightness(.94)}
td.mx .n{font-size:11px;display:block;color:inherit;font-weight:400}
td.mx.sel{box-shadow:inset 0 0 0 2px var(--accent)}

/* notes (methodology note: rust rule, no box), badges, flags */
.note{border-left:1px solid var(--accent);border-radius:0;padding:4px 0 4px 18px;color:var(--ink-2);margin:var(--s5) 0;font-size:15px;background:transparent;max-width:72ch}
.note.wn2{border-left-color:var(--warn);background:transparent}
.badge{font:400 var(--fs-label)/1 var(--mono);letter-spacing:.08em;padding:4px 8px;border-radius:var(--r-xs);white-space:nowrap;
  color:var(--ink-2);background:transparent;border:1px solid var(--line-2);display:inline-block}
.badge.b-a{color:var(--ink-2);background:transparent}
.badge.b-c,.badge.info{color:var(--accent);background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.badge.b-w,.badge.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--bg));border-color:color-mix(in srgb,var(--warn) 35%,transparent)}
.badge.b-ok,.badge.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 9%,var(--bg));border-color:color-mix(in srgb,var(--ok) 35%,transparent)}
.badge.b-bad,.badge.bad{color:var(--bad);background:color-mix(in srgb,var(--bad) 9%,var(--bg));border-color:color-mix(in srgb,var(--bad) 35%,transparent)}
.badges{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.badges .badge{white-space:normal;line-height:1.35;max-width:100%}
.lt .badge{font-size:10.5px;padding:3px 7px}
.flag{display:inline-flex;align-items:center;font:400 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  padding:4px 7px;border-radius:var(--r-xs);color:var(--ink-2);border:1px solid var(--line-2);background:transparent;white-space:nowrap;flex:none;vertical-align:middle}
.flag.sim,.flag.illus{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 45%,transparent);background:color-mix(in srgb,var(--warn) 7%,var(--bg))}
.flag.real{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,transparent);background:color-mix(in srgb,var(--ok) 7%,var(--bg))}
.flag[data-tip]{cursor:help}
/* info dot: <span class="i" data-tip="…">i</span> */
.i{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;border:1px solid var(--line-2);
  font:500 10px/1 var(--mono);color:var(--ink-2);cursor:help;vertical-align:1px;margin-left:5px;font-style:normal;flex:none}
.i:hover,.i:focus-visible{border-color:var(--accent);color:var(--accent)}
/* tooltip (one element, positioned by shell.js, clamped to the viewport) */
.rc-tip{position:fixed;z-index:100;max-width:340px;padding:10px 13px;border-radius:var(--r-md);background:var(--surface);
  color:var(--ink-2);font:400 13px/1.5 var(--sans);box-shadow:var(--shadow),0 0 0 1px var(--line);pointer-events:none;
  white-space:normal;overflow-wrap:anywhere;letter-spacing:normal;text-transform:none;text-align:left}
.rc-tip[hidden]{display:none}
/* "English version in progress" */
.pending{font:400 var(--fs-xs)/1.5 var(--mono);color:var(--warn);margin:10px 0 0;padding:6px 10px;
  border:1px solid color-mix(in srgb,var(--warn) 45%,transparent);border-radius:var(--r-xs);display:inline-block}
p.pending.wrap{display:block;margin:12px auto 0;border:0;padding-block:0}
/* bilingual spans: <span data-l="en">…</span><span data-l="zh">…</span> — html[lang] decides */
html[lang^="zh"] [data-l="en"],html:not([lang^="zh"]) [data-l="zh"]{display:none!important}

/* code */
pre{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s4) var(--s5);overflow-x:auto;
  font-family:var(--mono);font-size:13px;line-height:1.6;margin:0 0 var(--s4);color:var(--ink-2)}
pre .dm{color:var(--muted)} pre .cy{color:var(--accent)} pre .wn{color:var(--warn)} pre .ok{color:var(--ok)}
pre .pp{color:var(--data-2)} pre .hl{color:var(--ink);background:var(--accent-soft)}

/* controls: segmented pills (Dexterity .segmented) */
.ctrls{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;margin-bottom:var(--s4)}
.pick{font:400 13px/1 var(--sans);padding:7px 14px;border-radius:999px;cursor:pointer;
  border:1px solid var(--line-2);background:transparent;color:var(--muted);transition:background .2s,color .2s}
.pick:hover{color:var(--ink)}
.pick[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pick:disabled{opacity:.45;cursor:not-allowed}
/* text inputs: <input class="field" type="search|text|email"> (also applies to bare search/text inputs on generated pages) */
.field,body:not(.rc-shadow) input[type=search],body:not(.rc-shadow) input[type=text]{font:400 var(--fs-body)/1.3 var(--sans);color:var(--ink);
  background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-md);padding:10px 14px;width:100%;max-width:28rem;outline:none}
.field::placeholder,body:not(.rc-shadow) input::placeholder{color:var(--muted)}
.field:focus,body:not(.rc-shadow) input[type=search]:focus,body:not(.rc-shadow) input[type=text]:focus{border-color:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:7px 0 5px}
.form .frow{padding:13px 0;border-bottom:1px solid var(--line)}
.form .frow:last-child{border-bottom:0}
.fl{font:400 var(--fs-label)/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}
.cases{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}

/* readout: a row of numbers in hairline cells, mono label over a serif figure */
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-top-color:var(--ink);border-radius:var(--r-md);overflow:hidden;margin-bottom:var(--s2)}
.readout.r4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.readout div{background:var(--bg);padding:var(--s4)}
.rl{font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.1em;color:var(--muted);display:block}
.rv{font:400 30px/1.1 var(--serif);color:var(--ink);display:block;margin-top:6px}
.rv.zero{color:var(--muted)}

/* details / summary — long detail folded under a short label (generated pages; Shadow pages style their own) */
body:not(.rc-shadow) details:not(.obj):not(.layer){border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 -1px}
body:not(.rc-shadow) details:not(.obj):not(.layer)>summary{cursor:pointer;list-style:none;padding:18px 0;font:500 var(--fs-body)/1.4 var(--sans);
  color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
body:not(.rc-shadow) details:not(.obj):not(.layer)>summary::-webkit-details-marker{display:none}
body:not(.rc-shadow) details:not(.obj):not(.layer)>summary::after{content:"+";font:300 22px/1 var(--mono);color:var(--muted);flex:none;transition:transform .25s var(--ease)}
body:not(.rc-shadow) details:not(.obj):not(.layer)[open]>summary::after{transform:rotate(45deg)}
body:not(.rc-shadow) details:not(.obj):not(.layer)>summary:hover{color:var(--accent)}
body:not(.rc-shadow) details:not(.obj):not(.layer)>:last-child:not(summary){margin-bottom:var(--s5)}
details+:not(details){margin-top:var(--s5)}

/* ============================ homepage (reference page) ============================ */
/* Everything is visible at rest: no scroll-reveal, no opacity waiting on JS. */
main.home{max-width:none;padding:0}
.home>section{max-width:var(--wrap);margin:0 auto;padding:var(--s9) 16px 0}
@media(min-width:720px){.home>section{padding-inline:40px}}
.home>section.band{max-width:none;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-bottom:var(--s9);margin-top:var(--s9)}
.home>section.band>*{max-width:calc(var(--wrap) - 80px);margin-inline:auto}
.hero{position:relative;padding-top:128px!important;padding-bottom:64px!important}
/* ruler + hairline sit inside the content column, like Dexterity's .page-hero */
.hero::after{left:16px;right:16px}
.hero::before{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1px;background:var(--line)}
@media(min-width:720px){.hero::after,.hero::before{left:40px;right:40px}}
.hero h1{font-size:var(--fs-hero);line-height:1;max-width:13ch;margin:0}
.hero .lede{margin:var(--s6) 0 var(--s6);max-width:48ch}
/* numbered section heads: hairline above, mono number in rust (Dexterity .section > h2) */
.home{counter-reset:sec}
.sec-h{font-size:var(--fs-h2);margin:0 0 var(--s3);padding-top:18px;border-top:1px solid var(--line)}
.sec-h::before{counter-increment:sec;content:counter(sec,decimal-leading-zero);display:block;font:400 var(--fs-label)/1 var(--mono);letter-spacing:.14em;color:var(--accent);margin-bottom:18px}
.band .sec-h{border-top:0;padding-top:0}
.sec-sub{font-size:var(--fs-lead);line-height:1.55;color:var(--muted);max-width:58ch;margin:0 0 var(--s6)}
.eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 var(--s4)}
.center{text-align:center}.center .sec-sub{margin-inline:auto}
/* offers: cells in a hairline grid */
.offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.offer{background:transparent;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 26px 30px;transition:background .3s var(--ease)}
.offer:hover{background:var(--surface)}
.band .offer,.band .fig,.band .panel{background:var(--bg)}      /* cards on a band: page colour, both themes */
.offer h3{font:400 30px/1.1 var(--serif);margin:0 0 var(--s2)}
.offer .tag{font:400 var(--fs-label)/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--accent);display:block;margin-bottom:var(--s4)}
.offer p{font-size:15px;color:var(--muted);margin:0}
@media(max-width:860px){.offers{grid-template-columns:1fr}}
/* figure: one chart, one caption */
.fig{margin:0;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6) var(--s5) var(--s5)}
.fig svg{display:block;width:100%;height:auto}
.fig figcaption{font:400 var(--fs-label)/1.5 var(--mono);letter-spacing:.04em;color:var(--muted);margin-top:var(--s4);display:flex;gap:var(--s2) var(--s4);flex-wrap:wrap;align-items:center}
.rc-key{display:inline-flex;align-items:center;gap:7px;color:var(--ink-2)}
.rc-key i{width:10px;height:10px;border-radius:50%;display:inline-block}
.rc-key i.k-s{background:var(--accent)} .rc-key i.k-a{background:var(--bg);box-shadow:inset 0 0 0 2px var(--data-2)}
.bigfacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0 0 var(--s5);border-top:1px solid var(--line)}
.bigfact{padding:var(--s5) var(--s4) var(--s5) 0}
.bigfact+.bigfact{padding-left:var(--s5);border-left:1px solid var(--line)}
.bigfact .v{font:400 clamp(48px,7vw,84px)/1 var(--serif);display:block;font-variant-numeric:tabular-nums}
.bigfact .l{font:400 var(--fs-label)/1.5 var(--mono);letter-spacing:.1em;color:var(--ink-2);display:block;margin-top:var(--s3)}
.bigfact.a .v{color:var(--data-2)} .bigfact.s .v{color:var(--accent)}
/* steps (Dexterity .steps: rust mono counters on hairline rows, here laid out in four columns) */
.rc-steps{list-style:none;margin:0 0 var(--s5);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5);counter-reset:st}
.rc-steps li{counter-increment:st;border-top:1px solid var(--ink);padding-top:var(--s4)}
.rc-steps li::before{content:counter(st,decimal-leading-zero);font:400 var(--fs-label)/1 var(--mono);letter-spacing:.14em;color:var(--accent);display:block;margin-bottom:var(--s4)}
.rc-steps b{display:block;font:400 30px/1.1 var(--serif);margin-bottom:8px}
.rc-steps span{color:var(--muted);font-size:15px}
@media(max-width:860px){.rc-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.rc-steps{grid-template-columns:1fr}}
/* status: one honest line (Dexterity .status voice) */
.status{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:var(--s2) var(--s5);
  font:400 var(--fs-label)/1.5 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:var(--s5) 0}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none;box-shadow:0 0 0 4px var(--accent-soft)}
.status b{font-variant-numeric:tabular-nums;color:var(--ink)}
.status .sep{width:4px;height:4px;border-radius:50%;background:var(--line-2)}
.status .i{text-transform:none}
@media(max-width:620px){.status .sep{display:none}.status{flex-direction:column;align-items:flex-start;gap:var(--s2)}}

/* ============================ legacy components (tokenised) ============================ */
/* Page-specific blocks from v1, colours mapped onto tokens. Phase-2 pages may keep using them. */
/* stack */
.stack{display:flex;flex-direction:column;gap:4px}
.layer{display:grid;grid-template-columns:56px 1fr;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.layer .lv{font-family:var(--mono);font-size:11px;display:grid;place-items:center;color:var(--muted);border-right:1px solid var(--line)}
.layer .lb{padding:10px 14px;font-size:12.5px;color:var(--muted)}
.layer .lb b{font-family:var(--disp);font-size:13.5px;letter-spacing:.04em;display:block;margin-bottom:2px;color:var(--ink)}
.layer.hi{border-color:color-mix(in srgb,var(--accent) 42%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 7%,transparent),var(--deep))}
.layer.hi .lv,.layer.hi .lb b{color:var(--c1)}

.idents li{display:grid;grid-template-columns:88px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.idents li:last-child{border-bottom:0}
.ik{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--c1);opacity:.8;padding-top:2px}
.ib b{font-family:var(--disp);font-size:14px;letter-spacing:.02em;display:block;margin-bottom:5px}
.ib code{display:block;padding:7px 10px;margin-bottom:6px;background:color-mix(in srgb,var(--accent) 6%,transparent);border-left:2px solid var(--c1);border-radius:0 2px 2px 0;font-size:11.5px;line-height:1.5}
.ib em{font-style:normal;font-size:12.5px;color:var(--muted);display:block}
.ib em.w{color:var(--c3)}
@media(max-width:620px){.idents li{grid-template-columns:1fr;gap:6px}}

/* pipeline */
.pipe{list-style:none;padding:0;margin:0}
.pipe li{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--line)}
.pipe li:last-child{border-bottom:0}
.pn{width:26px;height:26px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;
  font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.pipe li.key .pn{border-color:var(--accent);color:var(--accent)}
.pb{font-size:12.5px;color:var(--muted)}
.pb b{font-family:var(--disp);font-size:13.5px;letter-spacing:.03em;display:block;margin-bottom:2px;color:var(--ink)}
.pc{font-family:var(--mono);font-size:10.5px;color:var(--muted);white-space:nowrap;text-align:right;padding-top:3px}

/* case box */
#caseBox dl{grid-template-columns:120px 1fr}
@media(max-width:560px){#caseBox dl{grid-template-columns:1fr}}
.tieout{padding:10px 14px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--ink-2);
  background:linear-gradient(90deg,color-mix(in srgb,var(--ok) 6%,transparent),transparent)}
.tieout b{color:var(--ok)}

/* ---------- 活数据:证据流 ---------- */
.feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.feed .card{border:1px solid var(--line-2);border-radius:var(--r-md);overflow:hidden;background:var(--deep);display:flex;flex-direction:column}
.feed .card video{width:100%;aspect-ratio:16/10;object-fit:cover;background:#000;display:block;max-width:100%}
.feed .card .cb{padding:9px 11px;font-size:12px;color:var(--ink-2);flex:1}
.feed .card .ct{font-family:var(--mono);font-size:11px;color:var(--ink);display:block;margin-bottom:4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed .card .cm{font-family:var(--mono);font-size:10px;color:var(--muted);display:block;margin-top:4px}
.feed .card .verdict{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
td.hx{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;padding:9px 11px}
td.logo img{height:17px;width:auto;max-width:74px;object-fit:contain;vertical-align:middle;margin-right:7px;
  filter:var(--logo-filter);opacity:.82}

/* ---------- schema 地图 ---------- */
.lyr{margin:22px 0 0}
.lyr>h3{font:600 var(--fs-body)/1.3 var(--sans);color:var(--ink);margin:0 0 var(--s2);padding-bottom:6px;border-bottom:1px solid var(--line)}
.objs{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.obj{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden}
.obj.view{border-style:dashed}
.obj>summary{padding:10px 12px;cursor:pointer;list-style:none;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.obj>summary::-webkit-details-marker{display:none}
.obj>summary:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.obj .on{font-family:var(--mono);font-size:12.5px;color:var(--ink);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.obj .oc{font-family:var(--mono);font-size:10px;color:var(--muted)}
.obj .onote{font-size:11.5px;color:var(--muted);padding:0 12px 9px;line-height:1.55}
.obj table{font-size:11.5px}
.obj th,.obj td{padding:5px 12px;white-space:normal}
.obj td.cn{font-family:var(--mono);color:var(--ink);white-space:nowrap}
.obj td.ct{font-family:var(--mono);color:var(--muted);font-size:10.5px;white-space:nowrap}
.obj td.cnote{color:var(--c3);font-size:11px}
.pkdot{color:var(--c1);font-size:9px;margin-left:4px}
.obj[open]>summary{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--accent) 5%,transparent)}

/* ============================ 视觉组件(2026-09-20)============================ */
/* 起因:整站 0 个 img / 0 个 svg / 0 个 video —— 一堵字墙,没人会逐字读。 */

/* 大数字卡片 */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:18px 0}
.stat{background:transparent;border:1px solid var(--line);border-top-color:var(--ink);border-radius:var(--r-lg);padding:var(--s4) var(--s4) var(--s3);position:relative}
.stat .n{font:400 36px/1.05 var(--serif);color:var(--ink);display:block;font-variant-numeric:tabular-nums}
.stat .n small{font-size:13px;color:var(--ink-2);font-weight:400;margin-left:2px}
.stat .l{font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.1em;color:var(--muted);margin-top:8px;display:block}
.stat.w .n{color:var(--c3)} .stat.c .n{color:var(--ok)} .stat.a .n{color:var(--c1)}

/* logo 条 */
.logos{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0}
/* vendor marks come in any colour (many are black-on-transparent): flatten them to one light
   monochrome so they read on the dark background; hover only raises opacity, never restores colour */
.logos img{height:26px;width:auto;max-width:104px;object-fit:contain;opacity:.72;
  filter:var(--logo-filter);transition:opacity .18s}
.logos img:hover{opacity:1}
.logos.sm img{height:18px;max-width:72px}
td .vlogo{height:15px;max-width:54px;object-fit:contain;vertical-align:-3px;margin-right:6px;
  opacity:.75;filter:var(--logo-filter)}



/* 图表 */
.chart{background:transparent;border:1px solid var(--line);border-top-color:var(--ink);border-radius:var(--r-lg);padding:var(--s4) var(--s4) var(--s3);margin:var(--s3) 0}
.chart h4{font:400 var(--fs-label)/1.4 var(--mono);letter-spacing:.04em;color:var(--ink-2);margin:0 0 var(--s3) 2px}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart .lg{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 4px 2px;font:400 var(--fs-xs) var(--sans);color:var(--muted)}
.chart .lg i{display:inline-block;width:14px;height:2px;vertical-align:3px;margin-right:5px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:820px){.grid2{grid-template-columns:1fr}}

/* 表格里的条 */
.ibar{display:inline-block;height:7px;border-radius:1px;background:var(--c1);opacity:.8;
  vertical-align:middle;min-width:1px}
.ibar.w{background:var(--c3)} .ibar.bad{background:var(--c4)} .ibar.d{background:var(--line-2)}

/* 视频瓦片 */
.vids{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:8px;margin:14px 0}
.vid{position:relative;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:#000;
  aspect-ratio:16/10}
.vid video{width:100%;height:100%;object-fit:cover;display:block;opacity:.9}
.vid figcaption{position:absolute;left:0;right:0;bottom:0;padding:5px 7px;font:400 10px/1.35 var(--mono);
  color:var(--ink);background:color-mix(in srgb,var(--bg) 94%,transparent);pointer-events:none}   /* solid band: text never sits on raw video */

/* 报告卡 */
.rcard{border:1px solid var(--line-2);border-radius:var(--r-md);background:
  radial-gradient(120% 100% at 0% 0%,color-mix(in srgb,var(--accent) 6%,transparent),transparent 60%),var(--deep-2);padding:16px;margin:14px 0}
.rcard .hd{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;justify-content:space-between}
.rcard .vin{font:600 17px/1.2 var(--mono);color:var(--c1);letter-spacing:.02em}
.rcard .sub{font:400 12px var(--sans);color:var(--ink-2);margin-top:3px}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:14px}
.kv div{background:var(--deep);padding:9px 10px}
.kv dt{font:400 var(--fs-xs) var(--sans);color:var(--muted)}
.kv dd{font:500 13px var(--sans);color:var(--ink);margin:4px 0 0}

/* ============================ Shadow pages inside the shell ============================ */
/* Shadow pages keep their own markup; body.rc-shadow maps their tokens onto Instrument's. */
body.rc-shadow{
  --bg:var(--void); --panel:var(--deep); --panel-2:var(--deep-2); --text:var(--ink); --faint:var(--muted);
  --human:var(--c1); --ghost:var(--c3); --hot:var(--c4); --accent:var(--c1);
  --font:var(--sans); --gutter:16px; --measure:68ch; color-scheme:dark;
  font-size:14px;line-height:1.6}
body.rc-shadow [hidden]{display:none!important}
body.rc-shadow main.wrap{max-width:1140px}
body.rc-shadow h1{font-size:clamp(24px,3.4vw,30px);line-height:1.2}
body.rc-shadow h2{margin:0;line-height:1.3}
body.rc-shadow p{max-width:var(--measure)}
body.rc-shadow .label{font:600 var(--fs-xs)/1.3 var(--sans);color:var(--muted)}
body.rc-shadow .num{font-family:var(--mono);font-variant-numeric:tabular-nums}
body.rc-shadow .row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
body.rc-shadow .stack{gap:14px}
body.rc-shadow section.block{display:flex;flex-direction:column;gap:14px;padding-block:28px;border-top:1px solid var(--line)}
body.rc-shadow .panel{border-radius:var(--r-md)}
body.rc-shadow .table-scroll{overflow-x:auto}
body.rc-shadow th,body.rc-shadow td{white-space:normal;vertical-align:top}
body.rc-shadow .pill{display:inline-block;padding:2px 8px;border-radius:var(--r-xs);font:600 10.5px/1.6 var(--mono);letter-spacing:.08em;
  border:1px solid var(--line-2);color:var(--muted);white-space:nowrap}
body.rc-shadow .pill.real{color:var(--c1);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
body.rc-shadow .pill.demo{color:var(--c3);border-color:color-mix(in srgb,var(--warn) 50%,transparent)}
body.rc-shadow .pill.block{color:var(--c4);border-color:color-mix(in srgb,var(--bad) 50%,transparent)}
body.rc-shadow .pill.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
body.rc-shadow main button:not(.pick),body.rc-shadow main .btn{font:600 13px/1 var(--disp);letter-spacing:.06em;padding:10px 15px;
  border-radius:var(--r-xs);cursor:pointer;background:var(--c1);color:var(--accent-ink);border:0;text-decoration:none;display:inline-block}
body.rc-shadow main button.secondary,body.rc-shadow main .btn.secondary{background:transparent;color:var(--ink);border:1px solid var(--line-2)}
body.rc-shadow input,body.rc-shadow select,body.rc-shadow textarea{font:14px/1.4 var(--sans);color:var(--ink);background:var(--deep-2);
  border:1px solid var(--line-2);border-radius:var(--r-xs);padding:9px 11px;width:100%}
body.rc-shadow input[type=checkbox],body.rc-shadow input[type=radio]{width:auto}
body.rc-shadow label.field{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--muted)}
body.rc-shadow .handoff{border:1px dashed color-mix(in srgb,var(--warn) 50%,transparent);border-radius:var(--r-md);background:color-mix(in srgb,var(--warn) 3%,transparent);padding:14px 16px;
  display:flex;flex-direction:column;gap:12px}
body.rc-shadow .handoff summary{cursor:pointer;color:var(--c3);font:600 13px/1.4 var(--disp);letter-spacing:.04em}
body.rc-shadow .handoff:not([open]){gap:0}
body.rc-shadow .handoff-wrap{margin-block:28px}
body.rc-shadow .handoff .cols{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
body.rc-shadow .handoff ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:13px}
body.rc-shadow .handoff .task{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:13px;padding:8px 0;border-top:1px solid var(--line)}
body.rc-shadow .handoff .task .who{color:var(--muted);font-size:12px;grid-column:2}
body.rc-shadow .site-foot{color:var(--muted);font-size:12px;padding-block:28px 40px;border-top:1px solid var(--line);margin-top:40px}

/* 六层:每层是 <details>,点开看组件 / 现状 / 往下看(总览页) */
details.layer{display:block;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
details.layer>summary{display:grid;grid-template-columns:56px 1fr auto;align-items:stretch;cursor:pointer;list-style:none}
details.layer>summary::-webkit-details-marker{display:none}
details.layer>summary:hover{background:color-mix(in srgb,var(--accent) 4%,transparent)}
details.layer .lst{align-self:center;margin-right:14px;font:500 10.5px/1.3 var(--mono);letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--line-2);border-radius:var(--r-xs);padding:3px 8px;white-space:nowrap}
details.layer .lst::after{content:"  +";color:var(--c1)}
details.layer[open] .lst::after{content:"  −"}
details.layer[open]{border-color:var(--line-2)}
details.layer.hi[open]{border-color:color-mix(in srgb,var(--accent) 42%,transparent)}
.lbody{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:14px 22px;padding:12px 16px 14px 72px;border-top:1px solid var(--line)}
.lh{font:600 var(--fs-xs)/1.3 var(--sans);color:var(--muted);margin-bottom:6px;display:flex;align-items:center;gap:6px}
.lt{width:100%;border-collapse:collapse;font-size:12.5px}
.lt td{padding:5px 8px 5px 0;border-bottom:1px solid var(--line);color:var(--ink-2);white-space:normal}
.lt td:nth-child(2){width:1%;white-space:nowrap}
.lt td.num{width:1%;white-space:nowrap;text-align:right;font-family:var(--mono);color:var(--ink)}
.lsum{margin-top:6px;font:500 11px/1.4 var(--mono);color:var(--c1)}
.lnow{margin:0;padding-left:16px;display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-2)}
.lgo{grid-column:1/-1;font-size:12.5px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.lgo .lh{margin:0}
@media(max-width:760px){
  details.layer>summary{grid-template-columns:44px 1fr}
  details.layer .lst{grid-column:2;justify-self:start;margin:0 0 10px 14px;white-space:normal}
  .lbody{grid-template-columns:1fr;padding:12px 14px}
}

/* ============================ /table · cell detail (2026-09-27) ============================ */
/* body column: arm + hand/gripper marks, monochrome-light like every other vendor mark */
.body-cell .cmp{display:flex;align-items:center;gap:5px;margin-bottom:4px;min-height:17px}
.body-cell .cmp img,.cd-id .cmp img{height:15px;width:auto;max-width:62px;object-fit:contain;filter:var(--logo-filter);opacity:.8}
.cmp-x{color:var(--muted);font:400 11px var(--sans)}
.cmp-t{font:600 11px/1 var(--sans);color:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-xs);padding:2px 5px}
/* panel */
.cd{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow);padding:var(--s5) var(--s5) var(--s3);margin:var(--s3) 0 var(--s6)}
.cd h3{font:600 17px/1.3 var(--sans);letter-spacing:-.01em;color:var(--ink);margin:var(--s6) 0 var(--s3)}
.cd-hd{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.cd-id{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.cd-id .cmp{display:flex;align-items:center;gap:5px}
.cd-id .cmp img{height:20px;max-width:80px}
.cd-t{font:600 19px/1.3 var(--sans);letter-spacing:-.01em;color:var(--ink)}
.cd-x{background:var(--bg-2);border:0;color:var(--ink-2);font:400 18px/1 var(--sans);width:32px;height:32px;border-radius:50%;cursor:pointer;flex:none}
.cd-x:hover,.cd-x:focus-visible{color:var(--ink);background:var(--track)}
.cd-ro{margin:12px 0 4px}
.cd-ro .rs{display:block;font-size:var(--fs-xs);color:var(--muted);margin-top:2px}
.cd-ok{margin:0 0 var(--s2);font-size:var(--fs-xs);color:var(--ok)}
.cd .grid2{margin-top:6px}
/* decomposition */
.dc{background:var(--surface-2);border-radius:var(--r-md);padding:var(--s3) var(--s3) var(--s1);min-width:0}
.dc-h{font:600 var(--fs-sm) var(--sans);color:var(--ink);margin-bottom:var(--s2)}
.dc-bar{position:relative;display:flex;height:14px;background:var(--track);border-radius:3px;overflow:visible;
  background-image:linear-gradient(90deg,transparent calc(50% - .5px),var(--line-2) calc(50% - .5px),var(--line-2) calc(50% + .5px),transparent calc(50% + .5px))}
.dc-bar i{display:block;height:100%;border-right:1px solid var(--surface-2)}
.dc-bar b{position:absolute;top:-3px;bottom:-3px;width:0;border-left:1px solid var(--ink)}
.dc-scale{display:flex;justify-content:space-between;font:400 11px var(--sans);color:var(--muted);margin:2px 0 6px}
.dc-t{margin:0 0 6px;border:0;background:none}
.dc-t th,.dc-t td{padding:5px 6px;font-size:12px;background:none}
.dc-t thead th{background:none;font-size:11px}
.sw{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;vertical-align:0}
/* drill-down tree: label | interval bar | n | success | attempt — one shared 0–100% scale */
.cd-tree{border:1px solid var(--line);border-radius:var(--r-md)}
.cd-r{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(120px,1fr) 42px 92px 92px;gap:10px;align-items:center;
  padding:6px 10px;border-bottom:1px solid var(--line);font-size:12px}
.cd-r.hd{font:600 11px var(--sans);color:var(--muted);background:var(--surface-2)}
.cd-r.l1 .cd-l{padding-left:16px} .cd-r.l2 .cd-l{padding-left:32px}
.cd-r.l0{background:var(--surface)}
.cd-r.thin>.c-n,.cd-r.thin .cd-l,.cd-r.thin .cd-lf,.cd-r.thin .cd-tt,.cd-r.thin .cd-tg{color:var(--muted)}
.cd-r.hit{box-shadow:inset 2px 0 0 var(--c1);background:color-mix(in srgb,var(--accent) 7%,transparent)}
.cd-l{min-width:0;display:flex;align-items:center;gap:7px}
.cd-tg{background:none;border:0;color:var(--ink);font:inherit;cursor:pointer;display:flex;align-items:center;gap:7px;padding:2px 0;text-align:left;min-width:0}
.cd-tg:hover,.cd-tg:focus-visible{color:var(--c1)}
.rc-chev{width:6px;height:6px;border-right:1px solid var(--c1);border-bottom:1px solid var(--c1);transform:rotate(-45deg);transition:transform .15s;flex:none}
.cd-tg[aria-expanded="true"] .rc-chev{transform:rotate(45deg)}
.cd-lf,.cd-tt{color:var(--ink-2);min-width:0}
.cd-tt code{font-size:10.5px}
.c-n,.c-s,.c-a{font:400 12px var(--mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink)}
.c-n{color:var(--ink-2)}
.c-s small,.c-a small{display:block;font-size:11px;color:var(--muted)}
.c-a{color:var(--c2)}
.cd-r.hd .c-n,.cd-r.hd .c-s,.cd-r.hd .c-a{font:600 11px var(--sans);color:var(--muted)}
.cib{position:relative;display:block;height:14px;background:var(--track);border-radius:3px;
  background-image:linear-gradient(90deg,transparent calc(25% - .5px),var(--line) calc(25% - .5px),var(--line) calc(25% + .5px),transparent calc(25% + .5px),
    transparent calc(50% - .5px),var(--line-2) calc(50% - .5px),var(--line-2) calc(50% + .5px),transparent calc(50% + .5px),
    transparent calc(75% - .5px),var(--line) calc(75% - .5px),var(--line) calc(75% + .5px),transparent calc(75% + .5px))}
.cib.na{opacity:.35}
.cib.sc{background:none;display:flex;justify-content:space-between;font:400 11px var(--sans);height:auto}
.cib i{position:absolute}
.cib .rf{top:-2px;bottom:-2px;border-left:1px dashed var(--muted)}
.cib .wh{top:6px;height:2px;background:var(--c1)}
.cib .wh::before,.cib .wh::after{content:"";position:absolute;top:-3px;height:8px;border-left:1px solid var(--c1)}
.cib .wh::before{left:0} .cib .wh::after{right:0}
.cib .pt{top:3px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--c1);box-shadow:0 0 0 2px var(--surface)}
/* reference footage inside task rows */
.cd-th{position:relative;flex:none;width:52px;height:32px;padding:0;border:1px solid var(--line-2);border-radius:var(--r-xs);background:var(--shadow-c);cursor:pointer;overflow:hidden}
.cd-th img{width:100%;height:100%;object-fit:cover;display:block;opacity:.8}
.cd-th .pl{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;display:grid;place-items:center;font-size:8px;color:var(--bg);background:color-mix(in srgb,var(--ink) 78%,transparent)}
.cd-th:hover,.cd-th:focus-visible{border-color:var(--c1)}
.cd-v{padding:8px 10px 8px 42px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.cd-v video{width:100%;max-width:420px;aspect-ratio:16/10;background:var(--shadow-c);display:block;border-radius:var(--r-md)}
.cd-v p{margin:6px 0 0;font:400 var(--fs-xs) var(--sans);color:var(--warn)}
.cd-media{margin:var(--s2) 0 0;font-size:var(--fs-xs)}
/* failure mix */
.fm-r{display:grid;grid-template-columns:minmax(0,220px) 1fr 34px;gap:9px;align-items:center;margin:4px 0}
.fm-l{font:400 12px var(--sans);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-l code{font-size:11px;color:var(--muted);background:none;border:0;padding:0}
.fm-b{height:9px;background:var(--track);border-radius:3px;overflow:hidden;display:block}
.fm-b i{display:block;height:100%;background:var(--bad)}
.fm-v{font:500 11px var(--mono);color:var(--ink);text-align:right}
.fm-sep{margin:var(--s4) 0 var(--s1);padding-top:var(--s2);border-top:1px solid var(--line);font:600 var(--fs-xs) var(--sans);color:var(--warn)}
.fm-r.non .fm-b i{background:var(--muted)}
.fm-r.non .fm-l{color:var(--muted)}
@media(max-width:700px){
  .cd-r{grid-template-columns:minmax(0,1fr) 34px 78px 70px;gap:6px}
  .cd-r>.cib{grid-column:1/-1;order:5}
  .cd-r.hd>.cib{display:none}
  .cd-r.l1 .cd-l{padding-left:10px} .cd-r.l2 .cd-l{padding-left:20px}
  .cd-v{padding-left:10px}
  .fm-r{grid-template-columns:minmax(0,130px) 1fr 30px}
}
/* phone: the panel becomes a full-width sheet */
@media(max-width:620px){
  .cd{position:fixed;left:0;right:0;bottom:0;top:0;z-index:90;margin:0;border-radius:0;border-left:0;border-right:0;
    overflow-y:auto;overscroll-behavior:contain;padding:12px 16px 20px;box-shadow:0 -12px 40px color-mix(in srgb,var(--shadow-c) 60%,transparent)}
  body.cd-open{overflow:hidden}
  .cd-ro{grid-template-columns:repeat(2,1fr)}
}
/* run card → its task's reference footage in the table (the clip is not this run's recording) */
.feed .card .cref{display:flex;align-items:center;gap:7px;margin-top:7px;padding-top:7px;border-top:1px solid var(--line);
  font:400 10px var(--mono);color:var(--c1);text-decoration:none}
.feed .card .cref img{width:44px;height:28px;object-fit:cover;border:1px solid var(--line-2);border-radius:var(--r-xs);opacity:.75;flex:none}
.feed .card .cref:hover,.feed .card .cref:focus-visible{color:var(--ink)}
/* homepage reference wall: grouped by setting › environment, each tile opens its task row on /table */
.vwall .vgs{display:flex;flex-wrap:wrap;gap:6px 18px}
.vwall .vg{margin:10px 0 0;flex:0 1 auto;min-width:0;max-width:100%}
.vwall .vg .vids{display:flex;flex-wrap:wrap}
.vwall .vg .vid{width:148px;flex:none}
@media(max-width:620px){.vwall .vg{flex:1 1 100%}.vwall .vg .vid{width:calc(50% - 4px)}}
.vwall h4{font:600 var(--fs-xs) var(--sans);color:var(--ink-2);margin:0}
.vwall .vids{margin:8px 0}
a.vid{display:block;text-decoration:none}
a.vid:hover,a.vid:focus-visible{border-color:var(--c1)}
.vid .vv{display:block;color:var(--c3);font-size:9.5px;margin-top:2px}
/* breakdown rows with n < 40: estimate + interval still drawn, greyed and marked not citable */
.nc{display:block;font:500 11px var(--sans);color:var(--warn);white-space:nowrap}
.cd-r.thin .c-s,.cd-r.thin .c-a{color:var(--muted)}
.cib.thin .pt{background:var(--muted)}
.cib.thin .wh{background:var(--muted)}
.cib.thin .wh::before,.cib.thin .wh::after{border-color:var(--muted)}
.dc-t td.thin{color:var(--muted)}
/* reference-clip verdicts: green only for success_met */
.v-ok{color:var(--ok)!important} .v-low{color:var(--c3)!important} .v-und{color:var(--ink-2)!important} .v-bad{color:var(--c4)!important}
/* failure mix: namespace roll-up, top-N bars, the rest behind an in-place toggle, Σ over the whole group */
.fm-ns{display:flex;flex-wrap:wrap;gap:5px;margin:2px 0 8px}
.fm-more{background:var(--bg-2);border:0;color:var(--accent);font:500 var(--fs-xs) var(--sans);padding:6px 12px;border-radius:var(--r-pill);cursor:pointer;margin:var(--s1) 0}
.fm-more:hover,.fm-more:focus-visible{background:var(--track)}
.fm-sum{font:400 11px var(--mono);color:var(--muted);text-align:right;margin:2px 0 4px}
/* panel headline follows the table's success/attempt toggle; the other rate stays visible, never merged */
.cd-ro .em{box-shadow:inset 0 3px 0 var(--accent)}
.cd-ro .em .rv{color:var(--accent)}
tr.sum td .n{display:block;font-size:11px;color:var(--muted);font-weight:400}
/* body panel (click a BODY cell): composition by RCSN unit + policy × setting / horizon matrices */
td.body-cell[role="button"]{cursor:pointer}
td.body-cell[role="button"]:hover,td.body-cell[role="button"]:focus-visible{background:var(--bg-2);outline:none}
td.body-cell.sel{box-shadow:inset 2px 0 0 var(--c1)}
.bp-u{margin:0 0 6px}
.bp-u td,.bp-u th{font-size:11.5px}
.bp-u code{font-size:10.5px}
.bp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
@media(max-width:980px){.bp-grid{grid-template-columns:1fr}}
.bp-m{margin:0;border:0;background:none}
.bp-m th,.bp-m td{padding:5px 7px;font-size:11px;white-space:nowrap}
.bp-m tbody th{font:600 12px var(--sans);color:var(--ink-2);text-align:left;background:none;text-transform:none;letter-spacing:0}
td.bm{font-family:var(--mono);text-align:right;vertical-align:top;color:var(--ink)}
td.bm b{font-weight:500;display:block}
td.bm small{display:block;font-size:11px;color:var(--muted)}
td.bm small.att{color:var(--c2)}
td.bm.thin b,td.bm.thin small.att{color:var(--muted)}
td.bm.na{color:var(--muted);text-align:center}
td.bm[role="button"]{cursor:pointer}
td.bm[role="button"]:hover,td.bm[role="button"]:focus-visible{background:var(--bg-2);outline:1px solid var(--accent);outline-offset:-1px}
#ppUnits tr.hit td{background:color-mix(in srgb,var(--accent) 9%,transparent);box-shadow:inset 0 1px 0 var(--c1),inset 0 -1px 0 var(--c1)}
.rl .lc{text-transform:none}
/* ledger identity labels: full-opacity accent (the v1 .8 opacity fell under 4.5:1 on light) */
.idents .ik{opacity:1;font:600 12px var(--sans);letter-spacing:0;color:var(--accent)}
/* body-panel matrix totals sit on the same surface as the cells so muted/attempt text keeps AA */
.bp-m tr.sum td,.bp-m tr.sum th{background:var(--surface-2)}

/* inline SVG text uses the UI face; numbers stay tabular */
.fig svg text,.chart svg text{font-family:var(--sans);font-variant-numeric:tabular-nums}
