:root{--ink:#181818;--paper:#f8f8f0;--light:#e8f0d0;--dark:#7fa65a;--sel:#f0d040;--last:#f0d04059;--sq:max(var(--min-sq), calc(min(100vw - var(--gutter), 100dvh - var(--chrome)) / 8));--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--paper);color:var(--ink);margin:0;font:16px/1.3 ui-monospace,Menlo,Consolas,monospace}#app{flex-direction:column;align-items:center;min-height:100dvh;padding:4px 0;display:flex}header.game-header{width:calc(var(--sq) * 8);justify-content:space-between;align-items:center;gap:6px;margin-bottom:4px;display:flex}header.game-header button{min-height:44px;font:inherit;border:2px solid var(--ink);cursor:pointer;background:#fff;border-radius:4px;padding:0 10px;font-size:13px}header.game-header button[hidden]{visibility:hidden;display:inline-block}h1{white-space:nowrap;margin:4px 0;font-size:14px}.turn{text-align:center;flex:1;margin:0;font-size:13px}main{flex-direction:column;align-items:center;gap:6px;display:flex}.board{grid-template-columns:repeat(8, var(--sq));grid-template-rows:repeat(8, var(--sq));border:3px solid var(--ink);touch-action:none;-webkit-user-select:none;user-select:none;outline:none;display:grid}.sq{justify-content:center;align-items:flex-end;display:flex;position:relative}.sq.light{background:var(--light)}.sq.dark{background:var(--dark)}.sq.last:before,.sq.selected:before{content:"";background:var(--last);position:absolute;inset:0}.sq.selected:before{background:#f0d04099}.sq.focus{outline-offset:-3px;outline:3px solid #3050f0}.sq.dot:after{content:"";width:calc(var(--sq) * var(--dot));height:calc(var(--sq) * var(--dot));pointer-events:none;z-index:2;background:#18181859;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sq.capture:after{content:"";pointer-events:none;z-index:2;border:4px solid #c82828b3;border-radius:50%;position:absolute;inset:4%}.sq.check{animation:pulse var(--pulse) ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:inset 0 0 #dc1e1ee6}50%{box-shadow:inset 0 0 0 calc(var(--sq) / 2) #dc1e1e99}}.piece{z-index:1;width:calc(var(--sq) * var(--piece-scale));height:calc(var(--sq) * var(--piece-scale));object-fit:contain;object-position:bottom;image-rendering:pixelated;pointer-events:none;position:relative}.piece.hop{animation:.18s ease-out hop}@keyframes hop{50%{transform:translateY(calc(var(--hop) * -1))}}.piece.dragging{z-index:10;transition:none}.glyph{width:calc(var(--sq) * var(--glyph));height:calc(var(--sq) * var(--glyph));z-index:3;pointer-events:none;position:absolute;bottom:1px;right:1px}.glyph text{fill:var(--ink);stroke:var(--paper);stroke-width:1px;paint-order:stroke;font-size:18px}.piece.blast-off{animation:blast var(--end-anim) ease-in forwards}@keyframes blast{to{transform:translateY(-120vh)rotate(1080deg)scale(.2)}}.piece.faint{animation:faint var(--end-anim) ease-in forwards}@keyframes faint{to{opacity:0;transform:translateY(30%)}}.textbox{width:calc(var(--sq) * 8);border:4px double var(--ink);background:#fff;border-radius:6px;min-height:72px;padding:6px 10px;position:relative}.tb-main{text-transform:none;margin:0;font-weight:700}.tb-caption{color:#505050;margin:4px 0 0;font-size:12px}.tb-tick{font-size:10px;animation:1s steps(2,end) infinite blink;position:absolute;bottom:4px;right:8px}@keyframes blink{50%{opacity:0}}.overlay{z-index:50;background:#00000059;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay[hidden]{display:none}.panel{border:4px double var(--ink);text-align:center;background:#fff;border-radius:6px;max-width:calc(100vw - 16px);padding:12px;position:relative}.panel p{margin:0 0 8px;font-weight:700}.panel button{min-width:44px;min-height:44px;font:inherit;border:2px solid var(--ink);background:var(--paper);cursor:pointer;border-radius:4px}.promo-row{gap:6px;display:flex}.promo-row button{flex-direction:column;align-items:center;width:76px;padding:4px;display:flex}.promo-row img{object-fit:contain;width:56px;height:56px;image-rendering:pixelated}.promo-row span{font-size:9px}.promo .cancel{border-radius:50%;position:absolute;top:-14px;right:-14px}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.battle{z-index:40;background:rgba(0, 0, 0, calc(.55 * var(--dim,1)));justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.battle[hidden]{display:none}.screen{aspect-ratio:320/288;border:4px solid var(--ink);background:#f8f8f0;border-radius:6px;width:min(100vw - 16px,480px);position:relative;overflow:hidden}.screen canvas{width:100%;height:100%;image-rendering:pixelated;pointer-events:none;position:absolute;inset:0}.mon{aspect-ratio:1;width:34%;position:absolute;transform:translate(-50%,-50%)}.mon img{object-fit:contain;width:100%;height:100%;image-rendering:pixelated;display:block}.mon.mirror img{transform:scaleX(-1)}.mon.evo{width:40%}.mon.evo img{filter:brightness(0)}.hp{border:2px solid var(--ink);background:#fff;border-radius:4px;width:40%;height:7px;position:absolute}.hp[hidden]{display:none}.hp span{height:100%;display:block}.hp-far{top:8%;left:6%}.hp-near{top:56%;right:6%}.battle-text{width:auto;min-height:22%;position:absolute;bottom:2%;left:2%;right:2%}.quick-fx{z-index:30;pointer-events:none;image-rendering:pixelated;position:fixed}.quick-fx[hidden]{display:none}.stage{flex-direction:column;flex:1;align-items:center;width:100%;display:flex}.game-view{flex-direction:column;align-items:center;display:flex;position:relative}.menu{flex-direction:column;align-items:center;gap:12px;width:min(100vw - 16px,420px);min-height:100dvh;padding:16px 0;display:flex}.screen-splash{cursor:pointer;justify-content:center}.logo{text-align:center}.logo h1{white-space:normal;margin:0;font-size:28px}.logo .sub{color:#c03028;margin:4px 0 0;font-weight:700}.credit{font-size:14px}.hint{color:#606060;font-size:12px;animation:1.2s steps(2,end) infinite blink}.kings{gap:24px;display:flex}.menu-sprite{object-fit:contain;width:96px;height:96px;image-rendering:pixelated}.buttons{flex-direction:column;gap:8px;width:100%;display:flex}.menu button{min-height:48px;font:inherit;border:3px solid var(--ink);cursor:pointer;background:#fff;border-radius:6px;font-weight:700}.menu button.primary{background:#f8d030;min-height:60px;font-size:20px}.menu button.secondary{width:50%}.menu button.level,.menu button.card{flex-direction:column;align-items:center;padding:6px;display:flex}.menu small{color:#505050;font-size:12px;font-weight:400}.cards{gap:10px;width:100%;display:flex}.cards .card{flex:1}h2{margin:4px 0;font-size:18px}h3{margin:4px 0 0;font-size:15px}.rules{margin:0;font-size:14px}.legend{flex-direction:column;gap:2px;width:100%;display:flex}.legend-row{text-align:center;grid-template-columns:56px 1fr 56px;align-items:center;font-size:13px;display:grid}.legend-head{font-size:12px}.legend-sprite{object-fit:contain;width:52px;height:52px;image-rendering:pixelated}.settings{flex-direction:column;gap:6px;width:100%;display:flex}.setting{border-bottom:1px solid #d0d0c0;justify-content:space-between;align-items:center;gap:8px;min-height:44px;font-size:14px;display:flex}.setting input[type=checkbox]{width:24px;height:24px}.setting select{font:inherit;min-height:36px}.site-footer{color:#606060;text-align:center;margin-top:auto;padding:8px 0;font-size:10px}.site-footer p{margin:2px 0}.site-footer a{color:inherit}.intro{z-index:45;cursor:pointer;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.intro img{object-fit:contain;width:120px;height:120px;image-rendering:pixelated}.end-buttons{justify-content:center;gap:8px;display:flex}.end-buttons button{padding:0 14px}.toast{background:var(--ink);color:#fff;z-index:60;border-radius:6px;padding:8px 14px;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.reactions{width:calc(var(--sq) * 8);flex-wrap:wrap;justify-content:center;gap:4px;display:flex}.reactions[hidden]{display:none}.reactions button{min-height:44px;font:inherit;border:2px solid var(--ink);cursor:pointer;background:#fff;border-radius:4px;padding:0 8px;font-size:12px}.reactions .resign{background:#f0d0d0}.code-row{gap:8px;width:100%;display:flex}.code-input{min-height:48px;font:inherit;letter-spacing:6px;text-transform:uppercase;text-align:center;border:3px solid var(--ink);border-radius:6px;flex:1;font-size:22px}.room-code{letter-spacing:10px;margin:8px 0;font-size:44px;font-weight:700}.online-message{text-align:center;font-size:16px}.swap{justify-content:center;align-items:center;gap:6px;margin-bottom:8px;font-size:14px;display:flex}