:root{color-scheme:dark;font:14px/1.5 'Segoe UI',sans-serif;color:#eee8dc;background:#11181e}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{display:flex;flex-direction:column}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #80d9ff;outline-offset:4px}.table-header{height:46px;flex:none;display:flex;align-items:center;gap:28px;padding:0 20px;background:#101820;border-bottom:1px solid #42545e;color:#c7d1d7;font-size:11px;z-index:20}.back{font-weight:650}.table-title{font-size:12px;color:#f5f0e4}.table-title>span{margin-left:9px;font:9px/1.4 'Segoe UI',sans-serif;letter-spacing:1px;text-transform:uppercase;color:#b9a77e;border:1px solid #655d47;padding:3px 7px;border-radius:3px}.table-header nav{margin-left:auto;display:flex;gap:10px}.table-header button{background:none;border:1px solid transparent;border-radius:4px;padding:5px 9px;font-size:11px}.table-header button:hover,.table-header button[aria-pressed=true]{background:#253744;border-color:#536d7e}.portrait-hint{display:none}.table-viewport{flex:1;min-height:0;overflow:auto;position:relative;background:#0a1015;scrollbar-color:#58656c #151c23}.arena{width:100%;min-width:900px;height:100%;min-height:540px;position:relative;overflow:hidden;isolation:isolate;container-type:size;background:url('assets/practice-battlefield.webp') center/cover no-repeat}.board-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px 40px #070c1680;background:linear-gradient(180deg,#101b2455,transparent 30%,transparent 70%,#000b)}.player-name{position:absolute;left:2.3%;display:flex;align-items:center;gap:10px;text-shadow:0 2px 4px #000;z-index:4;font:600 clamp(17px,1.55cqw,29px) Georgia,serif}.player-name small{font:9px 'Segoe UI',sans-serif;display:block;color:#c3c6c5;margin-top:5px;letter-spacing:.3px}.opponent-name{top:2.2%}.your-name{bottom:2.4%}.rank-mark{font-size:38px;color:#ab9462;text-shadow:1px 1px #000}.opponent-hand{position:absolute;top:-10%;left:50%;transform:translateX(-50%);height:20%;display:flex;align-items:start;z-index:1}.card-back{position:relative;aspect-ratio:488/680;border:5px solid #1c1917;border-radius:7px;background:radial-gradient(ellipse at center,#375578 0%,#162c41 45%,#766242 47%,#3e3025 50%,#1a2028 65%);box-shadow:inset 0 0 0 1px #9b8155,0 4px 7px #0009;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#9fbcce}.card-back i{font:46px Georgia;font-style:normal;text-shadow:0 0 18px #80bfff}.card-back span{font:7px Georgia;letter-spacing:1.5px;color:#d6c28e}.opponent-hand .card-back{height:100%;margin-left:-18px;transform:translateY(var(--lift)) rotate(var(--angle));transform-origin:center 85%}.avatar{position:absolute;left:50%;transform:translateX(-50%);height:16%;width:8.5%;min-width:83px;max-width:150px;z-index:5;filter:drop-shadow(0 3px 7px #000)}.avatar.opponent{top:1.7%}.avatar.you{bottom:16.5%}.portrait{height:93%;width:100%;overflow:hidden;border-radius:48% 48% 38% 38%;border:3px solid #b09b71;background:#202d35;box-shadow:inset 0 0 10px #000,0 0 0 4px #171c22}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;transform:scale(1.2)}.avatar.opponent .portrait img{object-position:45% 30%}.life{position:absolute;bottom:-4%;left:50%;transform:translateX(-50%);height:40%;min-height:35px;aspect-ratio:1.15;display:grid;place-items:center;background:linear-gradient(135deg,#3d4140,#191e22);border:2px solid #b5ac94;border-radius:45%;font:bold clamp(24px,2.4cqw,40px) Georgia,serif;line-height:1;color:#fff;text-shadow:0 2px 4px #000;box-shadow:0 4px 7px #0009;z-index:2}.avatar.active:before{content:'';position:absolute;inset:20% -30% -17%;border-radius:50%;background:radial-gradient(ellipse,#ffe4a2a0,transparent 66%);z-index:-1;filter:blur(8px)}.avatar.active .portrait{box-shadow:0 0 10px #f5bc62,0 0 26px #ffd68e66;border-color:#ecce8f}.avatar-wings{position:absolute;bottom:0;left:-14%;width:128%;height:25%;border-bottom:5px solid #a9976c;border-radius:0 0 50% 50%;z-index:-1}
.land-row{position:absolute;display:flex;gap:12px;align-items:center;z-index:3}.opponent-lands{top:19%;left:17%;transform:scale(.94)}.your-lands{bottom:21%;left:12%}.land{display:block;position:relative;padding:0;background:#171b20;border:3px solid #8d9b9f;width:6.2cqw;max-width:112px;min-width:62px;aspect-ratio:1.02;border-radius:5px;box-shadow:0 6px 7px #0009;transition:transform .18s,filter .18s}.land>span{position:absolute;top:-1px;left:0;right:0;padding:1px 4px;font:9px Georgia,serif;text-align:left;background:#c4cfcd;color:#151e24;white-space:nowrap;overflow:hidden;border-radius:2px 2px 0 0;z-index:2}.land img{display:block;width:100%;height:100%;object-fit:cover}.land-gem{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);font:15px Georgia;border-radius:50%;width:22px;height:22px;background:#b9c4c5;border:2px solid #819396;color:#243a46;display:grid;place-items:center}.your-lands .land:not(.tapped){border-color:#a0eaff;box-shadow:0 0 8px #46cfff8c,0 5px 7px #0009}.land.tapped{transform:rotate(12deg) translateY(4px);filter:brightness(.6)}.tap-symbol{position:absolute;inset:9% 0 0;display:grid;place-items:center;font:70px/1 Georgia;color:#d6e1e4bb;text-shadow:0 2px #000}.mana-available{position:absolute;left:0;bottom:-31px;font-size:10px;color:#ced9dd;text-shadow:0 2px 3px #000}
.creature-row{position:absolute;left:50%;transform:translateX(-50%);display:flex;justify-content:center;gap:27px;z-index:4}.opponent-creatures{top:30%}.your-creatures{bottom:33%}.permanent{position:relative;padding:0;border:4px solid #161b22;border-radius:7px;background:#1b2530;width:8.9cqw;min-width:91px;max-width:169px;aspect-ratio:.98;box-shadow:0 5px 5px #000a,0 0 0 1px #687379;transition:transform .2s,box-shadow .2s}.permanent img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 28%;border:2px solid #829797;border-radius:4px}.permanent-title{position:absolute;top:-1px;left:2px;right:2px;z-index:2;padding:2px 3px;background:linear-gradient(#d4dedb,#a4b8b8);border-radius:3px;font:clamp(8px,.68cqw,12px)/1.2 Georgia,serif;color:#101a24;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.permanent-bottom{position:absolute;left:0;right:0;bottom:-9px;display:flex;align-items:center;justify-content:center;gap:6px}.permanent-bottom strong{display:grid;place-items:center;background:linear-gradient(#eee7cd,#b9b7a9);color:#161b1f;border:2px solid #4d585b;border-radius:7px;min-width:45px;padding:0 5px;box-shadow:0 3px 4px #000b;font:700 clamp(15px,1.6cqw,25px)/1 Georgia}.ability-gem{width:23px;height:23px;background:#293c48;color:#bfcbd0;border:2px solid #aab9bc;border-radius:8px;font-size:16px;display:grid;place-items:center}.permanent.tapped{transform:rotate(12deg);filter:brightness(.72)}.permanent.can-attack{box-shadow:0 0 0 2px #edb765,0 0 15px #ffb54c55,0 7px 10px #000b}.permanent.attacking{transform:translateY(-18px);box-shadow:0 0 0 3px #ff993d,0 0 26px #f79b4b99}.attack-ribbon{position:absolute;top:-21px;left:35%;width:30%;height:23px;background:linear-gradient(#e7792d,#b84920);clip-path:polygon(50% 0,100% 55%,100% 100%,0 100%,0 55%)}.permanent.blocking{transform:translateY(16px);box-shadow:0 0 0 3px #f1c888,0 0 15px #dfbe8066}.table-seam{position:absolute;top:49%;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,#ada38b44,transparent);text-align:center;pointer-events:none}.table-seam span{position:relative;top:-8px;padding:3px 16px;font:9px 'Segoe UI',sans-serif;letter-spacing:2px;background:#27303785;color:#d9d2bf;text-shadow:0 1px 3px #000;border-radius:20px}.combat-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}.combat-lines path{fill:none;stroke:#eab56f;stroke-width:3;filter:drop-shadow(0 0 5px #ed6e35)}
.pile{position:absolute;width:5.5%;height:13%;max-height:128px;min-height:68px;z-index:3;filter:drop-shadow(0 6px 3px #000)}.pile .card-back{height:100%;box-shadow:3px 3px #101318,5px 5px #514b3f,7px 7px #161a1d}.pile .card-back i{font-size:30px}.pile b,.graveyard b{position:absolute;bottom:-6px;right:-5px;display:grid;place-items:center;padding:2px 6px;min-width:24px;border-radius:5px;background:#101921;border:1px solid #99866b;color:#e8e2d4;font-size:11px}.pile>span{position:absolute;bottom:-24px;left:0;right:0;text-align:center;font-size:9px;color:#c8d0d3;text-shadow:0 2px 3px #000}.opponent-library{top:6%;right:13%;transform:rotate(-5deg)}.your-library{bottom:7%;left:10%;transform:rotate(4deg)}.graveyard{position:absolute;width:4.5%;height:11%;padding:0;border:2px solid #6b6b5b;background:#27303a;border-radius:4px;box-shadow:0 5px 4px #000a;z-index:3}.graveyard img{width:100%;height:100%;object-fit:cover;border-radius:3px;filter:brightness(.75)}.opponent-grave{top:7.5%;right:7%}.your-grave{bottom:8%;left:17%}.hand{position:absolute;bottom:-7%;left:50%;transform:translateX(-50%);display:flex;align-items:flex-end;justify-content:center;z-index:9;height:27%;isolation:isolate}.hand-card{height:100%;aspect-ratio:488/680;position:relative;border:0;background:#141b20;padding:0;border-radius:9px;margin-left:-2.1cqw;transform:translateY(var(--lift)) rotate(var(--angle));transform-origin:50% 100%;box-shadow:0 0 0 2px #3e4b50,0 5px 14px #000;transition:transform .16s,box-shadow .16s}.hand-card:first-child{margin-left:0}.hand-card img{display:block;width:100%;height:100%;object-fit:contain;border-radius:8px}.hand-card.available{box-shadow:0 0 0 2px #5cd5f9,0 0 12px #4bd1ff66,0 8px 18px #000b}.hand-card:hover,.hand-card:focus-visible{transform:translateY(-30%) rotate(0) scale(1.1);z-index:5;box-shadow:0 0 0 3px #a8edff,0 15px 30px #000;outline:none}.hand-cost{position:absolute;top:-21px;right:5px;display:flex;white-space:nowrap;filter:drop-shadow(0 2px 2px #000)}.mana{display:inline-grid;place-items:center;font:700 10px 'Segoe UI',sans-serif;min-width:17px;height:17px;border-radius:50%;background:#dedbd0;color:#1b2830;margin-left:1px;font-style:normal;padding:0 2px}.mana.W{background:#f4e9bd}.mana.U{background:#a4d2ec}.mana.G{background:#abd1b1}.mana.R{background:#e7b39b}.phase-rail{position:absolute;bottom:18%;right:24%;display:flex;gap:14px;color:#8b9b9e;z-index:5}.phase-rail>span{font:20px Georgia;text-align:center;min-width:25px;text-shadow:0 2px 3px #000}.phase-rail small{display:block;font:8px 'Segoe UI',sans-serif;margin-top:3px}.phase-rail .current{color:#ffdb8b;text-shadow:0 0 9px #f7b965}.phase-action{position:absolute;right:2.3%;bottom:7%;width:17%;min-width:170px;max-width:280px;z-index:8;text-align:center}.next-phase{position:relative;display:flex;align-items:center;justify-content:center;width:100%;gap:15px;padding:10px 16px;border:2px solid #ffcf84;border-radius:40px;background:linear-gradient(#fff1a2 0%,#ffa654 10%,#ef722c 50%,#dd4a1a 80%,#fc9e4a);box-shadow:0 0 16px #fa6e305e,inset 0 0 8px #fff1a2;color:#fff4de;text-shadow:0 2px 2px #a44719;font:600 clamp(18px,1.9cqw,29px)/1.1 Georgia,serif}.next-phase:hover{filter:brightness(1.15)}.next-phase span{position:absolute;right:16px;font:30px Georgia}.phase-action>small{display:block;color:#e1d7c8;margin-top:8px;font-size:11px;text-shadow:0 2px 4px #000}.all-attack{background:#2d3540d9;border:1px solid #b0a48d;padding:5px 15px;border-radius:18px;font-size:11px;margin-top:10px}.board-status{position:absolute;bottom:29%;right:3%;max-width:21%;font-size:11px;color:#e7dac4;text-shadow:0 2px 4px #000;z-index:8}.board-status:empty{display:none}.table-coach{position:absolute;right:2.5%;top:43%;width:20%;max-width:300px;padding:16px;border:1px solid #8c795e;border-radius:8px;background:#17232beb;box-shadow:0 10px 35px #0009;z-index:15}.table-coach>span{font-size:9px;letter-spacing:1.5px;color:#eacda0}.table-coach p{font-size:12px;line-height:1.6;color:#e4e5e3;margin:10px 0 0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}dialog{background:#14232e;color:#ecf1f2;border:1px solid #617887;border-radius:12px;max-height:92dvh;max-width:calc(100vw - 30px);padding:24px;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#030b13bd;backdrop-filter:blur(5px)}#inspect{width:760px}#inspect[open]{display:grid;grid-template-columns:1fr 1fr;gap:25px}.inspect-face{width:100%;height:auto;align-self:center;border-radius:9px}.inspect-copy{align-self:center}.inspect-copy>small{font-size:10px;letter-spacing:1px;color:#a9c4d4}.inspect-copy h2{font:29px/1.1 Georgia,serif;margin:10px 0 15px}.inspect-copy p{font-size:13px;line-height:1.55;color:#d6e0e7}.rules{white-space:pre-line}.preview-play{display:block;width:100%;border:1px solid #8fc0dc;border-radius:6px;background:#b4d8f2;color:#142b3d;font-weight:650;font-size:13px;padding:12px;margin:20px 0 10px}.inspect-copy .preview-note{font-size:10px;letter-spacing:0;line-height:1.5;display:block}.inspect-copy .artist{display:block;margin-top:20px;font-size:10px;letter-spacing:0}.close{position:absolute;right:10px;top:10px;width:31px;height:31px;background:#1e3443;border:1px solid #6c8292;border-radius:50%;font-size:22px;line-height:1;color:#eef5f9}.reference-heading{display:flex;align-items:center;gap:25px;margin-bottom:14px;padding-right:30px}.reference-heading h2{font:24px Georgia;margin:0}.reference-heading a{font-size:12px;color:#b4d8f2}#reference{width:1200px}#reference>img{display:block;width:100%;height:auto}#reference>p{font-size:11px;color:#b7c6cf;margin:12px 0 0}
@media(max-width:1000px){.table-header{gap:14px;padding:0 12px}.table-header nav{gap:2px}.table-header button{font-size:10px;padding:5px 7px}.table-title{font-size:11px}.table-title>span{font-size:8px}.land-row{gap:9px}.creature-row{gap:20px}.phase-rail{right:23%;gap:9px}.phase-rail>span{font-size:16px}.table-coach{font-size:11px;width:23%;right:2%}.hand{height:25%}.avatar{height:16%}.permanent-title{font-size:8px}.next-phase{font-size:20px}.player-name{font-size:19px}.your-library{left:8%}.your-grave{left:16%}}
@media(max-width:700px){.table-header{height:auto;min-height:58px;flex-wrap:wrap;gap:5px 12px;padding:8px 10px}.table-header nav{width:100%;margin:0;justify-content:space-between}.table-title{margin-left:auto}.table-title>span{margin-left:4px}.table-header button{padding:4px 7px}.portrait-hint{display:block;flex:none;padding:6px 10px;background:#202d36;color:#cbd8df;font-size:10px;text-align:center}#inspect[open]{display:block;padding:20px}.inspect-face{display:block;width:min(245px,90%);margin:auto}.inspect-copy{padding-top:18px}.inspect-copy h2{font-size:25px}.reference-heading{display:block}.reference-heading h2{font-size:21px}.reference-heading a{display:block;margin-top:10px}}
@media(max-height:560px) and (orientation:landscape){.table-header{height:36px;min-height:36px;padding-block:0;flex-wrap:nowrap}.table-header nav{width:auto;margin-left:auto}.table-title>span{display:none}.portrait-hint{display:none}.arena{min-height:420px}.hand{height:30%;bottom:-11%}.avatar{height:20%}.avatar.you{bottom:18%}.opponent-hand{height:24%;top:-14%}.permanent{width:8cqw;min-width:80px}.land{width:5.5cqw;min-width:55px}.opponent-creatures{top:29%}.your-creatures{bottom:34%}.phase-rail{bottom:20%}.your-lands{bottom:21%}.phase-action{bottom:5%}.player-name small{display:none}}
/* Clip the fanned hand without making the board an autofocus scroll container. */
.arena{overflow:clip}
.avatar.you{height:13%;bottom:19%}
.hand{height:24%}
.phase-rail{right:7%;bottom:21%}
.your-library{left:3%;bottom:10%}
.your-grave{left:10%;bottom:11%}
.hand-cost,.your-library>span{display:none}
.mana-available{left:auto;right:0;bottom:-25px}
@media(max-height:560px) and (orientation:landscape){.avatar.you{height:16%;bottom:21%}.hand{height:27%;bottom:-9%}.phase-rail{bottom:23%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Practical training table: stable card rows and restrained visual hierarchy. */
.arena{background:linear-gradient(#15242deb,#15242deb),url('assets/practice-battlefield.webp') center/cover}
.board-vignette{box-shadow:none;background:linear-gradient(180deg,#c1d6e603 49.5%,#7895a82b 49.5%,#7895a82b 49.7%,#07131b20 49.7%)}
.table-header{background:#101b24;border-color:#31424f;font-size:12px}
.table-header button{font-size:12px}
.player-name{font:600 clamp(17px,1.4cqw,22px)/1.3 'Segoe UI',sans-serif;text-shadow:none;left:3%}
.player-name small{font-size:11px;color:#9eafbd;margin-top:5px}
.rank-mark,.avatar-wings,.avatar.active:before{display:none}
.opponent-name{top:3%}.your-name{bottom:3%}
.avatar{left:3%;transform:none;width:58px;min-width:0;height:58px;filter:none}
.avatar.opponent{top:11%}.avatar.you{bottom:11%;height:58px}
.portrait,.avatar.active .portrait{border:2px solid #688492;border-radius:50%;box-shadow:none}
.avatar.active .portrait{border-color:#b7d9eb}
.life{left:calc(100% + 10px);top:5px;bottom:auto;transform:none;aspect-ratio:auto;width:65px;height:45px;min-height:0;border:0;border-radius:6px;background:#243744;box-shadow:none;font:600 27px/1 'Segoe UI',sans-serif;text-shadow:none}
.life:after{content:'LIFE';position:absolute;bottom:-15px;font:9px/1 'Segoe UI',sans-serif;letter-spacing:1px;color:#a8bac7}
.opponent-hand{top:2%;height:16%;gap:7px}
.opponent-hand .card-back{margin:0;transform:none;max-height:125px}
.card-back{border:3px solid #4a6577;background:linear-gradient(135deg,#263b4d,#192b3a);box-shadow:0 3px 7px #0005,inset 0 0 0 3px #172733;border-radius:6px}
.card-back i{font-size:30px;text-shadow:none;color:#88a8bd}.card-back span{font:6px 'Segoe UI',sans-serif;color:#a7bdca}
.land-row{gap:10px;left:3%;transform:none}
.opponent-lands{top:31%}.your-lands{bottom:35%}
.land-row:before{content:'LANDS';position:absolute;left:0;top:-23px;color:#8fa7b7;font-size:10px;letter-spacing:1.3px}
.land{width:5.2cqw;min-width:47px;max-width:83px;border:2px solid #718791;box-shadow:0 3px 6px #0005}
.land>span{font:10px/1.4 'Segoe UI',sans-serif;background:#263b49;color:#edf3f6}
.your-lands .land:not(.tapped){border-color:#91b9cb;box-shadow:0 3px 6px #0005}
.land-gem{width:18px;height:18px;font-size:12px;bottom:-7px;border-width:1px}
.land.tapped{transform:rotate(9deg);filter:brightness(.6)}.tap-symbol{font-size:44px}
.mana-available{font-size:10px;color:#a9c3d2;bottom:-27px;text-shadow:none}
.creature-row{gap:18px}.opponent-creatures{top:28%}.your-creatures{bottom:32%}
.creature-row:before{position:absolute;top:-28px;left:0;right:0;text-align:center;color:#a9bbc6;font-size:10px;letter-spacing:1.2px;white-space:nowrap}
.opponent-creatures:before{content:'OPPONENT’S BATTLEFIELD'}.your-creatures:before{content:'YOUR BATTLEFIELD'}
.permanent{width:9.5cqw;min-width:96px;max-width:145px;border:2px solid #68818e;border-radius:7px;box-shadow:0 4px 8px #0005}
.permanent img{border:0;border-radius:5px}
.permanent-title{left:0;right:0;top:0;background:#213746ed;color:#f1f5f7;font:500 clamp(9px,.78cqw,12px)/1.3 'Segoe UI',sans-serif;padding:5px 4px;border-radius:4px 4px 0 0}
.permanent-bottom{bottom:5px;justify-content:flex-end;right:5px}
.permanent-bottom strong{border:1px solid #afc5d0;background:#ecf1ed;box-shadow:none;font:700 18px/1.2 'Segoe UI',sans-serif;border-radius:4px;min-width:38px}
.ability-gem{display:none}
.permanent.can-attack{box-shadow:0 0 0 2px #d4a669}
.permanent.attacking{transform:translateY(-8px);box-shadow:0 0 0 3px #e6ab60}
.permanent.blocking{transform:translateY(8px);box-shadow:0 0 0 2px #e6ab60}
.attack-ribbon{top:-12px;height:12px;background:#e6ab60}
.table-seam{background:none;top:49.5%}.table-seam span{background:#203341;color:#c3d5df;letter-spacing:1px;font-size:10px;padding:5px 16px;border:1px solid #4d6575;text-shadow:none}
.combat-lines path{filter:none;stroke-width:2}
.table-seam{left:3%;right:3%;text-align:left}

.pile{width:4.5%;height:11%;filter:none;min-height:55px}.pile .card-back{box-shadow:3px 3px #0f202c,5px 5px #445b69}
.pile b,.graveyard b{border-color:#536e7f;border-radius:4px;background:#112432}
.opponent-library{right:3%;top:5%;transform:none}.opponent-grave{right:9%;top:5.5%}
.your-library{left:auto;right:3%;bottom:34%;transform:none}.your-grave{left:auto;right:9%;bottom:34.5%}
.graveyard{width:4%;height:10%;box-shadow:none;border-color:#536e7f}
.pile>span{font-size:10px;color:#b3c4cf}.your-library>span{display:block}
.hand{bottom:2%;height:24%;max-height:220px;gap:8px;align-items:center}
.hand:before{content:'YOUR HAND · CLICK A CARD TO INSPECT';position:absolute;top:-24px;left:0;color:#a9bbc6;font-size:10px;letter-spacing:1px;white-space:nowrap}
.hand-card{margin:0;transform:none;border-radius:6px;box-shadow:0 3px 8px #0006}
.hand-card.available{box-shadow:0 0 0 1px #789aaf,0 3px 8px #0006}
.hand-card:hover,.hand-card:focus-visible{transform:translateY(-12px) scale(1.035);box-shadow:0 0 0 2px #b6dbef,0 7px 18px #0008}
.phase-rail{right:3%;bottom:20%;gap:12px;color:#8da4b4}.phase-rail>span{font-size:17px;text-shadow:none}.phase-rail small{font-size:10px}.phase-rail .current{color:#f0c185;text-shadow:none}
.phase-action{right:3%;bottom:7%;width:15%;min-width:150px;max-width:230px}
.next-phase{border:1px solid #e9b57d;border-radius:7px;background:#dfaa6c;color:#182833;box-shadow:none;text-shadow:none;font:600 18px/1.3 'Segoe UI',sans-serif;padding:12px 24px 12px 10px}
.next-phase span{font-size:23px;right:12px}.phase-action>small{font-size:11px;color:#b5c8d5;text-shadow:none}.all-attack{border-radius:5px;border-color:#587287;background:#203644}
.board-status{bottom:28%;right:3%;max-width:19%;font-size:11px;color:#becfda;text-shadow:none}
.table-coach{border-color:#597689;background:#1b303f;box-shadow:0 8px 20px #0005}
@media(max-height:650px){.land{width:4.8cqw}.permanent{width:8.2cqw;min-width:86px}.hand{height:24%;bottom:2%}.avatar.you{height:48px;bottom:13%}.avatar.opponent{height:48px;top:13%}.avatar{width:48px}.opponent-hand{height:16%}.hand:before,.creature-row:before{font-size:9px;top:-20px}.phase-rail{bottom:22%}.phase-action{bottom:6%}.opponent-creatures{top:28%}.your-creatures{bottom:32%}}

/* Gameplay layout and interaction states. */
.pile{padding:0;border:0;background:none;color:inherit;font:inherit}
.card-keywords{position:absolute;top:26px;left:4px;right:4px;padding:2px;background:#15232dcf;color:#d7e7ef;font-size:9px;line-height:1.2;border-radius:2px}
.permanent-bottom em{font:9px/1.2 'Segoe UI',sans-serif;background:#20313d;color:#e4d1ad;border-radius:3px;padding:3px}
.empty-zone{font-size:12px;color:#8ca4b4;line-height:1.5;padding:12px 0;white-space:normal;text-align:center}
.creature-row{width:46%;overflow-x:auto;justify-content:safe center;padding:28px 6px 12px;scrollbar-width:thin;scrollbar-color:#536e7f transparent}
.creature-row:before{top:3px}.creature-row .permanent{flex:0 0 clamp(86px,8.5cqw,130px)}
.opponent-creatures{top:23%}.your-creatures{bottom:28%}
.land-row{width:24%;flex-wrap:wrap;gap:10px 7px;max-height:25%;overflow-y:auto;padding:23px 3px 22px;scrollbar-width:thin;scrollbar-color:#536e7f transparent}
.land-row:before{top:0}.land-row .land{flex:0 0 clamp(42px,4.4cqw,67px)}
.opponent-lands{top:26%}.your-lands{bottom:28%}.mana-available{bottom:0;right:3px}
.hand{width:58%;height:23%;max-height:215px;gap:6px;align-items:flex-end}
.hand-card{width:calc((100% - (var(--hand-count) - 1)*6px)/var(--hand-count));max-width:145px;max-height:100%;height:auto;flex:none}
.hand:before{top:-16px}.hand-card.available{box-shadow:0 0 0 2px #89c2df,0 3px 8px #0006}
.opponent-hand{width:42%;height:13%;justify-content:center;gap:5px}.opponent-hand .card-back{flex:0 1 65px;min-width:0}
.next-phase{font-size:16px}button:disabled{cursor:not-allowed;opacity:.5}
.phase-action>small{min-height:16px}.phase-rail{bottom:24%}
.board-status{bottom:auto;top:49%;max-width:25%;right:3%;background:#1a303ed9;padding:9px 11px;border-radius:6px;font-size:12px;line-height:1.45}
.board-status:empty{display:none}.table-coach{top:18%;right:2%;width:24%}.table-coach details{font-size:11px;max-height:190px;overflow:auto}.table-coach details p{font-size:11px;margin:6px 0}
.opening-guide{position:absolute;top:29%;left:50%;transform:translateX(-50%);text-align:center;background:#1b303f;border:1px solid #527083;border-radius:10px;padding:20px 30px;z-index:7;box-shadow:0 6px 24px #0003}
.opening-guide strong{font-size:22px;display:block}.opening-guide span{display:block;color:#b3ccdb;font-size:12px;margin-top:5px}.opening-guide p{font-size:12px;color:#a0b7c7;margin:12px 0 0}
.targetable{outline:3px solid #f1c387!important;outline-offset:3px;cursor:crosshair!important}.block-focus{outline:3px solid #8ed5fb;outline-offset:3px}
.block-tag{position:absolute;bottom:-17px;left:0;color:#f4c989;font-size:9px}.attack-number{position:absolute;top:-17px;left:5px;border-radius:4px;background:#d8a66f;color:#15232d;padding:1px 7px;font-weight:700}
.card-flight{position:fixed;z-index:100;pointer-events:none;object-fit:contain;transform-origin:0 0;border-radius:6px;filter:drop-shadow(0 4px 10px #0006)}
.game-result{position:absolute;top:33%;left:50%;transform:translateX(-50%);width:300px;background:#203747;border:1px solid #96b9cf;z-index:18;padding:30px;border-radius:12px;text-align:center;box-shadow:0 20px 80px #000a}.game-result strong{display:block;font-size:30px}.game-result span{display:block;font-size:13px;color:#c5d8e3;margin:12px 0}.game-result button{border:0;border-radius:6px;padding:10px 20px;background:#dfaa6c;color:#172733}
.arena[data-phase="opening"] .opponent-creatures{visibility:hidden}
.set-tag{font-style:normal;font-size:8px;color:#e6bc84;border:1px solid #806d50;border-radius:3px;padding:1px 3px;margin-left:5px}
.hand:before{content:'LANDS: DOUBLE-CLICK OR DRAG TO PLAY · CLICK TO INSPECT';font-size:9px;letter-spacing:.5px}
.hand-card[draggable="true"]{cursor:grab}.hand-card[draggable="true"]:active{cursor:grabbing}
.land-drop-zone{display:none;position:absolute;left:2%;right:23%;top:51%;bottom:25%;border:2px dashed #88bad3;border-radius:12px;background:#538fac15;pointer-events:none;z-index:12}
.land-drop-zone span{position:absolute;top:9px;left:50%;transform:translateX(-50%);padding:5px 12px;border-radius:5px;background:#1b3445;color:#d5edfa;font-size:12px}
.dragging-land .land-drop-zone{display:block}.land-drop-ready .land-drop-zone{border-style:solid;border-color:#b0e8cc;background:#65bb8b25}.land-drop-ready .land-drop-zone span{background:#254e40}
@media(max-height:650px){.phase-rail{display:none}}
#inspect:has(.deck-overview){width:900px}#inspect:has(.reset-copy),#inspect:has(.rules-copy),#inspect:has(.grave-list){width:620px}
.deck-overview,.reset-copy,.rules-copy,.grave-list{grid-column:1/-1;padding:8px}.deck-overview>p,.rules-copy p,.reset-copy p{font-size:13px;color:#b8cdd9;line-height:1.7}.deck-columns{display:grid;grid-template-columns:1fr 1fr;gap:30px}.deck-columns h3{font-size:18px}.deck-columns p{font-size:12px;color:#b8cdd9}.deck-columns section>small{display:block;margin-bottom:16px;color:#e6bc84}.deck-entry{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid #344b5a;font-size:12px}.deck-entry small{margin-left:auto}.grave-list button{display:block;width:100%;text-align:left;padding:10px;border:0;border-bottom:1px solid #405868;background:#203747}
@media(max-width:700px){.table-header nav{gap:0}.table-header button{font-size:10px;padding:5px}.deck-columns{grid-template-columns:1fr}.table-header{gap:4px}.table-title>span{font-size:7px}}
@media(max-height:650px){.creature-row{padding-top:22px;padding-bottom:10px}.creature-row:before{top:2px}.creature-row .permanent{flex-basis:82px;min-width:82px}.hand{height:23%;bottom:2%}.opponent-creatures{top:21%}.your-creatures{bottom:27%}.opening-guide{top:22%;padding:16px}.board-status{font-size:10px;top:46%;max-width:24%}.card-keywords{font-size:8px;top:24px}.land-row .land{flex-basis:43px;min-width:43px}.opponent-lands{top:28%}.your-lands{bottom:28%}.phase-rail{bottom:26%}.phase-action{bottom:5%}}

/* Sample draft match: explicit token representation and ability targets. */
.land.targetable{outline:3px solid #80d5ed;box-shadow:0 0 20px #60c6ef77}.token-face{display:flex;flex-direction:column;gap:14px;padding:18px;background:#c1c9c9;color:#162128;border:7px solid #354957;border-radius:15px;justify-content:space-between}.token-face img{width:100%;border-radius:8px}.token-face strong{font-size:24px}.token-face b{align-self:flex-end;font-size:28px}.inspect-copy .preview-play+.preview-play{margin-top:8px}
/* Arena-reference layout: central avatars, side permanents, stack and phase stops. */
.avatar.you{left:50%;bottom:21%;transform:translateX(-50%);width:72px;height:72px;display:block}.avatar.opponent{left:50%;top:2%;transform:translateX(-50%);width:62px;height:62px;display:block}.avatar .portrait{width:100%;height:100%;border-radius:50%;border:2px solid #95bcd1}.avatar .life{position:absolute;left:50%;bottom:-12px;transform:translateX(-50%);border-radius:45%;border:2px solid #a7bdc5;min-width:58px;font-size:25px;background:#15212e}.avatar .life:after{display:none}.avatar.active .portrait{box-shadow:0 0 23px #e9b461aa;border-color:#edbc70}
.player-name.your-name{bottom:2%;left:2%}.player-name.opponent-name{top:2%;left:2%}.opponent-hand{top:-4%;left:53%;transform:translateX(-50%);width:28%;opacity:.8;height:9%}
.opponent-lands{top:11%;left:3%;width:32%;max-height:16%}.your-lands{bottom:23%;left:3%;width:32%;max-height:18%}.land-row .land{flex-basis:clamp(42px,4.3cqw,64px)}
.opponent-creatures{top:24%;left:26%;width:53%;transform:none}.your-creatures{bottom:34%;left:26%;width:53%;transform:none}.creature-row .permanent{flex-basis:clamp(82px,7.2cqw,112px)}.permanent{aspect-ratio:.82;height:auto}.permanent>img{height:100%;object-fit:cover}.card-keywords{top:auto;bottom:29px;font-size:9px}.creature-row{max-height:24%}
.hand{left:50%;bottom:-2%;transform:translateX(-50%);width:52%;height:22%;gap:0}.hand-card{margin-left:-5px;border:1px solid #456073;max-width:136px}.hand-card.available{box-shadow:0 0 7px #65c5e8,0 0 0 1px #98e1f2}.hand-card:hover,.hand-card:focus-visible{transform:translateY(-32px) scale(1.16);z-index:9}.hand:before{top:-14px;text-align:center;width:100%;font-size:8px;opacity:.7}
.support-row{position:absolute;left:3%;width:21%;display:flex;gap:7px;overflow-x:auto;max-height:24%;padding:5px;scrollbar-width:thin}.opponent-support{top:28%}.your-support{bottom:40%}.support-card{position:relative;flex:0 0 100px;aspect-ratio:.72;overflow:hidden;border:1px solid #8ba1b3;border-radius:10px;background:#263745;color:#eee;text-align:left;padding:0}.support-card img{width:100%;height:100%;object-fit:cover}.support-card strong{position:absolute;top:0;left:0;right:0;padding:5px;background:#122433dd;font-size:10px}.support-card>span{position:absolute;bottom:0;left:0;right:0;background:#142330e8;padding:5px;font-size:9px;display:flex;align-items:center;gap:5px}.support-card.planeswalker{border-color:#c1a674;border-radius:28px 28px 10px 10px}.loyalty-shield{font:700 24px Georgia;display:inline-block;min-width:30px;text-align:center;background:#18212a;border:2px solid #c0cad0;clip-path:polygon(0 0,100% 0,100% 70%,50% 100%,0 70%)}
.phase-rail{display:flex!important;right:2%;bottom:14%;gap:3px}.phase-rail button{background:#172938;border:1px solid #56768c;color:#aacbdd;width:39px;height:43px;border-radius:13px;font-size:20px;padding:2px;position:relative}.phase-rail button small{font:8px 'Segoe UI';display:block}.phase-rail .current{background:#795c38;color:#ffe4b3;border-color:#ecb46c;box-shadow:0 0 10px #b4773444}.phase-rail .stop-set:after{content:'';position:absolute;right:0;top:-3px;width:9px;height:9px;background:#eb7056;border:1px solid #ffd5c9;border-radius:50%}
.phase-action{right:2%;bottom:3%;width:17%}.next-phase{border-radius:23px;background:linear-gradient(#f4c37c,#cc8948);border:1px solid #f6cc96;box-shadow:0 2px 12px #a66b2733;color:#17222d}.phase-action>small{font-size:10px}.board-status{top:47%;right:2%;max-width:22%;font-size:11px}.spell-stack{position:absolute;right:2%;top:24%;width:19%;max-height:45%;overflow:auto;z-index:8;padding:10px;background:#12202ce8;border:1px solid #7d6d52;border-radius:10px}.spell-stack>small{color:#d8b781;font-size:10px;letter-spacing:2px}.stack-item{display:flex;gap:8px;align-items:center;margin-top:7px;border:1px solid #4c5e6a;border-radius:5px;padding:4px}.stack-item img{width:48px;height:55px;object-fit:cover;border-radius:4px}.stack-item b{font-size:11px;display:block}.stack-item small{display:block;font-size:10px;color:#a8c4d4}.stack-item.top-spell{border-color:#e5b774;background:#36464e}
.your-library{bottom:26%;right:3%}.your-grave{bottom:26%;right:9%}.opponent-library{top:4%;right:3%}.opponent-grave{top:4%;right:9%}.table-seam{left:3%;right:26%;top:48%;text-align:center}.table-seam span{font-size:9px;background:#112433a8}.opening-guide{top:31%;padding:20px 30px}
.ability-choice{display:flex;width:100%;justify-content:space-between;gap:14px;text-align:left;margin-top:9px;align-items:center}.ability-choice b{font-size:13px}.ability-choice small{white-space:nowrap;font-size:12px}.choice-panel{grid-column:1/-1}.choice-panel>small{color:#dbb57c;letter-spacing:2px;font-size:10px}.choice-options{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-height:65vh;overflow:auto;padding:10px}.choice-options button{border:1px solid #6086a0;border-radius:7px;background:#243b4a;padding:9px;flex:0 1 170px;min-width:120px;color:#e7f0f4}.choice-options button:hover{border-color:#e8b16c;background:#3b5261}.choice-options img{display:block;width:100%;border-radius:6px;margin-bottom:8px}.choice-options strong{font-size:12px}.choice-options button:focus{outline:2px solid #e8b16c}#inspect:has(.choice-panel){width:850px;max-width:94vw}#inspect:has(.choice-panel)>.close,#inspect:has(.choice-panel)>form{display:none}
.match-lobby{position:absolute;inset:8% 23%;border:1px solid #6d8798;border-radius:16px;background:#172b3bea;padding:35px;overflow:auto;text-align:center}.match-lobby>small{color:#d8b780;letter-spacing:2px}.match-lobby h1{font-size:36px;margin:18px}.match-lobby p{color:#b7cad8}.match-summary{display:flex;gap:15px;justify-content:center;align-items:center;margin:25px}.match-summary b{font-size:25px}.match-summary span{font-size:13px}.match-lobby>a{display:block;margin:18px;color:#a8d4ed}.match-lobby details{margin:22px auto;max-height:200px;overflow:auto;font-size:12px;text-align:left}.match-lobby summary{text-align:center;cursor:pointer}
@media(max-height:650px){.avatar.you{width:48px;height:48px;bottom:22%}.avatar.opponent{width:42px;height:42px}.avatar .life{font-size:19px;min-width:42px}.support-card{flex-basis:70px}.phase-rail{bottom:17%;display:flex!important}.phase-rail button{width:31px;height:34px;font-size:16px}.creature-row .permanent{flex-basis:77px;min-width:77px}.opponent-creatures{top:24%}.your-creatures{bottom:34%}.hand{height:22%}.match-lobby{inset:5% 20%;padding:20px}}
#inspect:has(.inspect-copy){position:fixed;inset:9% 2% auto auto;margin:0;width:580px;max-width:93vw;max-height:82vh;grid-template-columns:44% 1fr;gap:18px;border-color:#7799ad;background:#152837f5}#inspect:has(.inspect-copy)::backdrop{background:#0003}.prepared-tag{border:1px solid #92cfd4;color:#b7f0ea!important}.attack-target-note{position:absolute;left:0;right:0;bottom:26px;background:#593d2ce8;color:#ffe1ac;padding:3px;font-size:8px}.ability-choice{border:1px solid #718a98;background:#2a4353;color:#e4ecf1}.ability-choice:not(:disabled):hover{background:#425d6c;border-color:#f1c17c}.ability-choice:disabled{opacity:.35}
.phase-stop-owner{position:absolute;right:2%;bottom:20%;width:210px;display:flex;gap:5px;justify-content:flex-end}.phase-stop-owner button{border:0;background:transparent;color:#899fae;font-size:9px;padding:3px 6px;border-radius:5px}.phase-stop-owner button[aria-pressed=true]{background:#284050;color:#dceaf2}@media(max-height:650px){.phase-stop-owner{bottom:25%}}
/* Keep card actions visible beside the face, not below it. */
#inspect:has(.inspect-copy)>form{position:absolute;right:9px;top:9px;z-index:3}#inspect:has(.inspect-copy) .inspect-face{grid-column:2;grid-row:1;align-self:start;width:100%;max-height:65vh;object-fit:contain}#inspect:has(.inspect-copy) .inspect-copy{grid-column:1;grid-row:1;min-width:0;padding:6px 0}#inspect:has(.inspect-copy) .inspect-copy h2{font-size:22px;margin:8px 0 14px}#inspect:has(.inspect-copy) .rules{font-size:11px;line-height:1.5;max-height:135px;overflow:auto}#inspect:has(.inspect-copy)::backdrop{backdrop-filter:none;background:#0003}#inspect:has(.inspect-copy) .ability-choice{padding:10px 8px}#inspect:has(.inspect-copy) .artist{font-size:9px}
.support-card{flex-basis:90px;aspect-ratio:.8}.opponent-support{top:27%}.your-support{bottom:36%}.your-lands{bottom:21%;max-height:15%}.arena[data-phase=attack] .phase-rail{bottom:22%}.arena[data-phase=attack] .phase-stop-owner{bottom:28%}.phase-action .all-attack{font-size:10px;padding:6px 8px}
@media(max-height:650px){.support-card{flex-basis:65px}.your-support{bottom:37%}.arena[data-phase=attack] .phase-rail{bottom:28%}.arena[data-phase=attack] .phase-stop-owner{bottom:36%}#inspect:has(.inspect-copy){inset:5% 2% auto auto;max-height:90vh}#inspect:has(.inspect-copy) .rules{max-height:70px}}
.your-library{bottom:37%}.your-grave{bottom:37%}.land-drop-zone{bottom:20%}

.pod-rival{display:flex;flex-direction:column;gap:10px;margin:24px 0;color:#c7d3d0}.pod-rival select{padding:12px;background:#182a34;color:#f5eddb;border:1px solid #658079;border-radius:7px;font:inherit}.pod-rival small{color:#9eadaf}

/* Arena-style phase gems: opponent at their avatar, yours above the orange Next pill. */
.arena-phase-strip{position:absolute;display:flex;gap:6px;justify-content:center;z-index:11;isolation:isolate}
.arena-phase-strip:before{content:'';position:absolute;top:22px;left:20px;right:20px;height:1px;background:#83b3d37a;z-index:-1}
.your-phases{right:2%;bottom:19%;width:22%;max-width:310px}
.opponent-phases{left:50%;top:12%;transform:translateX(-50%);width:270px}
.phase-gem{position:relative;background:transparent;border:0;padding:0 2px;color:#aac3da;min-width:38px;cursor:pointer;flex:1;max-width:54px}
.phase-gem>span{display:grid;place-items:center;position:relative;margin:auto;width:39px;height:43px;background:#8ec5ee;clip-path:polygon(28% 0,72% 0,100% 26%,100% 74%,72% 100%,28% 100%,0 74%,0 26%);font:23px Georgia;color:#a3cae7;text-shadow:0 0 8px #5bc8ff}
.phase-gem>span:before{content:'';position:absolute;inset:2px;clip-path:inherit;background:radial-gradient(ellipse at center,#182d42 40%,#305470);z-index:-1}
.phase-gem small{display:block;margin-top:5px;font-size:9px;white-space:nowrap;color:#a9bccd}
.phase-gem.current>span{background:#ffd292;color:#fff1c9;filter:drop-shadow(0 0 6px #ffb95d)}
.phase-gem.current>span:before{background:radial-gradient(#e8a759,#925a29)}
.phase-gem.current small{color:#ffe2aa}
.phase-gem.stop-set i{position:absolute;width:10px;height:10px;border-radius:50%;background:#fa6643;border:1px solid #ffd6aa;box-shadow:0 0 8px #ff5b39;top:-4px;right:4px}
.phase-gem:focus-visible{outline:2px solid #ffd292;outline-offset:4px;border-radius:6px}
.phase-gem:hover>span{filter:brightness(1.25)}
.phase-action{right:2%;bottom:3%;width:22%;max-width:310px}
.phase-action .next-phase{min-height:49px;border-radius:30px;background:linear-gradient(#ffd494,#ee9649 45%,#cb5e26);border:1px solid #ffe2ae;box-shadow:inset 0 0 8px #ffd5a099,0 0 12px #b6693444;color:#fff4dc;text-shadow:0 1px 2px #81380f;font:600 24px/1.1 Georgia,serif;padding:9px 14px}
.phase-action .next-phase:disabled{background:linear-gradient(#3c4a54,#23333f);border-color:#607280;color:#a5b6c2;text-shadow:none;box-shadow:none;opacity:1}
.phase-action>small{font-size:10px;min-height:13px;max-height:28px;overflow:hidden}
.flow-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.flow-controls button{display:flex;gap:6px;align-items:center;background:#112638c9;border:1px solid #597a93;color:#bdd7e9;font-size:12px;border-radius:20px;padding:5px 10px}
.flow-controls button span{font:10px 'Segoe UI',sans-serif}
.flow-controls [aria-pressed=true]{background:#97551f;border-color:#ffb76d;color:#ffe7bc}
.spell-stack{top:20%;max-height:24%;width:22%;right:2%;padding:8px}
.response-cue{position:absolute;right:2%;top:47%;width:22%;max-height:24%;overflow:auto;z-index:12;padding:12px;border:1px solid #85bad8;border-radius:8px;background:#132e40f5;box-shadow:0 0 20px #64bde522}
.response-cue>b{font-size:12px;color:#bce6fd;letter-spacing:.5px}.response-cue p{font-size:11px;line-height:1.4;margin:7px 0;color:#e7e7de}.response-cue>small{display:block;font-size:10px;line-height:1.4;color:#a5bdcc;margin-top:8px}
.response-cue button{display:block;width:100%;padding:8px;margin-top:6px;text-align:left;border:1px solid #86b8cf;background:#29495d;border-radius:5px;font-size:11px;color:#dceffc}
.arena:has(.response-cue) .board-status{display:none}.arena:has(.response-cue) .your-library,.arena:has(.response-cue) .your-grave{opacity:.16;pointer-events:none}
.action-reason{display:block;color:#e0bca1;font-size:10px;line-height:1.4;margin:2px 0 10px}
.stop-plan{grid-column:1/-1}.stop-plan h2{font:26px Georgia}.stop-plan p{font-size:12px;line-height:1.6;color:#bdd1dd}.stop-grid{display:grid;grid-template-columns:minmax(180px,1fr) 85px 85px;gap:9px;align-items:center;margin:20px 0}.stop-grid>b{font-size:10px;color:#9fb6c7}.stop-grid>span{font-size:12px}.stop-grid button{border:1px solid #49677e;background:#1a3042;border-radius:5px;color:#adc5d7;padding:7px;font-size:11px}.stop-grid button[aria-pressed=true]{color:#ffe2b9;background:#5a3e2b;border-color:#d39360}
@media(max-height:650px){.your-phases{bottom:24%;width:23%}.opponent-phases{top:13%;width:210px}.phase-gem>span{width:30px;height:33px;font-size:19px}.phase-gem small{font-size:8px;margin-top:3px}.arena-phase-strip:before{top:17px}.phase-action{bottom:2%;width:23%}.phase-action .next-phase{min-height:36px;font-size:19px}.flow-controls button{padding:3px 8px;font-size:10px}.flow-controls{margin-bottom:4px}.response-cue{top:44%;max-height:26%;padding:8px}.response-cue button{padding:5px;font-size:10px}.spell-stack{top:17%;max-height:25%}.stack-item img{width:34px;height:40px}.response-cue>small{font-size:9px}.response-cue p{margin:4px 0}.phase-action .all-attack{margin-top:4px;padding:4px}}
@media(max-height:650px){.response-cue{top:42%;max-height:24%}.spell-stack{top:16%;max-height:23%}}
.table-header [data-ev]{border:1px solid #507c8b;border-radius:16px;color:#c3e5ef;white-space:nowrap}
.practice-evidence{grid-column:1/-1;min-width:0;padding:8px}.practice-evidence h2{font:30px Georgia;margin:8px 0}.practice-evidence h3{font:21px Georgia;margin:20px 0 8px}.practice-evidence p{font-size:12px;line-height:1.7;color:#bacbd5}.ev-eyebrow{color:#95cce2;font-size:10px;letter-spacing:2px}.ev-decks{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0}.ev-decks article{padding:18px;background:#163040;border:1px solid #456574;border-radius:10px}.ev-decks small,.ev-decks strong,.ev-decks article>span{display:block}.ev-decks strong{font:32px Georgia;color:#d3eaf1;margin:8px 0}.ev-decks small{font-size:10px;letter-spacing:1px}.ev-decks article>span{font-size:11px;color:#acbfca}.practice-evidence details{margin-top:14px}.practice-evidence summary{cursor:pointer;font-size:12px;color:#a5d7ee}.ev-factor{display:flex;justify-content:space-between;font-size:11px;margin-top:8px;gap:10px}.ev-snapshot{border-left:3px solid #7fbad1;padding:10px 15px;background:#142e3e}.ev-snapshot>b{font-size:13px}.ev-snapshot p{margin:6px 0 0}.ev-table-scroll{overflow-x:auto;margin-top:12px}.practice-evidence table{border-collapse:collapse;width:100%;font-size:11px}.practice-evidence th{text-align:left;color:#abcbd9;font-size:10px}.practice-evidence td,.practice-evidence th{border-bottom:1px solid #354f5e;padding:10px 8px}.practice-evidence td small{display:block;color:#95abb9;font-size:10px}.practice-evidence .ev-note{font-size:11px;color:#9db4c1}.practice-evidence .preview-play{margin-top:14px}
@media(max-width:700px){.ev-decks{grid-template-columns:1fr}.practice-evidence h2{font-size:25px}.table-header nav{overflow-x:auto;min-width:0}.table-header nav button{flex-shrink:0}.practice-evidence{padding:0}}
:root{--table-panel:linear-gradient(150deg,#202d35f5,#10181ff5)}
/* Arena-inspired reading: transient magnifier, explicit compact actions. */
.card-magnifier{position:fixed;z-index:80;pointer-events:none;opacity:0;transform:scale(.72);transition:opacity .13s ease,transform .18s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 14px 22px #000b);will-change:transform,opacity}
.card-magnifier.visible{opacity:1;transform:scale(1)}
.magnifier-face{display:block;width:100%;aspect-ratio:488/680;object-fit:contain;border-radius:13px;box-shadow:0 0 0 1px #b3c9d755,0 0 24px #8ccfff20;background:#111}
.magnifier-state{margin-top:6px;border:1px solid #7f9eaa77;border-radius:6px;padding:5px 9px;background:#17232ef5;font-size:11px;color:#e9d7ae;text-align:center}
.magnifier-token{aspect-ratio:488/680;border:8px solid #1e2328;border-radius:14px;padding:10px;background:linear-gradient(#768989,#d4cfb8);color:#17232a;display:flex;flex-direction:column;gap:8px}
.magnifier-token h3,.magnifier-token p{margin:0}.magnifier-token img{width:100%;max-height:48%;object-fit:cover}.magnifier-token strong{margin-top:auto;align-self:end;font-size:25px}
.card-action-menu{position:fixed;z-index:85;width:280px;max-height:calc(100vh - 80px);overflow:auto;padding:12px;background:var(--table-panel);border:1px solid #9cb5c18c;border-radius:10px;box-shadow:0 12px 35px #000b}
.card-action-menu[hidden]{display:none}.card-action-menu header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font:16px Georgia,serif}.card-action-menu header button{background:none;border:0;font-size:22px;color:#bdcbd2}.card-action-menu .preview-play{width:100%;margin:5px 0;padding:10px;font-size:13px}.card-action-menu>small,.card-action-menu .action-reason{display:block;color:#bac6ce;font-size:11px}.card-action-menu .card-details-link{display:block;margin-top:10px;border:0;background:none;font-size:11px;color:#99c9df;padding:3px 0}
/* Mirrored vertical rails are DraftSmith's adaptation, not an exact Arena skin. */
body .arena-phase-strip{left:auto;right:14px;width:84px;max-width:none;transform:none;display:flex;flex-direction:column;gap:3px;padding:7px 4px;background:linear-gradient(90deg,#16232a80,#10191ec9);border:1px solid #7c909344;border-radius:10px}
body .arena-phase-strip:before{display:none}
body .arena-phase-strip.opponent-phases,body.teaching-mode.open-hands .arena-phase-strip.opponent-phases{top:3%;bottom:auto}
body .arena-phase-strip.your-phases{top:auto;bottom:23%}
.arena-phase-strip .phase-owner{font-size:8px;letter-spacing:1px;text-align:center;color:#a6b8bf;margin-bottom:3px}
body .arena-phase-strip .phase-gem{width:100%;max-width:none;min-width:0;display:flex;align-items:center;gap:5px;padding:1px 3px;position:relative;flex:none}
body .arena-phase-strip .phase-gem>span{width:25px;height:27px;flex:none;font-size:16px;display:grid;place-items:center}
body .arena-phase-strip .phase-gem small{font-size:9px;margin:0;white-space:nowrap}
body .arena-phase-strip .phase-gem i{right:-1px;top:1px;width:7px;height:7px}
body .arena-phase-strip .phase-gem.current small{color:#ffe0a1}.arena-phase-strip .phase-gem.stop-set small{color:#ffba9e}
body .stack-dock{position:absolute;right:112px;top:24%;width:210px;max-height:53%;z-index:13;display:flex;flex-direction:column;gap:8px;pointer-events:none}
body .stack-dock .spell-stack{position:relative;inset:auto;width:100%;max-height:230px;margin:0;padding:0;overflow:hidden;display:flex;flex-direction:column;border:1px solid #8faca966;border-radius:9px;background:var(--table-panel);pointer-events:auto;box-shadow:0 9px 25px #0007}
.stack-heading{width:100%;display:flex;justify-content:space-between;align-items:center;border:0;border-bottom:1px solid #7b989a44;background:#25343dc9;padding:9px;font-size:9px;letter-spacing:.7px;text-align:left}.stack-heading b{color:#ffdda2;margin-left:5px}.stack-heading>span:last-child{color:#b7cbd4;font-size:9px;letter-spacing:0}
.stack-cards{overflow:auto;padding:6px}.stack-cards[hidden]{display:none}
body .stack-dock .stack-item{width:100%;display:flex;align-items:center;gap:9px;padding:7px;margin:0 0 5px;background:#0c151c88;border:1px solid #62787b55;border-radius:6px;text-align:left}.stack-dock .stack-item>img{width:43px;height:57px;object-fit:cover;border-radius:4px}.stack-dock .stack-item>span{min-width:0;display:grid;gap:4px}.stack-dock .stack-item b{font:13px/1.25 Georgia,serif}.stack-dock .stack-item small{font-size:8px;line-height:1.4;color:#bbccd1}.stack-dock .stack-item.top-spell{border-color:#d7b87899;box-shadow:inset 2px 0 #ddb96b}
body .stack-dock .response-cue{position:relative;inset:auto;width:100%;max-height:190px;padding:10px;margin:0;pointer-events:auto;background:var(--table-panel);border-radius:9px;font-size:11px}.stack-dock .response-cue p{margin:5px 0}.stack-dock .response-cue button{font-size:11px}.stack-dock .response-cue small{font-size:10px}
@media(max-height:720px){body .arena-phase-strip{gap:0;padding-top:4px;padding-bottom:4px}body .arena-phase-strip .phase-gem>span{height:23px;width:23px}body .arena-phase-strip.your-phases{bottom:25%}body .stack-dock{top:20%;max-height:52%;width:195px}body .stack-dock .spell-stack{max-height:170px}body .stack-dock .response-cue{max-height:145px}}
@media(prefers-reduced-motion:reduce){.card-magnifier{transition:none}}
/* Keep libraries and graveyards clear of both phase rails and the stack dock. */
body .opponent-library{right:112px;top:4%}body .opponent-grave{right:190px;top:4%}
body .your-library{left:3%;right:auto;bottom:8%}body .your-grave{left:10%;right:auto;bottom:8%}
body .your-library>span{display:none}
body .arena:has(.response-cue) .your-library,body .arena:has(.response-cue) .your-grave{opacity:1;pointer-events:auto}
body.teaching-mode.open-hands .opponent-hand{width:58%;left:51%}
body .hand:before{content:'HOVER TO READ · CLICK FOR ACTIONS · DOUBLE-CLICK OR DRAG LANDS TO PLAY';font-size:8px}
/* Emberstone — approved table finish. Presentation only; all actions remain engine-owned. */
body.emberstone-table{--table-panel:linear-gradient(140deg,#454135f5,#23231ff5);--ember-edge:#bc9e6b77;--ember-ink:#c9c2ae}
.emberstone-table .arena{background:linear-gradient(#211d1740,#211d1740),url('assets/practice-battlefield.webp') center/cover no-repeat}
.emberstone-table .board-vignette{background:radial-gradient(ellipse at 50% 45%,#bc9e5618,transparent 60%),linear-gradient(0deg,#20120566,#14202922 60%,#1f231b44);box-shadow:inset 0 0 60px #0005}
.emberstone-table .board-vignette:after{content:'';position:absolute;inset:14px;border:1px solid #c6ac7766;border-radius:24px;box-shadow:inset 0 0 0 3px #0003,inset 0 0 0 5px #b4955418;pointer-events:none}
.emberstone-table .table-header{background:linear-gradient(#1d2428,#141c22);border-bottom-color:#bda16b44;box-shadow:0 3px 12px #0004}
.emberstone-table .table-seam{background:linear-gradient(90deg,transparent,#c6ae7c55,transparent)}
.emberstone-table .table-seam span{background:#28271fe8;color:#e1d6b8;border:1px solid #bda16b55;box-shadow:0 2px 7px #0004}
.emberstone-table .arena-phase-strip,.emberstone-table .stack-dock .spell-stack,.emberstone-table .stack-dock .response-cue{background:var(--table-panel);border-color:var(--ember-edge);box-shadow:inset 0 1px #efdeb833,inset 0 0 0 3px #080e1433,0 7px 18px #0005}
.emberstone-table .phase-owner,.emberstone-table .phase-gem small{color:var(--ember-ink)}
.emberstone-table .arena-phase-strip .phase-gem>span{background:linear-gradient(140deg,#b9b49c,#4a625f 40%,#293c3b 80%,#a6ad9b);color:#e1ece7}
.emberstone-table .arena-phase-strip .phase-gem.current>span{background:linear-gradient(135deg,#ffe9a8,#ae7d3e 50%,#7e5b2e);color:#fff1ce}
.emberstone-table .stack-heading{background:#544a343f;border-bottom-color:#b99d6944;color:#e5d8bc}
.emberstone-table .stack-dock .stack-item{background:#151b1b99;border-color:#c0a46d44}
.emberstone-table .stack-dock .stack-item.top-spell{border-color:#d4b87599;box-shadow:inset 2px 0 #d5b576}
.emberstone-table .permanent,.emberstone-table .land{background:linear-gradient(140deg,#bca77c,#484942 24%,#252d30 70%,#aaa17d);border-color:#c3b69699;box-shadow:inset 0 1px #fff2,0 6px 10px #0008}
.emberstone-table .permanent img{border-color:#b6baaa88}
.emberstone-table .permanent.can-attack,.emberstone-table .permanent.attacking{box-shadow:0 0 0 2px #edb765,0 0 15px #ffb54c55,0 7px 10px #000b}
.emberstone-table .permanent.blocking{box-shadow:0 0 0 3px #f1c888,0 0 15px #dfbe8066}
.emberstone-table .support-card{border-color:#b9a57c99;box-shadow:inset 0 1px #fff2,0 6px 12px #0005}
.emberstone-table .support-card strong,.emberstone-table .support-card>span{background:#242b2be8}
.emberstone-table .phase-action .next-phase{background:linear-gradient(#ffe3a1,#efba69 14%,#dc9442 60%,#b16b2b);border:1px solid #ffe4af;box-shadow:inset 0 2px #fff2c555,inset 0 -2px #82572577,0 0 0 3px #8b693c22,0 7px 18px #0007}
.emberstone-table .avatar .portrait{border:3px solid #b4ad91;box-shadow:0 0 0 2px #172027,0 5px 13px #0008}
.emberstone-table .avatar.active .portrait{border-color:#e9c682;box-shadow:0 0 0 2px #24231e,0 0 24px #e6b96d33,0 5px 14px #0008}
.emberstone-table .avatar .life{top:auto;bottom:-10px;width:49px;min-width:49px;height:35px;border:1px solid #bcbd9f;font:700 25px/1 Georgia;background:linear-gradient(#30434b,#17232b);box-shadow:0 3px 6px #0009}
.emberstone-table .avatar.you{bottom:23%}
.emberstone-table .board-status{top:auto;bottom:22%;right:112px;max-width:205px;background:#252a25e8;border:1px solid #bda16b44;color:#dcd8c9;border-radius:7px;font-size:10px}
.emberstone-table .hand{padding-top:14px;overflow:visible}
.emberstone-table .hand-card{transform:translateY(var(--fan-y,0px)) rotate(var(--fan-angle,0deg));transform-origin:50% 110%;transition:transform 240ms cubic-bezier(.16,1,.3,1),box-shadow 220ms,filter 180ms;border:2px solid #253039;box-shadow:0 0 0 1px #9bb7c466,0 6px 10px #0009}
.emberstone-table .hand-card.available{box-shadow:0 0 0 1px #b4e4eeaa,0 0 11px #61d1eb33,0 5px 9px #000a}
.emberstone-table .hand-card:hover,.emberstone-table .hand-card:focus-visible{transform:translateY(-14px) rotate(0);box-shadow:0 0 0 1px #ebd4a6,0 0 20px #c6e8ff22,0 14px 24px #000a;filter:brightness(1.035);z-index:9}
body.emberstone-table.teaching-mode.open-hands .opponent-hand{top:0;height:21%;padding:14px 8px 14px;align-items:start}
.emberstone-table .revealed-hand-card{transform:translateY(var(--fan-y,0px)) rotate(var(--fan-angle,0deg));transform-origin:50% -20%;transition:transform 240ms cubic-bezier(.16,1,.3,1),box-shadow 220ms;box-shadow:0 5px 10px #0008;border-color:#a9aa8a}
.emberstone-table .revealed-hand-card:hover,.emberstone-table .revealed-hand-card:focus-visible{transform:translateY(6px) rotate(0);z-index:2;box-shadow:0 0 0 1px #e7d2a5,0 9px 16px #0008}
.emberstone-table .card-magnifier{transition:none;transform:none;filter:drop-shadow(0 17px 25px #000b)}
.emberstone-table .magnifier-face{box-shadow:0 0 0 1px #cbb99066,0 0 24px #d5edff18}
.emberstone-table .magnifier-state{background:#262a27f5;border-color:#bda16b77}
@media(max-height:720px){.emberstone-table .avatar .life{font-size:21px;min-width:42px;width:42px;height:30px}.emberstone-table .hand:before{display:none}.emberstone-table .board-status{bottom:24%;max-width:190px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.emberstone-table .hand-card,.emberstone-table .revealed-hand-card{transition:none}}
.emberstone-table .board-status{bottom:27%}
.emberstone-table .opening-guide{background:var(--table-panel);border-color:var(--ember-edge);box-shadow:inset 0 1px #efdeb822,0 7px 22px #0005}
.emberstone-table .opening-guide span,.emberstone-table .opening-guide p{color:var(--ember-ink)}
.emberstone-table .permanent.targetable,.emberstone-table .land.targetable,.emberstone-table .support-card.targetable{box-shadow:0 0 0 3px #a4e8ff,0 0 20px #73d4ff77}
.emberstone-table .permanent.block-focus{box-shadow:0 0 0 3px #f1c888,0 0 20px #e8b66c88}
/* Emberstone menus — mineral grain, brass inlays and restrained honey light. */
body.emberstone-table{--menu-ink:#f0e6ce;--menu-muted:#c1b69e;--honey:#e6b969;--stone-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.075' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.09' filter='url(%23s)'/%3E%3C/svg%3E");--stone-surface:var(--stone-grain),radial-gradient(ellipse at 12% 0,#82704b38,transparent 65%),linear-gradient(145deg,#383830,#242722 65%,#1c211e)}
body.emberstone-table dialog,body.emberstone-table #inspect:has(.inspect-copy),body.emberstone-table .card-action-menu,body.emberstone-table .stack-dock .spell-stack,body.emberstone-table .stack-dock .response-cue,body.emberstone-table .game-result{background:var(--stone-surface);color:var(--menu-ink);border:1px solid #a98b568c;box-shadow:inset 0 1px #fff0c934,inset 0 0 0 4px #11150e55,inset 0 0 0 5px #c3a06422,0 22px 70px #0009}
body.emberstone-table dialog{border-radius:14px;padding:28px;scrollbar-width:thin;scrollbar-color:#977d50 #20261f}body.emberstone-table dialog::backdrop{background:#090c09a3;backdrop-filter:blur(3px)}body.emberstone-table dialog h2{font:28px/1.2 Georgia,serif;color:#f4e8c9;margin:6px 0 14px}body.emberstone-table dialog p,body.emberstone-table .response-cue p{color:var(--menu-muted)}body.emberstone-table dialog .close{color:#dfc99a;border:1px solid #ac8b5055;background:#1b201ac9;border-radius:50%;width:30px;height:30px;line-height:1;padding:0;z-index:4}
body.emberstone-table :is(dialog,.card-action-menu,.game-result,.stack-dock) button{transition:border-color .2s,box-shadow .24s,background-color .2s,color .2s;outline-offset:3px}
body.emberstone-table :is(dialog,.card-action-menu,.game-result,.stack-dock) button:not(:disabled):hover,body.emberstone-table :is(dialog,.card-action-menu,.game-result,.stack-dock) button:focus-visible{border-color:#f0c57d;box-shadow:inset 0 0 12px #eeb65820,0 0 0 1px #f4ce8455,0 0 18px #dc9b4145;color:#fff2d6;outline-color:#efd199}
body.emberstone-table :is(dialog,.card-action-menu) .preview-play,body.emberstone-table .game-result button,body.emberstone-table .response-cue button{background:linear-gradient(155deg,#e6c17d,#c19048);color:#211b12;border:1px solid #f0d5a088;box-shadow:inset 0 1px #fff1c966,0 3px 8px #0004;border-radius:7px}
body.emberstone-table :is(dialog,.card-action-menu) .preview-play:hover,body.emberstone-table .game-result button:hover,body.emberstone-table .response-cue button:hover{background:linear-gradient(155deg,#f3d69b,#d4a354);color:#211b12}
body.emberstone-table .choice-options>button,body.emberstone-table .stop-grid button,body.emberstone-table .card-action-menu .card-details-link,body.emberstone-table dialog .all-attack{background:linear-gradient(135deg,#4b4838,#30362c);color:#eee2c6;border:1px solid #a68a555c;border-radius:7px;padding:10px 13px}
body.emberstone-table .stop-grid button[aria-pressed=true]{background:#765d31;color:#fff0c6;border-color:#ecc77d}body.emberstone-table .choice-panel>small,body.emberstone-table .stack-item small,body.emberstone-table .card-action-menu small{color:#c6b68e}body.emberstone-table .stack-heading{color:#e8d2a4;border-bottom-color:#9a81503d}body.emberstone-table .stack-item{background:#171e19a6;border-color:#94794b55;border-radius:7px}body.emberstone-table .stack-item.top-spell{border-color:#ddba7588;background:#54482c55}body.emberstone-table .response-cue small{color:#c4b99e}body.emberstone-table .card-action-menu>header{border-bottom-color:#9c845944;color:#edddb6}
body.emberstone-table #inspect:has(.grave-gallery){width:880px;max-width:94vw;max-height:88vh}body.emberstone-table .grave-gallery{grid-column:1/-1;min-width:0}body.emberstone-table .grave-gallery>header{padding:0 0 15px;margin-bottom:18px;border-bottom:1px solid #a98a513d}body.emberstone-table .grave-gallery header>small{font-size:9px;letter-spacing:2px;color:#d8bc81}.grave-gallery h2 span{font:14px 'Segoe UI',sans-serif;color:#c7b68c;margin-left:9px}.grave-gallery header p{font-size:12px;margin:0}.grave-card-grid{display:grid;grid-template-columns:repeat(auto-fill,112px);gap:16px 18px;align-items:start;justify-content:start}.grave-card{padding:0;background:#181d18;border:1px solid #9b825577;border-radius:7px;overflow:hidden;text-align:left;color:#eadfc6;box-shadow:0 4px 8px #0006}.grave-card img{display:block;width:100%;aspect-ratio:488/680;object-fit:contain}.grave-card>span{display:block;padding:7px;font:10px/1.4 Georgia,serif;min-height:40px}.grave-card>small{display:block;padding:0 7px 7px;font-size:9px;color:#e9c684}.grave-empty{grid-column:1/-1;padding:30px 0}.grave-actions{margin-top:20px;padding-top:12px;border-top:1px solid #ac8c4f55}.grave-actions h3{font:20px Georgia}.grave-actions .ability-choice{display:block;margin:7px 0;width:100%}body.emberstone-table dialog .card-magnifier{padding:0;border:0;background:none;box-shadow:none;z-index:100}.grave-gallery .grave-card:hover{transform:translateY(-2px)}
body.emberstone-table .game-result{width:min(400px,80%);top:25%;padding:30px 32px 26px;border-radius:14px}.result-kicker{display:block;letter-spacing:3px;font-size:10px;color:#d4bd8a}.result-crest{display:grid;place-items:center;width:58px;height:58px;margin:18px auto 12px;border:1px solid #d4b36b99;border-radius:50%;font:40px Georgia;color:#f0cb7e;box-shadow:0 0 0 5px #caa2540c,0 0 35px #b57b3222,inset 0 0 20px #b57b321a}.emberstone-table .game-result strong{font:40px Georgia;color:#f4dfad;text-shadow:0 2px 12px #ac742533}.emberstone-table .game-result>span{color:#c9bca0;margin:12px 0 22px}.emberstone-table .game-result button{display:block;width:100%;margin:10px 0;padding:11px 16px}.emberstone-table .game-result [data-ev]{background:#2c3227;color:#decca3;border-color:#9d82515c}
body.emberstone-table .land-drop-zone{left:2%;right:13%;top:22%;bottom:24%;border-color:#e3bc77aa;border-style:dashed;background:radial-gradient(ellipse,#e3b65a14,#161b121a);box-shadow:inset 0 0 38px #d0a05210;border-radius:18px;z-index:12}.emberstone-table .land-drop-zone span{top:42%;background:#292c21f5;color:#f1d8a3;border:1px solid #e0b97888;box-shadow:0 4px 20px #0006;padding:10px 18px;max-width:85%;text-align:center}.emberstone-table .land-drop-ready .land-drop-zone{border-style:solid;border-color:#f2d39b;background:#d7ac5520;box-shadow:inset 0 0 40px #eac77919,0 0 20px #e6b96625}body.emberstone-table .hand:before{content:'HOVER TO READ · DRAG ANY PLAYABLE CARD TO CAST · CLICK FOR OPTIONS'}
@media(prefers-reduced-motion:reduce){body.emberstone-table :is(dialog,.card-action-menu,.game-result,.stack-dock) button{transition:none}.grave-gallery .grave-card:hover{transform:none}}
@media(max-width:600px){body.emberstone-table dialog{padding:20px}.grave-card-grid{grid-template-columns:repeat(auto-fill,90px);gap:12px}.grave-card>span{font-size:9px}}
/* A steady, quiet cue for the exact legal hand options behind a combat pause. */
body.emberstone-table .hand-card.combat-option{border-color:#ddba78;box-shadow:0 0 0 1px #ebc98b99,0 0 14px #d6a95738,0 6px 10px #0009}
body.emberstone-table .hand-card.combat-option:after{content:'◆';position:absolute;top:-7px;right:5px;display:grid;place-items:center;width:18px;height:18px;border:1px solid #dfc58d99;border-radius:50%;background:#353322;color:#f1d69d;font:10px/1 'Segoe UI',sans-serif;box-shadow:0 2px 6px #0006;pointer-events:none}
body.emberstone-table .hand-card.combat-option:hover,body.emberstone-table .hand-card.combat-option:focus-visible{border-color:#f1d599;box-shadow:0 0 0 1px #f2d7a6,0 0 18px #d9ab4e44,0 12px 22px #0008}
/* Opponent hand: visible card proportions and the same gentle fan as the player. */
body.emberstone-table .table-header .track-game{display:flex;align-items:center;gap:9px;flex:none;min-height:38px;padding:5px 13px;border:1px solid #efcc83;border-radius:7px;background:linear-gradient(135deg,#e3bf7c,#b58948);color:#241e12;box-shadow:inset 0 1px #fff2,0 2px 10px #0005;text-align:left}
body.emberstone-table .track-game b{display:block;font-size:12px;letter-spacing:1px}.track-game small{display:block;font-size:9px;margin-top:2px;white-space:nowrap}
body.emberstone-table .table-header .track-game.recording{background:linear-gradient(135deg,#384b33,#273925);color:#f2dfb7;border-color:#cdb176}
body.emberstone-table .table-header .track-game.record-error{background:#623c2c;color:#ffe9c4;border-color:#e6b879}
body.emberstone-table .table-header nav{min-width:0;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#947c4c transparent}body.emberstone-table .table-header nav button{flex-shrink:0}
.recording-review{width:min(620px,80vw)}.recording-review>small{color:#d9bb7c;letter-spacing:2px;font-size:10px}.recording-review p{font-size:13px;line-height:1.5}.recording-ratings{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.recording-ratings>div{padding:14px;background:#111a1480;border:1px solid #b99a5b44;border-radius:8px}.recording-ratings b,.recording-ratings span{display:block;margin-top:7px}.recording-ratings small{color:#cfb784}.recording-review label{display:block;margin:16px 0 8px}.recording-review textarea{width:100%;min-height:90px;resize:vertical;background:#151d16;color:#f1e6cc;border:1px solid #a6895655;border-radius:7px;padding:12px;font:14px 'Segoe UI',sans-serif}.recording-actions{display:flex;gap:10px;flex-wrap:wrap}.recording-actions button{padding:10px;border:1px solid #aa8c5755;border-radius:7px;background:#343b2b;color:#eedbbb}.recording-review .recording-footnote{font-size:11px;color:#bcae92}
@media(max-width:1500px){body.emberstone-table .table-header{gap:12px}body.emberstone-table .table-title{max-width:135px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex-shrink:1}body.emberstone-table .table-title>span{display:none}}
body.emberstone-table .arena{--opponent-card-width:min(8.2cqw,18cqh,128px)}
body.emberstone-table .opponent-hand,body.emberstone-table.teaching-mode.open-hands .opponent-hand{top:-60px;left:50%;width:58%;height:auto;opacity:1;padding:18px 10px;gap:0;align-items:flex-start;justify-content:safe center;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#8a784c55 transparent;z-index:7}
body.emberstone-table .opponent-hand>.card-back,body.emberstone-table .opponent-hand>.revealed-hand-card{flex:0 1 var(--opponent-card-width);width:var(--opponent-card-width);min-width:56px;max-width:128px;height:auto;max-height:none;aspect-ratio:488/680;margin:0 0 0 -6px;transform:translateY(var(--fan-y,0px)) rotate(var(--fan-angle,0deg));transform-origin:50% -20%}
body.emberstone-table .opponent-hand>:first-child{margin-left:0}
body.emberstone-table .opponent-hand>.card-back{border-width:3px;box-shadow:0 0 0 1px #b7a17355,inset 0 0 0 1px #9b8155,0 5px 10px #0008}
body.emberstone-table .opponent-hand>.revealed-hand-card:hover,body.emberstone-table .opponent-hand>.revealed-hand-card:focus-visible{transform:translateY(5px) rotate(0);z-index:9;box-shadow:0 0 0 1px #e7d2a5,0 9px 16px #0008}
body.emberstone-table .avatar.opponent,body.emberstone-table.teaching-mode.open-hands .avatar.opponent{left:50%;top:calc(var(--opponent-card-width)*1.39345 - 34px);width:62px;height:62px}
body.emberstone-table .opponent-lands{top:27%;width:20%;max-height:18%}
@media(max-height:650px){body.emberstone-table .avatar.opponent,body.emberstone-table.teaching-mode.open-hands .avatar.opponent{width:48px;height:48px;top:calc(var(--opponent-card-width)*1.39345 - 38px)}body.emberstone-table .opponent-hand,body.emberstone-table.teaching-mode.open-hands .opponent-hand{padding-block:14px}body.emberstone-table .arena{--opponent-card-width:min(8.2cqw,16cqh,128px)}}

body.emberstone-table .recording-actions .preview-play{width:auto;display:inline-block;margin:0}.recording-actions{margin-top:16px}.recording-footnote summary{cursor:pointer;padding:6px 0}

body.emberstone-table .table-header .track-game[hidden]{display:none}

/* The centered portrait identifies this side without a label behind its life badge. */
body.emberstone-table .opponent-creatures:before{display:none}
/* Attachments share their host's battlefield slot; the exposed edges remain real controls. */
.attachment-group{position:relative;margin-left:var(--attachment-space);isolation:isolate;flex-shrink:0}
.attachment-front{position:relative;width:100%;height:100%}
.creature-row .creature-attachment{flex:0 0 clamp(96px,7.2cqw,112px);aspect-ratio:.82}
.creature-row .attachment-front>.permanent{width:100%;min-width:0;max-width:none;height:100%}
.land-row .land-attachment{flex:0 0 clamp(42px,4.4cqw,67px);aspect-ratio:1.02}
.land-attachment .attachment-front>.land{width:100%;min-width:0;height:100%}
.support-row .support-attachment{flex:0 0 100px;aspect-ratio:.72}
.support-attachment .attachment-front>.support-card{width:100%;height:100%}
body.emberstone-table .attachment-group>.attachment-card{position:absolute;left:calc(-14px * var(--attachment-index));top:calc(2px * var(--attachment-index));width:100%;height:calc(100% - 4px);aspect-ratio:auto;min-width:0;padding:0;border:1px solid #b29b67;border-radius:6px;background:#272d22;box-shadow:0 3px 7px #0009;overflow:hidden}
body.emberstone-table .attachment-card .attachment-title{position:absolute;inset:3px auto 3px 0;width:13px;padding:2px 1px;writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:9px/11px 'Segoe UI',sans-serif;background:#252b20d9;color:#ead6aa;display:block}
body.emberstone-table .attachment-card:hover,body.emberstone-table .attachment-card:focus-visible{border-color:#f3d18e;box-shadow:0 0 9px #ddb67377;outline:1px solid #f3d18e;outline-offset:1px}
body.emberstone-table .stat-raised,body.emberstone-table .granted-keyword{color:#f5cd78}
body.emberstone-table .stat-lowered{color:#f3a59c}
body.emberstone-table .permanent-bottom strong{display:flex;align-items:center;gap:1px;background:linear-gradient(#31362f,#18241f);color:#eee9d9;border-color:#a2a98d}
.card-keywords{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.magnifier-live{padding:9px 12px;background:linear-gradient(130deg,#3a3d2e,#1d2923);border:1px solid #c4a56888;border-radius:0 0 8px 8px;box-shadow:0 6px 15px #0006;color:#e9e6dc}
.magnifier-live>div{display:flex;align-items:center;justify-content:space-between;gap:10px}.magnifier-live small{font-size:9px;letter-spacing:1px;color:#bfb69d}.magnifier-live strong{font:bold 25px/1 Georgia}.magnifier-live p{font-size:12px;line-height:1.4;margin:7px 0 0}.magnifier-live p:empty{display:none}
@media(max-height:650px){.creature-row .creature-attachment{flex-basis:77px}.support-row .support-attachment{flex-basis:70px}.land-row .land-attachment{flex-basis:43px}}
