:root{--ink:#0b0c17;--stone:#181b2e;--stone-2:#232843;--edge:#3a4170;--text:#eef0ff;--muted:#a3a8cc;--gold:#ffc35a;--gold-deep:#a8601a;--coin:#ffd34d;--p2:#4fd6ff;--danger:#ff5d7a;--jelly:#8be36a;--display:"Lilita One","Arial Black","Trebuchet MS",system-ui,sans-serif;--body:"Nunito",ui-rounded,system-ui,-apple-system,"Segoe UI",sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--ink);height:100%;color:var(--text);font-family:var(--body);overscroll-behavior:none;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font-size:15px;line-height:1.4}#gl{pointer-events:none;width:100%;height:100%;display:block;position:fixed;inset:0}#cv{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#safeProbe{visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);position:fixed;inset:0}[hidden]{display:none!important}svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.screen{z-index:10;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-top:max(12px,env(safe-area-inset-top,0px));padding-bottom:max(12px,env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;position:fixed;inset:0;overflow-y:auto}.screen.dim{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#080914c2}#custom{z-index:20;background:var(--ink)}#notice{z-index:25}.screen>.inner{width:100%;margin:auto}h2.t{font-family:var(--display);color:var(--gold);text-shadow:0 3px #4a2a0c;text-wrap:balance;margin:0;font-size:clamp(26px,5.5vw,38px);font-weight:400;line-height:1.05}.sub{color:var(--muted);margin:0;font-weight:800}.lbl{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0;font-size:12px;font-weight:900}.panel{background:linear-gradient(180deg,var(--stone-2),var(--stone));border:2px solid var(--edge);border-radius:18px;gap:12px;min-width:0;padding:14px;display:grid;box-shadow:0 6px #0d0f1c,0 18px 40px #00000073}.field{gap:6px;display:grid}input.txt{font:inherit;color:var(--text);border:2px solid var(--edge);-webkit-user-select:text;user-select:text;background:#0f1121;border-radius:12px;outline:none;width:100%;padding:9px 12px;font-size:17px;font-weight:800}input.txt:focus{border-color:var(--gold)}input.code-in{font-family:var(--display);letter-spacing:.35em;text-transform:uppercase;text-align:center;padding:6px 0 6px .35em;font-size:34px}.actions{flex-wrap:wrap;gap:10px;display:flex}.btn{font-family:var(--display);letter-spacing:.02em;color:var(--text);background:var(--stone-2);border:2px solid var(--edge);cursor:pointer;border-radius:14px;flex:auto;min-height:48px;padding:10px 18px 9px;font-size:19px;font-weight:400;transition:transform 60ms,box-shadow 60ms;transform:translateY(0);box-shadow:0 4px #0d0f1c}.btn:active{transform:translateY(3px);box-shadow:0 1px #0d0f1c}.btn.primary{background:var(--gold);color:#2b1806;box-shadow:0 4px 0 var(--gold-deep);border-color:#ffe0a0}.btn.primary:active{box-shadow:0 1px 0 var(--gold-deep)}.btn.ghost{box-shadow:none;color:var(--muted);background:0 0;border-color:#0000;flex:0 auto}.btn.sm{flex:none;min-height:42px;padding:7px 14px 6px;font-size:16px}.btn:disabled{opacity:.5;pointer-events:none}.btn:focus-visible,.tile:focus-visible,.sw:focus-visible,.chip:focus-visible,.card:focus-visible,.item:focus-visible{outline:3px solid var(--p2);outline-offset:2px}.status{color:var(--muted);text-align:center;min-height:1.4em;margin:0;font-weight:800}.status.ok{color:var(--jelly)}.status.err{color:var(--danger)}.coin{background:radial-gradient(circle at 38% 35%,#fff3b0 0 18%,var(--coin) 22%);vertical-align:-.12em;border:2px solid #9a6a14;border-radius:50%;width:.95em;height:.95em;display:inline-block}.lobby{gap:14px;max-width:460px;display:grid}.brand h1{font-family:var(--display);color:var(--gold);letter-spacing:.01em;text-shadow:0 3px 0 var(--gold-deep),0 6px 0 #4a2a0c,0 12px 26px #0000008c;margin:0;font-size:clamp(44px,12vw,66px);font-weight:400;line-height:.92}.brand p{color:var(--muted);max-width:32ch;margin:10px 0 0;font-weight:800}.brand .depth{letter-spacing:.14em;text-transform:uppercase;color:var(--jelly);min-height:1em;margin-top:8px;font-size:12px;font-weight:900;display:block}.kcard{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.kcard canvas{border:2px solid var(--edge);cursor:pointer;background:radial-gradient(circle at 50% 62%,#2c3359,#121428 70%);border-radius:14px;width:76px;height:76px;display:block}.kc-name{font-family:var(--display);text-overflow:ellipsis;white-space:nowrap;font-size:24px;line-height:1.05;overflow:hidden}.kc-sub{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:800;overflow:hidden}.code{font-family:var(--display);letter-spacing:.3em;color:var(--gold);text-align:center;-webkit-user-select:all;user-select:all;padding-left:.3em;font-size:52px;line-height:1}.how{color:var(--muted);max-width:60ch;margin:0;font-size:13px;font-weight:700}.how b{color:var(--text)}@media (orientation:landscape) and (height<=560px){.lobby{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:12px 22px;max-width:920px}.lobby .brand{grid-area:1/1}#kcardPanel{grid-area:2/1}#mainPanel,#hostPanel,#joinPanel{grid-area:1/2/span 2}.lobby .how{grid-column:1/-1}.brand p{display:none}.brand h1{font-size:46px}.code{font-size:44px}.panel{gap:10px;padding:12px}}.cust{gap:12px;max-width:980px;display:grid}.cust-head{align-items:center;gap:12px;display:flex}.cust-head h2{flex:1}.cust-body{grid-template-columns:minmax(0,1fr);gap:14px;display:grid}.cust-pv{align-content:start;justify-items:center;gap:10px;display:grid}#bigPv{border:2px solid var(--edge);background:radial-gradient(circle at 50% 62%,#2c3359,#121428 70%);border-radius:20px;width:150px;height:150px;display:block}.opts{gap:14px;min-width:0;display:grid}.optrow{gap:7px;min-width:0;display:grid}.swatches{flex-wrap:wrap;gap:9px;display:flex}.sw{cursor:pointer;border:3px solid #ffffff24;border-radius:50%;width:40px;height:40px;padding:0}.sw[aria-checked=true]{border-color:#fff;box-shadow:0 0 0 3px #fff3}.tiles{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;display:grid}.tiles.w{grid-template-columns:repeat(auto-fill,minmax(66px,1fr))}.tile{font:inherit;color:var(--text);border:2px solid var(--edge);cursor:pointer;background:#121428;border-radius:12px;align-content:start;justify-items:center;gap:3px;min-width:0;padding:6px 4px 7px;display:grid}.tile canvas{width:52px;height:52px;display:block}.tile svg{width:28px;height:28px;color:var(--muted);margin:6px 0 2px}.tile b{text-align:center;font-size:12px;font-weight:900;line-height:1.15}.tile small{color:var(--muted);text-align:center;font-size:10px;font-weight:800;line-height:1.15}.tile[aria-checked=true]{border-color:var(--gold);background:#2a2412}.tile[aria-checked=true] svg{color:var(--gold)}.tile:disabled{opacity:.42;cursor:default}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{font:inherit;color:var(--text);border:2px solid var(--edge);cursor:pointer;background:#121428;border-radius:999px;min-height:40px;padding:7px 14px;font-size:14px;font-weight:900}.chip[aria-checked=true]{border-color:var(--gold);color:var(--gold);background:#2a2412}.wdesc{color:var(--muted);min-height:1.4em;margin:0;font-size:13px;font-weight:800}.wdesc b{color:var(--text)}@media (orientation:landscape) and (height<=560px){.cust-body{grid-template-columns:190px minmax(0,1fr);align-items:start}.cust-pv{position:sticky;top:0}#bigPv{width:140px;height:140px}.opts{gap:10px}}.picks{text-align:center;gap:10px;max-width:960px;display:grid}.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.cards.n4{grid-template-columns:repeat(4,minmax(0,1fr))}.cards.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.card{--cat:var(--gold);font:inherit;color:var(--text);text-align:left;background:linear-gradient(180deg,var(--stone-2),var(--stone));border:2px solid var(--edge);cursor:pointer;border-radius:16px;grid-template-columns:44px minmax(0,1fr);align-content:start;align-items:start;gap:3px 12px;min-width:0;padding:12px;display:grid;box-shadow:0 5px #0d0f1c}.card:active{transform:translateY(3px);box-shadow:0 2px #0d0f1c}.card .ic{border:2px solid var(--cat);width:44px;height:44px;color:var(--cat);background:#0f1121;border-radius:50%;grid-row:span 3;place-items:center;display:grid}.card .ic svg{width:24px;height:24px}.card b{font-family:var(--display);font-size:19px;font-weight:400;line-height:1.1}.card .d{color:var(--muted);font-size:13px;font-weight:700;line-height:1.3}.card em{letter-spacing:.12em;text-transform:uppercase;color:var(--cat);font-size:11px;font-style:normal;font-weight:900}.atk{--cat:#ffc35a}.def{--cat:#ff8fa3}.util{--cat:#4fd6ff}.wpn{--cat:#c7a2ff}.relic{--cat:#7ef0c8}.card.chosen{border-color:var(--cat);box-shadow:0 0 0 3px #ffffff14,0 5px #0d0f1c}.cards.done .card:not(.chosen){opacity:.35}.wait{color:var(--muted);margin:0;font-weight:800}@media (orientation:landscape){.cards.n4 .card{text-align:center;grid-template-columns:minmax(0,1fr);justify-items:center}.cards.n4 .card .ic{grid-row:auto}}@media (width<=600px) and (orientation:portrait){.cards,.cards.n4,.cards.n2{grid-template-columns:minmax(0,1fr)}}.shop{gap:10px;max-width:980px;display:grid}.shop-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.goldpill{font-family:var(--display);color:var(--coin);font-variant-numeric:tabular-nums;background:#1d1806;border:2px solid #6b5514;border-radius:999px;align-items:center;gap:7px;padding:3px 14px 2px;font-size:22px;display:inline-flex}.items{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.item{--cat:var(--gold);font:inherit;color:var(--text);text-align:left;background:linear-gradient(180deg,var(--stone-2),var(--stone));border:2px solid var(--edge);cursor:pointer;border-radius:14px;grid-template-columns:36px minmax(0,1fr);align-items:start;gap:1px 10px;min-width:0;padding:9px 10px;display:grid;box-shadow:0 4px #0d0f1c}.item:active{transform:translateY(2px);box-shadow:0 2px #0d0f1c}.item .ic{border:2px solid var(--cat);width:36px;height:36px;color:var(--cat);background:#0f1121;border-radius:50%;grid-row:span 3;place-items:center;display:grid}.item .ic svg{width:20px;height:20px}.item b{font-size:14px;font-weight:900;line-height:1.15}.item .d{color:var(--muted);font-size:12px;font-weight:700;line-height:1.25}.item .price{color:var(--coin);font-variant-numeric:tabular-nums;align-items:center;gap:5px;margin-top:2px;font-size:14px;font-weight:900;display:inline-flex}.item.cant .price{color:var(--danger)}.item.sold{opacity:.38;pointer-events:none}.item.sold .price{color:var(--muted)}.shop-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}@media (width<=600px) and (orientation:portrait){.items{grid-template-columns:repeat(2,minmax(0,1fr))}}.rest{text-align:center;gap:12px;max-width:720px;display:grid}.over,.menu,.notice{text-align:center;gap:12px;max-width:560px;display:grid}.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.stat{border:2px solid var(--edge);background:#10122399;border-radius:14px;gap:2px;padding:8px 4px;display:grid}.stat b{font-family:var(--display);font-variant-numeric:tabular-nums;font-size:26px;font-weight:400;line-height:1}.stat span{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:11px;font-weight:900}.build{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.build span{border:1px solid var(--edge);background:#10122a;border-radius:999px;align-items:center;gap:5px;padding:3px 10px 3px 8px;font-size:13px;font-weight:800;display:inline-flex}.build span svg{width:15px;height:15px;color:var(--cat,var(--muted))}.build span.relic{border-color:#2f6b5b}@media (orientation:landscape) and (height<=560px){.over{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:10px 18px;max-width:860px}.over h2,.over .sub{grid-column:1/-1}.over .stats{grid-column:1}.over .build{grid-area:3/2/span 2}.over .actions,.over .wait{grid-column:1}}#menuBtn{z-index:5;top:calc(env(safe-area-inset-top,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);cursor:pointer;color:#fff;background:#0a0c188c;border:2px solid #ffffff2e;border-radius:12px;place-items:center;width:42px;height:42px;display:grid;position:fixed}#menuBtn svg{stroke-width:2.4px;width:20px;height:20px}#toasts{z-index:6;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 58px);pointer-events:none;justify-items:center;gap:6px;padding:0 16px;display:grid;position:fixed}.toast{border:2px solid var(--edge);text-align:center;background:#0a0c18db;border-radius:999px;max-width:min(92vw,520px);padding:6px 14px;font-size:14px;font-weight:900;animation:.2s ease-out tin}.toast.out{opacity:0;transition:opacity .4s}@media (orientation:landscape){#toasts:not([data-n="0"]){padding-left:calc(env(safe-area-inset-left,0px) + 186px)}}@media (orientation:portrait){#toasts{top:calc(env(safe-area-inset-top,0px) + 100px)}#toasts[data-n="2"]{top:calc(env(safe-area-inset-top,0px) + 126px)}#toasts[data-n="3"]{top:calc(env(safe-area-inset-top,0px) + 150px)}}@keyframes tin{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.toast{animation:none}.btn{transition:none}}