:root{--gold:#ffd24a;--gold2:#c9a227;--ink:#0b0e22;--panel:#121835;--panel2:#1c2450;--line:#2f3a78;--txt:#e8e6ff;--dim:#9aa0c8;--good:#7dffb0;--bad:#ff8080;--cyan:#7fe0ff;
  --glass:rgba(11,14,34,.72);--shadow:0 10px 40px rgba(0,0,0,.55)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:#070b1e;color:var(--txt);font:15px/1.5 "Nunito",Verdana,Geneva,sans-serif}
canvas#space{position:fixed;inset:0;display:block}
.hidden{display:none!important}
h1,h2,h3{font-family:"Pirata One",Georgia,serif;font-weight:400;letter-spacing:.5px;margin:.2em 0;color:var(--gold)}
h1{font-size:34px}h2{font-size:30px}h3{font-size:22px;margin-top:.9em}
p{margin:.5em 0}.lead{font-size:16px;color:#fff}
.dim{color:var(--dim)}.good{color:var(--good)}.bad{color:var(--bad)}.center{text-align:center}.num{text-align:right;font-variant-numeric:tabular-nums}.grow{flex:1;min-width:0}
.quote{font-style:italic;color:#ffe9a8;border-left:3px solid var(--gold2);padding-left:10px}
kbd{display:inline-block;min-width:20px;text-align:center;font:600 11px/1 Verdana,sans-serif;color:#dfe3ff;background:#232c5c;border:1px solid #4352a0;border-bottom-width:3px;border-radius:5px;padding:3px 5px;margin:0 2px}

/* ---------- HUD */
#hud{position:fixed;inset:0;pointer-events:none;z-index:5}
#hudTop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:10px 14px 0}
#hudStats{display:flex;flex-wrap:wrap;gap:6px}
.pill{display:flex;align-items:center;gap:6px;background:var(--glass);backdrop-filter:blur(8px);border:1px solid #3a4690;border-radius:16px;padding:4px 12px;font-size:13.5px;position:relative;box-shadow:0 2px 10px #0006}
.pill:empty{display:none}
.pill.cred{border-color:var(--gold2);color:#ffe9a8;font-size:15px}.pill.cred b{font-variant-numeric:tabular-nums;color:#fff}
.pill .mini{width:64px;height:8px;background:#05071a;border:1px solid #3a4690;border-radius:5px;overflow:hidden}
.pill .mini div{height:100%;background:linear-gradient(90deg,#3fd67f,#a6ffce);transition:width .3s}.pill .mini div.mid{background:linear-gradient(90deg,#d6a53f,#ffe08a)}.pill .mini div.low{background:linear-gradient(90deg,#d63f3f,#ff9a8a);animation:pulse .7s infinite alternate}.pill .mini div.cargo{background:linear-gradient(90deg,#3f8fd6,#9ad4ff)}
@keyframes pulse{to{opacity:.5}}
.delta{position:absolute;left:34px;top:100%;font-weight:700;font-size:14px;animation:rise 1.5s ease-out forwards;text-shadow:0 0 6px #000}
@keyframes rise{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(26px)}}
.shards{color:var(--gold);letter-spacing:2px}.shards i{color:#3a4690;font-style:normal}.shards.big{font-size:24px;margin:4px 0 8px}.shards.big .dim{font-size:13px;letter-spacing:0}
#hudBtns{display:flex;gap:6px;pointer-events:auto}
.hbtn{background:var(--glass);backdrop-filter:blur(8px);color:var(--txt);border:1px solid #3a4690;border-radius:10px;padding:6px 10px;font:inherit;font-size:13px;cursor:pointer;transition:.15s}
.hbtn:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-1px)}
#hudObj{margin:8px 14px 0;max-width:620px;background:linear-gradient(90deg,rgba(58,47,10,.85),rgba(11,14,34,.6));backdrop-filter:blur(6px);border-left:3px solid var(--gold);border-radius:4px 10px 10px 4px;padding:6px 12px;font-size:12.5px;color:#d9d3b0}
#hudObj b{display:block;color:var(--gold);font-family:"Pirata One",Georgia,serif;font-weight:400;font-size:17px;letter-spacing:.5px}
#autoTag{position:absolute;top:50%;left:50%;transform:translate(-50%,90px);background:rgba(10,40,60,.75);border:1px solid var(--cyan);color:var(--cyan);border-radius:20px;padding:4px 14px;font-size:12px;letter-spacing:1px;animation:pulse 1s infinite alternate}
#autoTag small{opacity:.7;letter-spacing:0;margin-left:6px}
#hudKeys{position:absolute;left:14px;bottom:12px;font-size:12px;color:var(--dim);background:var(--glass);padding:5px 10px;border-radius:10px}
#nearCard{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;background:var(--glass);backdrop-filter:blur(10px);border:1px solid var(--gold2);border-radius:16px;padding:8px 16px 8px 8px;box-shadow:var(--shadow);animation:up .3s cubic-bezier(.2,1.4,.4,1);max-width:min(640px,94vw)}
#nearCard img{width:64px;height:64px;object-fit:contain}
.ncName{font-family:"Pirata One",Georgia,serif;font-size:24px;color:var(--gold);line-height:1}
.ncTags{margin-top:4px;display:flex;flex-wrap:wrap;gap:4px}.ncTags .tag{margin:0;font-size:11px;padding:1px 6px}
.ncKey{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--gold);padding-left:10px;border-left:1px solid var(--line)}
.ncKey kbd{font-size:18px;padding:7px 11px;background:#4a3c0c;border-color:var(--gold);color:var(--gold);animation:pulse .8s infinite alternate}
@keyframes up{from{opacity:0;transform:translate(-50%,24px)}}

#banner{position:fixed;left:0;right:0;top:22%;text-align:center;pointer-events:none;z-index:45;opacity:0}
#banner.show{animation:banner 2.4s ease-out forwards}
.bTitle{font-family:"Pirata One",Georgia,serif;font-size:46px;color:var(--gold);text-shadow:0 0 24px #ffd24a88,0 3px 0 #4a3408,0 0 4px #000}
.bSub{font-size:15px;color:#fff;text-shadow:0 0 8px #000,0 0 3px #000;letter-spacing:1px}
@keyframes banner{0%{opacity:0;transform:scale(.6)}12%{opacity:1;transform:scale(1.06)}20%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(-20px)}}

#toasts{position:fixed;right:14px;bottom:214px;z-index:40;display:flex;flex-direction:column;gap:6px;align-items:flex-end;pointer-events:none;max-width:380px}
.toast{background:var(--glass);backdrop-filter:blur(8px);border:1px solid var(--line);border-left:4px solid var(--gold2);border-radius:10px;padding:8px 13px;font-size:13px;box-shadow:0 4px 16px #0008;transition:opacity .5s,transform .5s;animation:tin .3s cubic-bezier(.2,1.4,.4,1)}
.toast.good{border-left-color:var(--good)}.toast.bad{border-left-color:var(--bad)}.toast.out{opacity:0;transform:translateX(30px)}
@keyframes tin{from{opacity:0;transform:translateX(40px)}}
#tips{position:fixed;left:14px;bottom:52px;z-index:41;display:flex;flex-direction:column;gap:8px;max-width:360px}
.tip{background:linear-gradient(160deg,#23306e,#151c45);border:1px solid var(--cyan);border-radius:12px;padding:10px 30px 10px 14px;font-size:13px;box-shadow:var(--shadow);position:relative;animation:tipin .4s cubic-bezier(.2,1.4,.4,1);transition:opacity .5s}
.tip.out{opacity:0}.tip button{position:absolute;right:6px;top:4px;background:none;border:none;color:var(--dim);cursor:pointer;font-size:14px}
.tip .tag{margin:0 2px}
@keyframes tipin{from{opacity:0;transform:translateY(20px)}}

/* ---------- overlays */
#overlay,#modal,#title{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
#overlay{background:rgba(3,5,17,.55);backdrop-filter:blur(3px);z-index:10;padding:56px 12px 12px}
#modal{background:rgba(3,5,17,.78);backdrop-filter:blur(4px);z-index:30;padding:12px}
#panel{width:min(1040px,100%);height:100%;max-height:840px;background:linear-gradient(160deg,rgba(24,31,68,.97),rgba(12,16,40,.97));border:1px solid var(--gold2);border-radius:18px;display:flex;flex-direction:column;box-shadow:var(--shadow),0 0 0 1px #000,inset 0 1px 0 #ffffff18;overflow:hidden}
#panel.small{width:min(520px,100%);height:auto}
#panel.pop,#modalBox.pop{animation:pop .28s cubic-bezier(.2,1.3,.4,1)}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(14px)}}
.phead{display:flex;align-items:center;gap:14px;padding:12px 18px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,color-mix(in srgb,var(--pc,#1c2450) 22%,transparent),transparent 60%),#0b0e2288}
.phead h1{margin:0;line-height:1.05}.sub{color:var(--dim);font-size:13px}
.pthumb{width:74px;height:74px;object-fit:contain;margin:-8px -4px -8px -8px;filter:drop-shadow(0 0 10px var(--pc))}
.repline{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--dim);margin-top:3px}.meter.rep{width:130px;flex:none}
.pstats{display:flex;flex-direction:column;align-items:flex-end;font-size:13px;color:#ffe9a8;gap:1px}
.pbtns{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.legend{display:flex;gap:10px;font-size:11px;color:var(--dim);flex-wrap:wrap}.lg{display:inline-block;width:10px;height:10px;border-radius:50%;border:2px solid}.lg.gold{border-color:var(--gold)}.lg.red{border-color:#ff6b6b;border-style:dashed}
.tabs{display:flex;flex-wrap:wrap;gap:4px;padding:8px 14px 0;border-bottom:1px solid var(--line);background:#0b0e2255}
.tab{position:relative;background:transparent;color:var(--dim);border:1px solid transparent;border-bottom:none;border-radius:10px 10px 0 0;padding:8px 12px;font:inherit;cursor:pointer;transition:.15s}
.tab kbd{opacity:.45;font-size:9px;padding:1px 4px;border-bottom-width:1px;margin-left:6px}
.tab:hover{color:var(--txt);background:#ffffff0a}.tab.on{background:var(--panel2);color:var(--gold);border-color:var(--line);box-shadow:inset 0 2px 0 var(--gold)}
.badge{background:var(--line);color:#fff;border-radius:9px;padding:0 6px;font-size:11px;margin-left:5px}.badge.ready{background:var(--gold);color:#241a00;animation:pulse .8s infinite alternate}
#panelBody{flex:1;overflow-y:auto;padding:16px 20px 24px;position:relative}
#panelBody.slide{animation:slide .22s ease-out}
@keyframes slide{from{opacity:0;transform:translateX(14px)}}
#panelBody::-webkit-scrollbar,#modalBox::-webkit-scrollbar{width:10px}#panelBody::-webkit-scrollbar-thumb,#modalBox::-webkit-scrollbar-thumb{background:var(--line);border-radius:5px}

#modalBox{width:min(640px,100%);max-height:92vh;overflow-y:auto;background:linear-gradient(160deg,#1f2858,#121737);border:1px solid var(--gold);border-radius:18px;padding:22px 28px;box-shadow:var(--shadow),0 0 60px #ffd24a22,inset 0 1px 0 #ffffff22;position:relative}
.modalBtns{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.modalBtns.col{flex-direction:column}
.keyhint{position:absolute;right:30px;bottom:6px;font-size:10px;color:var(--dim);opacity:.6}
.bigicon{font-size:60px;text-align:center;animation:popicon .6s cubic-bezier(.2,1.6,.4,1)}

/* ---------- controls */
.btn{background:linear-gradient(#26306a,#1a2250);color:var(--txt);border:1px solid #3a4690;border-radius:10px;padding:8px 14px;font:inherit;cursor:pointer;transition:transform .08s,filter .15s,border-color .15s;box-shadow:0 2px 0 #0a0d24}
.btn:hover{filter:brightness(1.2);transform:translateY(-1px);border-color:#6a78d0}.btn:active{transform:translateY(1px);box-shadow:none}
.btn[disabled]{opacity:.4;cursor:not-allowed;filter:none;transform:none}
.btn.gold{background:linear-gradient(#ffdf6e,#c9a227);color:#241a00;border-color:#fff1a8;font-weight:bold;box-shadow:0 2px 0 #6b4a1a,0 0 14px #ffd24a33}
.btn.sm{padding:4px 10px;font-size:13px;margin:2px;border-radius:8px}.btn.sell{border-color:#4f8a4a;background:linear-gradient(#274f3a,#1a3528)}.btn small{opacity:.8}
.btn.big{display:block;width:280px;margin:10px auto;padding:13px;font-size:18px}
.btn.ap{display:inline-flex;align-items:center;gap:8px;margin:3px;padding:6px 10px;font-size:13px}
.modalBtns.col .btn.ap{display:flex;justify-content:space-between;margin:0;padding:10px 14px;font-size:15px}.modalBtns.col .odds{width:120px;margin-left:auto}
.odds{display:inline-block;width:46px;height:6px;background:#05071a;border-radius:4px;overflow:hidden}.odds i{display:block;height:100%;border-radius:4px}
.ap.hi .odds i{background:var(--good)}.ap.mid .odds i{background:var(--gold)}.ap.lo .odds i{background:var(--bad)}
.ap.hi small{color:var(--good)}.ap.mid small{color:var(--gold)}.ap.lo small{color:var(--bad)}.ap.hi{border-color:#3f8a5f}

.card{background:#0b0e2299;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:9px 0;transition:border-color .2s}
.card.mini{font-size:13px;padding:8px 12px}
.card.story{border-color:var(--gold2);background:linear-gradient(120deg,#3a2f0a66,#0b0e2299)}
.card.ready{border-color:var(--gold);box-shadow:0 0 18px #ffd24a33}
.card.done{opacity:.55;padding:6px 14px}.card.link{cursor:pointer}.card.link:hover{opacity:1}
.card.win{border-color:var(--good);box-shadow:0 0 18px #7dffb033}.card.lose{border-color:var(--bad)}
.card.npc{display:flex;gap:14px}.face{font-size:48px;line-height:1;filter:drop-shadow(0 3px 6px #000)}
.result{background:#05071acc;border-radius:8px;padding:8px 12px;margin:6px 0;animation:pop .3s cubic-bezier(.2,1.4,.4,1)}
.hearts{font-size:12px}
.job{border-top:1px dashed var(--line);padding:8px 0}.job p{margin:.2em 0;color:var(--dim)}
.rw{color:var(--gold);font-size:13px;margin-right:8px}
.reqs{display:flex;gap:16px;flex-wrap:wrap;margin:8px 0;font-weight:600}
.prog{display:inline-block;position:relative;width:90px;height:16px;background:#05071a;border:1px solid var(--line);border-radius:8px;overflow:hidden;vertical-align:middle;margin-left:6px}
.prog i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#3f5fd6,#7f9aff)}.prog.good i{background:linear-gradient(90deg,#2f9a5f,var(--good))}
.prog b{position:relative;display:block;text-align:center;font-size:11px;line-height:15px;color:#fff;text-shadow:0 0 3px #000}
.cols{display:flex;gap:22px;flex-wrap:wrap}.col1{flex:0 0 260px;text-align:center}.col2{flex:1 1 320px;min-width:0}
.portrait{width:260px;height:260px;object-fit:contain;animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-6px)}}
.io{display:flex;gap:20px;flex-wrap:wrap;margin-top:12px}.io .chip{margin:3px 3px 0 0;display:inline-block}
.trait{display:flex;align-items:center;gap:8px;margin:5px 0;font-size:13px}.trait>span:first-child{flex:0 0 130px}.trait .num{flex:0 0 58px}
.meter{flex:1;height:9px;background:#05071a;border:1px solid var(--line);border-radius:5px;overflow:hidden}.meter div{height:100%;background:linear-gradient(90deg,var(--gold2),var(--gold));border-radius:5px;transition:width .4s}
.meter.big{height:14px;margin:8px 0 12px}.meter.new div{background:linear-gradient(90deg,#2f9a5f,var(--good))}
.cmp{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:13px}.cmp>span:first-child{flex:0 0 60px;color:var(--dim)}.cmp>div{flex:1;display:flex;flex-direction:column;gap:2px}.cmp .num{flex:0 0 120px}
.mkthead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
table.mkt{width:100%;border-collapse:collapse}table.mkt th{text-align:left;color:var(--dim);font-weight:normal;font-size:12px;border-bottom:1px solid var(--line);padding:4px 6px}table.mkt th.num{text-align:right}
table.mkt td{padding:7px 6px;border-bottom:1px solid #2f3a7855}table.mkt tr:hover td{background:#ffffff08}
tr.hotrow td{background:#ffd24a12}.ico{font-size:18px}.hint{font-size:12px;color:var(--dim)}.acts{text-align:right;white-space:nowrap}
.tag{font-size:10px;border:1px solid var(--line);border-radius:4px;padding:0 4px;margin-left:4px;color:var(--dim);white-space:nowrap}.tag.hot{color:#241a00;background:var(--gold);border-color:var(--gold);font-weight:700}.tag.dev{color:#c9b8ff;border-color:#6b55b5}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:var(--panel2);color:var(--txt);border:1px solid var(--line);border-radius:16px;padding:4px 11px;font:inherit;font-size:13px}
button.chip{cursor:pointer;transition:.12s}button.chip:hover{border-color:var(--gold2);transform:translateY(-1px)}.chip.on{background:#4a3c0c;border-color:var(--gold);color:var(--gold)}
.chip.tech{border-color:#3f8f9e}.chip.dev{border-color:#6b55b5}
.bench{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:radial-gradient(ellipse at center,#2a2050aa,#0b0e2299);border:1px solid var(--gold2);border-radius:14px;padding:14px;margin:10px 0}
.slot{min-width:140px;min-height:44px;border:2px dashed var(--line);border-radius:10px;padding:9px 10px;text-align:center;transition:.2s}.slot.full{border-style:solid;border-color:var(--gold2);background:#4a3c0c55}.slot.wide{flex:1;min-width:200px}.plus{font-size:22px;color:var(--gold)}
.mystery{display:inline-block;animation:wob 1s ease-in-out infinite}@keyframes wob{50%{transform:rotate(14deg) scale(1.2)}}
.patents{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}.pat{background:#0b0e2299;border:1px solid #6b55b5;border-radius:10px;padding:7px 10px;font-size:13px}.pat.special{border-color:var(--gold2);background:#3a2f0a44}.pat small{color:var(--dim)}
.keys{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin:14px 0;font-size:13.5px}
.mapwrap{position:relative}
#mapCv{width:min(720px,100%,calc(100vh - 200px));height:auto;border-radius:14px;border:1px solid var(--line)}
#mapTip{position:absolute;width:255px;text-align:left;background:var(--glass);backdrop-filter:blur(8px);border:1px solid var(--gold2);border-radius:10px;padding:8px 12px;font-size:12.5px;pointer-events:none;z-index:3;box-shadow:var(--shadow)}

/* ---------- conversations */
.npcgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px}
.npccard{display:flex;gap:12px;align-items:center;text-align:left;width:100%;background:#0b0e2299;border:1px solid var(--line);border-radius:14px;padding:10px 14px;color:var(--txt);font:inherit;cursor:pointer;transition:.15s;position:relative}
.npccard:hover{border-color:var(--gold2);transform:translateY(-2px);background:#1c245099}
.npccard .face{font-size:40px}.npccard .mood{font-size:12px;color:var(--dim)}
.npccard .mark{position:absolute;right:10px;top:8px;font-size:16px;animation:pulse .8s infinite alternate}
.convo{display:flex;gap:18px;flex-wrap:wrap}.convo .side{flex:0 0 190px;text-align:center}.convo .side .face{font-size:90px}.convo .main{flex:1 1 340px;min-width:0}
.bubble{background:#05071acc;border:1px solid var(--line);border-radius:4px 16px 16px 16px;padding:10px 14px;margin:8px 0;animation:pop .3s cubic-bezier(.2,1.4,.4,1)}
.bubble.me{border-radius:16px 4px 16px 16px;background:#3a2f0a55;border-color:var(--gold2);margin-left:40px;color:#ffe9a8}
.bubble.sys{background:none;border:none;color:var(--dim);font-size:13px;padding:0 4px;text-align:center}
.choices{display:flex;flex-direction:column;gap:6px;margin-top:12px}.choices .btn{text-align:left}
.memory{font-size:12.5px;color:var(--dim);border-top:1px dashed var(--line);margin-top:10px;padding-top:8px;text-align:left}.memory li{margin:2px 0}.memory ul{margin:4px 0;padding-left:18px}
.relbar{display:flex;align-items:center;gap:6px;justify-content:center;font-size:12px;margin-top:6px}.relbar .meter{width:110px;flex:none}

/* ---------- celebration */
.celebrate{text-align:center}.celebrate h3{font-size:28px;margin:.1em 0}
.confetti{font-size:48px;animation:popicon .6s cubic-bezier(.2,1.6,.4,1)}
@keyframes popicon{from{transform:scale(.2) rotate(-20deg);opacity:0}}
.claimbox{margin-top:14px;text-align:left;background:#3a2f0a55;border:1px solid var(--gold);border-radius:12px;padding:8px 14px}
.claimhead{font-family:"Pirata One",Georgia,serif;color:var(--gold);font-size:19px;margin-bottom:4px}
.claim{display:flex;gap:10px;padding:5px 0;border-top:1px dashed #c9a22755;animation:claimin .4s backwards}.claim span:first-child{flex:0 0 26px;text-align:center}
.claim:nth-child(3){animation-delay:.12s}.claim:nth-child(4){animation-delay:.24s}.claim:nth-child(5){animation-delay:.36s}.claim:nth-child(6){animation-delay:.48s}
@keyframes claimin{from{opacity:0;transform:translateX(-14px)}}

/* ---------- title */
#title{z-index:50;background:radial-gradient(ellipse at center,rgba(20,12,50,.35),rgba(5,7,22,.8))}
.tbox{text-align:center;animation:pop .6s ease-out}.skull{font-size:clamp(40px,8vh,70px);animation:bob 3s ease-in-out infinite;filter:drop-shadow(0 6px 14px #000)}
@keyframes bob{50%{transform:translateY(-10px) rotate(-4deg)}}
.tbox h1{font-size:clamp(54px,12vh,104px);margin:0;line-height:1;background:linear-gradient(#fff3b8,#ffd24a 45%,#a8742f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 #3a2608) drop-shadow(0 0 26px #ffd24a55)}
.tag1{font-size:20px;color:#ffe9a8;font-family:"Pirata One",Georgia,serif}.tag2{color:var(--dim);margin-bottom:22px}
.authbox{width:350px;margin:0 auto 12px;background:var(--glass);backdrop-filter:blur(10px);border:1px solid var(--gold2);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;font-size:13px;text-align:center;box-shadow:var(--shadow)}
.authbox input{background:#070b1e;color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:inherit}
.authbox input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #ffd24a22}
.authmsg{color:#ffe9a8;font-size:12.5px}.or{font-size:12px;margin:10px 0 2px}

@media (max-width:760px){.pstats,.tab kbd,.legend,#hudKeys{display:none}.pthumb{width:52px;height:52px}.col1{flex-basis:100%}.hint{display:none}#hShip,#hDay{display:none}.convo .side{flex-basis:100%}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01s!important;transition-duration:.01s!important}}
.instant{font-size:12.5px;margin-top:6px}
.pill .mini div.fuel{background:linear-gradient(90deg,#d6883f,#ffd08a)}
.meter.fuel div{background:linear-gradient(90deg,#d6883f,#ffd08a)}.fuelbox{text-align:left;margin-top:10px}
#strand{position:absolute;left:50%;top:38%;transform:translateX(-50%);pointer-events:auto;background:rgba(60,10,10,.85);border:1px solid var(--bad);color:#ffd0d0;border-radius:14px;padding:10px 16px;font-weight:700;letter-spacing:.5px;display:flex;gap:12px;align-items:center;animation:pulse 1s infinite alternate;box-shadow:var(--shadow)}
.btn.disabledish{opacity:.45}
#mgBar{position:relative;height:34px;background:#05071a;border:1px solid var(--line);border-radius:10px;margin:14px 0;overflow:hidden}
#mgZone{position:absolute;top:0;bottom:0;background:linear-gradient(#2f9a5f,#7dffb0);opacity:.85}
#mgNeedle{position:absolute;top:-4px;bottom:-4px;width:5px;margin-left:-2px;background:#fff;box-shadow:0 0 10px #fff;border-radius:3px}
.chip.rare{border-color:var(--cyan);box-shadow:0 0 8px #7fe0ff55}.pat.bp{cursor:pointer;transition:.12s}.pat.bp:hover{border-color:var(--gold);transform:translateY(-1px)}.benchinfo{margin:6px 0}.bench .slot{min-width:118px}
.subnav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.pill .mini div.shield{background:linear-gradient(90deg,#3f6fd6,#9ac4ff)}
table.vs{width:100%;border-collapse:collapse;margin:8px 0;font-size:14px}table.vs th{font-family:"Pirata One",Georgia,serif;font-weight:400;font-size:19px;color:var(--gold);padding:2px 8px}table.vs td{padding:3px 8px;width:42%}table.vs td.center{width:16%;font-size:12px}
.bars{display:flex;gap:10px}.bars .meter{flex:1}.meter.foe div{background:linear-gradient(90deg,#a04bff,#e0b8ff);margin-left:auto}
.battlelog{background:#05071acc;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:13px;min-height:74px;display:flex;flex-direction:column;gap:3px;justify-content:flex-end}
.statline{text-align:center}

/* ---------- mobile (touch) client */
#touchUI{position:fixed;inset:0;z-index:6;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}
#stick{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;background:radial-gradient(circle,#1c245088,#0b0e2244);border:2px solid #7f8adf66;pointer-events:auto;touch-action:none;display:flex;align-items:center;justify-content:center}
#stick span{position:absolute;bottom:-18px;font-size:10px;letter-spacing:2px;color:#9aa0c8aa}
#knob{width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe9a8,#c9a227);box-shadow:0 0 18px #ffd24a66;pointer-events:none}
#tbtns{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));display:grid;grid-template-columns:auto auto;gap:10px;align-items:end;justify-items:end;pointer-events:none}
.tbtn{pointer-events:auto;touch-action:none;width:74px;height:74px;border-radius:50%;border:2px solid #7f8adf88;background:#1c2450aa;color:#e8e6ff;font:700 12px Verdana,sans-serif;letter-spacing:1px;backdrop-filter:blur(4px)}
.tbtn.fire{width:96px;height:96px;background:#7a1f2faa;border-color:#ff8080aa;font-size:14px;grid-column:2;grid-row:2}
#tBrake{grid-column:1;grid-row:2}#tLand{grid-column:2;grid-row:1;width:96px;height:52px;border-radius:26px;background:linear-gradient(#ffdf6e,#c9a227);color:#241a00;border-color:#fff1a8;animation:pulse .8s infinite alternate}
.tbtn.down{transform:scale(.92);filter:brightness(1.5)}
html.mobile,html.mobile body{overscroll-behavior:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
html.mobile canvas#space{touch-action:none}
html.mobile #hudKeys,html.mobile kbd,html.mobile .keyhint,html.mobile #hShip,html.mobile #hDay,html.mobile #hShards{display:none!important}
html.mobile .ncKey kbd{display:inline-block!important}
html.mobile #hudTop{padding:6px 8px 0;gap:6px}html.mobile .pill{font-size:12px;padding:3px 8px}html.mobile .pill .mini{width:38px}
html.mobile .hbtn{padding:8px 12px;font-size:15px}
html.mobile #hudObj{font-size:11px;max-width:62vw;margin:6px 8px 0;padding:4px 8px}html.mobile #hudObj b{font-size:14px}html.mobile #hudObj span{display:none}
html.mobile #nearCard{bottom:auto;top:96px;pointer-events:auto;padding:6px 12px 6px 6px}html.mobile #nearCard img{width:44px;height:44px}html.mobile .ncName{font-size:19px}
html.mobile #toasts{bottom:auto;top:150px;right:8px;max-width:70vw}html.mobile #tips{left:8px;right:8px;bottom:auto;top:96px;max-width:none}
html.mobile #strand{top:30%;flex-direction:column;text-align:center}
html.mobile #overlay{padding:0}html.mobile #panel{max-height:none;height:100%;width:100%;border-radius:0;border:none}
html.mobile #panel.small{height:auto;width:92%;border-radius:16px;border:1px solid var(--gold2)}
html.mobile .phead{padding:8px 10px;gap:8px;flex-wrap:wrap}html.mobile .phead h1{font-size:24px}html.mobile .pthumb{width:44px;height:44px;margin:0}html.mobile .pstats,html.mobile .legend{display:none}
html.mobile .tabs{flex-wrap:nowrap;overflow-x:auto;padding:6px 8px 0;scrollbar-width:none}html.mobile .tab{white-space:nowrap;padding:9px 12px}
html.mobile #panelBody{padding:12px 12px 40px;-webkit-overflow-scrolling:touch}
html.mobile .btn{padding:10px 14px}html.mobile .btn.sm{padding:8px 11px;font-size:13px}
html.mobile table.mkt{display:block;overflow-x:auto;white-space:nowrap}html.mobile .col1{flex-basis:100%}html.mobile .portrait{width:180px;height:180px}
html.mobile .convo .side{flex-basis:100%}html.mobile .convo .side .face{font-size:56px}html.mobile .bubble.me{margin-left:16px}
html.mobile #modalBox{padding:16px 16px;max-height:94vh}html.mobile h2{font-size:24px}html.mobile .bTitle{font-size:30px}
html.mobile .tbox h1{font-size:clamp(44px,14vw,80px)}html.mobile .authbox{width:min(350px,90vw)}html.mobile .btn.big{width:min(280px,84vw)}
html.mobile #mapCv{width:min(100%,calc(100vh - 150px))}
.audioset{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;margin:8px 0;font-size:13px}.audioset label{display:flex;align-items:center;gap:8px}.audioset input{accent-color:#ffd24a;width:140px}

/* ---------- planet screens use the whole window */
#overlay{padding:52px 10px 10px}
#panel{width:100%;max-width:1800px;height:100%;max-height:none}
#panel.small{max-width:520px}
.tabs{flex-wrap:nowrap;overflow:hidden}.tab{flex:0 1 auto;white-space:nowrap;min-width:0;padding:8px 11px}
@media (max-width:1350px){.tab kbd{display:none}.tab{padding:8px 9px}}
@media (max-width:1050px){.tab .ti{display:none}}
.mktgrid{display:grid;gap:0 26px;align-items:start}
table.mkt td{padding:4px 5px;white-space:nowrap}table.mkt .btn.sm{padding:3px 8px;margin:1px}
table.mkt td.iname{white-space:normal;max-width:230px}table.mkt td.hint{white-space:normal}
.mkthead{margin-bottom:4px}.mkthead p{margin:0}
html.mobile .tabs{overflow-x:auto}html.mobile .mktgrid{grid-template-columns:1fr!important}
table.mkt td.iname{white-space:nowrap;max-width:none}table.mkt td.iname .tag{font-size:9px;padding:0 3px;margin-left:3px}
.mkthead{flex-wrap:nowrap;min-height:40px}.mkthead .btn{white-space:nowrap;flex:none}
table.mkt tr{height:33px}#panelBody{padding-bottom:12px}
.mktgrid.ultra table.mkt td{padding:3px 3px;font-size:13px}.mktgrid.ultra table.mkt .btn.sm{padding:2px 6px;font-size:12px}.mktgrid.ultra table.mkt tr{height:31px}.mktgrid{gap:0 18px}
.mktgrid table.mkt{min-width:0}.mktgrid td.iname{overflow:hidden;text-overflow:ellipsis;max-width:190px}
.shipgrid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,1.15fr) minmax(280px,1fr);gap:0 26px;align-items:start}
@media (max-width:1100px){.shipgrid{grid-template-columns:1fr 1fr}}@media (max-width:760px){.shipgrid{grid-template-columns:1fr}}html.mobile .shipgrid{grid-template-columns:1fr}
.shipimg{display:block;width:100%;max-width:330px;margin:0 auto}
.gauge{display:grid;grid-template-columns:96px 1fr auto;gap:2px 10px;align-items:center;margin:6px 0;font-size:13.5px}.gauge small{grid-column:2 / 4;font-size:11.5px}.gauge .meter.big{margin:0;height:12px}
.meter.low div{background:linear-gradient(90deg,#d63f3f,#ff9a8a)}.meter.shieldm div{background:linear-gradient(90deg,#3f6fd6,#9ac4ff)}.meter.cargom div{background:linear-gradient(90deg,#3f8fd6,#9ad4ff)}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.statgrid div{background:#0b0e2299;border:1px solid var(--line);border-radius:8px;padding:5px 8px;text-align:center}.statgrid span{display:block;font-size:11px;color:var(--dim)}
.uprow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0;border-bottom:1px solid #2f3a7855;font-size:13.5px}.uprow small{text-align:right}
.pips{color:var(--gold);letter-spacing:3px;font-size:12px}.pips i{color:#3a4690;font-style:normal}

/* ---------- borderless, full-window planet screens; every tab fits without scrolling */
#overlay{padding:0;background:rgba(3,5,17,.35)}
#panel{max-width:none;border:none;border-radius:0;box-shadow:none;background:linear-gradient(160deg,rgba(20,26,58,.95),rgba(9,12,32,.96))}
#panel.small{border:1px solid var(--gold2);border-radius:18px;box-shadow:var(--shadow);background:linear-gradient(160deg,rgba(24,31,68,.98),rgba(12,16,40,.98))}
body.ovl #hudTop,body.ovl #hudObj,body.ovl #hudKeys,body.ovl #nearCard,body.ovl #autoTag{display:none!important}
.pstats{flex-direction:row;flex-wrap:wrap;gap:4px 14px;justify-content:flex-end;max-width:360px;font-size:13.5px}
#panelBody{padding:14px 22px 12px}#fit{min-height:0}
.ovgrid{display:grid;grid-template-columns:minmax(230px,300px) minmax(320px,1.4fr) minmax(280px,1fr);gap:0 30px;align-items:start}
.ovgrid .portrait{width:min(230px,100%);height:auto;aspect-ratio:1}
@media (max-width:1000px){.ovgrid{grid-template-columns:1fr 1fr}}
.fitgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:10px;align-items:start}.fitgrid.wide{grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}
.fitgrid .card{margin:0;padding:10px 14px}.fitgrid .card p{margin:.3em 0}.fitgrid .card h3{margin-top:0}
.job{padding:6px 0}.job .btn.sm{float:right;margin:-2px 0 0 8px}.job .rw{margin-left:6px}
.wsgrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:0 28px;align-items:start}
.patents.tight{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:5px}.patents.tight .pat{padding:5px 9px;font-size:12.5px;line-height:1.35}
.bench{padding:10px;margin:6px 0}.bench .slot{min-width:96px;padding:7px 8px;min-height:38px;font-size:13.5px}.bench .slot.wide{min-width:170px}
.npcgrid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.chatlog{max-height:calc(100vh - 470px);min-height:120px;overflow-y:auto;padding-right:6px}.choices{margin-top:8px;gap:5px}.choices .btn{padding:6px 12px}
.convo .side .face{font-size:64px}.memory{margin-top:6px;padding-top:6px}
html.mobile #overlay{background:rgba(3,5,17,.55)}html.mobile .ovgrid,html.mobile .wsgrid{grid-template-columns:1fr}html.mobile .chatlog{max-height:none;overflow:visible}html.mobile .pstats{display:none}
html.mobile body.ovl #hudTop{display:flex!important}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:5px}.vtile{display:flex;align-items:center;gap:4px;background:#0b0e2299;border:1px solid var(--line);border-radius:9px;padding:3px 6px 3px 10px;font-size:13px;min-width:0}.vtile .grow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vtile .btn.sm{padding:2px 8px;margin:0}
.vcash{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.treewrap{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:0 20px;overflow:hidden!important;height:100%}
.treesvg{width:100%;height:100%;min-height:0;font-family:"Nunito",Verdana,sans-serif}.tnode rect{transition:.15s}.tnode:hover rect{filter:brightness(1.5)}
.tnode.d1 rect{animation:pulse 1.4s infinite alternate}
.treeside{overflow-y:auto;border-left:1px solid var(--line);padding-left:18px}.treeside h3:first-child{margin-top:0}
.treewrap a,.dim a{color:var(--cyan)}
html.mobile .treewrap{grid-template-columns:1fr;overflow:auto!important;height:auto}html.mobile .treesvg{height:60vh}html.mobile .treeside{border:none;padding:0}
.treeside .tag{display:inline-block}
.bubble.sys .gains{text-align:left;background:#3a2f0a44;border:1px solid var(--gold2);border-radius:12px;padding:8px 14px;margin:2px 0;color:var(--txt);font-size:13.5px}
.gains .claim small{font-size:12px;line-height:1.35;display:inline-block}.gains .claim{animation:none}
.whyodds{margin-top:6px;border-top:1px dashed #c9a22755;padding-top:6px}.whyodds summary{cursor:pointer;color:var(--cyan);font-size:12.5px}.whyodds .claim{padding:2px 0;border:none;font-size:12.5px}.whyodds .claim span:first-child{flex:0 0 34px;text-align:right;font-weight:700}

/* ---------- settings */
#overlay.top{z-index:60;background:rgba(3,5,17,.7)}
#panel.small.settings{width:min(620px,100%);max-height:94vh;height:auto}#panel.settings #panelBody{padding:6px 22px 18px;overflow-y:auto}
#panel.settings h3{margin:.7em 0 .2em}
.setrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid #2f3a7855;cursor:default}
.setrow span b{display:block;font-weight:600}.setrow span small{color:var(--dim);font-size:12px}
.setrow input[type=range]{accent-color:#ffd24a;width:190px;flex:none}
.switch{flex:none;width:50px;height:28px;border-radius:14px;border:1px solid #4352a0;background:#0b0e22;position:relative;cursor:pointer;transition:.18s;padding:0}
.switch i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#7f88bf;transition:.18s}
.switch.on{background:linear-gradient(#ffdf6e,#c9a227);border-color:#fff1a8}.switch.on i{left:25px;background:#241a00}
.seg{display:inline-flex;border:1px solid #4352a0;border-radius:10px;overflow:hidden;flex:none}.seg button{background:#0b0e22;color:var(--txt);border:none;padding:6px 14px;font:inherit;font-size:13px;cursor:pointer}.seg button.on{background:linear-gradient(#ffdf6e,#c9a227);color:#241a00;font-weight:700}
.setbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
#titleSettings{margin-top:12px;opacity:.85}
html.nohints kbd,html.nohints #hudKeys,html.nohints .keyhint{display:none!important}html.nohints .ncKey kbd{display:inline-block!important}
html.mobile #panel.small.settings{width:96%;max-height:96vh}html.mobile .setrow input[type=range]{width:130px}

/* ---------- item guide */
.guidewrap{display:grid;grid-template-columns:270px minmax(0,1fr);gap:0 24px;overflow:hidden!important;height:100%}
.gside{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line);padding-right:14px}
.gside input{background:#070b1e;color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:8px 11px;font:inherit;margin-bottom:8px}.gside input:focus{outline:none;border-color:var(--gold)}
#guideList{overflow-y:auto;flex:1;min-height:0;padding-right:4px}.ghead{font-family:"Pirata One",Georgia,serif;color:var(--gold);font-size:17px;margin:8px 0 3px}.gnote{font-size:12px;padding:4px 2px}
.gitem{display:block;width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:8px;color:var(--txt);font:inherit;font-size:13.5px;padding:4px 9px;cursor:pointer}.gitem:hover{background:#ffffff0d}.gitem.on{background:#4a3c0c;border-color:var(--gold);color:var(--gold)}.gitem small{color:var(--dim)}
.gmain{overflow-y:auto;min-height:0}.gmain h2{margin-top:0}.gcols{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.gcols h3:first-child{margin-top:.3em}
.gline{justify-content:flex-start;align-items:flex-start}.gline>span:first-child{flex:0 0 24px}
.glink,.dim a{color:var(--cyan);font-size:12.5px;white-space:nowrap}
@media (max-width:1000px){.gcols{grid-template-columns:1fr}}
html.mobile .guidewrap{grid-template-columns:1fr;overflow:auto!important;height:auto}html.mobile .gside{border:none;padding:0;max-height:34vh}html.mobile .gcols{grid-template-columns:1fr}

/* ---------- expandable star map + tracker */
#radarHit{position:absolute;right:18px;bottom:18px;width:184px;height:184px;border-radius:50%;background:transparent;border:2px solid transparent;pointer-events:auto;cursor:zoom-in;transition:.15s;padding:0}
#radarHit:hover{border-color:var(--gold);box-shadow:0 0 22px #ffd24a66}
html.mobile #radarHit{right:10px;top:58px;bottom:auto;width:104px;height:104px}
#trackTag{position:absolute;right:214px;bottom:24px;pointer-events:auto;background:rgba(10,50,30,.8);border:1px solid var(--good);color:#c9ffe0;border-radius:18px;padding:4px 6px 4px 12px;font-size:13px;display:flex;gap:8px;align-items:center}
#trackTag button{background:none;border:none;color:#c9ffe0;cursor:pointer;font-size:13px;padding:2px 6px}
html.mobile #trackTag{right:124px;top:64px;bottom:auto;font-size:12px}
.mapgrid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:0 20px;overflow:hidden!important;height:100%}
.mapbox{position:relative;min-height:0;display:flex;align-items:center;justify-content:center}
#mapCv{width:auto;height:100%;max-width:100%;max-height:100%;aspect-ratio:1;object-fit:contain;touch-action:none}
.mapzoom{position:absolute;left:10px;top:10px;display:flex;flex-direction:column;gap:4px}.mapzoom .btn{width:36px;padding:6px 0;margin:0}
.mapside{overflow-y:auto;min-height:0;border-left:1px solid var(--line);padding-left:18px}.mapsel{display:flex;gap:10px;align-items:center}.mapsel img{width:70px;height:70px;object-fit:contain}.mapsel h3{margin:0}
.mapbtns{display:flex;flex-direction:column;gap:6px;margin:8px 0 4px}.maplist .gitem small{float:right}
html.mobile .mapgrid{grid-template-columns:1fr;overflow:auto!important;height:auto}html.mobile .mapside{border:none;padding:0}html.mobile #mapCv{height:auto;width:100%}
.hbtn{white-space:nowrap}#hudBtns{flex-wrap:wrap;justify-content:flex-end}

/* ---------- news ticker (discreet strip along the bottom) */
#ticker{position:fixed;left:0;right:0;bottom:0;height:22px;z-index:12;display:flex;align-items:center;background:rgba(5,7,22,.82);border-top:1px solid #2f3a7888;font-size:12px;color:#aab0d8;cursor:pointer;overflow:hidden}
#ticker:hover{color:#fff;background:rgba(10,14,40,.95)}
.tlabel{flex:none;padding:0 10px;color:var(--gold);font-weight:700;letter-spacing:1px;font-size:10.5px;border-right:1px solid #2f3a78;background:rgba(5,7,22,.95);z-index:1}
.twin{flex:1;overflow:hidden;white-space:nowrap}#tickerRun{display:inline-block;white-space:nowrap;padding-left:100%;animation:tick 60s linear infinite}
#ticker:hover #tickerRun{animation-play-state:paused}
#tickerRun span{margin:0 4px}#tickerRun b{color:#3a4690;margin:0 14px;font-weight:400}#tickerRun i{color:#6f78ad;font-style:normal;font-size:11px}
#tickerRun .up{color:#9dffc4}#tickerRun .down{color:#ffb8a0}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-100%)}}
#overlay{padding-bottom:22px}#hudKeys{bottom:32px}#radarHit{bottom:40px}#trackTag{bottom:46px}#toasts{bottom:236px}#tips{bottom:72px}
.tag.ev{color:#ffb8a0;border-color:#a8604a}.evbanner{border-color:var(--gold2);background:#3a2f0a44;margin:0 0 8px}
html.mobile #touchUI #stick,html.mobile #tbtns{margin-bottom:22px}html.mobile #ticker{font-size:11px}
#zoneTag{position:absolute;left:50%;top:64px;transform:translateX(-50%);background:rgba(60,8,8,.8);border:1px solid #ff6464;color:#ffc9c9;border-radius:18px;padding:4px 14px;font-size:12px;letter-spacing:1px;white-space:nowrap}#zoneTag small{letter-spacing:0;opacity:.8}
html.mobile #zoneTag{top:150px;font-size:11px}

/* ---------- comms */
#commTag{position:absolute;left:50%;top:96px;transform:translateX(-50%);pointer-events:auto;cursor:pointer;background:rgba(8,40,60,.9);border:1px solid var(--cyan);color:#d8f6ff;border-radius:20px;padding:6px 16px;font:inherit;font-size:13px;letter-spacing:.5px;animation:commring 1s infinite;white-space:nowrap;z-index:13}
@keyframes commring{0%,100%{box-shadow:0 0 0 0 #7fe0ff88}50%{box-shadow:0 0 0 10px #7fe0ff00;transform:translateX(-50%) scale(1.04)}}
body.ovl #commTag{top:auto;bottom:30px}
.commhead{display:flex;gap:14px;align-items:center;margin-bottom:6px}.commhead .face{font-size:54px}
.card.urgent{border-color:var(--cyan);box-shadow:0 0 14px #7fe0ff22}.card.urgent .btn.sm{float:right}
html.mobile #commTag{top:180px;font-size:12px}
.cbonus{display:inline-block;font-size:12px;border:1px solid #3f8a5f;color:#b8ffd6;border-radius:10px;padding:1px 8px;margin:2px 4px 2px 0;background:#0e2a1c}.cbonus.sk{border-color:var(--gold2);color:#ffe9a8;background:#3a2f0a66}
.crewrow{align-items:flex-start}.cface{font-size:20px}
.stars{color:var(--gold);font-size:11px;letter-spacing:1px}

/* ---------- painted avatars */
.ava{border-radius:50%;object-fit:cover;flex:none;vertical-align:middle;box-shadow:0 3px 10px #000a,0 0 0 1px #c9a22766;background:#0b0e22}
.convo .side .ava{display:block;margin:0 auto 6px;box-shadow:0 6px 22px #000c,0 0 0 2px #c9a227aa}
.bubble .ava{margin:-3px 4px -3px -4px;box-shadow:0 0 0 1px #c9a22766}
.npccard .ava{margin-right:2px}.crewline{display:flex;align-items:center;gap:10px}.crewline>span{min-width:0}
.vsava{display:flex;align-items:center;justify-content:center;gap:18px;margin:2px 0 4px}.vsava span{font-family:"Pirata One",Georgia,serif;color:var(--gold);font-size:24px}
.commhead .ava{box-shadow:0 0 0 2px var(--cyan),0 0 18px #7fe0ff55}
.phead>.ava{margin:-6px 0}
#pLoan{pointer-events:auto;cursor:pointer;border-color:#a8604a;color:#ffd0b8}#pLoan.bad{border-color:var(--bad);color:var(--bad);animation:pulse .8s infinite alternate}
.loanbox{text-align:left;margin-top:8px}.loanbox.late{border-color:var(--bad)}.loanbox .btn{float:right;margin-top:-2px}
.lbjoin{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}.lbjoin input{background:#070b1e;color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:8px 11px;font:inherit;width:220px}.lbjoin input:focus{outline:none;border-color:var(--gold)}
table.lbt td{padding:6px 8px}table.lbt td:first-child{width:40px;text-align:center;font-size:16px}

/* ---------- painted object art */
img.ico{width:1.55em;height:1.55em;vertical-align:-.42em;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px #c9a22755}
.chip img.ico,.tag img.ico{width:1.4em;height:1.4em;margin:-2px 1px -2px -4px}
.bigicon img.ico{width:1.7em;height:1.7em;box-shadow:0 6px 20px #000c,0 0 0 2px #c9a227aa}
#tickerRun img.ico{width:1.3em;height:1.3em}
.artcard{display:flex;gap:12px;align-items:flex-start}
.shipyardrow{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:6px}.shipyardrow .ava:first-child{opacity:.7}
.ghero{float:right;margin:0 0 8px 14px}
.pthumb,.portrait,#nearCard img,.mapsel img{border-radius:50%}
.portrait{box-shadow:0 8px 30px #000a}
table.mkt img.ico,.vtile img.ico,.gitem img.ico{width:28px;height:28px;vertical-align:middle;margin:-3px 2px -3px 0}table.mkt tr{height:36px}.mktgrid.ultra table.mkt tr{height:34px}

.maplist .gitem img.ico,.gitem img.ico{width:1.7em;height:1.7em;margin-right:4px}
.tab img.ico{width:1.5em;height:1.5em;margin-right:3px}.hbtn img.ico,.pill img.ico{width:1.45em;height:1.45em;vertical-align:-.38em}
.patents.bps{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.bphead{display:flex;gap:8px;align-items:center;margin-bottom:4px}.bphead>img.ico{width:34px;height:34px}
.bpparts{display:grid;grid-template-columns:1fr 1fr;gap:3px 6px}.bppart{display:flex;gap:6px;align-items:center;border:1px solid #ffffff18;border-radius:8px;padding:2px 6px;min-width:0}.bppart img.ico{width:24px;height:24px;flex:none}
.bppart span{min-width:0;display:flex;flex-direction:column;line-height:1.15}.bppart b,.bppart small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bppart b{font-weight:600;font-size:12px}.bppart small{font-size:10.5px}
.bppart.have{border-color:#5fe08a88;background:#5fe08a14}.bppart.have small{color:var(--good,#7dffb0)}.bppart.miss{border-color:#ff6b6b88;background:#ff6b6b12;cursor:help}.bppart.miss img.ico{filter:grayscale(.7) opacity(.75)}.bppart.miss small{color:#ff9d9d}
.bphow{margin:0 0 6px;font-size:12.5px}.bphow ol{margin:4px 0 0 18px;padding:0}.bphow li{margin:1px 0}
.tag.bad{border-color:#ff6b6b88;color:#ff9d9d}.tag.good{border-color:#5fe08a88;color:#7dffb0}
/* ---------- chronicle: sagas and relics */
#coordTag{position:absolute;left:50%;transform:translateX(-50%);bottom:46px;background:rgba(40,30,8,.8);border:1px solid var(--gold2,#c9a227);color:#ffe9a8;border-radius:18px;padding:4px 14px;font-size:13px;font-variant-numeric:tabular-nums;letter-spacing:.3px}
html.mobile #coordTag{bottom:auto;top:64px;font-size:12px}
.sstep{font-size:12.5px;margin:2px 0;line-height:1.35}.sstep.cur{background:#ffd24a14;border-left:2px solid var(--gold);padding:3px 6px;border-radius:4px}
.riddle{font-size:14px;line-height:1.5;background:#0006;border:1px solid #c9a22755;border-radius:10px;padding:10px 12px;font-style:italic}.cipher{font-style:normal;font-family:Consolas,monospace;letter-spacing:2px;color:#ffe680;word-spacing:6px}
.relin{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.relin input{background:#0b0e22;border:1px solid var(--line);color:inherit;border-radius:8px;padding:6px 9px;font:inherit;width:150px}.relin input[type=text]{flex:1;min-width:140px}
ol.how{margin:4px 0 0 18px;padding:0;font-size:12.5px}.cols2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-content:start}@media (max-width:900px){.cols2{grid-template-columns:1fr}}
.achcols{grid-template-columns:minmax(300px,1fr) 2fr}.achrow,.achcard{display:flex;gap:10px;align-items:center;padding:5px 8px;border:1px solid #ffffff14;border-radius:10px;margin-bottom:4px;background:#0b0e2288;font-size:13px}.achrow{border-color:#c9a22766;background:#3a2f0a33}
.achico{font-size:24px;flex:none}.achico img.ico{width:34px;height:34px}.achday{color:var(--gold);white-space:nowrap}.achgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px}.achcard{margin:0}.achcard .achico img.ico{filter:grayscale(.8) opacity(.7)}
.achbar{display:inline-block;width:90px;height:5px;border-radius:3px;background:#ffffff18;vertical-align:middle;margin-right:6px;overflow:hidden}.achbar div{height:100%;background:var(--gold)}.pbtns .subnav{display:inline-flex;margin:0 8px 0 0}
.verbadge{display:inline-flex;gap:6px;align-items:center;border:1px solid #ffb34788;background:#ffb34718;color:#ffd9a0;border-radius:14px;padding:2px 10px;font-size:12px;letter-spacing:.5px;white-space:nowrap}.verbadge b{color:#ffb347;letter-spacing:1.5px}#titleVer{margin:-4px 0 8px}
/* ---------- conversation minigames */
.tghead{display:flex;gap:12px;align-items:center;margin-bottom:10px}.tgstage{min-width:min(520px,80vw);margin:6px 0}.tgnote{font-size:12px;margin:6px 0}
.tglabels{display:flex;justify-content:space-between;font-size:12px;color:var(--dim);margin-bottom:3px}
.tgbar{position:relative;height:34px;border-radius:17px;background:linear-gradient(90deg,#5a1f2a,#2a2f55 35%,#2a2f55 65%,#5a1f2a);border:1px solid var(--line);overflow:hidden;margin-bottom:12px}
.tgzone{position:absolute;top:0;bottom:0;background:linear-gradient(180deg,#7dffb0aa,#2fae6a88);border-left:2px solid #7dffb0;border-right:2px solid #7dffb0}
.tgneedle{position:absolute;top:-2px;bottom:-2px;width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 10px #fff}.tgneedle.fat{width:14px;margin-left:-7px;border-radius:7px;background:#ff9d9d;box-shadow:0 0 12px #ff6b6b}.tgneedle.fat.ok{background:#7dffb0;box-shadow:0 0 14px #7dffb0}
.tgmeter{height:10px;border-radius:5px;background:#ffffff18;overflow:hidden;margin:0 0 12px}.tgmeter.big{height:22px;border-radius:11px}.tgmeter div{height:100%;width:0;background:linear-gradient(90deg,#ffd24a,#7dffb0)}.tgmeter div.red{background:linear-gradient(90deg,#ffb347,#ff4a4a)}
.tgheart{position:relative;height:310px;display:flex;align-items:center;justify-content:center;cursor:pointer;user-select:none}.tgtarget{position:absolute;width:120px;height:120px;border-radius:50%;border:3px dashed #ff8fc7aa}
.tgring{position:absolute;border-radius:50%;border:4px solid #ffffffcc;box-shadow:0 0 14px #ff8fc7}.tgring.ok{border-color:#7dffb0;box-shadow:0 0 20px #7dffb0}.tgbig{font-size:64px}.tgbig.pulse{animation:tgpulse .4s}@keyframes tgpulse{50%{transform:scale(1.5)}}
.tgstare{display:flex;align-items:center;justify-content:center;gap:26px;margin:8px 0 14px}.tgface{font-size:70px;display:inline-block}.tgvs{color:var(--dim);font-size:18px}
.tgpoints{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:8px 0}.tgpoint{background:#0b0e22;border:2px solid var(--line);border-radius:14px;color:inherit;padding:14px 6px;cursor:pointer;font:inherit;transition:.08s}.tgpoint span{font-size:40px;display:block}.tgpoint small{color:var(--dim)}
.tgpoint.lit{background:#ffd24a;border-color:#fff;transform:scale(1.07);box-shadow:0 0 24px #ffd24a}.tgpoint.lit small{color:#1a1200}
html.mobile .tgheart{height:240px}html.mobile .tgface{font-size:54px}
/* ---------- captain screen + stat diffs */
.statdiff{border:1px solid #5fe08a66;background:#5fe08a10;border-radius:12px;padding:8px 12px;margin:8px 0;text-align:left}.statdiff .claim{display:flex;justify-content:space-between;gap:14px;padding:2px 0;font-size:13.5px}
.capwrap{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(280px,1fr);gap:14px;align-content:start}.capgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px;align-content:start}
.capskill{border-color:color-mix(in srgb,var(--sc) 55%,transparent);margin:0}.caphead{display:flex;gap:10px;align-items:center}.capico{font-size:30px}.capico img.ico{width:44px;height:44px}.caplvl{font-size:22px;color:var(--sc);font-weight:700;margin-left:6px}
.capxp{height:7px;border-radius:4px;background:#ffffff18;overflow:hidden;margin:6px 0 3px}.capxp div{height:100%;background:var(--sc)}.spark{width:100%;height:46px;margin:4px 0;display:block}.sparkt{font-size:8px;fill:#ffffff66}
.capdoes{margin:4px 0 4px 16px;padding:0;font-size:12.5px;line-height:1.45}.capsrc{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-top:4px}.capsrc .chip{font-size:11.5px;padding:2px 8px}
.radar{width:100%;max-width:280px;display:block;margin:0 auto}.radart{font-size:11px;font-weight:700}.caprow{cursor:help}.capside .card{margin-top:0}
@media (max-width:1000px){.capwrap{grid-template-columns:1fr}}
.capwrap{grid-template-columns:1fr}.capgrid{grid-template-columns:repeat(5,minmax(0,1fr))}@media (max-width:1300px){.capgrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}
.capside{display:grid;grid-template-columns:300px 1fr;gap:10px}.capside .card{margin:0}.capattrs{columns:3;column-gap:22px}.capattrs .caprow{break-inside:avoid}@media (max-width:1000px){.capside{grid-template-columns:1fr}.capattrs{columns:1}}
.statdiff .claim span:first-child{white-space:nowrap}
.confetti img.ico{width:56px;height:56px;margin:0 6px}.confetti img.ico:nth-child(2){width:72px;height:72px}
.tgroar{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:10px 0 14px;font:700 34px Georgia,serif;letter-spacing:2px}.tgroar span{min-width:30px;text-align:center;color:#ffffff55;border-bottom:3px solid transparent}.tgroar span.done{color:#7dffb0}.tgroar span.cur{color:#ffd24a;border-color:#ffd24a;transform:scale(1.2)}.tgroar.shake{animation:tgshake .25s}@keyframes tgshake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}.tgkey{min-width:64px;font-size:22px}
.tgstage .btn.big.tgkey{display:inline-block;width:auto;min-width:74px;margin:4px}
.tgflee{position:relative;height:300px;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,#05071a,#141a44);margin-bottom:8px}.tgflee:before,.tgflee:after{content:'';position:absolute;top:0;bottom:0;width:1px;background:#ffffff14;left:33.33%}.tgflee:after{left:66.66%}
.tgship,.tgrock{position:absolute;transform:translateX(-50%);font-size:40px;line-height:1}.tgship{top:78%;transition:left .09s;transform:translateX(-50%) rotate(-45deg)}.tgrock{top:-10%}.tgflee.shake{animation:tgshake .25s}html.mobile .tgflee{height:240px}
.basegrid{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}.basecard .uprow{padding:3px 0}.basecard .chips{margin:2px 0 6px}
.salegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px}.salegrid .card{margin:0}
.hagglebar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 6px}.qhow{font-size:12.5px;margin:6px 0 0;border-top:1px dashed #ffffff22;padding-top:5px}
.tgbid{text-align:center;margin:8px 0}.tgbidx{font:700 54px Georgia,serif}.tgcrowd{text-align:center;font-size:30px;min-height:40px;margin-bottom:6px}
.tgcards{display:grid;gap:8px;margin:6px auto 12px;max-width:520px}.tgcard{position:relative;height:84px;border-radius:12px;border:2px solid var(--line);background:#0b0e22;color:inherit;cursor:pointer;font:inherit}.tgcard .tgfront{display:none;font-size:30px;line-height:1.1}.tgcard .tgfront small{display:block;font-size:10.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 4px}.tgcard .tgback{font-size:30px;opacity:.5}
.tgcard.up{border-color:var(--gold);background:#2a2f55}.tgcard.up .tgfront{display:block}.tgcard.up .tgback{display:none}.tgcard.ok{border-color:#7dffb0;background:#123a2a}
.tglock{position:relative;height:300px;border-radius:14px;border:1px solid var(--line);background:radial-gradient(circle at 50% 50%,#2a1f4a,#05071a);overflow:hidden;margin-bottom:8px;touch-action:none}.tglockfoe{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:150px;opacity:.85;pointer-events:none}
.tgspot{position:absolute;transform:translate(-50%,-50%);border-radius:50%;border:3px solid #ff4a4a;background:radial-gradient(circle,#ff4a4aaa 0 25%,transparent 30% 55%,#ff4a4a55 60%);cursor:crosshair;padding:0;box-shadow:0 0 14px #ff4a4a}.tgspot.pop{animation:tgpulse .3s}
.tgband{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(45deg,#000a 0 6px,#5558 6px 12px)}html.mobile .tglock{height:240px}
/* ---------- flight mini-view */
#shipMini{position:absolute;left:14px;bottom:66px;pointer-events:auto;background:rgba(8,10,28,.72);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:12px;padding:6px 10px;font-size:12px;min-width:150px}
.smhead{cursor:pointer;color:var(--gold);font-weight:700;display:flex;align-items:center;gap:6px;white-space:nowrap}.smhead small{margin-left:auto;color:var(--dim)}.smhead img.ico{width:22px;height:22px}
.smgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin-top:4px}.smrow{display:flex;justify-content:space-between;gap:12px;padding:1.5px 0;color:var(--dim);white-space:nowrap}.smrow b{color:#e8ecff;font-variant-numeric:tabular-nums}.smrow b.good{color:#7dffb0}.smrow b.bad{color:#ff8080}.smrow b.warn{color:#ffd24a}
html.mobile #shipMini{left:8px;bottom:auto;top:96px;font-size:11px;padding:4px 8px}html.mobile .smgrid{grid-template-columns:1fr}
.aloglist{max-height:calc(100vh - 230px);overflow-y:auto;border:1px solid var(--line);border-radius:12px;padding:4px 12px;background:#0b0e2288;margin:6px 0}.alogday{position:sticky;top:0;background:#141a44;color:var(--gold);font-weight:700;padding:4px 8px;margin:6px -8px 2px;border-radius:8px;z-index:1}
.alogrow{display:flex;gap:10px;padding:3px 0;border-bottom:1px dashed #ffffff10;font-size:13px;align-items:baseline}.alogt{color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:11.5px;min-width:128px}.alogc{min-width:22px;text-align:center}.alogx{flex:1}
.alogq{background:#0b0e22;border:1px solid var(--line);color:inherit;border-radius:8px;padding:5px 9px;font:inherit;margin-left:auto;min-width:180px}
.studyrow{display:flex;gap:10px;align-items:center;margin:5px 0}.studyrow .capxp{flex:1;margin:0}.studyrow small{white-space:nowrap;color:var(--dim)}
.tgflasks{display:flex;justify-content:center;gap:10px;margin:8px 0 12px}.tgflask{position:relative;width:62px;height:150px;border:2px solid var(--line);border-radius:10px 10px 26px 26px;background:#0b0e22;overflow:hidden;cursor:pointer;color:#fff;font:inherit;padding:0}.tgflask .tgliq{position:absolute;left:0;right:0;bottom:0;opacity:.75}.tgflask b{position:relative;display:block;margin-top:8px;font-size:18px;text-shadow:0 1px 3px #000}.tgflask.sel{border-color:var(--gold);transform:translateY(-8px);box-shadow:0 0 16px #ffd24a88}
.cmp2{display:grid;grid-template-columns:64px minmax(0,1fr) 130px;gap:12px;align-items:center;margin:7px 0;font-size:13px;max-width:900px}.cmpl{color:var(--dim)}.cmpbars{display:flex;flex-direction:column;gap:3px}
.cmpbar{position:relative;height:18px;border-radius:9px;background:#ffffff12;overflow:hidden}.cmpbar i{position:absolute;left:0;top:0;bottom:0;border-radius:9px}.cmpbar.now i{background:linear-gradient(90deg,#55608f,#7f8bc4)}.cmpbar.new i{background:linear-gradient(90deg,#2fae6a,#7dffb0)}
.cmpbar b{position:relative;display:block;padding:0 10px;line-height:18px;font-size:11.5px;font-weight:600;color:#fff;text-shadow:0 1px 2px #000c;white-space:nowrap}.cmpd{text-align:right;font-weight:700;white-space:nowrap}
.smhead{cursor:default}.smopen{cursor:pointer;display:flex;align-items:center;gap:6px}.smopen:hover{text-decoration:underline}.smhead small{cursor:pointer;padding:0 4px;font-size:14px}.smhead kbd{font-size:9px;opacity:.6}
/* ---------- admin console */
.admbtn{border-color:#ff8fc7!important;color:#ffd1e8!important}.admbody{overflow:auto;font-size:13px}.admsec{border:1px solid var(--line);border-radius:12px;margin:8px 0;padding:6px 12px;background:#0b0e2277}.admsec>summary{cursor:pointer;font-weight:700;color:var(--gold);padding:4px 0}
.admwrap{overflow-x:auto}.admt{width:100%;font-size:12.5px}.admt td,.admt th{padding:4px 8px;vertical-align:top;text-align:left;white-space:normal}.admt th{white-space:nowrap;position:sticky;top:0;background:#141a44}.admt tr:nth-child(even) td{background:#ffffff06}
.admtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin:6px 0 10px}.admtiles .tile{border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:#0b0e22aa;display:flex;flex-direction:column}.admtiles .tile b{font-size:22px;color:var(--gold)}.admtiles .tile span{color:var(--dim);font-size:12px}
.admpre{white-space:pre-wrap;word-break:break-word;font:12px Consolas,monospace;background:#0006;border-radius:8px;padding:8px;max-height:420px;overflow:auto}.admtext{background:#0006;border-radius:8px;padding:8px 12px;margin:6px 0}.admbody code{font:11.5px Consolas,monospace;color:#c9d2ff;word-break:break-word}.admbody .card{margin:8px 0}
.piratecard{display:flex;gap:10px;align-items:flex-start;margin:0}
#hoverTip{position:fixed;z-index:2147483600;max-width:340px;background:#0b0e22f2;border:1px solid var(--gold2,#c9a227);border-radius:10px;padding:7px 11px;font-size:12.5px;line-height:1.4;color:#e8ecff;box-shadow:0 8px 24px #000a;pointer-events:none;white-space:pre-line}#hoverTip.hidden{display:none}img.ico,img.ava{cursor:help}button img.ico,.tab img.ico,.chip img.ico,.hbtn img.ico,.btn img.ico{cursor:inherit}
.treepane{position:relative;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column}.treezoom{display:flex;gap:6px;align-items:center;margin-bottom:4px}.treescroll{flex:1;min-height:0;overflow:hidden}.treescroll.zoomed{overflow:auto;cursor:grab;border:1px solid var(--line);border-radius:10px}.treescroll.grab{cursor:grabbing}.treescroll.zoomed .treesvg{display:block;max-width:none}
/* ---------- scrollbars: brass on navy, everywhere */
@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:#c9a227 #0b0e22}} /* Firefox; Chromium and Safari use the painted version below */
::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-track{background:#0b0e22cc;border-radius:6px;box-shadow:inset 0 0 0 1px #ffffff10}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ffe3a0,#c9a227 45%,#7a5518);border-radius:6px;border:2px solid #0b0e22;box-shadow:inset 0 0 0 1px #00000055}
::-webkit-scrollbar-thumb:horizontal{background:linear-gradient(90deg,#ffe3a0,#c9a227 45%,#7a5518)}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#fff3c4,#ffd24a 45%,#a87a22)}::-webkit-scrollbar-corner{background:#0b0e22}
#panelBody::-webkit-scrollbar,#modalBox::-webkit-scrollbar{width:11px}#panelBody::-webkit-scrollbar-thumb,#modalBox::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ffe3a0,#c9a227 45%,#7a5518);border-radius:6px}
html.mobile .tabs{scrollbar-width:none}html.mobile .tabs::-webkit-scrollbar{display:none}
/* ---------- main menu */
.menubody{display:flex;flex-direction:column;gap:12px}.menubody .btn.big{margin:4px auto 2px}.menugrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.menuitem{display:flex;align-items:center;gap:10px;text-align:left;background:#121735;border:1px solid var(--line);border-radius:12px;padding:9px 12px;color:inherit;font:inherit;cursor:pointer;transition:.12s}.menuitem:hover{border-color:var(--gold);background:#1a2150;transform:translateY(-1px)}
.menuitem .mi{font-size:24px;flex:none;width:34px;text-align:center}.menuitem .mi img.ico{width:32px;height:32px}.menuitem b{display:block;font-size:14px}.menuitem small{display:block;color:var(--dim);font-size:11.5px}.menuitem.quit{grid-column:1/-1;justify-content:center;text-align:center}.menuitem.quit .grow{flex:none}.menuitem.adm{border-color:#ff8fc7}
.menukeys{border:1px solid var(--line);border-radius:12px;padding:6px 12px;background:#0b0e2266}.menukeys summary{cursor:pointer;color:var(--dim);font-size:13px}.menukeys .keys{margin-top:8px}
.menufoot{text-align:center;color:var(--dim);font-size:12px;line-height:1.6;border-top:1px solid var(--line);padding-top:8px}
.titlegrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:min(280px,84vw);margin:12px auto 0}.titlegrid .btn{width:100%;margin:0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:38px;white-space:nowrap}.titlegrid .btn:last-child:nth-child(odd){grid-column:1/-1}
.titlegrid .btn{height:42px;min-height:0;padding:0 8px;box-sizing:border-box}.titlegrid .btn img.ico{width:24px;height:24px;margin:0;vertical-align:middle;flex:none}
.titlegrid .btn,#titleGrid #titleSettings{margin:0!important}
/* ---------- compact HUD: phones and narrow windows */
#hudMore{display:none}#hudSheet{position:fixed;inset:0;z-index:40;background:rgba(3,5,17,.6);display:flex;align-items:flex-end;justify-content:center;pointer-events:auto}#hudSheet.hidden{display:none}
.sheet{width:min(560px,100%);background:linear-gradient(180deg,#1a2150,#0b0e22);border:1px solid var(--gold2,#c9a227);border-bottom:none;border-radius:20px 20px 0 0;padding:8px 14px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px #000a;animation:sheetup .18s ease-out}@keyframes sheetup{from{transform:translateY(40px);opacity:0}}
.sheetgrip{width:44px;height:5px;border-radius:3px;background:#ffffff33;margin:2px auto 10px}.sheetgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sheetbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:78px;border-radius:16px;border:1px solid var(--line);background:#121735;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation}.sheetbtn:active{transform:scale(.95);border-color:var(--gold)}
.sheetbtn span{font-size:28px;line-height:1}.sheetbtn span img.ico{width:38px;height:38px}.sheetbtn small{font-size:12px;color:#d9defa}.sheetclose{display:block;width:100%;margin-top:12px;min-height:46px}
html.compact #hudTop{flex-wrap:nowrap;align-items:flex-start;gap:6px;padding:6px 8px 0}html.compact #hudStats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:5px;flex:1;min-width:0;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(90deg,#000 88%,transparent)}html.compact #hudStats::-webkit-scrollbar{display:none}
html.compact .pill{flex:none;font-size:12px;padding:3px 9px 3px 4px;white-space:nowrap}html.compact .pill .mini{width:34px}html.compact .pill img.ico{width:22px;height:22px}html.compact #hDay,html.compact #hShards,html.compact #hCloud{display:none}
html.compact #hudBtns{flex:none;flex-wrap:nowrap;gap:6px}html.compact #hudBtns .hbtn{display:none}html.compact #hudBtns .hbtn[onclick^="toggleMap"],html.compact #hudMore{display:inline-flex;align-items:center;justify-content:center;min-width:46px;min-height:44px;padding:0 10px;font-size:20px}
html.compact #hudBtns .hbtn[onclick^="toggleMap"]{font-size:0}html.compact #hudBtns .hbtn[onclick^="toggleMap"] img.ico{width:28px;height:28px;margin:0}html.compact #hudBtns kbd{display:none}
html.compact #hudObj{margin:6px 8px 0;max-width:calc(100vw - 16px);font-size:11.5px;padding:4px 9px}html.compact #hudObj b{font-size:14px;display:inline;margin-right:6px}
html.compact #hudKeys{display:none}html.compact #shipMini{left:8px;bottom:auto;top:118px;font-size:11px;padding:4px 8px;max-width:60vw}html.compact .smgrid{grid-template-columns:1fr}
html.compact #coordTag{bottom:auto;top:92px;font-size:11.5px}
/* touch comfort */
html.mobile .btn,html.mobile .tab,html.mobile .chip,html.mobile .menuitem,html.mobile .gitem,html.mobile .npccard{min-height:44px;touch-action:manipulation}html.mobile .btn.sm{min-height:40px}html.mobile .chip{display:inline-flex;align-items:center;padding:6px 12px}
html.mobile button,html.mobile .tab,html.mobile .chip{-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}html.mobile .btn:active,html.mobile .tab:active,html.mobile .menuitem:active{transform:scale(.97);filter:brightness(1.25)}
html.mobile .tabs{gap:6px;scroll-snap-type:x proximity}html.mobile .tab{scroll-snap-align:start;padding:10px 14px}html.mobile .tab .ti img.ico{width:24px;height:24px}
html.mobile .menugrid{grid-template-columns:1fr}html.mobile .modalBtns .btn{min-height:48px}html.mobile .modalBtns.col .btn{padding:12px 14px}
html.mobile .tgkey,html.mobile .tgstage .btn.big{min-height:56px}html.mobile .tgpoints{grid-template-columns:1fr 1fr}html.mobile .tgflask{width:48px;height:130px}html.mobile .tgcard{height:74px}
html.mobile #hoverTip{display:none}html.mobile input,html.mobile select{font-size:16px;min-height:42px} /* 16px stops iOS zooming into fields */
html.mobile .salegrid,html.mobile .basegrid,html.mobile .capgrid,html.mobile .achgrid,html.mobile .cols2{grid-template-columns:1fr}html.mobile .capside{grid-template-columns:1fr}html.mobile .capattrs{columns:1}
html.compact #hudBtns #hudMore{display:inline-flex}body.sheet-open #touchUI,body.sheet-open #shipMini{display:none!important}#hudSheet{z-index:60}
.sheet{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
/* ---------- the League */
.btn.big.league{background:linear-gradient(180deg,#1f6f8a,#123c55);border-color:#7fe0ff;color:#e8fbff;display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1.2}.btn.big.league small{font-size:11px;opacity:.8;font-weight:400}
.lgbody{overflow:auto}.lgstatus{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;background:#0b0e22cc;border:1px solid var(--line);border-radius:12px;padding:8px 14px;margin-bottom:10px;font-size:13.5px;position:sticky;top:0;z-index:2}
.lgerr{border-color:#ff6b6b!important;color:#ffb3b3}.lgok{border-color:#5fe08a88!important;color:#c9ffe0}.lgq{width:64px;background:#0b0e22;border:1px solid var(--line);color:inherit;border-radius:8px;padding:5px 6px;font:inherit;margin-right:4px}
.lgform{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.lgform label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--dim)}.lgform select,.lgform input{background:#0b0e22;border:1px solid var(--line);color:inherit;border-radius:8px;padding:7px 8px;font:inherit}
html.mobile .lgform{grid-template-columns:1fr}html.mobile .lgstatus{position:static}
.lgbody .cols2>div{min-width:0}.lgbody table.mkt{width:100%}html.compact .lgbody table.mkt{display:block;overflow-x:auto;white-space:nowrap}html.compact .lgbody .cols2{grid-template-columns:1fr}
/* ---------- phones: tabs scroll instead of shrinking */
html.mobile .tabs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}html.mobile .tabs::-webkit-scrollbar{display:none}
html.mobile .tab{flex:none;min-width:max-content;display:inline-flex;align-items:center;gap:6px}html.mobile .tab .ti{display:inline-flex!important}
html.mobile .switch,html.mobile .setrow .switch{min-height:32px}
/* ---------- small screens: panel headers and notices */
.sheetopen{display:none!important}html.compact .sheetopen{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;font-size:20px}
html.compact .phead .pbtns>.btn:not(.gold):not(.sheetopen):not(.sm){display:none}html.compact .phead .pbtns{flex-wrap:nowrap;gap:6px;margin-left:auto}html.compact .phead .pbtns .subnav{flex-wrap:wrap}
html.compact .phead{align-items:center}html.compact .phead .grow{min-width:0}html.compact .phead h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#hudSheet{z-index:200}
html.mobile body.ovl #toasts{top:auto;bottom:calc(34px + env(safe-area-inset-bottom));left:8px;right:8px;max-width:none;align-items:stretch}html.mobile #toasts>:nth-last-child(n+3){display:none}html.mobile #toasts .toast{font-size:12.5px}
html.mobile .mkthead{flex-wrap:wrap}html.mobile .mkthead p{flex:1 1 100%}html.mobile .mkthead .btn{width:100%}
/* ---------- phones: market rows become cards (no sideways scrolling) */
html.phone .mktgrid table.mkt,html.phone .lgbody table.lgmkt{display:block;white-space:normal;overflow:visible}html.phone .mktgrid table.mkt tbody,html.phone table.lgmkt tbody{display:block}
html.phone .mktgrid table.mkt tr:first-child,html.phone table.lgmkt tr:first-child{display:none}
html.phone .mktgrid table.mkt tr,html.phone table.lgmkt tr{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px;padding:8px 4px;border-bottom:1px solid #ffffff14}
html.phone .mktgrid table.mkt td,html.phone table.lgmkt td{display:inline-flex;align-items:baseline;gap:4px;padding:0;border:none;background:none!important;font-size:13px}
html.phone .mktgrid table.mkt td:first-child,html.phone table.lgmkt td:first-child{flex:1 1 100%;font-size:15px;align-items:center}
html.phone .mktgrid table.mkt td:last-child,html.phone table.lgmkt td:last-child{flex:1 1 100%;justify-content:flex-end;gap:6px;margin-top:4px}
html.phone .mktgrid table.mkt td:nth-child(2)::before{content:'Have';color:var(--dim);font-size:11px}html.phone .mktgrid table.mkt td:nth-child(3)::before{content:'Stock';color:var(--dim);font-size:11px}
html.phone .mktgrid table.mkt td:nth-child(4)::before{content:'Buy';color:var(--dim);font-size:11px}html.phone .mktgrid table.mkt td:nth-child(5)::before{content:'Paid';color:var(--dim);font-size:11px}html.phone .mktgrid table.mkt td:nth-child(6)::before{content:'Sell';color:var(--dim);font-size:11px}
html.phone table.lgmkt td:nth-child(2)::before{content:'Have';color:var(--dim);font-size:11px}html.phone table.lgmkt td:nth-child(3)::before{content:'Buy';color:var(--dim);font-size:11px}html.phone table.lgmkt td:nth-child(4)::before{content:'Sell';color:var(--dim);font-size:11px}html.phone table.lgmkt td:nth-child(5)::before{content:'Trend';color:var(--dim);font-size:11px}
html.phone .mktgrid table.mkt .btn.sm,html.phone table.lgmkt .btn.sm{min-width:52px}
/* ---------- tablets: touch-sized like a phone, but with room — two columns, framed dialogs, fuller header */
html.tablet .ovgrid,html.tablet .wsgrid,html.tablet .cols2,html.tablet .capside{grid-template-columns:1fr 1fr}html.tablet .salegrid,html.tablet .basegrid,html.tablet .achgrid,html.tablet .capgrid,html.tablet .menugrid{grid-template-columns:1fr 1fr}
html.tablet .capgrid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}html.tablet .capattrs{columns:2}html.tablet .shipgrid{grid-template-columns:1fr 1fr}html.tablet .mktgrid{grid-template-columns:1fr!important}
html.tablet table.mkt{display:table;white-space:normal;width:100%}html.tablet .guidewrap{grid-template-columns:240px 1fr;height:100%;overflow:hidden!important}html.tablet .gcols{grid-template-columns:1fr 1fr}
html.tablet .treewrap{grid-template-columns:minmax(0,1fr) 300px;height:100%;overflow:hidden!important}html.tablet .treesvg{height:100%}
html.tablet #panelBody{padding:16px 20px 44px}html.tablet .phead{padding:12px 18px}html.tablet .phead h1{font-size:30px}html.tablet .pthumb{width:64px;height:64px}
html.tablet #panel.small{width:min(560px,92%)}html.tablet #modalBox{max-width:min(620px,92vw)}html.tablet .convo .side{flex-basis:220px}html.tablet .portrait{width:240px;height:240px}
html.tablet .sheet{width:min(640px,100%)}html.tablet .sheetgrid{grid-template-columns:repeat(5,1fr)}html.tablet .tgpoints{grid-template-columns:repeat(4,1fr)}html.tablet .lgform{grid-template-columns:1fr 1fr}
html.tablet:not(.compact) .hbtn{min-height:44px;padding:8px 14px;font-size:15px}html.tablet:not(.compact) #hudKeys{display:none}html.tablet .pill{font-size:13.5px;padding:4px 11px 4px 5px}html.tablet .pill .mini{width:56px}
html.tablet #stick{width:160px;height:160px}html.tablet .tbtn{width:88px;height:88px}html.tablet .tbtn.fire{width:112px;height:112px}
html.tablet #shipMini{top:auto;bottom:230px;font-size:12px}html.tablet.compact .phead .pbtns>.btn:not(.gold):not(.sheetopen):not(.sm){display:inline-flex}html.tablet.compact .sheetopen{display:none!important}
html.phone .mktgrid table.mkt tr,html.phone table.lgmkt tr{height:auto!important}html.phone .mktgrid td.iname{max-width:none;overflow:visible}
html.mobile #nearCard img.ico{width:1.35em!important;height:1.35em!important}html.mobile #nearCard .ncTags{display:flex;flex-wrap:wrap;gap:4px}html.mobile #nearCard .tag{display:inline-flex;align-items:center;gap:3px}html.tablet #nearCard{top:110px;max-width:520px}html.phone #nearCard{left:8px;right:8px;max-width:none}html.phone #nearCard .ncTags .tag:nth-child(n+5){display:none}
html.phone #nearCard{left:8px!important;right:96px;transform:none!important;animation:none;max-width:none;top:92px}html.phone #nearCard .ncName{font-size:17px}html.phone #radarHit{width:88px;height:88px}
.forgot{font-size:12.5px;color:var(--cyan,#7fe0ff);text-decoration:underline;opacity:.9}.forgot:hover{opacity:1}.authmsg{line-height:1.4}
/* ---------- title hecklers + legal */
.heckler{width:min(430px,92vw);height:92px;margin:6px auto 10px;display:flex;align-items:center;gap:10px;cursor:pointer;opacity:0;transform:translateY(8px) scale(.97);text-align:left}
.heckler:empty{display:none}.heckler.flip{flex-direction:row-reverse}.heckler.in{opacity:1;transform:none;transition:opacity .45s ease,transform .45s cubic-bezier(.2,1.4,.4,1)}
.heckler img{width:84px;height:84px;flex:none;filter:drop-shadow(0 6px 12px #000a);animation:bob 3.2s ease-in-out infinite}
.hbub{position:relative;flex:1;background:#fff8e1;color:#2a1c00;border:2px solid var(--gold2);border-radius:14px;padding:7px 12px;font-size:13px;line-height:1.3;box-shadow:var(--shadow)}
.hbub b{display:block;font-family:"Pirata One",Georgia,serif;font-weight:400;font-size:16px;color:#7a4b00;letter-spacing:.4px}
.hbub span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hbub:before{content:"";position:absolute;top:50%;left:-9px;margin-top:-8px;border:8px solid transparent;border-left:0;border-right-color:var(--gold2)}
.heckler.flip .hbub:before{left:auto;right:-9px;border:8px solid transparent;border-right:0;border-left-color:var(--gold2)}
html.phone .heckler{height:86px}html.phone .heckler img{width:64px;height:64px}html.phone .hbub{font-size:12px;padding:6px 10px}
.agree{font-size:11.5px;margin:-4px auto 8px;max-width:350px}.agree a,.legallinks a{color:var(--cyan)}
.legallinks{font-size:12px;color:var(--dim);margin-top:12px}.legallinks a{text-decoration:none;padding:6px 2px;display:inline-block}.legallinks a:hover{text-decoration:underline}
.legaltabs{flex-wrap:wrap}.legalbody{overflow:auto}.legaldoc{max-width:820px;margin:0 auto;line-height:1.6}.legaldoc .lead{font-size:16px;border-left:3px solid var(--gold2);padding:4px 0 4px 12px;color:#fff7d6}
.legaldoc code{background:var(--panel2);border-radius:6px;padding:1px 6px;font-size:12.5px}.legaldoc a{color:var(--cyan)}.legaldoc li{margin:5px 0}
.ltable{overflow-x:auto;margin:8px 0}.ltable table{border-collapse:collapse;width:100%;font-size:13.5px}.ltable th,.ltable td{border:1px solid var(--line);padding:7px 9px;text-align:left;vertical-align:top}.ltable th{background:var(--panel2);color:var(--gold)}
/* title on touch devices: scroll from the top (a centred flex box that overflows hides its top for good), and fit a phone */
.heckler,.heckler.flip{transform:none;transition:opacity .25s ease}.heckler.in{transform:none;transition:opacity .35s ease}.heckler img{border-radius:50%;animation:none}
html.mobile #title{align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:max(10px,env(safe-area-inset-top)) 0 max(14px,env(safe-area-inset-bottom))}
html.mobile #title .tbox{margin:auto;width:100%;padding:0 12px;animation:none}
html.phone .tbox .skull{display:none}
html.phone .tbox h1{font-size:clamp(40px,13vw,64px)}
html.phone .tbox .tag1{font-size:clamp(15px,4.6vw,19px);margin:4px 0 2px;line-height:1.2}html.phone .tbox .tag2{font-size:12px;margin:0 0 4px;line-height:1.3}
html.phone .heckler{height:78px;margin:4px auto 8px;gap:8px}html.phone .heckler img{width:60px;height:60px}html.phone .hbub{font-size:12px;line-height:1.25;padding:5px 9px}html.phone .hbub b{font-size:14px}
html.phone .authbox{padding:10px 12px;gap:6px;margin-bottom:8px}html.phone .authbox input{font-size:16px}
html.phone .dim.or{font-size:11.5px;line-height:1.3;margin:0 auto 4px;max-width:340px}html.phone .agree{margin:0 auto 6px}
html.phone .titlegrid{margin-top:8px}html.phone .legallinks{margin-top:6px}html.phone .legallinks a{padding:9px 3px}
@media (max-height:700px){html.phone .tbox .tag2{display:none}}
@media (max-height:480px) and (orientation:landscape){html.mobile .tbox .skull,html.mobile .tbox .tag2{display:none}html.mobile .tbox h1{font-size:44px}html.mobile .tbox .tag1{font-size:15px;margin:2px 0}html.mobile .heckler{height:70px;margin:2px auto 6px}html.mobile .heckler img{width:56px;height:56px}}
.heckler:empty{display:flex}
/* phone flight HUD: nothing on top of anything else */
html.phone #hudObj{max-width:calc(100vw - 114px)}
html.phone #coordTag{left:auto;right:8px;transform:none;top:150px;padding:3px 10px;font-size:11px}
html.phone #shipMini{top:98px}
html.phone body:has(#nearCard:not(.hidden)) #shipMini,html.phone body:has(#nearCard:not(.hidden)) #coordTag{display:none}
/* phone minigames: keep the play area and its controls on one screen */
html.phone .tgnote{display:none}html.phone .tghead small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}html.phone .tghead{margin-bottom:6px}
html.phone #modalBox h2{font-size:24px;margin:0 0 4px}html.phone .tgstage{margin:6px 0}
html.mobile .switch,html.mobile .setrow .switch{min-height:36px;height:36px;width:58px;border-radius:18px}html.phone #panel button.btn{min-width:40px}
html.mobile .switch i{top:5px;left:5px;width:24px;height:24px}html.mobile .switch.on i{left:27px}
html.mobile #panel button{min-height:36px}