:root{--bg: #0b0e17;--bg-deep: #070912;--panel: rgba(18, 23, 38, .82);--panel-solid: #121726;--edge: #283254;--edge-soft: rgba(120, 140, 190, .18);--ink: #e7edf6;--ink-dim: #97a3bd;--ink-faint: #5f6b87;--player: #54c8ff;--enemy: #ff5d77;--gold: #f6cf63;--gold-deep: #c89a2e;--health: #5ee08a;--rare: #5aa0ff;--epic: #c178ff;--radius: 4px;--mono: "VT323", ui-monospace, monospace;--sans: "Pixelify Sans", ui-monospace, monospace;--pixel: "Press Start 2P", monospace;--shadow: 4px 4px 0 rgba(0, 0, 0, .45);--shadow-sm: 3px 3px 0 rgba(0, 0, 0, .4)}*{box-sizing:border-box;margin:0;padding:0}.picon{image-rendering:pixelated;display:inline-block;vertical-align:middle;flex-shrink:0}html,body,#app{height:100%;width:100%}body{background:radial-gradient(1200px 800px at 50% -10%,#161d33 0%,transparent 60%),radial-gradient(900px 700px at 110% 110%,#1a1330 0%,transparent 55%),var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden;user-select:none;-webkit-tap-highlight-color:transparent}#app{height:100dvh;display:flex;flex-direction:column}.btn{font-family:var(--sans);font-weight:700;font-size:17px;letter-spacing:.5px;color:var(--ink);background:#222c46;border:2px solid var(--edge);border-radius:var(--radius);padding:11px 20px;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .06s,box-shadow .06s,border-color .12s,background .12s}.btn:hover{border-color:var(--gold);background:#2a3654}.btn:active{transform:translate(3px,3px);box-shadow:none}.btn.primary{background:#2f63a8;border-color:#4f8be0}.btn.primary:hover{background:#387cc8;border-color:var(--player)}.btn.big{font-size:19px;padding:15px 32px;background:var(--gold-deep);color:#1a1405;border-color:var(--gold)}.btn.big:hover{background:#d8a93a;border-color:#fff0c0}.btn.ghost{background:#161d30;border-color:var(--edge)}.icon-btn{width:40px;height:40px;border-radius:var(--radius);background:#161d30;border:2px solid var(--edge);color:var(--ink-dim);font-size:18px;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-sm);transition:color .12s,border-color .12s,transform .06s,box-shadow .06s}.icon-btn:hover{color:var(--ink);border-color:var(--gold)}.icon-btn:active{transform:translate(3px,3px);box-shadow:none}.icon-btn.muted{color:var(--enemy)}.screen{flex:1;min-height:0;display:flex;flex-direction:column;padding:clamp(16px,3vw,36px);overflow-y:auto;animation:fade .3s ease}@keyframes fade{0%{opacity:0;transform:translateY(6px)}}.screen-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}.screen-head h1{font-family:var(--pixel);font-size:clamp(15px,2.4vw,22px);letter-spacing:1px;color:var(--gold);flex:1}.screen-head .progress{font-family:var(--mono);font-size:20px;color:var(--ink-dim);font-weight:700}.screen-foot{margin-top:auto;padding-top:20px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.section{font-size:13px;text-transform:uppercase;letter-spacing:2px;color:var(--ink-faint);margin:18px 0 12px}.banner{border-radius:10px;padding:12px 16px;margin-bottom:16px;font-weight:600;text-align:center}.banner.complete{background:linear-gradient(90deg,#f6cf6326,#f6cf630d);border:1px solid var(--gold-deep);color:var(--gold)}.title-screen{align-items:center;justify-content:center;text-align:center;position:relative}.title-glow{position:absolute;inset:0;background:radial-gradient(600px 360px at 50% 38%,rgba(84,200,255,.16),transparent 70%);pointer-events:none}.corner-gear{position:absolute;top:16px;right:16px;z-index:2}.title-main{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:18px}.logo{display:flex;flex-direction:column;line-height:1;gap:10px}.logo-eight,.logo-squared{font-family:var(--pixel);letter-spacing:2px}.logo-eight{font-size:clamp(34px,8vw,76px);color:var(--ink);text-shadow:5px 5px 0 #11203a}.logo-squared{font-size:clamp(34px,8vw,76px);color:var(--gold);text-shadow:5px 5px 0 #2a1f06}.tagline{font-size:clamp(14px,2.4vw,18px);color:var(--ink-dim);letter-spacing:.5px}.title-actions{display:flex;flex-direction:column;gap:12px;margin-top:14px;width:min(320px,80vw)}.title-actions .btn{width:100%}.studio{margin-top:22px;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--ink-faint)}.summary-screen{align-items:center;justify-content:center;text-align:center;position:relative}.summary-main{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:8px}.summary-mode{font-family:var(--pixel);font-size:clamp(13px,2.4vw,18px);letter-spacing:2px;color:var(--accent, #54c8ff);text-transform:uppercase}.summary-badge{font-family:var(--pixel);font-size:11px;letter-spacing:1px;color:#0c1322;background:var(--gold);padding:5px 10px;text-shadow:none;box-shadow:3px 3px #2a1f06}.summary-num{font-family:var(--pixel);font-size:clamp(54px,14vw,120px);line-height:1;color:var(--gold);text-shadow:6px 6px 0 #2a1f06;margin-top:6px}.summary-cap{font-family:var(--pixel);font-size:clamp(12px,2vw,15px);letter-spacing:1px;color:var(--ink);text-transform:uppercase}.summary-best{font-size:14px;letter-spacing:.5px;color:var(--ink-dim);margin-top:2px}.summary-actions{display:flex;flex-direction:column;gap:12px;margin-top:22px;width:min(320px,80vw)}.summary-actions .btn{width:100%}.online-screen{position:relative;align-items:center}.online-body{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:24px;text-align:center}.online-lead{max-width:440px;font-size:14px;line-height:1.6;color:var(--ink-dim)}.online-actions{display:flex;flex-direction:column;gap:12px;width:min(320px,80vw);margin-top:6px}.online-actions .btn{width:100%}.room-code{font-family:var(--pixel);font-size:clamp(34px,9vw,64px);letter-spacing:8px;color:var(--gold);text-shadow:5px 5px 0 #2a1f06;padding:14px 8px 14px 16px;border:3px solid #2b2f44;background:#0f1322;box-shadow:5px 5px #05060c}.code-input{font-family:var(--pixel);font-size:clamp(24px,6vw,40px);letter-spacing:6px;text-align:center;text-transform:uppercase;color:var(--ink);background:#0f1322;border:3px solid #2b2f44;box-shadow:inset 3px 3px #05060c;padding:12px 8px 12px 14px;width:min(320px,80vw);outline:none}.code-input:focus{border-color:var(--accent, #54c8ff)}.name-input{font-family:var(--ui, inherit);font-size:16px;text-align:center;color:var(--ink);background:#0f1322;border:3px solid #2b2f44;box-shadow:inset 3px 3px #05060c;padding:10px 12px;width:min(320px,80vw);outline:none}.name-input:focus{border-color:var(--accent, #54c8ff)}.name-input::placeholder{color:var(--ink-faint)}.online-status{font-size:13px;letter-spacing:.5px;color:var(--ink-faint);min-height:18px}.online-err{color:#ff8a6a}.rematch-status{font-size:13px;letter-spacing:.5px;color:var(--accent, #54c8ff);margin-top:2px}.level-list{display:flex;flex-direction:column;gap:12px;max-width:720px;width:100%;margin:0 auto}.level-node{display:flex;gap:16px;align-items:center;text-align:left;background:var(--panel-solid);border:2px solid var(--edge);border-left:5px solid var(--edge);border-radius:var(--radius);padding:14px 16px;cursor:pointer;color:var(--ink);box-shadow:var(--shadow-sm);transition:transform .08s,border-color .12s,box-shadow .08s}.level-node:hover:not(:disabled){transform:translate(2px,2px);border-left-color:var(--gold);box-shadow:none}.level-node.locked{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}.level-node.cleared{border-left-color:var(--health)}.ln-num{font-family:var(--pixel);font-size:18px;width:46px;height:46px;flex-shrink:0;display:grid;place-items:center;border-radius:var(--radius);background:#0c1120;border:2px solid var(--edge);color:var(--gold)}.level-node.cleared .ln-num{color:var(--health)}.ln-body{flex:1;min-width:0}.ln-title{font-family:var(--pixel);font-size:12px;line-height:1.5;margin-bottom:7px;display:flex;align-items:center;gap:8px}.ln-flavor,.deck-note,.tagline,.howto-body p,.howto-body li,.card-text,.hint{letter-spacing:.3px}.ln-check{color:var(--health)}.ln-flavor{font-size:13px;color:var(--ink-dim);margin-bottom:6px}.ln-meta{display:flex;gap:14px;font-family:var(--mono);font-size:16px}.ln-ai{color:var(--enemy)}.ln-reward{color:var(--gold)}.collection-screen{max-width:860px;width:100%;margin:0 auto}.skins{display:flex;gap:12px;flex-wrap:wrap}.skin{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);padding:12px 16px;cursor:pointer;color:var(--ink-dim);box-shadow:var(--shadow-sm)}.skin.selected{border-color:var(--gold);color:var(--ink)}.skin.locked{opacity:.45;cursor:not-allowed}.skin-swatch{width:54px;height:54px;image-rendering:pixelated;border-radius:var(--radius);border:2px solid}.skin-name{font-size:15px;font-weight:600}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:14px;padding-bottom:20px}.grid-cell{position:relative;display:flex;justify-content:center}.grid-cell.locked-card{filter:grayscale(1) brightness(.6)}.count-badge,.lock-badge{position:absolute;top:-6px;right:8px;background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);padding:1px 8px;font-family:var(--mono);font-size:17px;font-weight:700;color:var(--gold)}.deck-screen{max-width:900px;width:100%;margin:0 auto}.deck-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}.deck-note{color:var(--ink-dim);font-size:13px;flex:1;min-width:200px}.progress.bad{color:var(--enemy)}.deck-cell{flex-direction:column;gap:4px}.deck-cell:not(.in-deck) .card{filter:grayscale(.55) brightness(.78)}.stepper{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:6px}.step{width:28px;height:28px;border-radius:8px;background:#ffffff0f;border:1px solid var(--edge);color:var(--ink);font-size:16px;font-weight:700;cursor:pointer;display:grid;place-items:center}.step:hover:not(:disabled){border-color:var(--gold-deep)}.step:disabled{opacity:.35;cursor:default}.step-count{font-family:var(--mono);font-size:18px;min-width:54px;text-align:center;color:var(--ink-dim)}.deck-cell.in-deck .step-count{color:var(--gold)}.howto-screen{max-width:720px;width:100%;margin:0 auto}.howto-body section{margin-bottom:20px}.howto-body h3{color:var(--gold);font-size:16px;margin-bottom:8px}.howto-body p,.howto-body li{color:var(--ink-dim);font-size:14px;line-height:1.6}.howto-body ul{padding-left:20px}.howto-body b{color:var(--ink)}.battle{flex:1;min-height:0;position:relative;display:flex;flex-direction:row;align-items:stretch;gap:10px;padding:10px;animation:fade .3s ease}.battle-left,.battle-right{display:flex;flex-direction:column;flex-shrink:0;min-height:0}.battle-left{width:clamp(190px,19vw,272px);gap:10px}.battle-right{width:clamp(176px,18vw,246px);gap:6px}.left-actions{display:flex;gap:8px}.left-actions .icon-btn{flex:1}.left-spacer{flex:1;min-height:0}.battle-log{flex:1;min-height:60px;display:flex;flex-direction:column;background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}.log-title{font-family:var(--pixel);font-size:9px;letter-spacing:1px;color:var(--ink-faint);padding:8px 10px 4px;flex-shrink:0}.log-lines{flex:1;min-height:0;overflow-y:auto;padding:0 10px 8px;display:flex;flex-direction:column;gap:3px;scrollbar-width:thin}.log-line{font-size:14px;line-height:1.15;color:var(--ink-dim)}.log-line.log-enemy{color:#ff96a8}.log-line.log-you{color:#9fd8ff}.log-line.log-neutral{color:var(--ink-faint)}.nameplate.enemy{background:var(--panel-solid);border:2px solid var(--edge);border-left:5px solid var(--enemy);border-radius:var(--radius);padding:8px 12px;box-shadow:var(--shadow-sm)}.np-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.np-title{font-weight:700;font-size:14px}.np-sub{font-family:var(--mono);font-size:15px;color:var(--enemy)}.np-king{display:flex;align-items:center;gap:8px;margin:5px 0 4px}.np-crown{color:var(--enemy);font-size:16px}.np-bar{flex:1;height:10px;background:#0a0d16;border:1px solid #000;overflow:hidden}.np-bar-fill{height:100%;transition:width .3s steps(6)}.np-bar-fill.enemy{background:var(--enemy)}.np-hp{font-family:var(--mono);font-weight:700;font-size:18px;line-height:1;min-width:24px;text-align:right}.np-meta{display:flex;gap:14px;font-family:var(--mono);font-size:15px;color:var(--ink-dim)}.turn-banner{text-align:center;padding:4px 0 2px;font-family:var(--pixel);font-size:clamp(12px,1.2vw,16px);letter-spacing:1px;color:var(--player);text-shadow:2px 2px 0 rgba(0,0,0,.6)}.turn-banner.enemy-turn{color:var(--enemy);text-shadow:2px 2px 0 rgba(0,0,0,.6)}.turn-banner.flash{animation:bannerpop .5s ease}@keyframes bannerpop{0%{transform:scale(.8);opacity:0}40%{transform:scale(1.08);opacity:1}to{transform:scale(1)}}.board-wrap{flex:1;min-width:0;min-height:0;position:relative}.board-canvas{position:absolute;inset:0;display:block;cursor:pointer}.inspect{background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);padding:8px 10px;box-shadow:var(--shadow-sm)}.inspect.hidden,.overlay.hidden,.hidden{display:none!important}.ins-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:4px}.ins-name{font-weight:700}.ins-side{font-size:15px;font-family:var(--mono);text-transform:uppercase}.ins-side.player{color:var(--player)}.ins-side.enemy{color:var(--enemy)}.ins-stats{display:flex;gap:12px;font-family:var(--mono);font-size:18px;font-weight:700}.ins-stats .atk{color:var(--gold)}.ins-stats .def{color:var(--rare)}.ins-stats .hp{color:var(--health)}.ins-ability{margin-top:5px;font-size:12px;color:var(--ink-dim)}.hand-title{font-family:var(--pixel);font-size:10px;color:var(--ink-dim);text-align:center;letter-spacing:1px;padding:2px 0 4px;flex-shrink:0}.player-res{display:flex;flex-direction:column;gap:8px;background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);padding:10px 12px;box-shadow:var(--shadow-sm)}.res-command{display:flex;align-items:center;gap:3px;flex-wrap:wrap}.crystal{width:13px;height:14px;background:#2a3552;border:1px solid #161d30}.crystal.full{background:var(--player);border-color:#bfe9ff}.res-num{font-family:var(--mono);font-weight:700;font-size:18px;line-height:1;margin-left:6px;color:var(--player)}.res-meta{display:flex;gap:12px;font-family:var(--mono);font-size:15px;color:var(--ink-dim)}.hand{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:10px;overflow-x:hidden;overflow-y:auto;padding:14px 12px 10px;scrollbar-width:thin}.hand-empty{color:var(--ink-faint);font-size:14px;align-self:center;margin-top:14px;font-style:italic}.endturn{flex-shrink:0;width:100%;font-family:var(--sans);font-weight:700;font-size:18px;color:#1a1405;background:var(--gold-deep);border:2px solid var(--gold);border-radius:var(--radius);padding:16px;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .06s,box-shadow .06s,background .12s}.endturn:hover:not(:disabled){background:#d8a93a}.endturn:active:not(:disabled){transform:translate(3px,3px);box-shadow:none}.endturn:disabled{opacity:.4;cursor:default;filter:grayscale(.6);box-shadow:none}.endturn.has-plays{animation:etpulse .8s steps(2,jump-none) infinite}@keyframes etpulse{0%,to{border-color:var(--gold)}50%{border-color:#fff5d0}}.hint{background:#54c8ff14;border:2px solid var(--edge);border-radius:var(--radius);padding:7px 10px;font-size:13px;line-height:1.25;color:var(--ink-dim);flex-shrink:0}.card-preview{position:fixed;z-index:30;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:6px;width:210px}.card-preview .preview-card{width:200px;max-width:200px;cursor:default;box-shadow:var(--shadow)}.card-preview .preview-card .card-text{display:block}.preview-flavor{width:100%;background:var(--panel-solid);border:2px solid var(--edge);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:7px 10px;font-size:12px;line-height:1.3;color:var(--ink-faint);font-style:italic}.settings-card{text-align:left}.settings-card h2{text-align:center}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:16px 0;font-size:16px}.settings-row .btn{min-width:86px}.tutorial-callout{position:absolute;left:50%;top:14px;transform:translate(-50%);z-index:7;width:min(540px,66%);background:var(--panel-solid);border:3px solid var(--gold);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px 16px}.tutorial-callout.at-bottom{top:auto;bottom:14px}.tut-head{font-family:var(--pixel);font-size:11px;color:var(--gold);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.tut-step{color:var(--ink-dim)}.tut-text{font-size:16px;line-height:1.35;color:var(--ink)}.tut-actions{margin-top:10px;display:flex;justify-content:flex-end}.tut-actions:empty{display:none}.tutorial-callout.nudge{animation:tutnudge .35s}@keyframes tutnudge{0%,to{transform:translate(-50%)}25%{transform:translate(calc(-50% - 7px))}75%{transform:translate(calc(-50% + 7px))}}.card{position:relative;width:112px;flex-shrink:0;background:#161d30;border:2px solid var(--edge);border-radius:var(--radius);padding:8px 8px 10px;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .1s ease,box-shadow .1s ease,border-color .12s}.hand .card:hover{transform:translate(-7px) scale(1.02);box-shadow:var(--shadow);z-index:3}.card.compact{width:104px;cursor:default}.card.rarity-rare{border-color:var(--rare)}.card.rarity-epic{border-color:var(--epic)}.card.selected{border-color:var(--gold);box-shadow:var(--shadow)}.hand .card.selected{transform:translate(-7px);z-index:3}.battle-right .card{width:100%;max-width:178px}.battle-right .card .card-text{display:none}.card.unaffordable{opacity:.5;filter:saturate(.5)}.card.dealt{animation:dealin .32s cubic-bezier(.2,.8,.3,1) backwards}@keyframes dealin{0%{opacity:0;transform:translateY(22px) scale(.86)}to{opacity:1;transform:translateY(0) scale(1)}}.card.shake{animation:cardshake .35s ease}@keyframes cardshake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.card-cost{position:absolute;top:-8px;left:-8px;width:28px;height:28px;background:#2f7fc0;border:2px solid #bfe9ff;border-radius:var(--radius);display:grid;place-items:center;font-family:var(--mono);font-weight:700;font-size:20px;line-height:1;color:#eaf6ff;box-shadow:var(--shadow-sm);z-index:2}.card-art{width:100%;aspect-ratio:76 / 60;height:auto;border-radius:var(--radius);image-rendering:pixelated;border:2px solid #0c1120}.card-name{font-weight:700;font-size:16px;margin:5px 0 3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card.compact .card-name{font-size:13px;white-space:normal;line-height:1.1;height:2.3em;display:flex;align-items:center;justify-content:center}.card-stats{display:flex;justify-content:space-between;font-family:var(--mono);font-weight:700;font-size:19px;line-height:1;padding:0 3px}.card-stats .atk{color:var(--gold)}.card-stats .def{color:var(--rare)}.card-stats .hp{color:var(--health)}.card-text{margin-top:6px;font-size:13px;line-height:1.2;color:var(--ink-dim);min-height:44px}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#05070ed1;animation:fade .3s ease}.overlay-card{background:var(--panel-solid);border:3px solid var(--edge);border-radius:var(--radius);padding:30px 34px;text-align:center;max-width:440px;width:86vw;box-shadow:8px 8px #00000080}.overlay.win .overlay-card{border-color:var(--gold)}.overlay.lose .overlay-card{border-color:var(--enemy)}.overlay-card h2{font-family:var(--pixel);font-size:26px;margin-bottom:14px;letter-spacing:1px}.win-title{color:var(--gold);text-shadow:3px 3px 0 rgba(0,0,0,.5)}.lose-title{color:var(--enemy)}.overlay-card p{color:var(--ink-dim);line-height:1.6;margin-bottom:10px}.overlay-card .reward{color:var(--gold);background:#f6cf6314;border:1px solid var(--gold-deep);border-radius:8px;padding:8px 12px}.overlay-card b{color:var(--ink)}.overlay-actions{display:flex;gap:10px;justify-content:center;margin-top:20px}@media(max-width:760px){.battle{flex-direction:column;gap:6px;padding:6px}.board-wrap{order:1;flex:1;min-height:0}.battle-left{order:2;width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px}.left-spacer{display:none}.left-actions{order:9}.nameplate.enemy{flex:1;min-width:150px}.turn-banner{padding:0 6px}.hint{flex:1 1 100%;width:100%}.player-res{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px;flex:1}.endturn{width:auto;flex:1;min-width:120px;padding:12px}.inspect{display:none!important}.battle-log{display:none}.battle-right{order:3;width:auto}.hand-title{display:none}.battle-right .hand{flex-direction:row;align-items:flex-end;overflow-x:auto;overflow-y:hidden;max-height:156px;gap:8px}.battle-right .card{width:96px;max-width:96px}.tutorial-callout{width:92%}}