:root{--bg:#14111f;--bg2:#1d1730;--panel:#241e38;--panel2:#2e2648;--ink:#0b0912;--line:#3d3360;--text:#f1eadb;--muted:#a49cb8;--gold:#f2c14e;--red:#e05561;--green:#5ec27a;--cyan:#5ad1e6;--purple:#a77bff;--orange:#f28c3a;--t-common:#b8b3c8;--t-rare:#5aa8f0;--t-epic:#b36bff;--t-legend:#f2c14e;--font:"Galmuri11", "Galmuri9", ui-monospace, monospace;--font-s:"Galmuri9", "Galmuri11", ui-monospace, monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:none;margin:0;font-size:12px}body{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overflow:hidden}#app{flex-direction:column;height:100dvh;display:flex}input,select,button{font:inherit;color:inherit}img.px,.px{image-rendering:pixelated}.btn{--c:var(--panel2);appearance:none;border:2px solid var(--ink);background:var(--c);color:var(--text);cursor:pointer;box-shadow:inset -2px -2px 0 #00000059, inset 2px 2px 0 #ffffff1f, 0 2px 0 var(--ink);white-space:nowrap;min-height:34px;padding:7px 12px;transition:transform 50ms;position:relative}.btn:hover:not(:disabled){filter:brightness(1.15)}.btn:active:not(:disabled){transform:translateY(2px);box-shadow:inset -2px -2px #00000059,inset 2px 2px #ffffff1f}.btn:disabled{opacity:.45;cursor:default}.btn.gold{--c:#b5832a;color:#fff6d0}.btn.red{--c:#a83a48}.btn.green{--c:#2f7a55}.btn.blue{--c:#3a5aa8}.btn.purple{--c:#6a45b0}.btn.small{min-height:26px;font-family:var(--font-s);padding:3px 8px;font-size:11px}.btn.ghost{--c:transparent;box-shadow:none;border-color:var(--line)}.box{background:var(--panel);border:2px solid var(--ink);box-shadow:inset 0 0 0 2px var(--line), 0 4px 0 var(--ink);padding:12px}.muted{color:var(--muted)}.gold{color:var(--gold)}.row{align-items:center;gap:8px;display:flex}.grow{flex:1}.field{flex-direction:column;gap:4px;margin-bottom:10px;display:flex}.field input,.field select{background:var(--ink);border:2px solid var(--line);color:var(--text);-webkit-user-select:text;user-select:text;outline:none;padding:8px;font-size:16px}.field input:focus{border-color:var(--gold)}#toast{z-index:1000;pointer-events:none;flex-direction:column;gap:6px;display:flex;position:fixed;top:12px;left:50%;transform:translate(-50%)}#toast div{border:2px solid var(--gold);background:#1b1530ee;padding:6px 12px;animation:.2s ease-out pop}@keyframes pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.screen-center{background:radial-gradient(ellipse at 50% 40%, #241c40 0%, var(--bg) 70%);flex:1;place-items:center;padding:16px;display:grid;overflow:auto}.logo{font-family:var(--font);color:var(--gold);text-shadow:3px 3px 0 #7a2f4f, 6px 6px 0 var(--ink);letter-spacing:2px;text-align:center;margin:0 0 4px;font-size:34px}.logo-sub{text-align:center;color:var(--muted);margin-bottom:18px}.login-box{width:min(340px,100%)}.deco-cards{justify-content:center;gap:6px;margin-bottom:14px;display:flex}.deco-cards img{width:44px;height:60px;animation:2.4s ease-in-out infinite bob}.deco-cards img:nth-child(2){animation-delay:.3s}.deco-cards img:nth-child(3){animation-delay:.6s}.deco-cards img:nth-child(4){animation-delay:.9s}.deco-cards img:nth-child(5){animation-delay:1.2s}@keyframes bob{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-6px)rotate(2deg)}}.lobby{flex:1;width:100%;max-width:760px;margin:0 auto;padding:12px;overflow:auto}.lobby header{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.lobby h1{color:var(--gold);text-shadow:2px 2px #7a2f4f;margin:0;font-size:20px}.wallet{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.chipnum{color:var(--gold);font-size:16px}.chipnum:before{content:"●";color:var(--red);margin-right:4px;font-size:11px}.room-list{flex-direction:column;gap:8px;margin-top:8px;display:flex}.room{align-items:center;gap:10px;padding:10px;display:flex}.room .title{font-size:14px}.room .seats{gap:2px;display:flex}.room .seats i{background:var(--line);width:8px;height:8px;display:inline-block}.room .seats i.on{background:var(--green)}.banner-return{border:2px solid var(--gold);background:#3a2a10;align-items:center;gap:10px;margin-bottom:10px;padding:10px;display:flex}.empty{text-align:center;color:var(--muted);padding:30px}.section-title{justify-content:space-between;align-items:center;margin:16px 0 6px;display:flex}.section-title h2{color:var(--cyan);margin:0;font-size:14px}.modal-back{z-index:500;background:#080610c7;place-items:center;padding:12px;display:grid;position:fixed;inset:0}.modal{width:min(420px,100%);max-height:92dvh;overflow:auto}.modal h3{color:var(--gold);margin:0 0 10px;font-size:15px}.modal.wide{width:min(760px,100%)}.shop-grid{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin:10px 0;display:grid}.shop-item{text-align:center;padding:10px 6px}.shop-item .amt{color:var(--gold);margin:6px 0;font-size:15px}.notice{font-family:var(--font-s);color:var(--orange);border:1px dashed var(--orange);padding:6px;font-size:11px}.table-screen{background:#0f0c1a;flex-direction:column;flex:1;min-height:0;display:flex}.topbar{background:var(--bg2);border-bottom:2px solid var(--ink);scrollbar-width:none;flex-wrap:nowrap;align-items:center;gap:6px;padding:4px 6px;display:flex;overflow-x:auto}.topbar .t{color:var(--gold);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.topbar .hn{color:var(--muted);font-family:var(--font-s);white-space:nowrap}.stage{flex:1;min-height:0;position:relative;overflow:hidden}.stage canvas{display:block}.game-host{position:absolute;inset:0;overflow:hidden}.hud{background:var(--bg2);border-top:2px solid var(--ink);flex-wrap:wrap;align-items:stretch;gap:6px;padding:6px;display:flex}.hud .ability{flex:220px;align-items:center;gap:8px;min-width:0;padding:6px 8px;display:flex}.hud .actions{flex-direction:column;flex:2 320px;justify-content:center;gap:6px;min-width:0;display:flex}.hud .actions .row{flex-wrap:wrap}.hud .status{text-align:center;color:var(--muted);padding:8px}.act-main{grid-template-columns:1fr 1fr 1fr;gap:6px;display:grid}.act-main .btn{padding:8px 4px;font-size:13px}.raise-row{align-items:center;gap:4px;display:flex}.raise-row input[type=range]{accent-color:var(--gold);flex:1;min-width:80px}.raise-row .amt{text-align:right;min-width:56px;color:var(--gold);font-size:13px}.ab-icon{border:2px solid var(--ink);flex:none;place-items:center;width:34px;height:34px;font-size:18px;display:grid;box-shadow:inset 0 0 0 2px #ffffff26}.ab-text{flex:1;min-width:0}.ab-name{font-size:13px}.ab-desc{font-family:var(--font-s);color:var(--muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:11px;display:-webkit-box;overflow:hidden}.tier-common{color:var(--t-common)}.tier-rare{color:var(--t-rare)}.tier-epic{color:var(--t-epic)}.tier-legend{color:var(--t-legend)}.bg-common{background:#5b566c}.bg-rare{background:#2f5f99}.bg-epic{background:#6a3aa8}.bg-legend{background:#9a7020}.pick-wrap{z-index:30;background:#080610b8;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:8px;display:flex;position:absolute;inset:0}.pick-title{color:var(--gold);text-shadow:2px 2px 0 var(--ink);font-size:16px}.pick-timer{background:var(--ink);border:1px solid var(--line);width:min(420px,90%);height:6px}.pick-timer i{background:var(--gold);height:100%;transition:width .2s linear;display:block}.pick-cards{flex-wrap:wrap;justify-content:center;gap:10px;max-width:100%;display:flex}.pick-card{cursor:pointer;background:var(--panel);border:3px solid var(--ink);width:172px;min-height:196px;box-shadow:inset 0 0 0 3px var(--tc), 0 5px 0 var(--ink);flex-direction:column;gap:6px;padding:10px;transition:transform .12s;animation:.35s cubic-bezier(.2,1.4,.4,1) backwards dealin;display:flex;position:relative}.pick-card:hover{transform:translateY(-6px)rotate(-1deg)}.pick-card:nth-child(2){animation-delay:80ms}.pick-card:nth-child(3){animation-delay:.16s}@keyframes dealin{0%{opacity:0;transform:translateY(40px)scale(.6)rotate(-8deg)}}.pick-card .tier{font-family:var(--font-s);color:var(--tc);font-size:11px}.pick-card .nm{color:var(--text);font-size:17px}.pick-card .cat{font-family:var(--font-s);color:var(--muted);font-size:11px}.pick-card .ds{font-family:var(--font-s);flex:1;font-size:11px;line-height:1.45}.pick-card .tl{font-family:var(--font-s);color:var(--muted);border-top:1px dashed var(--line);padding-top:4px;font-size:10px}.pick-card.legend{animation:.35s cubic-bezier(.2,1.4,.4,1) backwards dealin,1.2s linear infinite shine}@keyframes shine{0%,to{box-shadow:inset 0 0 0 3px var(--tc), 0 5px 0 var(--ink), 0 0 0 0 #f2c14e00}50%{box-shadow:inset 0 0 0 3px #fff6d0, 0 5px 0 var(--ink), 0 0 18px 4px #f2c14e8c}}.pick-card.epic{box-shadow:inset 0 0 0 3px var(--tc), 0 5px 0 var(--ink), 0 0 12px 2px #b36bff59}@media (width<=600px){.pick-cards{flex-direction:column;align-items:stretch;width:100%;max-width:360px}.pick-card{width:auto;min-height:0}.pick-card .ds{flex:none}}.info-panel{z-index:20;pointer-events:auto;flex-direction:column;gap:3px;width:min(250px,46%);max-height:calc(100% - 8px);display:flex;position:absolute;top:4px;right:4px;overflow:auto}.info-panel .it{font-family:var(--font-s);background:#0e1a24e6;border:1px solid #2b5560;padding:3px 6px;font-size:11px;line-height:1.4;animation:.2s ease-out pop}.info-panel .it.good{border-color:var(--green)}.info-panel .it.bad{border-color:var(--red)}.info-panel .it img{vertical-align:middle;width:22px;height:30px;margin-right:2px}.info-panel.collapsed .it:not(:last-child){display:none}.info-toggle{z-index:21;position:absolute;bottom:4px;right:4px}.log-panel{z-index:19;font-family:var(--font-s);color:#cfc6e6;pointer-events:none;opacity:.85;max-width:40%;font-size:10px;position:absolute;bottom:4px;left:4px}.log-panel div{text-shadow:1px 1px #000;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.choose{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.choose .card-btn{background:var(--ink);border:2px solid var(--line);cursor:pointer;padding:4px}.choose .card-btn:hover{border-color:var(--gold);transform:translateY(-3px)}.choose .card-btn img{width:88px;height:120px;display:block}.rank-grid{grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px;display:grid}.dex-tier{margin:10px 0 4px;font-size:13px}.dex-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px;display:grid}.dex-item{background:var(--bg2);border:2px solid var(--ink);border-left:4px solid var(--tc);padding:6px 8px}.dex-item .nm{font-size:13px}.dex-item .ds{font-family:var(--font-s);color:var(--text);margin-top:2px;font-size:11px;line-height:1.4}.dex-item .tl{font-family:var(--font-s);color:var(--muted);margin-top:3px;font-size:10px}img.card-img{image-rendering:pixelated}.info-panel .it img.card-img{width:44px;height:60px}.tb-row{display:contents}.topbar .tb-end{order:1}.btn kbd{display:none}.raise-row .presets,.raise-row .slide{display:contents}.empty-note{color:var(--muted);font-family:var(--font-s);padding:6px 2px;font-size:11px}.table-screen.wide{flex-direction:row}.wide .stage{flex:1}.wide .side{background:var(--bg2);border-left:2px solid var(--ink);width:360px;min-height:0;box-shadow:inset 2px 0 0 var(--line);flex-direction:column;flex:none;display:flex}.wide .topbar{border-bottom:2px solid var(--ink);flex-direction:column;align-items:stretch;gap:6px;padding:10px 12px;overflow:visible}.wide .tb-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.wide .topbar .tb-end{order:0}.wide .topbar .t{font-size:14px}.wide .topbar .hn{font-size:12px}.wide .hud{border-top:0;border-bottom:2px solid var(--ink);flex-flow:column;gap:10px;padding:12px}.wide .hud .ability{flex:none;align-items:flex-start;padding:10px}.wide .ab-desc{-webkit-line-clamp:unset;margin-top:2px;font-size:12px;line-height:1.45;display:block}.wide .hud .actions{flex:none;justify-content:flex-start;gap:10px;min-height:160px}.wide .hud .status{padding:24px 8px;font-size:13px}.wide .act-main{grid-template-columns:1fr 1fr 1fr;gap:8px}.wide .act-main .btn{white-space:normal;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:64px;font-size:14px;line-height:1.2;display:flex}.wide .btn kbd{font-family:var(--font-s);color:#ffffffbf;border:1px solid #ffffff59;padding:0 5px;font-size:10px;display:inline-block}.wide .raise-row{flex-direction:column;order:-1;align-items:stretch;gap:8px;display:flex}.wide .raise-row .presets{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.wide .raise-row .presets .btn{min-height:32px;font-size:12px}.wide .raise-row .slide{align-items:center;gap:10px;display:flex}.wide .raise-row .amt{min-width:70px;font-size:15px}.wide .side-sec{flex-direction:column;min-height:0;padding:10px 12px;display:flex}.wide .info-sec{border-bottom:2px solid var(--ink);flex:auto}.wide .log-sec{flex:0 0 170px}.wide .sec-title{color:var(--cyan);margin-bottom:6px;font-size:12px}.wide .info-panel{flex:1;width:auto;min-height:0;max-height:none;position:static}.wide .info-panel .it{padding:5px 8px;font-size:12px}.wide .log-panel{opacity:1;pointer-events:auto;flex:1;max-width:none;min-height:0;font-size:11px;line-height:1.5;position:static;overflow:auto}.wide .log-panel div{white-space:normal;text-shadow:none}.sec-title{display:none}.wide .sec-title{display:block}.overlay-msg{z-index:40;background:#080610b3;place-items:center;display:grid;position:absolute;inset:0}.blink{animation:1s steps(2,end) infinite blink}@keyframes blink{50%{opacity:.4}}.my-turn{animation:1s ease-in-out infinite turnglow}@keyframes turnglow{50%{box-shadow:inset 0 0 0 2px var(--gold), 0 0 12px 2px #f2c14e66}}@media (height<=520px) and (orientation:landscape){.hud{flex-wrap:nowrap;padding:3px 6px}.hud .ability{flex:0 240px;padding:3px 6px}.ab-desc{-webkit-line-clamp:1}.act-main .btn,.btn{min-height:28px;padding:4px 8px}.topbar{padding:2px 6px}.topbar .btn.small{min-height:22px;padding:1px 6px}}.raise-row input.amt{background:var(--ink);border:1px dashed var(--line);width:76px;color:var(--gold);text-align:right;font:inherit;cursor:text;-webkit-user-select:text;user-select:text;outline:none;flex:none;padding:3px 6px;font-size:13px}.raise-row input.amt:hover{border-color:var(--gold)}.raise-row input.amt:focus{border-style:solid;border-color:var(--gold);background:#000}.wide .raise-row input.amt{width:96px;padding:5px 8px;font-size:15px}.stage canvas{image-rendering:pixelated}