/* =====================================================================
   Neon dark theme: near-black surfaces, one mint neon for actions,
   cyan / violet / magenta as card accents. Glow only on things you can act on.
   Loaded after app.css.
   ===================================================================== */
:root{
  --bg:#06080F;
  --surface:#0E1322;
  --surface2:#161C31;
  --counter:#06080F;
  --well:#0A0E1B;
  --ink:#ECF1FF;
  --ink-2:#9AA6C7;
  --line:rgba(160,180,255,.14);
  --neon:#2BFFC6;
  --cyan:#22E4FF;
  --violet:#8B6BFF;
  --magenta:#FF4FD8;
  --peri:#22E4FF;
  --amber:#FF4FD8;
  --navy:#8B6BFF;
  --white:#0E1322;
  --glow:0 0 22px -4px rgba(43,255,198,.55);
  --shadow:0 0 0 1px var(--line),0 10px 24px -14px rgba(0,0,0,.8);
  --shadow-up:0 0 0 1px var(--line),0 16px 34px -16px rgba(0,0,0,.9);
}
html{background:#02030A;color-scheme:dark;scrollbar-color:#2A3358 #02030A}
body{background:var(--bg);color:var(--ink);box-shadow:0 0 0 1px rgba(160,180,255,.1),0 0 90px rgba(34,228,255,.08)}
::-webkit-scrollbar-thumb{background:#2A3358;border-color:#02030A}
::-webkit-scrollbar-track{background:#02030A}
::selection{background:var(--neon);color:#04110D}
:focus-visible{outline-color:var(--neon)}
.bar{background:rgba(6,8,15,.86);box-shadow:0 .5px 0 var(--line)}
.bar__back{color:var(--ink)}
.bar__back:active{background:rgba(255,255,255,.08)}

/* stocks become dark panels with a neon edge */
.st-peri{--stock:var(--surface);--stock-ink:var(--ink);--fine:var(--ink-2);--accent:var(--cyan);--g1:rgba(34,228,255,.06);--g2:transparent}
.st-amber{--stock:var(--surface);--stock-ink:var(--ink);--fine:var(--ink-2);--accent:var(--magenta);--g1:rgba(255,79,216,.06);--g2:transparent}
.st-navy{--stock:var(--surface);--stock-ink:var(--ink);--fine:var(--ink-2);--accent:var(--violet);--g1:rgba(139,107,255,.08);--g2:transparent}
.st-white{--stock:var(--surface);--stock-ink:var(--ink);--fine:var(--ink-2);--accent:var(--neon);--g1:rgba(43,255,198,.05);--g2:transparent}
.mrow--peri{--accent:var(--cyan)}
.mrow--amber{--accent:var(--magenta)}
.mrow--navy{--accent:var(--violet)}
.mrow--white{--accent:var(--neon)}
.mrow--peri,.mrow--amber,.mrow--navy,.mrow--white{--stock-ink:var(--ink);--fine:var(--ink-2)}
.pack,.ticket,.soon,.counter__in,.denom,.mrow{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#2BFFC6) 42%,transparent),0 12px 28px -18px color-mix(in srgb,var(--accent,#2BFFC6) 60%,#000)}
.denom.st-peri,.denom.st-amber{background:var(--surface);color:var(--ink)}
.denom__amt{color:var(--accent)}
.pack__n{color:var(--accent)}
.back,.care__card,.detail,.card--big,#buildCard{background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 14px 30px -18px #000}

/* home hero: the one glowing surface */
#houseCard{background:#0B1022;color:var(--ink);box-shadow:0 0 0 1px rgba(34,228,255,.4),0 0 44px -10px rgba(34,228,255,.5),0 18px 40px -20px #000}
#houseCard::before{display:block!important;content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background-image:radial-gradient(120% 70% at 85% -10%,rgba(139,107,255,.32),transparent 60%),radial-gradient(90% 60% at 0% 110%,rgba(34,228,255,.18),transparent 60%)}
#houseCard .holo{background:#fff}
#houseCard .holo svg{color:#06080F;--door:var(--cyan)}
#houseCard .card__title{text-shadow:0 0 28px rgba(34,228,255,.35)}
#houseCard .kind{background:rgba(160,180,255,.08);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
#houseCard .kind:hover,#houseCard .kind:focus-visible,#houseCard .kind:active{background:var(--neon);color:#04110D;box-shadow:var(--glow)}
#houseCard .card__fine{color:var(--ink-2)}

/* actions */
.tk--amber{background:var(--neon);color:#04110D;box-shadow:var(--glow)}
.tk--amber:hover{background:#6BFFD9}
.tk--ink{background:var(--surface2);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.tk--ink:hover{background:#1E2644}
.tk--line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px rgba(160,180,255,.3)}
.tk--line:hover{background:rgba(160,180,255,.08)}
.lnk{color:var(--neon)}
.tab,.kind,.opt,.base{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.tab:hover{background:var(--surface2)}
.tab[aria-pressed="true"],.tab.is-on,.opt[aria-pressed="true"],.base[aria-pressed="true"]{background:var(--neon);color:#04110D;box-shadow:var(--glow)}
.prog i{background:rgba(160,180,255,.18)}
.prog i.on{background:var(--neon);box-shadow:0 0 8px rgba(43,255,198,.6)}
.field{border-top-color:var(--line)}
.fld input,.fld textarea{border-bottom-color:rgba(160,180,255,.4);color:var(--ink)}
.fld input::placeholder,.fld textarea::placeholder{color:rgba(154,166,199,.7)}
.fld input:focus,.fld textarea:focus{box-shadow:0 1.5px 0 var(--neon);border-bottom-color:var(--neon)}
.err{background:rgba(255,79,216,.14);color:#FFD3F4;box-shadow:inset 0 0 0 1px rgba(255,79,216,.5)}
.sent .ref{color:var(--neon)}

/* tab bar */
.tabs{background:rgba(8,11,22,.9);box-shadow:0 -.5px 0 var(--line)}
.tabs__i,.tabs__go{color:#7C88AD}
.tabs__i[aria-current="page"]{color:var(--neon)}
.tabs__i[aria-current="page"] svg{filter:drop-shadow(0 0 6px rgba(43,255,198,.75))}
.tabs__go{color:var(--ink)}
.tabs__go svg{background:var(--neon);color:#04110D;box-shadow:0 0 0 4px var(--bg),0 0 22px rgba(43,255,198,.6)}
.dot,.tabs .dot{background:var(--magenta);box-shadow:0 0 0 2px #080B16,0 0 8px var(--magenta)}
.wabar{box-shadow:0 0 22px -2px rgba(37,211,102,.6),0 8px 18px -6px #000}

/* build cards */
.sc{background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 12px 26px -16px #000;transition:transform .15s,box-shadow .2s}
.sc:hover{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent,#2BFFC6) 60%,transparent),0 0 24px -8px var(--accent,#2BFFC6)!important}
.sc .win,.win{background:#0A0E1B}
.sc__meta p{color:var(--ink-2)}
.sc__stub a{color:var(--ink)}
.sc__stub span{background:rgba(43,255,198,.1);color:var(--neon)}
.win__live{background:#06080F;color:var(--neon);box-shadow:inset 0 0 0 1px var(--neon),0 0 10px rgba(43,255,198,.4)}
.sc--blank{border-color:rgba(160,180,255,.3);background:transparent;box-shadow:none}
.sc--blank:hover{background:rgba(160,180,255,.05);border-color:var(--neon);box-shadow:none!important}
.sc--blank .sc__stub span{background:none;color:var(--neon)}
.steps li::before{background:var(--surface2);color:var(--neon)}
.deck__hd h2,.pagehd h1{color:var(--ink)}
.stamp--soon{background:var(--bg);color:var(--ink)}

/* menu, sheets, chat, toast */
.menu__scrim,.sheet__scrim{background:rgba(2,3,10,.7)}
.menu__panel{background:var(--bg)}
.msearch,.xbtn{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink)}
.msearch:focus-within{box-shadow:inset 0 0 0 1.5px var(--neon)}
.mrow{background:var(--surface);color:var(--ink)}
.mrow:hover,.mrow:focus-visible{background:var(--surface2)}
.mresults a{background:var(--surface)}
.sheet__panel{background:var(--surface);color:var(--ink);box-shadow:0 -24px 60px -20px #000,0 -1px 0 var(--line)}
.sheet__grab i{background:rgba(160,180,255,.3)}
.chat__input,.chat__name{background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.chat__input:focus,.chat__name:focus{box-shadow:inset 0 0 0 1.5px var(--neon)}
.chat__send{background:var(--neon);color:#04110D;box-shadow:var(--glow)}
.chat__status.on i{background:var(--neon);border-color:var(--neon)}
.msg--v{background:var(--neon);color:#04110D}
.msg--a{background:var(--surface2);color:var(--ink)}
.cartpill{background:var(--neon);color:#04110D;box-shadow:var(--glow)}
.toast{background:var(--surface2);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 10px 30px #000}
.plan{background:var(--surface2);color:var(--ink)}
.plan[aria-checked="true"]{box-shadow:inset 0 0 0 1.5px var(--neon),var(--glow)}