/* tokens:begin */
/* Design tokens: the only place a colour literal may stand (docs/DESIGN.md, scripts/check_design.py).
   docs/design-tokens.json lists the same names; a test holds the two together. */
:root{
  --bg:#111310;--bg2:#181a16;--bg3:#1f221c;--border:#2c3028;
  --text:#d4d9cc;--text-dim:#808c78;--text-muted:#3e4439;
  --danger:#c46e6e;--ok:#7fb069;--warn:#d9b44a;--white:#fff;
  --swatch-forest:#a3c46e;--swatch-amber:#c9a84c;--swatch-ocean:#6ea3c4;--swatch-rose:#c46e9a;--swatch-mono:#8a9080;
  --accent:var(--swatch-forest);--accent-light:#c5e090;--accent-dim:#6b8f48;--on-fill:var(--bg);
  --accent-muted:#3d5228;--accent-warm:var(--swatch-amber);
  --toast-ok:#b7d99b;--toast-bad:#e0a09a;--toast-warn:#e9c46a;--toast-ink:#1a1c18;
  --warn-wash:rgba(233,196,106,.16);--danger-wash:rgba(220,80,70,.12);--danger-wash-soft:rgba(196,110,110,.08);
  --select-bg:rgba(163,196,110,.15);--select-bg-focus:rgba(163,196,110,.2);
  --ink-35:rgba(0,0,0,.35);--ink-40:rgba(0,0,0,.4);--ink-45:rgba(0,0,0,.45);--ink-50:rgba(0,0,0,.5);--ink-55:rgba(0,0,0,.55);
  --ink-60:rgba(0,0,0,.6);--ink-70:rgba(0,0,0,.7);--ink-72:rgba(0,0,0,.72);
  --git-clean:#65B8A6;--git-untracked:#83B7E8;--git-modified:#C6A5DC;--git-staged:#A3C4CE;--git-unpushed:#E3A77B;
  --git-behind:#8EA8E8;--git-unmerged:#C0A0E4;--git-pr:#7BCAC4;--git-diverged:#D6A3B4;--git-conflict:#DA998E;
  --git-no-upstream:#A0AAB8;--git-unknown:#8995A7;
  --logo-r:#94A3B8;
  --flag-de-black:#000;--flag-de-red:#d00;--flag-de-gold:#ffce00;--flag-us-red:#b22234;--flag-us-white:#fff;--flag-us-blue:#3c3b6e;
  --sidebar-w:260px;--header-h:48px;--toolbar-h:40px;--status-h:26px;--hit-min:24px;
  --font-ui:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;--font-prose:"Bitter",Georgia,serif;
  --fs-2xs:10px;--fs-xs:11px;--fs-sm:12px;--fs-md:13px;--fs-lg:14px;--fs-xl:16px;--fs-2xl:18px;--fs-3xl:20px;--fs-4xl:24px;--fs-display:42px;
  --radius-xs:3px;--radius-sm:4px;--radius:6px;--radius-md:8px;--radius-lg:10px;--radius-xl:12px;--radius-pill:999px;
  --trans:160ms ease;--trans-slow:300ms ease;--trans-glide:700ms cubic-bezier(.2,.8,.2,1);
  --z-search:10;--z-local-menu:20;--z-hint:30;--z-backdrop:40;--z-sidebar:50;--z-moverlay:100;--z-popup-backdrop:199;--z-popup:200;
  --z-dialog:300;--z-dialog-sub:305;--z-dialog-menu:310;--z-dialog-over:320;--z-dialog-top:330;--z-toast:400;--z-toast-top:420;--z-menu:1000;
}
/* Light mode */
body.light{
  --bg:#f5f6f2;--bg2:#edeee9;--bg3:#e0e2db;--border:#cdd0c7;
  --text:#1a1c18;--text-dim:#555;--text-muted:#999;--accent-muted:#d4eab8;
  --accent:#536b2c;--accent-light:#536b2c;--accent-dim:#3c4d1f;--on-fill:var(--white);
  --danger:#a64343;--ok:#496d39;--warn:#786019;--accent-warm:#7a5c10;
  --logo-r:#CBD5E1;
}
/* Accent schemes */
body.accent-amber{--accent:var(--swatch-amber);--accent-light:#e8c97a;--accent-dim:#9e7e30;--accent-muted:#4a3a10;--accent-warm:#c46e6e}
body.accent-ocean{--accent:var(--swatch-ocean);--accent-light:#9dc5de;--accent-dim:#4788b9;--accent-muted:#1a3d55;--accent-warm:var(--swatch-amber)}
body.accent-rose {--accent:var(--swatch-rose);--accent-light:#e09cc0;--accent-dim:#be6498;--accent-muted:#4a1530;--accent-warm:var(--swatch-amber)}
body.accent-mono {--accent:var(--swatch-mono);--accent-light:#b0b8a8;--accent-dim:#7d856f;--accent-muted:#2a3025;--accent-warm:#a09880}
body.light.accent-amber{--accent:#776124;--accent-light:#776124;--accent-dim:#55461a;--accent-muted:#f5e8c0;--accent-warm:#9a3b3b}
body.light.accent-ocean{--accent:#376887;--accent-light:#356482;--accent-dim:#274b61;--accent-muted:#c0dff0;--accent-warm:#7a5c10}
body.light.accent-rose {--accent:#a04172;--accent-light:#8e3a65;--accent-dim:#742f52;--accent-muted:#f5c0da;--accent-warm:#7a5c10}
body.light.accent-mono {--accent:#606558;--accent-light:#595d52;--accent-dim:#464940;--accent-muted:#d0d8c8;--accent-warm:#6d6446}
.uv-screen[data-accent=forest]{--accent:var(--swatch-forest);--accent-light:#c5e090}
.uv-screen[data-accent=amber]{--accent:var(--swatch-amber);--accent-light:#e8c97a}
.uv-screen[data-accent=ocean]{--accent:var(--swatch-ocean);--accent-light:#9dc5de}
.uv-screen[data-accent=rose]{--accent:var(--swatch-rose);--accent-light:#e09cc0}
.uv-screen[data-accent=mono]{--accent:var(--swatch-mono);--accent-light:#b0b8a8}
body.light .uv-screen[data-accent=forest]{--accent:#536b2c;--accent-light:#536b2c}
body.light .uv-screen[data-accent=amber]{--accent:#776124;--accent-light:#776124}
body.light .uv-screen[data-accent=ocean]{--accent:#376887;--accent-light:#356482}
body.light .uv-screen[data-accent=rose]{--accent:#a04172;--accent-light:#8e3a65}
body.light .uv-screen[data-accent=mono]{--accent:#606558;--accent-light:#595d52}
/* tokens:end */
/* parts:begin */
.mfui-btn{background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font:inherit;font-size:var(--fs-sm);padding:6px 12px;cursor:pointer}
.mfui-btn:hover{border-color:var(--text-dim)}
.mfui-btn[disabled]{opacity:.45;cursor:not-allowed}
.mfui-btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-fill);font-weight:500}
.mfui-btn-danger{border-color:var(--danger);color:var(--danger)}
.mfui-btn-sm{padding:2px 8px;font-size:var(--fs-xs)}
.mfui-input{background:var(--bg3);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font:inherit;font-size:var(--fs-md)}
.mfui-input:focus{border-color:var(--accent);outline:none}
.mfui-badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-lg);font-size:var(--fs-2xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;background:var(--bg2);border:1px solid var(--border);color:var(--text-dim);white-space:nowrap}
.mfui-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg3);padding:10px 12px}
.mfui-flag{display:inline-block;width:18px;height:13px;flex-shrink:0;overflow:hidden;border-radius:var(--radius-xs);box-shadow:0 0 0 1px var(--border);vertical-align:-2px}
.mfui-flag-svg{display:block;width:100%;height:100%}
.accent-picker{display:flex;align-items:center;gap:6px}
.ac-swatch{width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all var(--trans);flex-shrink:0}
.ac-swatch:hover{transform:scale(1.2)}
.ac-swatch.active{border-color:var(--text);transform:scale(1.15)}
.ac-swatch[data-accent=forest]{background:var(--swatch-forest)}.ac-swatch[data-accent=amber]{background:var(--swatch-amber)}.ac-swatch[data-accent=ocean]{background:var(--swatch-ocean)}.ac-swatch[data-accent=rose]{background:var(--swatch-rose)}.ac-swatch[data-accent=mono]{background:var(--swatch-mono)}
.mfui-doclink{display:inline-flex;align-items:center;gap:4px;margin-right:auto;min-height:var(--hit-min);padding:2px 8px;border-radius:var(--radius-md);font-size:var(--fs-xs);font-weight:500;color:var(--text-dim);text-decoration:none;white-space:nowrap;transition:color var(--trans)}
.mfui-doclink:hover,.mfui-doclink:focus-visible{color:var(--accent)}
.mfui-doclink-ico{width:14px;height:14px;flex-shrink:0}
.st-sec-head .mfui-doclink{margin-right:0}
@media (max-width:480px){.mfui-doclink-text{display:none}}
.mfui-section-title{margin:0;font-size:var(--fs-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim)}
.mfui-chip{padding:2px 10px;border-radius:var(--radius-md);background:var(--accent);color:var(--on-fill);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mfui-menu{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-md);padding:6px;box-shadow:0 12px 40px var(--ink-60)}
.mfui-menu-item{background:none;border:0;color:var(--text);font:inherit;font-size:var(--fs-md);padding:8px 10px;border-radius:var(--radius);cursor:pointer}
.mfui-icon-btn{background:none;border:0;color:var(--text-dim);cursor:pointer;padding:0 2px;align-items:center;justify-content:center;min-width:var(--hit-min);min-height:var(--hit-min);margin-block:-6px}
.set-embed .mfui-box{width:auto;max-width:none;max-height:none;border:0;box-shadow:none;background:none;padding:0}
.mfui-section-head{display:flex;align-items:center;gap:6px;padding:8px 20px 8px 10px;font-size:var(--fs-xs);font-weight:500;color:var(--text-dim);letter-spacing:.04em}
.mfui-section-head-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-md);font-weight:700;color:var(--accent);letter-spacing:.02em}
.mfui-digits{display:flex;gap:6px;justify-content:space-between}
.mfui-digit{flex:1 1 0;min-width:0;max-width:52px;height:50px;padding:0;text-align:center;font:600 var(--fs-3xl)/1 var(--font-mono);caret-color:transparent}
.mfui-digit.mfui-digit-filled{border-color:var(--accent)}
.mfui-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.mfui-foot-split{justify-content:space-between;align-items:center;flex-wrap:wrap}
.mfui-alert{margin:0 0 12px;padding:10px 12px;border:1px solid var(--danger);border-radius:var(--radius-md);color:var(--danger);font-size:var(--fs-md)}
.mfui-alert-info{border-color:var(--accent);color:var(--accent)}
.mfui-alert-ok{border-color:var(--ok);color:var(--ok)}
/* the scrollbar: one slim bar for every scroll area, in the accent of the surface it is on: the screen's own accent in the room,
   the page's accent elsewhere, the fallback (ocean) where none is set; a hover takes the full accent */
*::-webkit-scrollbar{width:4px;height:4px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent,var(--swatch-ocean)) 65%,transparent);border-radius:var(--radius-xs)}
*::-webkit-scrollbar-thumb:hover{background:var(--accent,var(--swatch-ocean))}
@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent,var(--swatch-ocean)) 65%,transparent) transparent}}
/* parts:end */
