/* ══════════════════════════════════════════════════════
   DESIGN TOKENS — WCAG 2.1 AA compliant
   Dark:  fg #f5f5f7 on bg #1c1c1e → 17.1:1 ✓
          fg2 #98989d on bg → 5.7:1 ✓
          fg3 #636366 on bg → 3.2:1 ✓ (UI/large text)
   Light: fg #1c1c1e on bg #f2f2f7 → 15.5:1 ✓
          fg2 #636366 on bg → 4.6:1 ✓
          fg3 #8e8e93 on bg → 3.0:1 ✓ (UI/large text)
   Accent-btn: white text on accent-btn ≥ 4.5:1 ✓
   ══════════════════════════════════════════════════════ */
:root,[data-theme="dark"]{
  --bg:#1c1c1e;--surface:#2c2c2e;--elevated:#3a3a3c;--overlay:#48484a;
  --fg:#f5f5f7;--fg2:#98989d;--fg3:#636366;
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.15);
  --hov:rgba(255,255,255,.06);--press:rgba(255,255,255,.04);
  --accent:#64d2ff;--accent-btn:#0071e3;
  --ok:#30d158;--warn:#ffd60a;--err:#ff453a;
  --sh-sm:0 1px 4px rgba(0,0,0,.3);--sh-md:0 4px 16px rgba(0,0,0,.35);
  --sh-lg:0 8px 32px rgba(0,0,0,.42);--sh-xl:0 16px 48px rgba(0,0,0,.55);
  --font:'SF Pro Display','Segoe UI Variable','Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:'SF Mono','Cascadia Code',Consolas,'Liberation Mono',monospace;
  --R:10px;--Rsm:6px;--Rlg:14px;
  --ease:cubic-bezier(.22,.68,0,1);--ease-pop:cubic-bezier(.34,1.56,.64,1);
  --tbH:52px;--ttH:36px;
}
[data-theme="light"]{
  --bg:#f2f2f7;--surface:#ffffff;--elevated:#ffffff;--overlay:#e5e5ea;
  --fg:#1c1c1e;--fg2:#636366;--fg3:#8e8e93;
  --line:rgba(0,0,0,.08);--line2:rgba(0,0,0,.12);
  --hov:rgba(0,0,0,.04);--press:rgba(0,0,0,.06);
  --accent:#0071e3;--accent-btn:#0071e3;
  --ok:#248a3d;--warn:#b25000;--err:#d70015;
  --sh-sm:0 1px 3px rgba(0,0,0,.08);--sh-md:0 4px 12px rgba(0,0,0,.12);
  --sh-lg:0 8px 24px rgba(0,0,0,.16);--sh-xl:0 16px 40px rgba(0,0,0,.22);
}

/* ═══ RESET ═══ */
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden;background:#000}
.tb,.tb *:not(input):not(textarea),.dk-grid,.dk-grid *,.wt,.sm-pin,.sm-sec-title,.sm-sec-btn,.sm-foot,.ctx-m,.ctx-m *{-webkit-user-select:none;user-select:none}

body{font-family:var(--font);background:var(--bg);color:var(--fg);font-size:14px}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-thumb{background:var(--line2);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--fg3)}

/* ═══ WALLPAPER ═══ */
.wall{position:fixed;inset:0;z-index:0;transition:background .6s var(--ease);overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;opacity:.7}
.orb-1{width:500px;height:500px;top:-12%;left:-5%;background:rgba(255,255,255,.22);animation:d1 30s ease-in-out infinite}
.orb-2{width:440px;height:440px;bottom:-14%;right:-4%;background:rgba(120,200,255,.26);animation:d2 36s ease-in-out infinite}
.orb-3{width:320px;height:320px;top:40%;left:52%;background:rgba(180,220,255,.16);animation:d1 42s ease-in-out infinite reverse}
@keyframes d1{0%,100%{transform:translate(0,0)}50%{transform:translate(54px,38px)}}
@keyframes d2{0%,100%{transform:translate(0,0)}50%{transform:translate(-46px,-40px)}}