.refined-battlefield{--permanent-width:clamp(112px,8.4vw,162px);--permanent-height:calc(var(--permanent-width) * .82);overflow:clip}
.board-half{position:absolute;inset:0;pointer-events:none}
.creature-lanes,.land-lanes,.support-lanes,.strategic-lanes{position:absolute;pointer-events:none}
.creature-lanes{left:14%;right:4%}
.opponent .creature-lanes{top:27%}
.you .creature-lanes{top:51%}
.has-strategic .creature-lanes{left:28%}
.land-lanes{left:5%;right:62%}
.opponent .land-lanes,.opponent .support-lanes{top:12%}
.you .land-lanes,.you .support-lanes{bottom:14%}
.refined-battlefield .command-zone{left:auto;right:3%;bottom:20px}
.refined-battlefield .opponent-command-zone{top:7px;bottom:auto}
.opponent-command-zone .commander-card{width:53px;height:auto;aspect-ratio:488/680}
.opponent-command-zone .zone-label{font-size:8px;letter-spacing:1px}
.support-lanes{left:59%;right:3%;display:flex;gap:12px}
.support-lanes .battle-lane{flex:1;min-width:0}
.strategic-lanes{left:2%;width:24%;display:flex;gap:10px}
.opponent .strategic-lanes{top:28%}
.you .strategic-lanes{top:51%}
.strategic-lanes .battle-lane{flex:1;min-width:0}
.battle-lane{position:relative;pointer-events:auto;min-width:0}
/* Rotation needs space outside the original card box; keep lane anchors fixed. */
.lane-viewport{overflow:hidden;position:relative;padding:28px 24px 60px;margin:-16px -20px;scrollbar-width:none}
.lane-track{display:flex;align-items:flex-start;justify-content:center;min-width:100%;width:max-content;gap:0}
.land-lanes .lane-track,.support-lanes .lane-track{justify-content:flex-start}
.permanent-slot{position:relative;flex:0 0 var(--lane-step,calc(var(--permanent-width) + 14px));width:var(--lane-step,calc(var(--permanent-width) + 14px));height:var(--permanent-height);isolation:isolate}
.permanent-slot:last-child{flex-basis:var(--permanent-width);width:var(--permanent-width)}
.permanent-slot:hover,.permanent-slot:focus-within{z-index:50}
.refined-battlefield .permanent{width:var(--permanent-width);height:var(--permanent-height);aspect-ratio:auto;min-width:var(--permanent-width);max-width:none;max-height:none;flex-shrink:0;margin:0;border:3px solid #263134;border-radius:8px;overflow:hidden;transform:rotate(0);z-index:3;position:relative;transition:transform .23s,box-shadow .18s,border-color .18s;box-shadow:0 6px 10px #0009}
.refined-battlefield .permanent.combat-eligible{touch-action:none}
.refined-battlefield .permanent .permanent-art{height:100%;width:100%;object-fit:cover;object-position:center;border-radius:4px}
.refined-battlefield .permanent:hover{transform:translateY(-7px) scale(1.1);z-index:10;box-shadow:0 0 0 1px #ddbc82,0 12px 18px #000b}
.refined-battlefield .permanent.tapped{transform:rotate(80deg)!important;margin:0}
.permanent-name{position:absolute;top:1px;left:1px;right:1px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:3px 4px;text-align:left;background:linear-gradient(90deg,#08151ded,#11212ddb);font:600 clamp(9px,.68vw,13px)/1.2 var(--sans);color:#e3dfcb;text-shadow:0 1px 2px #000;border-radius:3px}
.refined-battlefield .power-badge{bottom:3px;right:3px;min-width:35px;font-size:16px;line-height:1.1;padding:1px 4px;background:#f1e8ca;z-index:4}
.refined-battlefield .counter-badge{top:25px;left:3px;right:auto;max-width:90%;font-size:10px;background:#1c2739e8}
.refined-battlefield .damage-badge{bottom:4px;left:4px;top:auto;font-size:13px;font-weight:700;padding:2px 5px}
.sickness-mark{position:absolute;left:5px;top:24px;color:#e3dec0;text-shadow:0 0 5px #c4e6f9;font-size:21px;line-height:1}
.attachment-mark{position:absolute;left:5px;bottom:4px;color:#f7d09c;text-shadow:0 1px 3px #000;font-size:11px}
.permanent-count{position:absolute;right:4px;top:-10px;z-index:9;min-width:33px;padding:3px 6px;border:1px solid #ecce96;border-radius:15px;background:linear-gradient(#6f6444,#272e2a);color:#fff4cd;font:bold 15px/1.1 var(--sans);box-shadow:0 2px 9px #000c}
.permanent-count:hover{background:#847044}
.permanent-slot:has(.permanent-count):before,.permanent-slot:has(.permanent-count):after{content:'';position:absolute;width:var(--permanent-width);height:var(--permanent-height);left:-5px;top:5px;background:#20302e;border:2px solid #657065;border-radius:7px;z-index:0;pointer-events:none}
.permanent-slot:has(.permanent-count):after{left:-9px;top:9px;z-index:-1}
.attachment-stack{position:absolute;inset:0;z-index:1}
.attachment{position:absolute;top:calc(var(--permanent-height) - 3px + var(--attachment) * 22px);left:5px;width:calc(var(--permanent-width) - 1px);height:22px;border:2px solid #8c8868;border-radius:4px;overflow:hidden;padding:0;box-shadow:0 3px 5px #000b;background:#1c2426;transition:transform .18s}
.attachment img{width:100%;height:100%;object-fit:cover;opacity:.65}
.attachment span{position:absolute;left:0;right:0;bottom:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#0c1623cc;color:#e7dcc3;font-size:9px;text-align:left;padding:2px 4px}
.attachment:hover{transform:translateY(2px) scale(1.05);z-index:12;border-color:#d3d4bc}
.with-attachments{margin-bottom:18px}
.lane-page{display:none;position:absolute;top:calc(var(--permanent-height) * .42);z-index:70;width:25px;height:35px;border:1px solid #e7cc9299;border-radius:16px;background:#14232ddc;color:#f0d49c;font-size:27px;line-height:1;box-shadow:0 2px 8px #000b;padding:0}
.lane-page.previous{left:-4px}.lane-page.next{right:-4px}
.paged>.lane-page{display:block}
.paged .lane-viewport{mask-image:linear-gradient(90deg,transparent,#000 15px,#000 calc(100% - 15px),transparent)}
.refined-battlefield .permanent.combat-eligible,.can-target{border-color:#f1b86b!important;box-shadow:0 0 0 1px #c47b32,0 0 18px #eeb45860!important}
.refined-battlefield .permanent.combat-selected{border-color:#ffda87!important;box-shadow:0 0 0 3px #f28d3c,0 0 25px #f39c5580!important}
.you .permanent.combat-selected{transform:translateY(-10px)}
.opponent .permanent.combat-selected{transform:translateY(10px)}
.refined-battlefield .hand-card.playable{border:2px solid #94e4ff!important;box-shadow:0 0 0 1px #d4f8ff,0 -4px 18px #49bdffbb,0 0 30px #35baff55!important;animation:playable-glow 2.5s ease-in-out infinite}
@keyframes playable-glow{50%{box-shadow:0 0 0 1px #eaffff,0 -4px 24px #76d9ffd0,0 0 36px #4fc8ff88}}
.refined-battlefield .hand-card:not(.playable){box-shadow:0 -2px 8px #0009;border-color:#2a3335}
.refined-battlefield .hand-card{--hand-lift:152px;overflow:visible;touch-action:none;cursor:grab}
/* Preserve the original fanned hit area while the visible card lifts. */
.refined-battlefield .hand-card:hover::after,.refined-battlefield .hand-card:focus-visible::after{content:'';position:absolute;top:calc(var(--hand-lift) + var(--y));left:0;width:100%;height:100%;transform:rotate(var(--rot));transform-origin:50% 100%;z-index:-1;background:transparent}
.hand-dragging .refined-battlefield .hand-card{transform:translateX(var(--x)) translateY(var(--y)) rotate(var(--rot))!important;transition:none;cursor:grabbing}
.hand-dragging .hand-card::after{display:none}
.hand-dragging .hand-card.drag-source{opacity:.25;animation:none}
.dragged-hand-card{position:fixed;z-index:3000;pointer-events:none;border:2px solid #c7edff;border-radius:8px;box-shadow:0 10px 35px #000b,0 0 24px #79ccff88;object-fit:fill;transform:rotate(-3deg)}
.hand-insertion{position:fixed;z-index:2999;pointer-events:none;width:4px;height:110px;background:#bee9ff;box-shadow:0 0 14px #82d7ff;border-radius:3px}
.cast-drop-zone:after{content:'';position:absolute;inset:24% 9% 33%;border:2px solid #96dfff88;border-radius:32px;box-shadow:inset 0 0 60px #8cd6ff18;pointer-events:none}
@media(min-width:1700px){.refined-battlefield .hand-card{--hand-lift:175px}}
@media(max-width:1150px){.refined-battlefield .hand-card{--hand-lift:115px}}
@media(max-width:800px){.refined-battlefield .hand-card{--hand-lift:90px}}
.combat-caption{color:#ead8b2;font-size:14px;margin-bottom:12px;text-align:center}
.combat-tools{display:flex;justify-content:space-between;gap:12px;margin-top:13px}
.combat-tools .text-btn{font-size:12px}
.combat-error{font-size:11px;line-height:1.5;color:#e5a094;margin-top:12px}
#combat-links{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:9;overflow:visible}
#combat-links path{stroke-width:3;fill:none;filter:drop-shadow(0 0 3px #000)}
#combat-links .attack-link{stroke:#fca35b}
#combat-links .block-link{stroke:#69c7ff}
#combat-links .target-link{stroke:#ffdb8d;stroke-width:3;filter:drop-shadow(0 1px 2px #000) drop-shadow(0 0 4px #eeb35199)}
#target-arrow path{fill:#ffdb8d;stroke:none}
.refined-battlefield .permanent.spell-target{border-color:#ffdb8d;box-shadow:0 0 0 1px #eeb351,0 0 18px #eeb35166}
#combat-links .drag-link{stroke:#ffe2aa;stroke-dasharray:7 4}
#combat-arrow path{fill:#ffcb83;stroke:none}
.target-caption{position:absolute;z-index:15;left:28%;right:30%;top:45%;font:21px var(--serif);text-align:center;color:#f4d8a7;text-shadow:0 2px 8px #000;pointer-events:none}
.full-control.on{border-color:#dfba78;color:#ffe6b5;background:#9c693a45;box-shadow:0 0 12px #c9955133}
.flying-card{position:fixed;z-index:2000;pointer-events:none;transform-origin:top left;border-radius:8px;object-fit:fill;box-shadow:0 0 25px #8fdfff99,0 18px 40px #0009;border:2px solid #c7ecff}
.stack-arriving{opacity:0!important}
.stack-landed{animation:stack-arrival .4s ease-out}
@keyframes stack-arrival{from{box-shadow:0 0 30px #80dbffe0}to{box-shadow:0 3px 10px #0009}}
.engine-choice.engine-card-browser{left:8%;top:12%;width:76%;max-height:76vh}
.engine-card-browser .library-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0 0 15px}
.engine-card-browser .library-toolbar .choice-search{flex:1;min-width:200px;margin:0}
.engine-card-browser .library-toolbar select{font-size:12px;min-height:34px}
.choice-color-filters{display:flex;gap:4px}
.choice-color{width:27px;height:27px;border:1px solid #777569;border-radius:50%;background:#27343b;color:#ddd5c3;font-size:11px}
.choice-color.selected{border-color:#ffe1a0;box-shadow:0 0 0 2px #bba272}
.choice-color[data-color="W"]{background:#ded3a9;color:#272a28}.choice-color[data-color="U"]{background:#266a8b}.choice-color[data-color="B"]{background:#211d26}.choice-color[data-color="R"]{background:#9a4436}.choice-color[data-color="G"]{background:#326546}
.library-browser-layout{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:20px;min-height:0}
.library-results{overflow:auto;max-height:46vh;scrollbar-width:thin;padding:4px 8px 12px 4px}
.choice-group{min-width:0;max-width:190px}
.choice-group[hidden]{display:none!important}
.choice-group .choice-card{width:100%}
.choice-copy-count{position:absolute;left:7px;top:7px;background:#102533ee;color:#f4deb6;padding:3px 7px;border:1px solid #d9c79988;border-radius:12px;font:bold 13px var(--sans)}
.choice-quantity{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-top:6px;color:#d7cbae}
.choice-quantity button{background:#31444a;border:1px solid #9c9273;color:#f0ddbc;border-radius:3px;width:25px;height:24px}
.library-selection{border-left:1px solid #b9a77c44;padding-left:16px;max-height:46vh;overflow:auto}
.library-selection h3{font-size:14px;margin:0 0 12px;color:#e3ce9e}
.selected-choice{width:100%;padding:0;background:#15242b;border:1px solid #c7ad74;border-radius:7px;overflow:hidden;position:relative;color:#e9dfcc;margin-bottom:10px}
.selected-choice img{display:block;width:100%}
.selected-choice span{display:block;font-size:11px;padding:6px}
.library-no-results{padding:25px 8px;text-align:center}
.library-no-results[hidden]{display:none}
.scry-columns{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:18px}
.scry-zone{min-height:250px;border:1px solid #9c927355;border-radius:7px;padding:12px;background:#15222a55}
.scry-zone h3{font-size:16px;color:#ead4a5;margin:0 0 14px;text-align:center}
.scry-zone-cards,.order-card-grid,.reveal-card-grid{display:flex;gap:15px;justify-content:center;flex-wrap:wrap}
.scry-card{width:150px;max-width:100%;cursor:grab}
.scry-card img,.order-card img,.reveal-card-grid img{display:block;width:100%;border-radius:7px}
.scry-card-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;padding-top:9px}
.scry-card-controls .text-btn{font-size:11px}
.order-card{width:165px;position:relative}
.order-card>span{position:absolute;top:6px;left:6px;background:#17252eec;border-radius:50%;width:25px;height:25px;padding:4px;text-align:center}
.order-card>div{display:flex;justify-content:center;gap:8px;margin-top:10px}
.reveal-card-grid figure{width:155px;margin:0}
.reveal-card-grid figcaption{font-size:12px;text-align:center;padding-top:7px}
@media(max-width:800px){.library-browser-layout{grid-template-columns:minmax(0,1fr) 130px;gap:10px}.library-selection{padding-left:9px}.scry-columns{gap:8px}.scry-zone{padding:7px}}
.engine-card-browser .engine-choice-options{display:block}
.choice-search{width:100%;margin-bottom:17px;flex-shrink:0}
.choice-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:17px}
.choice-card{position:relative;padding:0;border:2px solid #4f5655;border-radius:8px;background:#15212a;max-width:190px;text-align:center;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.choice-card[hidden]{display:none}
.choice-card img{display:block;width:100%;aspect-ratio:488/680;object-fit:cover}
.choice-card>span{display:block;padding:6px;font-size:11px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#e3dbca}
.choice-card:hover{border-color:#c9ddde;box-shadow:0 0 15px #90caff55}
.choice-card.selected{border-color:#f1c77f;box-shadow:0 0 0 2px #aa8149,0 0 20px #dca44655}
.choice-card b{position:absolute;right:8px;top:8px;border-radius:50%;width:27px;height:27px;padding:4px;background:#f4d08c;color:#16252a}
.engine-choice:has(.choice-card-grid){min-width:340px}
.reduced-motion .hand-card.playable{animation:none}
@media(max-width:1150px){.refined-battlefield{--permanent-width:112px}.support-lanes{left:58%;right:2%;gap:7px}.creature-lanes{left:13%;right:2%}.land-lanes{left:5%;right:62%}.strategic-lanes{left:2%;width:26%}.battle-toolbar-right .full-control{font-size:10px}}
@media(max-width:800px){.refined-battlefield{--permanent-width:100px}.land-lanes{left:2%;right:61%}.support-lanes{left:61%;right:1%}.opponent .land-lanes,.opponent .support-lanes{top:15%}.you .land-lanes,.you .support-lanes{bottom:23%}.opponent .creature-lanes{top:32%}.you .creature-lanes{top:53%}.engine-choice.engine-card-browser{left:4%;width:90%;top:10%}.choice-card-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}.battle-toolbar-right{gap:5px}.battle-toolbar-right .full-control{font-size:9px;padding:4px 6px}.target-caption{font-size:17px}.permanent-name{font-size:9px}}
