:root{--paper:#f6f1e7;--paper-2:#ede5d5;--card:#fbf8f1;--ink:#1e1a16;--ink-2:#4a423a;--muted:#6e6458;--line:color-mix(in srgb, var(--ink) 14%, transparent);--clay:#c9573a;--clay-ink:#ae4529;--tone:color-mix(in srgb, var(--ink) 16%, transparent);--shadow:3px 3px 0 var(--ink);--r:3px;--backdrop:#100e0b8c;--hand:"LXGW WenKai Screen", "Kaiti SC", "STKaiti", "KaiTi", serif;--sans:"Inter Variable", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;--gap:8px;--bar:48px;--col:208px;--lcol:92px;--offer:84px;--tipf:13px}:root[data-theme=dark]{--paper:#15130f;--paper-2:#1e1b16;--card:#1b1814;--ink:#efe7d8;--ink-2:#cfc5b4;--muted:#978c7c;--clay:#e2774f;--clay-ink:#ee8d67;--tone:color-mix(in srgb, var(--paper) 12%, #fff 12%);--shadow:3px 3px 0 #000}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--paper) radial-gradient(var(--tone) 1px, transparent 1.4px) 0 0 / 8px 8px;color:var(--ink);font:400 14px/1.45 var(--sans);-webkit-user-select:none;user-select:none;touch-action:manipulation;overflow:hidden}h2,p{margin:0}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}[hidden]{display:none!important}button:focus-visible{outline:2px solid var(--clay);outline-offset:2px}canvas.ic,canvas.face{image-rendering:pixelated;flex:none;display:block}#s-game{gap:var(--gap);padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));grid-template:var(--bar) minmax(0, 1fr) auto / var(--lcol) minmax(0, 1fr) var(--col);grid-template-areas:"top top top""bonds stage side""low low low";display:grid;position:fixed;inset:0}.btn{min-height:40px;font:400 17px/1 var(--hand);background:var(--card);border:2px solid var(--ink);border-radius:var(--r);box-shadow:var(--shadow);white-space:nowrap;padding:0 16px}.btn:active:not(:disabled){box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.btn.primary{background:var(--ink);color:var(--paper);box-shadow:3px 3px 0 var(--clay)}.btn:disabled{opacity:.5}.lab{color:var(--muted);font-size:12px}#top{align-items:center;gap:var(--gap);grid-area:top;min-width:0;display:flex}.chip{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);height:36px;font:400 16px/1 var(--hand);white-space:nowrap;align-items:center;gap:6px;padding:0 12px;display:inline-flex}.chip.heart{color:var(--clay-ink);font-family:var(--sans);letter-spacing:2px}.coin i,.cost:before{content:"";border:2px solid var(--ink);background:#f2b632;border-radius:50%;flex:none;width:13px;height:13px;display:inline-block}#gold{font:700 16px/1 var(--sans)}#foe{white-space:nowrap;flex:1;justify-content:flex-end;align-items:center;gap:6px;min-width:0;display:flex;overflow:hidden}#foe b{font:400 16px/1 var(--hand)}.tag{min-width:22px;height:22px;font:400 14px/1 var(--hand);color:#fff;background:var(--c);border:1.5px solid var(--ink);border-radius:var(--r);place-items:center;padding:0 4px;display:inline-grid}#bonds{grid-area:bonds;grid-auto-rows:1fr;gap:6px;min-height:0;display:grid}.bond{background:var(--card);border:2px solid var(--line);border-radius:var(--r);opacity:.8;align-items:center;gap:4px;min-height:0;padding:0 6px;display:flex}.bond .ic{width:22px;height:22px}.bond .nm{font:400 15px/1 var(--hand)}.bond .ct{font:700 12px/1 var(--sans);color:var(--muted);margin-left:auto}.bond.on{opacity:1;border-color:var(--c);box-shadow:inset 0 0 0 1px var(--c)}.bond.on .ct{color:var(--ink)}#stage{aspect-ratio:8/5;border:2px solid var(--ink);min-width:0;max-width:100%;height:100%;min-height:0;max-height:100%;box-shadow:var(--shadow);background:var(--paper-2);grid-area:stage;place-self:center;position:relative;overflow:hidden}#cv{touch-action:none;width:100%;height:100%;display:block}#toast{background:var(--card);border:2px solid var(--ink);box-shadow:var(--shadow);font:400 15px/1.3 var(--hand);white-space:nowrap;pointer-events:none;padding:4px 12px;position:absolute;top:10px;left:50%;transform:translate(-50%)}#result{background:var(--backdrop);place-items:center;display:grid;position:absolute;inset:0}#result .card{background:var(--card);border:2px solid var(--ink);min-width:240px;box-shadow:var(--shadow);text-align:center;justify-items:center;gap:8px;padding:16px 24px;display:grid}#result h2{font:400 30px/1.1 var(--hand);color:var(--clay-ink)}#side{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);scrollbar-width:thin;flex-direction:column;grid-area:side;gap:6px;min-height:0;padding:8px;display:flex;overflow-y:auto}.who{align-items:center;gap:8px;display:flex}.who .face{background:var(--paper-2);border:2px solid var(--ink);width:44px;height:44px}.who h2{font:400 19px/1.1 var(--hand)}.sub{color:var(--muted);font-size:12px}.skill{color:var(--ink-2);font-size:12px;line-height:1.35}.slots,.bag{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.slot{aspect-ratio:5/3;background:var(--paper-2);border:2px dashed var(--line);border-radius:var(--r);min-width:0;font:400 13px/1 var(--hand);color:var(--muted);place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.slot.lock{opacity:.55}.slot.full{background:var(--card);border:2px solid var(--c)}.slot .ic{object-fit:contain;width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;inset:2px}.tier{min-width:14px;font:700 10px/14px var(--sans);text-align:center;color:var(--paper);background:var(--ink);border-radius:2px;position:absolute;bottom:1px;right:1px}.mini{background:var(--paper-2);border:1.5px solid var(--ink);border-radius:var(--r);height:26px;font:700 12px/1 var(--sans);flex:1;padding:0}.mini.on{background:var(--ink);color:var(--paper)}#low{grid-area:low;gap:4px;min-width:0;display:grid}#tip{height:20px;font-size:var(--tipf);color:var(--ink-2);white-space:nowrap;text-overflow:clip;line-height:20px;overflow:hidden}#row{gap:var(--gap);height:var(--offer);align-items:stretch;display:flex}#reroll,#speed{flex:none;width:92px;padding:0}.cost{font:700 13px/1 var(--sans);align-items:center;gap:3px;display:inline-flex}#shop{gap:var(--gap);flex:1;grid-template-columns:repeat(5,minmax(0,1fr));min-width:0;display:grid}.offer{text-align:left;background:var(--card);border:2px solid var(--c,var(--ink));border-radius:var(--r);min-width:0;box-shadow:2px 2px 0 var(--ink);grid-template:1fr auto/auto minmax(0,1fr);align-items:center;column-gap:8px;padding:6px 8px;display:grid;position:relative}.offer .ic,.offer .face{grid-row:1/3;width:44px;height:44px}.offer .nm{font:400 15px/1.2 var(--hand);white-space:nowrap;align-self:end;overflow:hidden}.offer .tag,.offer .ty{place-self:start}.offer .ty{color:var(--muted);font-size:12px}.offer>.cost{position:absolute;bottom:6px;right:6px}.offer.sold{border:2px dashed var(--line);box-shadow:none;background:0 0}.offer.pick{outline:3px solid var(--clay)}.offer.hero{background:var(--paper-2)}.stat{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);grid-column:span 1;align-items:center;gap:6px;min-width:0;padding:4px 6px;display:flex}#shop:has(.stat){grid-template-columns:repeat(3,minmax(0,1fr))}.stat .face{width:40px;height:40px}.bars{flex:1;gap:1px;min-width:0;display:grid}.bar{grid-template-columns:28px 1fr 44px;align-items:center;gap:4px;display:grid}.bar .lab{font-size:11px;line-height:1.2}.track{background:var(--paper-2);height:7px;display:block}.track i{height:100%;display:block}.v{font:700 11px/1.2 var(--sans);text-align:right}@media (height<=520px){:root{--bar:34px;--col:156px;--lcol:62px;--offer:56px;--gap:5px;--tipf:11px}#s-game{padding-top:max(5px, env(safe-area-inset-top));padding-bottom:max(5px, env(safe-area-inset-bottom))}.chip{height:30px;padding:0 8px;font-size:14px}.btn{min-height:32px;padding:0 10px;font-size:15px}#foe b{font-size:13px}.tag{min-width:18px;height:18px;font-size:12px}#foe .lab{font-size:11px}#reroll,#speed{width:56px}#reroll{place-content:center;justify-items:center;gap:3px;font-size:14px;display:grid}.bond{gap:2px;padding:0 3px}.bond .ic{width:16px;height:16px}.bond .nm{font-size:13px}.bond .ct{font-size:10px}#side{gap:4px;padding:5px}.who .face{width:30px;height:30px}.who h2{font-size:15px}.sub{font-size:10px}.skill{display:none}.mini{height:20px;font-size:10px}.lab{font-size:10px}#tip{height:16px;line-height:16px}.offer{column-gap:4px;padding:3px 5px}.offer .ic,.offer .face{width:30px;height:30px}.offer .nm{font-size:12px}.offer>.cost{font-size:11px;bottom:3px;right:3px}.stat .face{width:26px;height:26px}.bar{grid-template-columns:22px 1fr 32px;gap:2px}.bar .lab,.v{font-size:9px}.track{height:5px}}#rotate{z-index:9;background:var(--paper);font:400 20px var(--hand);place-items:center;display:none;position:fixed;inset:0}@media (orientation:portrait) and (width<=820px){#rotate{display:grid}}.screen{padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;display:grid;position:fixed;inset:0}h1,h2,h3{font-family:var(--hand);margin:0;font-weight:400;line-height:1.2}.btn-col{gap:10px;display:grid}.btn-row{gap:10px;display:flex}.btn-row .btn{flex:1}.back{font:400 14px/1 var(--hand);color:var(--muted);text-underline-offset:3px;text-decoration:underline}.title-panel{aspect-ratio:3/2;border:3px solid var(--ink);width:min(100%,150dvh - 36px,1240px);box-shadow:6px 6px 0 var(--ink);background:var(--paper-2);position:relative;overflow:hidden}.title-key{object-fit:cover;width:100%;height:100%;display:block}.title-card{background:var(--card);border:2px solid var(--ink);width:min(300px,32%);min-width:208px;box-shadow:var(--shadow);gap:8px;padding:14px 16px;display:grid;position:absolute;top:5%;left:3%}.title-card h1{font-size:clamp(28px,4.2vw,48px)}.kicker{font:400 13px/1.3 var(--hand);color:var(--clay-ink)}.lede{color:var(--ink-2);font-size:13px;line-height:1.5}#record:empty{display:none}.panel{background:var(--card);border:2px solid var(--ink);width:min(100%,1040px);height:min(100%,640px);box-shadow:var(--shadow);padding:14px}.panel.two{grid-template-columns:minmax(0,1fr) minmax(220px,34%);gap:14px;display:grid}.col{flex-direction:column;gap:10px;min-width:0;min-height:0;display:flex}.col>h2{font-size:22px}.col.side{border-left:2px solid var(--line);padding-left:14px}.grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));align-content:start;gap:8px;min-height:0;display:grid}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;align-content:stretch}.grid.scroll{scrollbar-width:thin;padding:2px 4px 2px 2px;overflow-y:auto}.tile{background:var(--paper-2);border:2px solid var(--line);border-radius:var(--r);align-content:center;justify-items:center;gap:2px;min-width:0;min-height:0;padding:6px 2px;display:grid}.tile.on{background:var(--card);border-color:var(--clay);box-shadow:inset 0 0 0 1px var(--clay)}.tile .face,.tile .ic{aspect-ratio:1;object-fit:contain;width:min(64px,70%);height:auto}.tile.small .face,.tile.small .ic{width:40px;height:40px}.grid.four .tile{grid-template-rows:minmax(0,1fr) auto auto;align-content:stretch}.tile .full{object-fit:contain;width:100%;height:100%;min-height:0;image-rendering:pixelated}.tile .nm{font:400 15px/1.2 var(--hand)}.tile.small .nm{font-size:13px}.tile .ty{color:var(--muted);font-size:11px}.tabs{gap:8px;display:flex}.tabs button{background:var(--paper-2);border:2px solid var(--ink);border-radius:var(--r);height:38px;font:400 16px/1 var(--hand);flex:1}.tabs button.on{background:var(--ink);color:var(--paper)}.detail{scrollbar-width:thin;flex:1;align-content:start;gap:10px;min-height:0;display:grid;overflow-y:auto}.dh{align-items:center;gap:10px;display:flex}.fig{object-fit:contain;width:auto;max-width:96px;height:84px;image-rendering:pixelated;flex:none}.dh h2{font-size:22px}.dl{gap:2px 0;font-size:13px;line-height:1.45;display:grid}.dl b{font:400 15px/1.3 var(--hand);color:var(--clay-ink);margin-top:6px}#modal{z-index:5;background:var(--backdrop);place-items:center;padding:12px;display:grid;position:fixed;inset:0}#modal .card{scrollbar-width:thin;background:var(--card);border:2px solid var(--ink);width:min(100%,560px);max-height:100%;box-shadow:var(--shadow);gap:10px;padding:16px 20px;display:grid;overflow-y:auto}#modal h2{color:var(--clay-ink);font-size:24px}.choice{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:8px;display:grid}.pickcard{background:var(--paper-2);border:2px solid var(--c,var(--ink));border-radius:var(--r);text-align:center;align-content:start;justify-items:center;gap:4px;padding:10px 6px;display:grid}.pickcard:hover{background:var(--card)}.pickcard .ic{width:44px;height:44px}.pickcard h3{font-size:17px}.pickcard p{color:var(--ink-2);font-size:12px;line-height:1.4}.howto{gap:6px;margin:0;padding-left:18px;font-size:14px;display:grid}.endteam{justify-content:center;gap:6px;display:flex}.endteam .face{background:var(--paper-2);border:2px solid var(--ink);width:52px;height:52px}#menu{cursor:pointer}.segs{flex:none;gap:0;display:flex}.segs:empty{display:none}.seg{background:var(--card);border:2px solid var(--ink);width:52px;height:36px;font:400 15px/1 var(--hand);padding:0}.seg+.seg{border-left:0}.seg.on{background:var(--ink);color:var(--paper)}.roster{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;display:grid}.mem{aspect-ratio:1;background:var(--paper-2);border:2px solid var(--line);border-radius:var(--r);padding:0;overflow:hidden}.mem .face{width:100%;height:100%}.mem.on{border-color:var(--clay)}.mem.off .face{opacity:.45}.who{justify-content:space-between}.who .tx{min-width:0}.seat{width:52px;height:28px;font:400 14px/1 var(--hand);flex:none}.slot.pick{outline:2px solid var(--clay);outline-offset:1px}.acts{grid-template-columns:1fr 1fr;gap:6px;display:grid}.acts .mini{height:30px;font:400 14px/1 var(--hand)}.mini:disabled{opacity:.45}.btn.act{flex:none;place-content:center;justify-items:center;gap:4px;width:92px;padding:0;font-size:15px;display:grid}#row #shop{grid-template-columns:repeat(5,minmax(0,1fr))}#shop.stats{grid-template-columns:repeat(var(--n,3), minmax(0, 1fr))}#shop.n1{--n:1}#shop.n2{--n:2}#shop.n3{--n:3}#shop.n4{--n:4}#shop.n5{--n:5}.stat.dead{opacity:.5}.stat .face{flex:none}#shop.n4 .bar,#shop.n5 .bar{grid-template-columns:1fr 34px}#shop.n4 .bar .lab,#shop.n5 .bar .lab{display:none}@media (height<=520px){.btn.act{gap:2px;width:56px;font-size:12px}.roster{grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}.slot{aspect-ratio:2}.slots,.bag{gap:4px}.seg{width:38px;height:30px;font-size:13px}.seat{width:40px;height:22px;font-size:12px}.acts .mini{height:22px;font-size:12px}#menu{padding:0 6px}#foe b{display:none}.title-card{gap:5px;min-width:190px;padding:8px 10px}.title-card .btn{min-height:30px}.title-card .btn-col{gap:6px}.lede{font-size:11px}.panel{padding:8px}.panel.two{gap:8px}.col{gap:6px}.col>h2{font-size:17px}.col.side{padding-left:8px}.tile .nm{font-size:13px}.tile .ty{display:none}.tile .face{width:min(44px,70%)}.tile.small .face,.tile.small .ic{width:28px;height:28px}.tile.small .nm{font-size:11px}.grid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:5px}.tabs button{height:28px;font-size:14px}.fig{height:52px}.dh h2{font-size:17px}.dl{font-size:11px}.dl b{margin-top:3px;font-size:12px}.detail{gap:5px}.btn-row .btn{min-height:30px}#modal .card{gap:6px;padding:10px 14px}#modal h2{font-size:18px}.howto{gap:3px;font-size:12px}.pickcard{padding:6px 4px}.pickcard .ic{width:30px;height:30px}.pickcard h3{font-size:14px}}