:root{--bg:#110d15;--panel:#211a28ee;--panel2:#302238;--gold:#f3d48a;--red:#ed5757;--blue:#6bb6ff;--green:#72e0a6;--text:#f7ecdb;--muted:#c5ad9b;--line:#6d526b;--shadow:#0008}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% 0%,#36223d 0,#140f18 45%,#07060a 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Arial,sans-serif;min-height:100vh}button,input,select{font:inherit}button{border:1px solid #d8a85d;background:linear-gradient(#755135,#3d2530);color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer;box-shadow:0 2px 0 #170c0c}button:hover{filter:brightness(1.12)}button:disabled{opacity:.45;cursor:not-allowed}.ghost{background:#1d1722;border-color:#766175}.danger{border-color:#ff9090;background:linear-gradient(#8f3434,#4d1d28)}.hidden{display:none!important}.error{color:#ffb0b0}.small{font-size:.9rem;color:var(--muted)}.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#100b14cc;border-radius:999px;padding:6px 10px;color:var(--gold)}.screen{min-height:100vh;display:grid;place-content:center}.auth-card{width:min(420px,92vw);margin:auto;padding:34px;border:1px solid #735a5b;border-radius:24px;background:linear-gradient(135deg,#2a1e29ee,#16121bee);box-shadow:0 30px 80px var(--shadow);text-align:center}.logo{font-weight:900;letter-spacing:-2px;line-height:.8;font-size:62px;color:#ff726a;text-shadow:0 3px 0 #6e2328,0 0 24px #ff786055}.tagline{color:var(--gold);margin-bottom:24px}.auth-card input{display:block;width:100%;margin:10px 0;padding:13px 14px;border-radius:12px;border:1px solid #705764;background:#0f0b12;color:#fff}.row,.actions{display:flex;gap:10px;flex-wrap:wrap}.row button{flex:1}.msg{min-height:24px}.app header{min-height:62px;display:flex;align-items:center;gap:14px;padding:10px 22px;background:#0b090dcc;border-bottom:1px solid #4a3349;position:sticky;top:0;z-index:5;backdrop-filter:blur(8px)}.brand{font-weight:900;font-size:24px;color:#ff756d}.brand span{font-weight:500;color:var(--gold)}nav{display:flex;gap:8px;flex-wrap:wrap}.active{outline:2px solid #f3d48a77}.me{margin-left:auto;color:var(--muted)}main{max-width:1500px;margin:0 auto;padding:18px}.panel{border:1px solid #57415a;border-radius:18px;background:var(--panel);box-shadow:0 15px 50px var(--shadow);padding:16px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:12px 0}.controls label,.ai-control label{display:grid;gap:6px;color:var(--gold)}input,select{background:#100b14;border:1px solid #735a73;color:var(--text);padding:11px;border-radius:10px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.list{display:grid;gap:10px}.list-item,.player-pill,.leader-row{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid #5a455b;background:#18111d;border-radius:12px;padding:10px}.list-actions{display:flex;gap:8px;flex-wrap:wrap}.players{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.chat{height:210px;overflow:auto;border:1px solid #54405b;background:#0f0b12;border-radius:12px;padding:10px}.chat.compact{height:120px}.chat p,.battle-log p{margin:4px 0}.report{padding:3px 7px;border-radius:7px;font-size:.8rem;background:#251b2d}.room-box{margin:16px 0;padding:12px;border:1px solid #6e5671;border-radius:16px;background:#18111de0}.leader-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}.leader-row{display:grid;grid-template-columns:1fr auto auto;margin-bottom:8px}.deck-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.deck-card,.card,.inspect-card{display:grid;grid-template-columns:76px 1fr;gap:10px;border:1px solid #5e4559;background:#160f1b;border-radius:14px;padding:10px}.deck-card img,.card img,.inspect-card img{width:76px;height:106px;object-fit:cover;border-radius:8px;background:#09070c}.deck-card h4,.card h4{margin:0 0 4px}.deck-card p,.card p{margin:3px 0;color:var(--muted);font-size:.88rem}.count-row{display:flex;gap:8px;align-items:center}.count-row button{padding:4px 9px}.game-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.game-actions{display:flex;gap:8px;flex-wrap:wrap}.ai-control{margin:10px 0}.play-area{display:grid;grid-template-columns:minmax(420px,720px) minmax(320px,1fr);gap:16px;align-items:start}canvas{width:100%;height:auto;border:2px solid #8a6b73;border-radius:16px;background:#1b151b;box-shadow:0 16px 40px #0009}.side{display:grid;gap:10px}.inspector,.battle-log,.hand{border:1px solid #54405b;background:#0f0b12;border-radius:12px;padding:10px}.battle-log{height:150px;overflow:auto}.hand{display:grid;gap:9px;max-height:360px;overflow:auto}.card{cursor:pointer;transition:transform .12s ease,border-color .12s ease}.card:hover{transform:translateY(-2px);border-color:var(--gold)}.card.selected{border-color:#fff2a8;box-shadow:0 0 0 2px #fff2a833}.hidden-card{opacity:.8}.summons{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.battle-scene{position:fixed;inset:0;z-index:20;display:grid;grid-template-columns:1fr 120px 1fr;align-items:center;padding:6vh 8vw;background:#030207dd;animation:sceneIn .16s ease-out}.battle-bg{position:absolute;inset:6vh 5vw;border:2px solid #d4b36a;border-radius:20px;background:radial-gradient(circle at 50% 30%,#f0b06166,#33202a 35%,#08060a 75%),url('/assets/backgrounds/oasis-battle.svg') center/cover;filter:saturate(1.12);box-shadow:0 0 80px #000 inset;z-index:-1}.fighter{display:grid;place-items:center;gap:10px}.sprite{width:min(33vw,330px);height:min(43vh,390px);background-size:contain;background-repeat:no-repeat;background-position:center bottom;filter:drop-shadow(0 20px 14px #000b)}.fighter.right .sprite{transform:scaleX(-1)}.fighter .name{font-weight:900;color:#fff;background:#170d13cc;border:1px solid #d7b46a;border-radius:999px;padding:8px 18px}.hpbar{width:min(30vw,300px);height:14px;border:1px solid #fff8;background:#2b1017;border-radius:999px;overflow:hidden}.hpbar i{display:block;height:100%;background:linear-gradient(90deg,#6ee48e,#f5de7b);transition:width .35s ease}.slash{font-size:62px;text-align:center;color:#ffdf8e;text-shadow:0 0 28px #ff5}.battle-text{position:absolute;left:50%;bottom:8vh;transform:translateX(-50%);font-weight:800;font-size:24px;background:#130d18dd;border:1px solid #d7b46a;border-radius:14px;padding:12px 22px}.sprite.attack{animation:attackLunge .72s ease-in-out}.fighter.right .sprite.hit{animation:hitShake .48s ease-in-out}.fighter.left .sprite.hit{animation:hitShakeL .48s ease-in-out}@keyframes sceneIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}@keyframes attackLunge{0%{transform:translateX(0)}45%{transform:translateX(90px) scale(1.05)}100%{transform:translateX(0)}}@keyframes hitShake{0%,100%{transform:scaleX(-1) translateX(0)}20%{transform:scaleX(-1) translateX(18px)}40%{transform:scaleX(-1) translateX(-12px)}60%{transform:scaleX(-1) translateX(8px)}}@keyframes hitShakeL{0%,100%{transform:translateX(0)}20%{transform:translateX(-18px)}40%{transform:translateX(12px)}60%{transform:translateX(-8px)}}@media(max-width:950px){.two-col,.leader-cols,.play-area{grid-template-columns:1fr}.app header{position:static}.battle-scene{grid-template-columns:1fr}.slash{display:none}.sprite{width:60vw;height:28vh}.fighter.right{margin-top:-4vh}}
#chatForm,#roomChatForm,#gameChatForm{display:flex;gap:8px;margin-top:8px}#chatForm input,#roomChatForm input,#gameChatForm input{flex:1;min-width:0}#chatForm button,#roomChatForm button,#gameChatForm button{white-space:nowrap}
#dmForm{display:flex;gap:8px;margin-top:8px}#dmForm input{flex:1;min-width:0}#dmForm button{white-space:nowrap}.history-log{height:220px}.friend-note{color:var(--muted);font-size:.9rem}.list-item.invite{border-color:var(--gold)}
.metrics-panel{border:1px solid #54405b;background:#0f0b12;border-radius:12px;padding:10px;overflow:auto}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin:8px 0}.metric-grid>div{display:grid;gap:2px;align-content:center;min-height:58px;border:1px solid #5a455b;background:#18111d;border-radius:10px;padding:8px;text-align:center}.metric-grid b{font-size:1.15rem;color:var(--gold)}.metric-grid span{font-size:.78rem;color:var(--muted)}.metric-grid.small-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tutorial-prompt{margin:8px 0;padding:10px;border:1px solid var(--gold);border-radius:12px;background:#2a2012;color:#ffe7a0;font-weight:800}

.audio-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.audio-range{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.82rem;background:#140f18;border:1px solid #59475a;border-radius:999px;padding:4px 8px}
.audio-range input{width:72px;padding:0;background:transparent;border:none}

.battle-scene{overflow:hidden}
.battle-bg::before,.battle-bg::after{content:"";position:absolute;inset:0;pointer-events:none}
.battle-bg::before{background:linear-gradient(180deg,#fff2 0,#0000 35%,#0005 100%);mix-blend-mode:screen}
.battle-bg::after{background:repeating-linear-gradient(90deg,#ffffff08 0 3px,#0000 3px 14px);opacity:.35}
.battle-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#fff8 0,#fff0 45%);opacity:0;pointer-events:none}
.battle-ring{position:absolute;left:50%;top:50%;width:24vw;height:24vw;max-width:340px;max-height:340px;border:4px solid #ffe7aa;border-radius:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;filter:drop-shadow(0 0 25px #ffcf63aa);pointer-events:none}
.battle-banner{position:absolute;top:7.5vh;left:50%;transform:translateX(-50%);padding:8px 18px;border:1px solid #efcc79;border-radius:999px;background:linear-gradient(180deg,#2a1208dd,#140d16dd);font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#fff1b0;box-shadow:0 0 30px #0009}
.sprite-wrap{position:relative;display:grid;place-items:center;width:min(35vw,360px);height:min(45vh,410px)}
.sprite-wrap::after{content:"";position:absolute;bottom:12px;left:50%;width:72%;height:22px;transform:translateX(-50%);background:radial-gradient(circle,#0008 0,#0000 72%)}
.sprite{position:relative;z-index:1}
.battle-scene.active .battle-flash{animation:bflash .42s ease-out 1}
.battle-scene.active .battle-ring{animation:bring .7s ease-out 1}
.battle-scene.impact{animation:screenShake .34s ease-in-out 1}
.battle-scene .slash{font-size:72px;filter:drop-shadow(0 0 18px #ffc64d)}
.battle-scene .battle-text{max-width:min(84vw,780px);text-align:center;line-height:1.25}
.sprite.attack{animation:attackLunge .72s cubic-bezier(.3,.05,.15,1.1)}
.fighter.right .sprite.attack{animation:attackR .72s cubic-bezier(.3,.05,.15,1.1)}
.fighter.right .sprite.hit{animation:hitShake .48s ease-in-out}
.fighter.left .sprite.hit{animation:hitShakeL .48s ease-in-out}
@keyframes attackR{0%{transform:scaleX(-1) translateX(0)}45%{transform:scaleX(-1) translateX(-90px) scale(1.05)}100%{transform:scaleX(-1) translateX(0)}}
@keyframes bflash{0%{opacity:0}18%{opacity:.92}100%{opacity:0}}
@keyframes bring{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}25%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) scale(1.18)}}
@keyframes screenShake{0%,100%{transform:translate(0,0)}20%{transform:translate(-8px,4px)}40%{transform:translate(7px,-4px)}60%{transform:translate(-4px,2px)}80%{transform:translate(4px,-2px)}}

@media(max-width:950px){.audio-controls{width:100%;justify-content:flex-start}.audio-range input{width:56px}.battle-banner{top:5vh;font-size:.85rem}}

.result-overlay{position:fixed;inset:0;display:grid;place-items:center;z-index:30;background:radial-gradient(circle at 50% 50%,#ffffff08 0,#000000c8 60%);backdrop-filter:blur(6px)}
.result-card{position:relative;min-width:min(88vw,780px);max-width:88vw;padding:34px 36px;border-radius:24px;text-align:center;border:2px solid #f0cf7f;background:linear-gradient(180deg,#1d1420f0,#0a090ff5);box-shadow:0 24px 90px #000d,0 0 60px #f0cf7f22;overflow:hidden}
.result-card::before{content:"";position:absolute;inset:-30%;background:conic-gradient(from 0deg,#fff0,#ffd77e55,#fff0,#ff7a7a44,#fff0);animation:spinGlow 6s linear infinite}
.result-card>*{position:relative;z-index:1}
.result-kicker{font-size:.95rem;letter-spacing:.24em;text-transform:uppercase;color:#ffd99c;margin-bottom:12px}
.result-title{font-size:clamp(40px,6vw,84px);font-weight:1000;letter-spacing:.06em;line-height:.95;text-shadow:0 3px 0 #000,0 0 28px #ffe7a0}
.result-sub{margin-top:12px;font-size:1.1rem;color:#f2dfc3}
.result-card.game-over{border-color:#ff8787;background:linear-gradient(180deg,#251114f2,#0f090cf7)}
.result-card.game-over .result-title{color:#ff8787;text-shadow:0 0 32px #ff5252aa,0 2px 0 #200}
.result-card.level-up{border-color:#ffe18a;background:linear-gradient(180deg,#28190ff0,#120c12f6)}
.result-card.level-up .result-title{color:#fff0ac;text-shadow:0 0 36px #ffe37daa,0 2px 0 #200}
.spark{position:absolute;border-radius:50%;filter:blur(1px);opacity:.9;mix-blend-mode:screen}
.spark-a{width:220px;height:220px;left:-30px;top:-20px;background:radial-gradient(circle,#fff6b8 0,#ffdd7444 35%,#0000 70%);animation:sparkFloat 2.6s ease-in-out infinite}
.spark-b{width:280px;height:280px;right:-70px;bottom:-60px;background:radial-gradient(circle,#fff 0,#8ad8ff44 35%,#0000 70%);animation:sparkFloat2 2.9s ease-in-out infinite}
@keyframes spinGlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes sparkFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-18px) scale(1.08)}}
@keyframes sparkFloat2{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(14px) scale(.95)}}

.battle-scene.kill .battle-bg{transform:scale(1.06);filter:saturate(1.22) contrast(1.08)}
.battle-scene.kill .battle-text{font-size:30px;border-width:2px;box-shadow:0 0 32px #ffdf8e55}
.battle-scene.kill .battle-banner{font-size:1rem;letter-spacing:.22em;box-shadow:0 0 50px #ffc85f66}
.battle-scene.focus-right .fighter.right .sprite-wrap,.battle-scene.focus-left .fighter.left .sprite-wrap{transform:scale(1.13)}
.battle-scene.focus-right .fighter.left,.battle-scene.focus-left .fighter.right{opacity:.68;filter:saturate(.8)}
.battle-scene.slowmo .sprite.attack{animation-duration:1.05s}
.battle-scene.slowmo .fighter.right .sprite.attack{animation-duration:1.05s}
.battle-scene.slowmo .fighter.right .sprite.hit,.battle-scene.slowmo .fighter.left .sprite.hit{animation-duration:.78s}
.battle-scene .ko-burst{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-weight:1000;font-size:clamp(34px,8vw,96px);letter-spacing:.12em;color:#fff3bf;text-shadow:0 0 24px #ffdf72,0 0 50px #ff7c51;opacity:0;pointer-events:none}
.battle-scene.kill .ko-burst{animation:koBurst 1.4s ease-out 1}
@keyframes koBurst{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}12%{opacity:1}30%{transform:translate(-50%,-50%) scale(1.16)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.28)}}

/* v0.5.8 overlay UX fixes */
.deck-head-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.inline-label{display:inline-flex;align-items:center;gap:8px;color:var(--gold)}.general-summary,.general-in-match{display:grid;grid-template-columns:56px 1fr;gap:10px;align-items:center;margin:8px 0;padding:8px;border:1px solid #5a455b;border-radius:12px;background:#120d17}.general-summary img,.general-in-match img{width:56px;height:72px;object-fit:cover;border-radius:8px}.status-grid{display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:start}.ap-badge{display:grid;place-items:center;min-width:96px;min-height:96px;border:2px solid #ffe19a;border-radius:18px;background:radial-gradient(circle,#7b5330,#21111b);box-shadow:0 0 28px #ffd36a33}.ap-badge b{font-size:44px;line-height:1;color:#fff2b0;text-shadow:0 0 18px #fff2a8}.ap-badge span{font-size:.72rem;letter-spacing:.16em;color:#f6d894}.board-column{display:grid;gap:10px}.zone-row{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.zone-card{min-height:92px;border:1px solid #5a455b;border-radius:12px;background:#120d17;padding:6px;display:grid;grid-template-rows:48px auto auto;gap:3px;align-items:center;text-align:center;cursor:pointer}.zone-card img{height:48px;max-width:100%;object-fit:cover;border-radius:6px;margin:auto}.zone-card.empty{opacity:.62;border-style:dashed}.zone-card b{color:var(--gold);font-size:.78rem}.zone-card span{font-size:.72rem;color:var(--muted)}.hand-horizontal{display:flex;gap:10px;overflow-x:auto;max-height:none;padding-bottom:12px}.hand-horizontal .card{min-width:230px;max-width:260px}.mini{padding:4px 8px;border-radius:8px;font-size:.8rem;margin-top:5px}.card-zoom-overlay{position:fixed;inset:0;z-index:40;background:#050307d8;display:grid;place-items:center;padding:24px;backdrop-filter:blur(6px)}.card-zoom-card{position:relative;display:grid;grid-template-columns:minmax(220px,360px) minmax(260px,420px);gap:20px;max-width:min(92vw,900px);border:2px solid #e5c074;border-radius:22px;background:linear-gradient(135deg,#211725,#100b14);padding:22px;box-shadow:0 24px 90px #000d}.card-zoom-card img{width:100%;max-height:76vh;object-fit:contain;border-radius:14px;background:#09070c}.card-zoom-card button{position:absolute;right:14px;top:14px}.card-zoom-card h2{margin-top:38px;color:#ffe19a}.card-zoom-card p{font-size:1.05rem;line-height:1.5}.fighter.right .sprite{transform:none!important}.fighter.right .sprite.attack{animation:attackLungeR .72s cubic-bezier(.3,.05,.15,1.1)!important}.fighter.right .sprite.hit{animation:hitShakePlain .48s ease-in-out!important}@keyframes attackLungeR{0%{transform:translateX(0)}45%{transform:translateX(-90px) scale(1.05)}100%{transform:translateX(0)}}@keyframes hitShakePlain{0%,100%{transform:translateX(0)}20%{transform:translateX(18px)}40%{transform:translateX(-12px)}60%{transform:translateX(8px)}}
@media(max-width:950px){.status-grid{grid-template-columns:1fr}.zone-row{grid-template-columns:repeat(3,1fr)}.card-zoom-card{grid-template-columns:1fr}.card-zoom-card h2{margin-top:0}}

/* UI flow + board presentation revamp overlay */
main{max-width:1760px;padding:16px 20px}.app header{gap:10px}.home-panel{min-height:calc(100vh - 110px);display:grid;align-content:center;background:linear-gradient(135deg,#21172ae8,#0d0c14f2),radial-gradient(circle at 80% 10%,#d8a85d22,#0000 35%)}.home-hero{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.home-hero h1{font-size:clamp(36px,6vw,76px);line-height:.92;margin:4px 0 10px;color:#ffe3a0;text-shadow:0 8px 34px #000}.eyebrow{letter-spacing:.22em;text-transform:uppercase;color:#ffaf72;font-weight:900}.home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}.home-tile{min-height:150px;text-align:left;padding:22px;border-radius:20px;background:linear-gradient(160deg,#33233c,#15101d);border-color:#8b7052;box-shadow:0 18px 45px #0007}.home-tile b{display:block;font-size:1.45rem;color:#fff1b0;margin-bottom:8px}.home-tile span{display:block;color:#d4c2b2;line-height:1.4}.home-tile:hover{transform:translateY(-3px);filter:brightness(1.1)}
#gamePanel{padding:12px;background:linear-gradient(180deg,#1a1322f4,#09080ef6)}.game-top{position:sticky;top:63px;z-index:4;background:#100b14e8;border:1px solid #3f2d43;border-radius:16px;padding:10px;backdrop-filter:blur(10px)}.play-area{grid-template-columns:minmax(680px,1fr) 340px;gap:14px;align-items:start}.board-column{justify-items:center;align-items:start}.board-column canvas{max-width:min(84vh,900px);box-shadow:0 18px 70px #000c,0 0 0 1px #d6ae6844}.board-column h3{justify-self:start;margin:8px 0 4px}.side-compact{position:sticky;top:145px;max-height:calc(100vh - 158px);overflow:auto;gap:8px}.side-card{border:1px solid #4f3b56;background:#100b14;border-radius:14px;padding:9px}.side-card h3,.side-card summary{font-size:.98rem;margin:0;color:#ffe0a0;font-weight:900;cursor:pointer}.side-card summary{list-style:none}.side-card summary::-webkit-details-marker{display:none}.side-card summary::after{content:'+';float:right;color:#cda15c}.side-card[open] summary::after{content:'–'}.compact-chat{height:112px}.compact-log{height:92px}.compact-history{height:128px}.game-chat,.battle-log{font-size:.88rem}.metric-grid.small-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.zone-row{width:100%;grid-template-columns:repeat(6,minmax(92px,1fr))}.zone-card{min-height:82px}.hand-horizontal{width:100%;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding:8px 2px 12px}.hand-horizontal .card{min-width:210px;max-width:230px;scroll-snap-align:start;grid-template-columns:64px 1fr}.hand-horizontal .card img{width:64px;height:90px}.ap-badge{min-width:118px;min-height:106px}.ap-badge b{font-size:54px}.inspector{font-size:.93rem}.move-hint{color:#9ddcff}.draw-reveal{position:fixed;inset:0;z-index:45;display:grid;place-items:center;background:#03020799;backdrop-filter:blur(4px)}.draw-reveal-card{max-width:min(94vw,980px);border:2px solid #f0cf7f;border-radius:24px;background:linear-gradient(135deg,#24172a,#0d0b12);padding:22px;box-shadow:0 24px 90px #000d;text-align:center}.draw-reveal-cards{display:flex;gap:14px;justify-content:center;overflow:auto;margin:14px 0}.reveal-card{width:170px;display:grid;gap:6px;justify-items:center;border:1px solid #6c5272;border-radius:14px;background:#120c17;padding:10px;cursor:pointer}.reveal-card img{width:120px;height:168px;object-fit:contain;border-radius:8px;background:#060409}.reveal-card b{color:#ffe3a0}.reveal-card span{font-size:.82rem;color:#cfbeb0;max-height:62px;overflow:hidden}.card-zoom-card{background:linear-gradient(135deg,#1c1226,#08070c);border-color:#ffd88e}.card-zoom-card img{filter:drop-shadow(0 18px 35px #000b)}
@media(max-width:1100px){.play-area{grid-template-columns:1fr}.side-compact{position:static;max-height:none}.game-top{position:static}.board-column canvas{max-width:100%}.zone-row{grid-template-columns:repeat(3,1fr)}}