/* ===== v5 PIXEL STATION palette: navy / lavender / cyan / orange ===== */
:root{--bg:#090c18;--panel:#1c2036;--panel2:#262b45;--line:#3b4163;--txt:#e8eaf6;--mut:#9ea3bf;--acc:#4ff0ff;--ink:#141828;--g1:#4ff0ff;--g2:#2bb7d6;--g3:#176f8c}
body{background:#090c18}
.brand b{color:#4ff0ff}
.top{background:rgba(9,12,24,.96);border-bottom:2px solid #262b45}
#nav button{background:linear-gradient(#2a2f4a,#1c2036);border:2px solid #3b4163;color:#b7bbd3;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 0 #090c18}
#nav button.on{background:linear-gradient(#7ff6ff,#2bb7d6);border-color:#141828;color:#07202a;box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 3px 0 #176f8c}
.card,.skin,.tc,.sheet .it{background:linear-gradient(#262b45,#1c2036);border:2px solid #3b4163;box-shadow:0 5px 0 #090c18,0 10px 24px rgba(0,0,0,.4)}
.skin.on{border-color:#4ff0ff;box-shadow:0 0 0 3px #4ff0ff inset,0 5px 0 #090c18}.tc:hover{border-color:#4ff0ff}
.btn{background:linear-gradient(#3b4163,#262b45);border:2px solid #141828;box-shadow:inset 0 2px 0 rgba(255,255,255,.12),0 3px 0 #090c18}
.btn.primary,.btn.sel{background:linear-gradient(#7ff6ff,#2bb7d6);color:#07202a;box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 3px 0 #176f8c}
.btn.danger{background:linear-gradient(#ff8a96,#d1283c)}
.seg-ctl{border:2px solid #3b4163;background:#141828}.seg-ctl button.on{background:linear-gradient(#7ff6ff,#2bb7d6);color:#07202a}
.frames,.walkTrack{background:linear-gradient(#262b45,#141828);border:2px solid #3b4163}
.game{border:5px solid #141828;box-shadow:0 0 0 3px #4a5078,0 0 0 6px #141828,0 20px 50px rgba(0,0,0,.6)}
.gcv{image-rendering:pixelated;image-rendering:crisp-edges}
.hcard,.tbar,.tlist,.gtimer,.tasktab,.ib{background:linear-gradient(#363b5c,#1c2036);border:3px solid #141828;box-shadow:inset 0 2px 0 rgba(255,255,255,.14),inset 0 -3px 0 rgba(0,0,0,.35),0 4px 0 #090c18,0 8px 18px rgba(0,0,0,.4)}
.hcard small{color:#9ea3bf}.code{color:#4ff0ff}
.tfill{background:#141828;border:3px solid #141828}.tfill i{background:linear-gradient(#7ff6ff,#2bb7d6 60%,#176f8c)}.tbar.locked .tfill i{background:repeating-linear-gradient(45deg,#ff3b4e 0 10px,#7a1220 10px 20px)}
.tlist p::before{background:#f5c542;box-shadow:0 0 6px #f5c542}.tlist p.d::before{background:#4ff0ff}.tlist p.d{color:#4ff0ff}
.gb .ic{background:radial-gradient(circle at 35% 28%,#5a6190,#363b5c 55%,#1c2036);border:4px solid #141828;box-shadow:inset 0 6px 0 rgba(255,255,255,.2),inset 0 -8px 0 rgba(0,0,0,.3),0 6px 0 #090c18,0 10px 18px rgba(0,0,0,.5)}
.gb:not(:disabled) .ic{background:radial-gradient(circle at 35% 28%,#7ff6ff,#2bb7d6 55%,#176f8c)}
.gb.emerg .ic,.gb.sab .ic{background:radial-gradient(circle at 35% 28%,#ff8a96,#d1283c 55%,#6b0f1a)!important}
.gb.repair .ic{background:radial-gradient(circle at 35% 28%,#ffd07a,#f2922e 55%,#8a4a05)!important}
.gb.fake .ic{background:radial-gradient(circle at 35% 28%,#c9a9ff,#8a6cf0 55%,#3b1f8a)!important}
.gb.dist .ic{background:radial-gradient(circle at 35% 28%,#ffe07a,#f5c542 55%,#8a6a05)!important}
.gb.council .ic{background:radial-gradient(circle at 35% 28%,#bfe8ff,#3a6cf0 55%,#1f3f9c)!important;animation:glowB 1.4s infinite}
@keyframes glowB{50%{box-shadow:inset 0 6px 0 rgba(255,255,255,.28),inset 0 -8px 0 rgba(0,0,0,.28),0 6px 0 #090c18,0 0 30px #4ff0ff}}
.gb.council b{color:#9cc4ff}.gb.emerg b,.gb.sab b{color:#ff8a96}.gb.repair b{color:#ffc37a}
.gb:disabled .ic{background:radial-gradient(circle at 35% 28%,rgba(90,97,144,.5),rgba(54,59,92,.5) 55%,rgba(28,32,54,.5));transform:scale(.82)}
.startbtn{background:linear-gradient(#7ff6ff,#2bb7d6 50%,#176f8c);border:4px solid #141828;box-shadow:inset 0 4px 0 rgba(255,255,255,.5),inset 0 -6px 0 rgba(0,0,0,.2),0 7px 0 #0b3a48,0 14px 24px rgba(0,0,0,.5);color:#07202a;-webkit-text-stroke:0}
.joy{background:radial-gradient(circle,rgba(28,32,54,.6),rgba(28,32,54,.8));border:4px solid #141828;box-shadow:inset 0 4px 10px rgba(0,0,0,.5),0 0 0 3px rgba(79,240,255,.3)}
.joy i{background:radial-gradient(circle at 35% 30%,#fff,#b7bbd3 60%,#6a7199)}
.game .banner{background:linear-gradient(#ff7b88,#c81e32);border:4px solid #141828;box-shadow:inset 0 3px 0 rgba(255,255,255,.4),0 6px 0 #4a0810}
.game .banner.warn{background:linear-gradient(#ffd97a,#f2922e);color:#2a1a02}
.sabmenu{background:linear-gradient(#3a1220,#1a0810);border:4px solid #141828}
.minimap .mm-in{background:linear-gradient(#262b45,#141828);border:5px solid #141828;box-shadow:inset 0 0 0 4px #4a5078,0 20px 50px rgba(0,0,0,.6)}
.rbox,.cbox,.mbox{background:linear-gradient(#3b4163,#1c2036);border:5px solid #141828;box-shadow:inset 0 0 0 3px #6a7199,inset 0 4px 0 rgba(255,255,255,.15),0 20px 50px rgba(0,0,0,.6)}
.rbox.green{background:linear-gradient(#2b4f9c,#1f3f9c)}.rbox.green .holdbtn{background:radial-gradient(circle at 35% 30%,#bfe8ff,#3a6cf0)}
.holdbtn{background:radial-gradient(circle at 35% 30%,#ffd07a,#f2922e);border:5px solid #141828}.holdbtn::before{background:conic-gradient(#4ff0ff calc(var(--p,0)*1%),rgba(0,0,0,.3) 0)}
.cprev{background:radial-gradient(circle at 50% 30%,#363b5c,#1c2036)}.acc{background:linear-gradient(#363b5c,#262b45)}
.mbody{background:linear-gradient(#141828,#0d1020);border:4px solid #141828}.mdone{background:radial-gradient(circle,rgba(28,32,54,.97),rgba(9,12,24,.98))}.mdone h2{color:#4ff0ff;text-shadow:0 0 20px #4ff0ff}.mdone circle,.mdone path{stroke:#4ff0ff}
.mfoot{background:rgba(0,0,0,.25)}.mroom{background:rgba(0,0,0,.3)}
.vote{background:linear-gradient(#262b45,#141828)}.vc{background:linear-gradient(#fff,#d6d9ea);color:#141828;box-shadow:inset 0 3px 0 rgba(255,255,255,.9),inset 0 -4px 0 rgba(0,0,0,.08),0 4px 0 #090c18}.vc small{color:#4a5078}.vc:hover:not(.dead){border-color:#4ff0ff}
.vhead h3{-webkit-text-stroke:4px #141828}.chat{background:linear-gradient(#262b45,#1c2036);border-color:#3b4163}.msg{background:#363b5c}.msg.me{background:#176f8c}.cin input{background:#0d1020;border-color:#3b4163}
.vt i{background:linear-gradient(90deg,#f5c542,#e5484d)}
.councilfx{background:radial-gradient(ellipse at 50% 60%,#1f3f9c,#090c18 70%)}.councilfx .rays{background:conic-gradient(from 0deg,rgba(79,240,255,.16),transparent 10%,rgba(79,240,255,.16) 20%,transparent 30%,rgba(79,240,255,.16) 40%,transparent 50%,rgba(79,240,255,.16) 60%,transparent 70%,rgba(79,240,255,.16) 80%,transparent 90%)}
.councilfx .lf{display:none}.councilfx .tree svg{filter:drop-shadow(0 0 30px rgba(79,240,255,.6))}.councilfx p{color:#bfe8ff}
.eject2{background:linear-gradient(#090c18,#1a2a6a 60%,#2bb7d6)}.eject2 .planet{background:radial-gradient(ellipse at 50% 0%,#c9b8ff,#8a6cf0 30%,#3b1f8a 60%);border-color:#141828}.eject2 .atmo{box-shadow:0 -10px 40px 16px rgba(138,108,240,.4)}.eject2 .land{background:radial-gradient(ellipse,#c9b8ff,transparent 70%)}
.eject2 .ark svg path:first-child{fill:#363b5c;stroke:#141828}.eject2 .ark svg path:nth-child(2){stroke:#4ff0ff}
.eject2 .sprout{filter:hue-rotate(160deg)}
.role-h.astro{color:#4ff0ff;text-shadow:0 0 30px #2bb7d6}
.phbar{border-color:#141828}.chart,.circ,.vec{background:#d6d9ea;border-color:#141828}
.pkt{background:#141828;color:#4ff0ff}.pkt i.one{background:#176f8c;color:#e8eaf6}
.meters div{background:#141828}
.tsp svg,.sheet .it .sp svg,.skin svg,.bigwalk svg,.frames svg,.walkTrack svg{image-rendering:pixelated}
/* generated PNG sprites */
.pimg{image-rendering:pixelated;display:block}
.sheet .it .sp img{max-height:104px;width:auto;max-width:32%}
.tsp img{height:90px;width:auto}
.councilfx .tree img{width:100%}
img.hl{filter:drop-shadow(0 0 5px #ffe14d) drop-shadow(0 0 2px #ffe14d)}img.br{filter:drop-shadow(0 0 5px #ff3b4e) drop-shadow(0 0 2px #ff3b4e)}
/* generated PNG characters */
.pchar{position:relative;display:block;aspect-ratio:74/99;width:100%;min-height:1px;height:auto;image-rendering:pixelated;overflow:visible}
.pchar img{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.pchar.anim img.fr{opacity:0;animation:walkFrame .6s steps(1) infinite;animation-fill-mode:both}
.pchar.anim img.fr.slow{animation:idleFrame 1.32s steps(1) infinite}
@keyframes walkFrame{0%,16.66%{opacity:1}16.67%,100%{opacity:0}}
@keyframes idleFrame{0%,25%{opacity:1}25.01%,100%{opacity:0}}
.pchar .phat{position:absolute;aspect-ratio:60/40;transform-origin:50% 100%;pointer-events:none}.pchar .phat svg{width:100%;height:100%;display:block;image-rendering:pixelated}
.pchar .hat-antenna{width:34%;left:34%;top:-13%}.pchar .hat-headphones{width:70%;left:15%;top:0}.pchar .hat-sprout{width:42%;left:29%;top:-20%}
.flip .pchar{transform:scaleX(-1)}
.walkanim .pchar{position:absolute;inset:0}
.ghostp img{animation:float 2.6s ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(79,240,255,.6))}
