:root{--bg: #101218;--surf: #1a1d26;--surf2: #232735;--line: #2d3240;--fg: #ece6d8;--muted: #9a99a3;--sodium: #f2a541;--p1: #4cc3c7;--danger: #e5574d;--heal: #7fcf7c;--gold: #d9b45a;--r-s: #e98bd0;--r-c: #a3abbd;--r-r: #5aa9ff;--r-l: #f5c84b;--f-display: "Noto Sans Thai Looped", "Sarabun", system-ui, sans-serif;--f-body: "Sarabun", system-ui, sans-serif;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font:15px/1.5 var(--f-body)}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--sodium);outline-offset:2px}#app{display:grid;grid-template-columns:minmax(0,1fr) 340px;height:100%}@media(max-width:900px)and (orientation:portrait){#app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;height:auto}#stage{height:62vh}}#stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:#07080c}#game{position:absolute;top:0;right:0;bottom:0;left:0}#game canvas{image-rendering:pixelated}#hud{background:var(--bg);border-left:1px solid var(--line);padding:14px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}#hud>*{flex-shrink:0}#toast{position:absolute;top:12px;left:50%;transform:translate(-50%);background:#0b0d12e6;border:1px solid var(--line);border-radius:8px;padding:6px 14px;font:600 15px var(--f-display);pointer-events:none}#guide{position:absolute;top:12px;left:50%;transform:translate(-50%);width:min(560px,calc(100% - 24px));background:#12151dee;border:1px solid var(--sodium);border-radius:10px;padding:10px 14px;display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:center;z-index:5}#guide .step{font:600 12px var(--f-display);color:#1b1408;background:var(--sodium);border-radius:99px;padding:2px 10px}#guide p{margin:0;font-size:15px}#guide p b{color:var(--sodium)}#guide button{background:none;border:0;color:var(--muted);font-size:13px;text-decoration:underline}#endbox{position:absolute;top:0;right:0;bottom:0;left:0;background:#0b0d12d9;display:grid;place-items:center;text-align:center;padding:20px}#endbox h2{font:600 30px var(--f-display);margin:0 0 6px}#endbox .rw{display:flex;gap:10px;justify-content:center;margin:14px 0;flex-wrap:wrap}#endbox .chip{display:flex;align-items:center;gap:6px;background:var(--surf);border:1px solid var(--line);border-radius:6px;padding:4px 10px;font-weight:600}#endbox .chip img{width:24px;height:24px;image-rendering:pixelated}#login{position:fixed;top:0;right:0;bottom:0;left:0;z-index:95;overflow-y:auto;display:grid;place-items:center;padding:16px;background:radial-gradient(ellipse 60% 50% at 30% 18%,#f2a54133,transparent 70%),var(--bg)}#login:before{content:"";position:fixed;top:-50px;right:0;bottom:0;left:0;pointer-events:none;opacity:.35;background:repeating-linear-gradient(105deg,transparent 0 22px,#aabedc22 22px 23px);animation:lg-rain .9s linear infinite}@keyframes lg-rain{to{transform:translateY(50px)}}@media(prefers-reduced-motion:reduce){#login:before{animation:none}}#login .lg{position:relative;width:min(860px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:28px;align-items:center}#login .lg-side{display:grid;justify-items:center;gap:6px;text-align:center}#login .lg-team{display:flex;gap:10px;margin-bottom:6px}#login figure{margin:0;display:grid;justify-items:center;gap:3px;font-size:12px;color:var(--muted)}#login figure img{width:64px;height:64px;image-rendering:pixelated;border-radius:10px;background:var(--surf);border:1px solid var(--line)}#login h1{margin:0;font:700 44px/1.15 var(--f-display)}#login h1 span{color:var(--sodium)}#login .lg-tag{margin:0;color:var(--muted);font-size:15px}#login .lg-form{display:grid;gap:10px;padding:20px;background:#161a23f2;border:1px solid var(--line);border-radius:14px}#login h2{margin:0;font:600 20px var(--f-display)}#login label{display:grid;gap:4px;font-size:13px;color:var(--muted)}#login input[type=email],#login input[type=password]{height:44px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:15px var(--f-body)}#login input:focus-visible{outline:2px solid var(--sodium);outline-offset:1px;border-color:transparent}#login .lg-check{display:flex;align-items:center;gap:8px;color:var(--fg);font-size:14px;min-height:32px}#login .lg-check input{width:18px;height:18px;accent-color:var(--sodium)}#login .lg-msg{margin:0;min-height:1.4em;font-size:13px;color:#ff9a90}#login .lg-msg.ok{color:var(--heal)}#login .lg-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}#login .btn{min-height:44px;font-size:15px}#login .lg-or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}#login .lg-or:before,#login .lg-or:after{content:"";flex:1;height:1px;background:var(--line)}#login .lg-guest{border-color:var(--p1);color:var(--p1);font-weight:600}#login .lg-note{margin:0;color:var(--muted);font-size:12.5px;line-height:1.45}#login .lg-note b{color:var(--fg)}#login .lg-off{justify-self:center;font-size:12.5px;color:var(--muted);min-height:32px}#login .lg-foot{grid-column:1 / -1;margin:0;text-align:center;color:var(--muted);font-size:12px}@media(max-width:720px)and (orientation:portrait){#login .lg{grid-template-columns:minmax(0,1fr);gap:16px}}@media(orientation:landscape)and (max-height:560px){#login .lg{gap:16px;grid-template-columns:minmax(0,1fr) minmax(0,360px)}#login figure img{width:44px;height:44px}#login h1{font-size:32px}#login .lg-form{padding:12px 14px;gap:7px}#login .lg-note{display:none}#login input[type=email],#login input[type=password]{height:40px}#login .lg-foot{display:none}}#comic{position:fixed;top:0;right:0;bottom:0;left:0;z-index:96;background:#07080c;display:grid;place-items:center;padding:10px;cursor:pointer}#comic .cm-wrap{width:min(100%,calc((100dvh - 64px) * 16 / 9));display:grid;gap:8px}#comic .cm-page{aspect-ratio:16 / 9;display:grid;gap:8px;padding:8px;background:#0b0b0d;border:3px solid #e9e4d8;border-radius:4px}#comic .cm-panel{position:relative;overflow:hidden;border:3px solid #e9e4d8;background-color:#1a1d26;background-size:cover;background-repeat:no-repeat;image-rendering:pixelated;opacity:0;transform:translateY(8px);transition:opacity .32s ease,transform .32s ease}#comic .cm-panel.on{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){#comic .cm-panel{transition:none;transform:none}}#comic .cm-cap{position:absolute;left:8px;top:8px;max-width:70%;margin:0;padding:4px 10px;background:#f2d36b;color:#1b1408;border:2px solid #1b1408;font:600 clamp(11px,1.45vw,16px)/1.35 var(--f-display);box-shadow:2px 2px #000}#comic .cm-bub{position:absolute;max-width:46%;padding:6px 10px;background:#fffdf7;color:#15161c;border:2px solid #15161c;border-radius:14px;font:600 clamp(11px,1.45vw,16px)/1.35 var(--f-body);box-shadow:2px 3px #000a}#comic .cm-bub i{display:block;font-style:normal;font:700 clamp(9px,1.05vw,12px) var(--f-display);margin-bottom:1px}#comic .cm-bub:after{content:"";position:absolute;width:12px;height:12px;background:#fffdf7;border:2px solid #15161c;border-top:0;border-left:0}#comic .cm-bub.t-down:after{left:18px;bottom:-8px;transform:rotate(45deg)}#comic .cm-bub.t-up:after{left:18px;top:-8px;transform:rotate(-135deg)}#comic .cm-bub.t-left:after{left:-8px;top:40%;transform:rotate(135deg)}#comic .cm-bub.t-right:after{right:-8px;top:40%;transform:rotate(-45deg)}#comic .cm-ports{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:space-around;padding:0 6%}#comic .cm-ports img{width:44%;max-width:160px;image-rendering:pixelated}#comic .cm-title{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;text-align:center;gap:2px}#comic .cm-title b{font:700 clamp(26px,4.4vw,54px)/1.1 var(--f-display);color:var(--sodium)}#comic .cm-title span{font:700 clamp(18px,3vw,36px)/1.2 var(--f-display);color:#dfe9d8}#comic .cm-title em{font:600 clamp(11px,1.3vw,15px) var(--f-body);font-style:normal;color:#9fc2a6;margin-top:6px}#comic .cm-bar{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}#comic .cm-dots{display:flex;gap:6px}#comic .cm-dots i{width:8px;height:8px;border-radius:50%;background:var(--line)}#comic .cm-dots i.on{background:var(--sodium)}#comic .cm-hint{margin-right:auto}#comic .btn{min-height:40px}#update{position:fixed;z-index:120;left:50%;top:max(10px,env(safe-area-inset-top,0px));transform:translate(-50%);display:flex;align-items:center;gap:10px;max-width:min(560px,calc(100vw - 20px));padding:8px 8px 8px 14px;background:#14110cf2;border:2px solid var(--sodium);border-radius:12px;box-shadow:0 6px 18px #000a;color:#ffe9c2}#update .up-t{font:600 14px/1.35 var(--f-body)}#update .up-t b{font-family:var(--f-display);color:var(--sodium);margin-right:4px}#update .up-t small{display:block;font-weight:400;font-size:12px;color:#c9bba0}#update .btn{min-height:40px;white-space:nowrap}#update .up-x{background:none;border:0;color:#a89f84;font:700 15px sans-serif;min-width:32px;min-height:40px}#loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:16px;background:var(--bg);transition:opacity .2s}#loading.out{opacity:0}#loading .ld{width:min(520px,100%);display:grid;gap:8px;justify-items:center;text-align:center}#loading .ld-k{margin:0;font:500 13px var(--f-display);color:var(--sodium);letter-spacing:.5px}#loading h2{margin:0;font:700 28px/1.2 var(--f-display)}#loading .ld-sub{margin:0;color:var(--muted);font-size:14px}#loading .ld-team{display:flex;gap:12px;margin:6px 0}#loading figure{margin:0;display:grid;gap:2px;justify-items:center;font-size:12px;color:var(--muted)}#loading figure img{width:56px;height:56px;image-rendering:pixelated;border-radius:8px;background:var(--surf);border:1px solid var(--line)}#loading .ld-bar{width:100%;height:6px}#loading .ld-bar i{background:var(--sodium);transition:width .15s}#loading .ld-tip{margin:4px 0 0;color:var(--muted);font-size:13px}#loading .ld-tip b{color:var(--fg)}@media(max-height:420px){#loading h2{font-size:22px}#loading figure img{width:44px;height:44px}#loading .ld{gap:5px}}.top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.top .btn{font-size:12px;padding:4px 10px}.top h1{font:600 22px/1.2 var(--f-display);margin:0}.top h1 span{color:var(--sodium)}.top p{margin:2px 0 0;color:var(--muted);font-size:13px}.status{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.pill{font:600 12px var(--f-body);padding:2px 10px;border-radius:99px;background:var(--surf2)}.pill.player{color:var(--p1)}.pill.enemy{color:var(--danger)}.pill.end{color:var(--gold)}.threat{flex:1 1 140px}.threat .lbl{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.bar{height:6px;background:var(--surf2);border-radius:3px;overflow:hidden}.bar b{display:block;height:100%;transition:width .25s}.threat .bar b{background:linear-gradient(90deg,var(--gold),var(--danger))}.team{display:grid;gap:6px}.tm{display:grid;grid-template-columns:44px 1fr;gap:2px 10px;align-items:center;text-align:left;background:var(--surf);border:1px solid var(--line);border-radius:8px;padding:6px 8px}.tm img{width:44px;height:44px;image-rendering:pixelated;border-radius:6px;background:#0b0d12;grid-row:span 2}.tm.on{border-color:var(--sodium)}.tm.ult{border-color:#ffb347;box-shadow:0 0 10px #ffb34766;animation:ult-glow 1.8s ease-in-out infinite}.tm.ult .nm small{color:#ffc46b;font-weight:600}.tm.ult .rgb b{background:#ffc46b}.btn.ult-ready{animation:ult-glow 1.8s ease-in-out infinite}@keyframes ult-glow{0%,to{box-shadow:0 0 4px #ffb34755}50%{box-shadow:0 0 14px #ffb347cc}}@media(prefers-reduced-motion:reduce){.tm.ult,.btn.ult-ready{animation:none;box-shadow:0 0 10px #ffb34799}}.tm.done{opacity:.6}.tm.down{border-color:var(--danger)}.tm.dead{opacity:.35}.tm .nm{font-size:14px;line-height:1.2;display:flex;justify-content:space-between;gap:6px}.tm .nm small{color:var(--muted);font-size:12px}.tm .bars{display:grid;gap:3px}.hpb b{background:var(--heal)}.rgb b{background:var(--sodium)}.sel{background:var(--surf);border:1px solid var(--line);border-radius:8px;padding:12px;display:grid;gap:8px}.sel h3{margin:0;font:600 16px var(--f-display)}.sel p{margin:0;font-size:13.5px}.hint{color:var(--muted);font-size:13px}.hint b{color:var(--fg)}.acts{display:flex;flex-wrap:wrap;gap:6px}.btn{background:var(--surf2);border:1px solid var(--line);border-radius:6px;padding:6px 12px;font-size:14px}.btn:hover:not(:disabled){border-color:var(--sodium)}a.btn{display:inline-flex;align-items:center;justify-content:center;color:var(--fg);text-decoration:none}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.main{background:var(--sodium);border-color:var(--sodium);color:#1b1408;font-weight:600}.btn.big{width:100%;padding:10px;font-size:16px}.log{list-style:none;margin:0;padding:8px 10px;background:var(--surf);border:1px solid var(--line);border-radius:8px;font-size:13px;max-height:170px;overflow:auto;display:flex;flex-direction:column-reverse;gap:2px}.log .good{color:var(--heal)}.log .bad{color:var(--danger)}.log .info{color:var(--sodium)}.loot{display:flex;gap:10px;font-size:13px;color:var(--muted);align-items:center}.loot img{width:20px;height:20px;image-rendering:pixelated;vertical-align:middle}#story{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#07080cd0;display:grid;align-items:end;justify-items:center;padding:24px max(16px,env(safe-area-inset-left,0px)) 32px;cursor:pointer}.story-card{width:min(760px,100%);background:var(--surf);border:1px solid var(--line);border-radius:12px;padding:16px 18px;display:grid;gap:12px;cursor:default;box-shadow:0 12px 40px #000a}.story-title{display:flex;justify-content:space-between;font:600 13px var(--f-display);color:var(--sodium);letter-spacing:.04em}.story-title span{color:var(--muted);font-weight:400}.story-body{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;min-height:96px}.story-card.narr .story-body{grid-template-columns:1fr}.story-body img{width:96px;height:96px;image-rendering:pixelated;background:#0b0d12;border-radius:8px;border:1px solid var(--line)}.story-body .badge{width:96px;height:96px;border-radius:8px;border:2px solid;display:grid;place-items:center;font:600 40px var(--f-display);background:#0b0d12}.story-text b{font:600 17px var(--f-display)}.story-text p{margin:4px 0 0;font-size:17px;line-height:1.6;min-height:3.2em}.story-card.narr .story-text p{font-style:italic;color:#cfc8b8}.story-acts{display:flex;justify-content:flex-end;gap:8px}@media(max-width:520px){.story-body img,.story-body .badge{width:64px;height:64px;font-size:28px}.story-text p{font-size:15px}}.bossbar{background:var(--surf);border:1px solid #e5574d88;border-radius:8px;padding:8px 10px;display:grid;gap:4px}.bossbar .lbl{display:flex;justify-content:space-between;font:600 13px var(--f-display);color:#ff9a90}.bossbar .bar{height:10px}.bossbar .bar b{background:linear-gradient(90deg,#e5574d,#ff9a90)}.res{display:flex;gap:6px;flex-wrap:wrap}.res .chip{display:flex;align-items:center;gap:4px;background:var(--surf);border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-weight:600;font-variant-numeric:tabular-nums}.res .chip img{width:22px;height:22px;image-rendering:pixelated}.res .chip small{font-weight:400;color:var(--muted);font-size:11px}.goal{margin:0;font-size:13px;color:var(--sodium)}.goal b{color:#7fe8a0}.goal.done{color:#7fe8a0;background:#7fe8a014;border:1px solid #7fe8a055;border-radius:6px;padding:6px 8px}.btn.exit{background:#3fbf6e;border-color:#3fbf6e;color:#07140c;font-weight:600}.tm.gone{opacity:.55;border-color:#3fbf6e88}.note{margin:0;font-size:13px;background:var(--surf2);border-left:3px solid var(--heal);padding:6px 10px;border-radius:4px}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line)}.tab{background:none;border:0;border-bottom:2px solid transparent;padding:6px 12px;color:var(--muted);font-family:var(--f-display)}.tab[aria-selected=true]{color:var(--fg);border-bottom-color:var(--sodium)}.node-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.k-easy{color:#6fd36a}.k-mid{color:#f2d14b}.k-hard{color:#f2a541}.k-deadly{color:#e5574d}.k-camp{color:#4cc3c7}.k-story{color:#e8c66a}.k-done{color:var(--heal)}.k-locked{color:#6b6d78}.pill.k-easy,.pill.k-mid,.pill.k-hard,.pill.k-deadly,.pill.k-camp,.pill.k-story,.pill.k-done{background:none;border:1px solid currentColor}dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0;font-size:13.5px}dt{color:var(--muted)}dd{margin:0}.cost{display:inline-flex;align-items:center;gap:2px;margin-right:4px;font-variant-numeric:tabular-nums}.cost img{width:18px;height:18px;image-rendering:pixelated;vertical-align:middle}.nodes{display:grid;gap:2px}.node{display:flex;align-items:center;gap:8px;text-align:left;background:none;border:1px solid transparent;border-radius:6px;padding:4px 8px;font-size:14px}.node:hover{border-color:var(--line)}.node[aria-current=true]{border-color:var(--sodium);background:var(--surf2)}.node.locked{color:var(--muted)}.node small{margin-left:auto;color:var(--muted);font-size:12px}.dot{width:10px;height:10px;border-radius:50%;background:currentColor;flex:none}.cards{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cards.one{grid-template-columns:1fr}.card{background:var(--surf);border:1px solid var(--line);border-radius:8px;padding:10px;display:grid;gap:6px;align-content:start}.card p{margin:0;font-size:13px;color:var(--muted)}.card-h{display:flex;justify-content:space-between;gap:6px}.lv{color:var(--gold);font-weight:600;font-size:13px}.card.hero{grid-template-columns:56px 1fr;align-items:start}.card.hero>img{width:56px;height:56px;image-rendering:pixelated;background:#0b0d12;border-radius:6px}.card.hero>div{display:grid;gap:4px}.card.hero .card-h{justify-content:flex-start;align-items:center;flex-wrap:wrap}.card.hero .card-h .lv{margin-left:auto}.card.hero .pill{font-size:11px;padding:0 8px}.card.in-squad{border-color:var(--p1)}.card.hurt{opacity:.7}.row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.tab{position:relative}.dot-new{position:absolute;top:4px;right:2px;width:7px;height:7px;border-radius:50%;background:var(--heal)}.pulls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.pulls.one{grid-template-columns:minmax(0,120px);justify-content:center}.pcard{perspective:500px;aspect-ratio:3 / 4}.pcard .in{position:relative;width:100%;height:100%;transition:transform .45s ease;transform-style:preserve-3d}.pcard.open .in{transform:rotateY(180deg)}.pcard .back,.pcard .face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;border-radius:6px;overflow:hidden}.pcard .back{display:grid;place-items:center;background:repeating-linear-gradient(135deg,#1d2536 0,#1d2536 6px,#19202f 6px,#19202f 12px);border:1px solid var(--line);color:var(--muted);font-size:18px}.pcard .face{transform:rotateY(180deg)}.pcard .face .sart{width:100%;height:100%}.pcard .cap{position:absolute;left:0;right:0;bottom:0;padding:3px 4px;background:linear-gradient(transparent,#000d 35%);font-size:10.5px;line-height:1.3}.pcard .cap b{display:block;font:600 12px var(--f-display)}.pcard .cap em{color:var(--heal);font-style:normal;font-weight:600}.pcard.t-L.open{filter:drop-shadow(0 0 8px #f5c84b99)}.pcard.t-R.open{filter:drop-shadow(0 0 5px #5aa9ff77)}.sart{position:relative;display:grid;place-items:center;border:2px solid var(--rc);border-radius:6px;overflow:hidden;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--rc) 35%,#141926),#0e121b 75%)}.sart img{width:80%;image-rendering:pixelated}.sart .ini{font:700 26px var(--f-display);color:color-mix(in srgb,var(--rc) 70%,#fff)}.sart svg{position:absolute;top:3px;right:3px;width:12px;height:12px;color:var(--rc)}.pity{display:grid;gap:4px}.pity-h{display:flex;justify-content:space-between;color:var(--muted);font-size:13px}.bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;background:var(--r-r)}.bar.l i,.bar.s i{background:var(--r-l)}.odds{width:100%;border-collapse:collapse;font-size:13px}.odds th,.odds td{padding:4px 5px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.odds th{color:var(--muted);font-weight:400}.odds .n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.rdot{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}.stars{color:var(--r-l);font-size:12px;letter-spacing:1px}.stars s{color:var(--line);text-decoration:none}.srow{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.srow .bar{flex:1;min-width:50px}.srow .btn{padding:2px 8px;font-size:12px}.card.rec{grid-template-columns:56px 1fr;align-items:start}.card.rec .sart{width:56px;height:56px}.card.rec>div{display:grid;gap:4px}.card.rec .card-h{justify-content:flex-start;align-items:baseline;flex-wrap:wrap}.soon{color:var(--sodium)!important;font-size:12px!important}h3.sub{margin:4px 0 0;font:600 15px var(--f-display)}.card.bld{cursor:pointer}.card.bld.hot{border-color:var(--sodium)}.card .next{color:var(--fg)}.pips{display:flex;gap:3px;align-items:center}.pips i{width:9px;height:5px;border-radius:1px;background:var(--line)}.pips i.on{background:var(--sodium)}.pips small{margin-left:6px;color:var(--muted);font-size:12px}.slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.slot{aspect-ratio:1;border:1px dashed var(--line);border-radius:8px;display:grid;place-content:center;text-align:center;font-size:13px;line-height:1.35;color:var(--muted);padding:4px;background:none}.slot small{font-size:11px}.slot.full{position:relative;border:1px solid var(--p1);padding:0;overflow:hidden;background:#0b0d12}.slot.full img{width:100%;height:100%;image-rendering:pixelated;display:block}.slot.full span{position:absolute;left:0;right:0;bottom:0;padding:1px 0;background:#000b;color:var(--fg);font:500 13px var(--f-display)}.slot.lock{background:repeating-linear-gradient(135deg,transparent 0 6px,#ffffff07 6px 12px)}.squad-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:14px}.squad-line img{width:22px;height:22px;image-rendering:pixelated;border-radius:4px;background:#0b0d12}.link{background:none;border:0;padding:0;color:var(--sodium);text-decoration:underline;font-size:13px}.foot{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}.foot .hint{margin-right:auto}.foot.acct{margin-top:0;padding-top:0;border-top:0}.foot.acct .hint{overflow-wrap:anywhere}details{background:var(--surf);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:13px}summary{cursor:pointer;font-family:var(--f-display)}details ul{margin:6px 0;padding-left:18px}.lastlog{display:none}.card-h{align-items:baseline}.card-h .lv{white-space:nowrap;flex-shrink:0}.btn.up{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.25}.up-c{display:inline-flex;flex-wrap:nowrap;align-items:center;gap:6px;white-space:nowrap}.up-c .cost{margin-right:0}.prod{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.rest{display:grid;gap:4px}.seg{display:grid;grid-template-columns:1fr 1fr;gap:6px}.seg .btn{min-width:0;line-height:1.25}.seg .btn.on{background:var(--sodium);color:#1a1206;border-color:var(--sodium);font-weight:700}.pull-btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.pull-btns .btn{min-height:52px;padding:4px 6px}.odds .nw{white-space:nowrap}.sheet,.r-top,.r-bot{display:contents}.sheet>*,.r-top>*,.r-bot>*{flex-shrink:0}.tab .ti,.tab-mob,.odds-line{display:none}.sh-h{margin:0;font:600 16px var(--f-display)}.card.set-row{grid-template-columns:minmax(0,1fr) auto;align-items:center}.set-row b{font-family:var(--f-display)}#rotate{display:none}@media(orientation:portrait)and (max-width:600px){#rotate{display:grid;position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;place-items:center;text-align:center;padding:24px;background:var(--bg)}#rotate b{font:600 22px var(--f-display);display:block;margin-bottom:6px}#rotate b:before{content:"📱↻";display:block;font-size:40px;margin-bottom:10px}#rotate p{color:var(--muted);margin:0}}@media(orientation:landscape)and (max-height:560px){#app{grid-template-columns:minmax(0,1fr) clamp(220px,30vw,280px)}#hud{padding:8px max(8px,env(safe-area-inset-right,0px)) 8px 8px;gap:6px;font-size:14px}#hud .btn{min-height:40px}#app:has(>#hud[data-mode=raid]){--sl: env(safe-area-inset-left, 0px);--sr: env(safe-area-inset-right, 0px);--sb: env(safe-area-inset-bottom, 0px);--col-w: 150px;--gap: 8px;--bot-h: 54px;grid-template-columns:minmax(0,1fr)}#hud[data-mode=raid]{display:contents}#hud[data-mode=raid] .loot,#hud[data-mode=raid] .log,#hud[data-mode=raid] details,#hud[data-mode=raid] .lastlog,#hud[data-mode=raid] .top h1,#hud[data-mode=raid] .threat .lbl{display:none}#hud[data-mode=raid]>.top{position:fixed;z-index:15;top:6px;right:max(8px,var(--sr));align-items:center;gap:6px;padding:4px 4px 4px 10px;background:#0b0d12d9;border:1px solid var(--line);border-radius:10px}#hud[data-mode=raid]>.top p{margin:0;font-size:12px;white-space:nowrap}#hud[data-mode=raid]>.top .btn{min-height:32px;padding:2px 8px;font-size:11px}#hud[data-mode=raid]>.top .row{flex-wrap:nowrap;gap:4px}#hud[data-mode=raid] .r-top{display:flex;flex-direction:column;gap:4px;position:fixed;z-index:15;top:6px;left:calc(var(--sl) + var(--col-w) + var(--gap) * 2);right:calc(max(8px,var(--sr)) + 270px);max-width:420px;padding:6px 10px;background:#0b0d12d9;border:1px solid var(--line);border-radius:10px;pointer-events:none}#hud[data-mode=raid] .status{flex-wrap:nowrap;gap:8px}#hud[data-mode=raid] .status .pill{white-space:nowrap;font-size:11px}#hud[data-mode=raid] .threat{flex:1 1 auto}#hud[data-mode=raid] .goal{font-size:11.5px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#hud[data-mode=raid] .goal.done{padding:2px 6px}#hud[data-mode=raid] .bossbar{padding:3px 8px}#hud[data-mode=raid] .team{position:fixed;z-index:15;top:6px;bottom:calc(var(--sb) + 6px);left:calc(var(--sl) + var(--gap));width:var(--col-w);display:flex;flex-direction:column;gap:6px;overflow-y:auto}#hud[data-mode=raid] .tm{flex:0 1 76px;min-height:58px;grid-template-columns:48px 1fr;gap:3px 8px;padding:5px 6px;background:#12151ce6;border-width:2px;border-radius:10px}#hud[data-mode=raid] .tm img{width:48px;height:48px}#hud[data-mode=raid] .tm.on{border-color:var(--sodium);background:#2a2214f0}#hud[data-mode=raid] .tm .nm{flex-direction:column;gap:0;font-size:14px}#hud[data-mode=raid] .tm .nm small{font-size:11px}#hud[data-mode=raid] .tm .bars{gap:3px}#hud[data-mode=raid] .tm .bar{height:7px}#hud[data-mode=raid] .r-bot{display:flex;gap:var(--gap);align-items:stretch;position:fixed;z-index:15;bottom:calc(var(--sb) + 6px);left:calc(var(--sl) + var(--col-w) + var(--gap) * 2);right:calc(max(8px,var(--sr)) + 140px);height:var(--bot-h);pointer-events:none}#hud[data-mode=raid] .r-bot>*{pointer-events:auto}#hud[data-mode=raid] .sel{flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:8px;padding:4px 5px;background:#12151ce6;border-radius:12px;overflow:hidden}#hud[data-mode=raid] .sel h3,#hud[data-mode=raid] .sel .stats{display:none}#hud[data-mode=raid] .sel>p:not(.key){display:none}#hud[data-mode=raid] .sel>p.key{flex:1 1 auto;min-width:120px;max-width:260px;margin:0 0 0 6px;font-size:12px!important;line-height:1.3;color:#ffd38a!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#hud[data-mode=raid] .sel:not(:has(.acts)):not(:has(p.key)){display:none}#hud[data-mode=raid] .acts{flex:0 1 auto;min-width:0;display:flex;flex-wrap:nowrap;gap:5px;overflow-x:auto}#hud[data-mode=raid] .acts .btn{flex:0 0 auto;min-height:44px;max-width:170px;padding:2px 10px;font-size:12px;line-height:1.2;white-space:normal}#hud[data-mode=raid] #endTurn{position:fixed;z-index:16;right:max(8px,var(--sr));bottom:calc(var(--sb) + 6px);width:128px;height:60px;min-height:0;padding:2px 6px;font-size:16px;line-height:1.2;border-radius:16px;box-shadow:0 4px 14px #0009}#hud[data-mode=raid] #endTurn small{font-size:10.5px!important}#app:has(>#hud[data-mode=raid]) #guide{top:74px;left:calc(var(--sl) + var(--col-w) + var(--gap) * 2);right:max(8px,var(--sr));width:auto;transform:none;max-width:520px;padding:6px 10px}#guide{top:6px;padding:6px 10px}#guide p{font-size:13px}#app:has(>#hud[data-mode=camp]){--sheet-w: clamp(300px, 50vw, 460px);--top-h: 44px;--bar-h: 52px;--sl: env(safe-area-inset-left, 0px);--sr: env(safe-area-inset-right, 0px);--sb: env(safe-area-inset-bottom, 0px);grid-template-columns:minmax(0,1fr) var(--sheet-w);grid-template-rows:var(--top-h) minmax(0,1fr) calc(var(--bar-h) + var(--sb));grid-template-areas:"top res" "stage sheet" "tabs tabs";padding-left:var(--sl)}#app:has(>#hud[data-mode=camp]) #stage{grid-area:stage}#hud[data-mode=camp]{display:contents}#hud[data-mode=camp]>.top{grid-area:top;align-items:center;padding:0 8px 0 12px;background:var(--bg);border-bottom:1px solid var(--line);min-width:0}#hud[data-mode=camp]>.top h1,#hud[data-mode=camp]>.top .btn,#hud[data-mode=camp] .foot{display:none}#hud[data-mode=camp]>.top p{margin:0;font:600 14px var(--f-display);color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#hud[data-mode=camp]>.res{grid-area:res;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:4px;padding:0 max(8px,var(--sr)) 0 4px;background:var(--bg);border-bottom:1px solid var(--line);overflow:hidden}#hud[data-mode=camp] .res .chip{border-radius:99px;padding:2px 8px 2px 4px;font-size:13px;white-space:nowrap}#hud[data-mode=camp] .res .chip img{width:18px;height:18px}#hud[data-mode=camp] .res .chip small{font-size:10px}#hud[data-mode=camp] .sheet{grid-area:sheet;display:flex;flex-direction:column;gap:8px;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:6px max(8px,var(--sr)) 6px 6px;padding:10px;background:var(--surf);border:1px solid var(--line);border-radius:14px}#hud[data-mode=camp] .sheet>*{flex-shrink:0}#hud[data-mode=camp] .sheet .card,#hud[data-mode=camp] .sheet .sel{background:var(--surf2);border-color:var(--surf2);border-radius:12px}#hud[data-mode=camp] .sheet .hint,#hud[data-mode=camp] .goal{font-size:12px}#hud[data-mode=camp] .tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;height:calc(var(--bar-h) + var(--sb));padding:0 max(8px,var(--sr)) var(--sb) calc(8px + var(--sl));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;background:#0b0d12;border-top:1px solid var(--line);border-bottom:0}#hud[data-mode=camp] .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:44px;padding:0;border:0;font:500 11px var(--f-display);color:var(--muted)}#hud[data-mode=camp] .tab .ti{display:block;width:20px;height:20px}#hud[data-mode=camp] .tab[aria-selected=true]{color:var(--sodium);box-shadow:inset 0 3px 0 var(--sodium)}#hud[data-mode=camp] .dot-new{top:6px;right:calc(50% - 16px)}#hud[data-mode=camp] .slots,#hud[data-mode=camp] .pulls{position:fixed;z-index:10;left:calc(8px + var(--sl));right:calc(var(--sheet-w) + 14px + var(--sr));padding:8px;background:#0b0d12e6;border:1px solid var(--line);border-radius:12px}#hud[data-tab=camp] .cards{grid-template-columns:1fr;gap:6px}#hud[data-tab=camp] .card.bld{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:2px;align-items:center;padding:8px 8px 8px 10px}#hud[data-tab=camp] .card.bld>*{grid-column:1}#hud[data-tab=camp] .card.bld>.btn{grid-column:2;grid-row:1 / span 4;min-width:96px;max-width:132px;min-height:44px;font-size:12px;line-height:1.3}#hud[data-tab=camp] .card.bld.hot{border-color:var(--sodium)}#hud[data-tab=camp] .card.bld p{font-size:12px}#hud[data-tab=radio] .pull-btns .btn{font-size:13px}#hud[data-tab=radio] .odds{display:none}#hud[data-tab=radio] .odds-line{display:block;margin:0}#hud[data-mode=camp] .pulls{bottom:calc(var(--bar-h) + var(--sb) + 8px);max-height:calc(100% - var(--top-h) - var(--bar-h) - 24px);overflow-y:auto}#hud[data-tab=team] .slots{top:calc(var(--top-h) + 8px);bottom:calc(var(--bar-h) + var(--sb) + 8px);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:8px}#hud[data-tab=team] .slot{aspect-ratio:auto;min-height:0}#hud[data-tab=team] .slot.full img{object-fit:contain}#hud[data-tab=team] .card.hero{grid-template-columns:44px 1fr}#hud[data-tab=team] .card.hero>img{width:44px;height:44px}}