/* DialedRE design tokens (DESIGN 13.2). Lifted verbatim from design/prototype/index.html. */
/* ============ 13.2 tokens: holographic HUD ============ */
:root{
  --bg0:#0B0B0D; --bg1:#0E0E11; --bg2:rgba(20,20,23,.82); --bg3:rgba(26,26,30,.86); --bg4:#222227;
  --line1:rgba(212,180,131,.14); --line2:rgba(212,180,131,.28); --line3:rgba(212,180,131,.5);
  --hi:inset 0 1px 0 rgba(212,180,131,.08);
  --text1:#F3F1EC; --text2:#A8A49B; --text3:#8E8A82;
  --accent:#D4B483; --accent2:#8A7A5C; --accent-ink:#16130D; --accent-soft:rgba(212,180,131,.12); --accent-glow:0 0 0 2px rgba(212,180,131,.35),0 0 18px rgba(212,180,131,.35);
  --glow:0 0 12px rgba(212,180,131,.45),0 0 32px rgba(212,180,131,.18);
  --gold:#E6B45A; --gold-soft:rgba(230,180,90,.14);
  --hot:#E0705F; --hot-soft:rgba(224,112,95,.16);
  --amber:#E6B45A; --amber-soft:rgba(230,180,90,.14);
  --sand:#B9B1A0;
  --danger:#E0705F; --danger-soft:rgba(224,112,95,.16);
  --info:#7FC8D2; --cy:#5FC8D4; --cy-soft:rgba(95,200,212,.14); --ok:#8FC99A; --ok-soft:rgba(143,201,154,.14); --info-soft:rgba(127,200,210,.14);
  --sig-fc:#FFC98A; --sig-cv:#C8F07A; --sig-tx:#FFB08A; --sig-pr:#7FC8D2; --sig-ev:#FF9C9C;
  --sans:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --serif:"Sora","Montserrat",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --fs-1:11px; --fs-2:12px; --fs-3:13px; --fs-4:14px; --fs-5:16px; --fs-6:20px; --fs-7:28px; --fs-h:32px; --fs-hero:44px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px; --s12:48px;
  --r1:4px; --r2:6px; --r3:8px; --r4:10px; --r-pill:999px;
  --cut:10px;
  --sh1:0 1px 2px rgba(0,0,0,.5);
  --sh2:0 12px 32px -12px rgba(0,0,0,.8),0 0 24px -8px rgba(212,180,131,.25);
  --sh3:0 40px 80px -32px rgba(0,0,0,.9),0 0 60px -20px rgba(212,180,131,.35);
  --glass:rgba(11,11,13,.72);
  --t1:120ms; --t2:180ms; --t3:260ms;
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.4,.64,1);
  --gutter:32px;
}
@media (prefers-reduced-motion:reduce){
  :root{--t1:0ms;--t2:0ms;--t3:0ms}
  *,*::before,*::after{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg0);color:var(--text1);font-family:var(--sans);font-size:var(--fs-4);line-height:1.45;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0;margin:0}
b,strong{font-weight:600}
h1,h2,h3,h4,h5{margin:0;font-weight:600}
svg{display:inline-block;vertical-align:middle}
.num,.money,.clock,td,.kpi,[data-count]{font-variant-numeric:tabular-nums}
.num,.money,.clock,.xs.num{font-family:var(--mono);font-size:.95em}
.serif{font-family:var(--serif);font-weight:600;letter-spacing:.01em}
:focus-visible{outline:0;box-shadow:var(--accent-glow)}
::selection{background:rgba(212,180,131,.35)}
.cut{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}

/* background canvas + vignette */
#bgfx{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.vignette{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 0%,rgba(212,180,131,.07),transparent 55%),radial-gradient(90% 70% at 50% 100%,rgba(0,0,0,.6),transparent 60%),radial-gradient(140% 100% at 50% 50%,transparent 55%,rgba(0,0,0,.65) 100%)}
.app,.bottombar,.pal-bg,.toast,.more-menu{position:relative;z-index:1}

