@import url('https://fonts.googleapis.com/css2?family=Alegreya:wght@400;500;600;700&family=Cinzel:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');
:root{--ink:#f0e8d6;--muted:#aaa394;--gold:#d8b76b;--gold2:#8f7040;--bronze:#a77a3d;--bronze-light:#e0c47d;--leather:#351619;--leather-light:#63302c;--walnut:#160c09;--iron:#171719;--vellum:#d9c69b;--panel:rgba(14,17,24,.9);--line:rgba(216,183,107,.23);--fire:#e65f42;--nature:#5cb574;--water:#57aee5;--stone:#ce9558;--wind:#a991e4}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#090b12;color:var(--ink);font-family:Inter,system-ui,sans-serif}button,a{font:inherit}button{color:inherit}.hidden{display:none!important}.splash-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#03050a url('assets/branding/splash-screen.webp') center/cover no-repeat;isolation:isolate;transition:opacity .7s ease,visibility .7s ease}.splash-screen::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 47%,rgba(5,7,13,.08) 0 18%,rgba(3,5,10,.48) 58%,rgba(1,2,5,.94) 100%),linear-gradient(180deg,rgba(1,3,8,.25),rgba(1,2,5,.62));box-shadow:inset 0 0 14vw #000}.splash-screen.is-leaving{opacity:0;visibility:hidden;pointer-events:none}.splash-atmosphere{position:absolute;inset:-15%;z-index:-1;background:conic-gradient(from 220deg at 50% 50%,rgba(230,95,66,.15),rgba(87,174,229,.12),rgba(92,181,116,.13),rgba(206,149,88,.13),rgba(169,145,228,.14),rgba(230,95,66,.15));filter:blur(56px);mix-blend-mode:screen;animation:splash-aura 8s linear infinite}.splash-lockup{width:min(530px,82vw);display:flex;flex-direction:column;align-items:center;text-align:center;filter:drop-shadow(0 12px 34px #000);animation:splash-arrive 1.15s cubic-bezier(.2,.72,.2,1) both}.splash-crest{width:clamp(128px,21vw,230px);height:auto;border-radius:50%;mix-blend-mode:screen;filter:saturate(.9) contrast(1.08) drop-shadow(0 0 26px rgba(216,183,107,.2));-webkit-mask-image:radial-gradient(circle,#000 52%,transparent 72%);mask-image:radial-gradient(circle,#000 52%,transparent 72%)}.splash-kicker{margin:clamp(-16px,-2vw,-8px) 0 8px;color:#d6be84;font:600 clamp(9px,1vw,12px)/1.2 Inter,sans-serif;letter-spacing:.38em;text-transform:uppercase}.splash-title{margin:0;color:#f0e4c6;font:700 clamp(40px,7.5vw,88px)/.95 Cinzel,serif;letter-spacing:.11em;text-indent:.11em;text-shadow:0 2px 4px #000,0 0 42px rgba(216,183,107,.25)}.splash-progress{width:min(280px,58vw);height:1px;margin-top:25px;overflow:hidden;background:linear-gradient(90deg,transparent,rgba(216,183,107,.28),transparent)}.splash-progress i{display:block;width:46%;height:100%;background:linear-gradient(90deg,transparent,#f1d891,transparent);filter:drop-shadow(0 0 5px #d8b76b);animation:splash-load 1.3s ease-in-out infinite}@keyframes splash-arrive{from{opacity:0;transform:scale(.93) translateY(15px)}to{opacity:1;transform:none}}@keyframes splash-aura{to{transform:rotate(1turn)}}@keyframes splash-load{from{transform:translateX(-110%)}to{transform:translateX(240%)}}.hand.discard-choice .card.clickable{outline:2px solid #d8b76b;outline-offset:-2px;animation:discard-choice-pulse 1.5s ease-in-out infinite}.hand.discard-choice .card.clickable::after{content:"Scarta";position:absolute;inset:auto 8px 8px;background:#130f08e8;border:1px solid #d8b76b;color:#f1deab;padding:5px;text-align:center;text-transform:uppercase;letter-spacing:.12em;font-size:9px;font-weight:800;z-index:5}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.start-screen{min-height:100dvh;display:grid;place-items:center;background:url('assets/art/elementum-duel-key-art.png') center/cover fixed;position:relative;overflow:hidden}.start-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,10,.94) 0%,rgba(5,6,10,.68) 42%,rgba(5,6,10,.18)),linear-gradient(0deg,rgba(5,6,10,.76),transparent 50%)}.back-link{position:absolute;z-index:2;top:24px;left:28px;color:#d7d9d3;text-decoration:none;font-size:13px}.start-content{position:relative;z-index:1;width:min(520px,calc(100% - 40px));margin-right:min(42vw,640px);text-align:center}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.3em;color:var(--gold);font-weight:700}.start-content h1{font:700 clamp(46px,7vw,90px)/.95 Cinzel,serif;letter-spacing:.08em;margin:12px 0 0;text-shadow:0 3px 30px #000}.subtitle{font:500 19px Cinzel,serif;letter-spacing:.24em;text-transform:uppercase;color:#d9c38e;margin:9px 0 26px}.intro{color:#c8ccc6;line-height:1.65;max-width:470px;margin:0 auto 28px}.audio-controls{display:flex;justify-content:center;gap:8px}.start-audio{margin:0 0 16px}.audio-toggle{border:1px solid rgba(255,255,255,.16);background:rgba(7,9,13,.7);color:#c8ccc6;border-radius:20px;padding:7px 13px;cursor:pointer;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.audio-toggle span{color:var(--gold);margin-right:4px}.audio-toggle[aria-pressed="false"]{color:#717772;border-color:rgba(255,255,255,.08);text-decoration:line-through}.audio-toggle[aria-pressed="false"] span{color:#717772}.audio-icon{width:30px;height:30px;border:1px solid transparent!important;border-radius:50%;font-size:16px!important;color:#d8b76b!important}.audio-icon:hover{border-color:var(--line)!important;background:#ffffff0a!important}.audio-icon[aria-pressed="false"]{color:#656b67!important;text-decoration:line-through}.difficulty{border:0;padding:0;display:flex;gap:9px;margin:0 0 20px}.difficulty legend{position:absolute;clip:rect(0 0 0 0)}.difficulty label{flex:1;cursor:pointer}.difficulty input{position:absolute;opacity:0}.difficulty span{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.14);background:rgba(7,9,13,.72);padding:12px 7px;border-radius:4px;transition:.2s}.difficulty small{color:var(--muted);margin-top:4px;font-size:10px}.difficulty input:checked+span{border-color:var(--gold);background:rgba(75,58,29,.58);box-shadow:inset 0 0 24px rgba(216,183,107,.1)}.primary-button{border:1px solid #efd38d;background:linear-gradient(#c39a4f,#8d6530);color:#101015;text-transform:uppercase;letter-spacing:.12em;font-weight:800;padding:14px 28px;border-radius:3px;cursor:pointer;box-shadow:0 8px 28px #0008}.start-content .primary-button{width:100%}.text-button{border:0;background:transparent;color:#c8b684;text-decoration:underline;text-underline-offset:5px;margin-top:17px;cursor:pointer}.tutorial-choice{display:flex;align-items:center;gap:10px;text-align:left;margin:0 0 16px;padding:10px 12px;border:1px solid #ffffff17;background:#080a0dcc;border-radius:4px;cursor:pointer}.tutorial-choice input{accent-color:var(--gold);width:18px;height:18px}.tutorial-choice span{display:flex;flex-direction:column}.tutorial-choice b{font-size:12px;color:#e8d8ad}.tutorial-choice small{font-size:10px;color:var(--muted);margin-top:2px}
.game{min-height:100dvh;background:radial-gradient(circle at 50% 37%,rgba(83,62,31,.2),transparent 34%),linear-gradient(rgba(4,5,8,.68),rgba(4,5,8,.8)),url('assets/art/elemental-convergence.png') center/cover fixed}.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line);background:rgba(5,7,10,.82);position:sticky;top:0;z-index:20}.topbar a,.topbar button{color:#b9bcb6;background:0;border:0;text-decoration:none;cursor:pointer;font-size:12px}.brand{text-align:center}.brand b{font:600 17px Cinzel;letter-spacing:.18em;color:#e4cc91}.brand span{display:block;color:#777f7a;font-size:9px;text-transform:uppercase;letter-spacing:.2em;margin-top:2px}.header-actions{display:flex;gap:12px}.table{max-width:1560px;margin:auto;padding:12px 18px 34px}.player-zone{display:grid;grid-template-columns:240px 1fr;gap:14px;align-items:center}.opponent-zone{margin-bottom:10px}.player-own{margin-top:10px}.mage-card{min-height:105px;border:1px solid var(--line);background:linear-gradient(90deg,rgba(8,10,14,.95),rgba(22,22,22,.82)),var(--mage-art) center 25%/cover;border-radius:5px;padding:13px 15px;position:relative;overflow:hidden}.mage-card::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,rgba(0,0,0,.1));pointer-events:none}.mage-name{font:600 15px Cinzel;color:#f1deab;position:relative;z-index:1}.stats{display:flex;gap:8px;margin-top:12px;position:relative;z-index:1}.stat{background:#080a0dcc;border:1px solid #ffffff1a;padding:5px 9px;border-radius:20px;font-size:11px}.stat b{color:white;font-size:14px;margin-left:3px}.instability-board{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.instability{border:1px solid #ffffff12;background:#0c0f14d9;padding:7px 9px;border-radius:4px;min-width:0}.instability-head{display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.instability-head b{font-size:13px}.instability-bonus{margin-top:3px;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.meter{height:4px;background:#ffffff13;margin-top:6px;border-radius:3px;overflow:hidden}.meter i{display:block;height:100%;width:calc(var(--value) / 6 * 100%);background:var(--element-color);box-shadow:0 0 10px var(--element-color)}.instability.critical{animation:pulse 1.2s infinite}.middle-zone{display:grid;grid-template-columns:180px minmax(360px,1fr) minmax(520px,620px);gap:12px;min-height:390px}.panel,.arena{border:1px solid var(--line);background:linear-gradient(135deg,rgba(11,14,20,.72),rgba(15,16,19,.62));box-shadow:inset 0 1px #ffffff08,0 12px 40px #0005;border-radius:5px}.catastrophe-deck{padding:14px;background:linear-gradient(rgba(11,6,8,.58),rgba(11,6,8,.72)),url('assets/art/catastrophe.png') center/cover}.cat-title{font:600 12px Cinzel;text-transform:uppercase;color:#e1b0a9}.cat-count{font:700 42px Cinzel;color:#e5d4b8;margin:22px 0 0}.catastrophe-pips{display:flex;gap:5px;margin:3px 0 15px}.catastrophe-pips i{width:20px;height:4px;background:#ffffff1b}.catastrophe-pips i.used{background:#c45547;box-shadow:0 0 8px #c45547}.cat-last{font-size:10px;color:#c8b4ad;line-height:1.5}.arena{padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.arena::before{content:"";position:absolute;width:260px;height:260px;border:1px solid #d8b76b20;border-radius:50%;box-shadow:0 0 0 22px #d8b76b08,0 0 0 58px #d8b76b05}.turn-banner{position:absolute;top:10px;font:600 11px Cinzel;color:#cbb983;letter-spacing:.16em;text-transform:uppercase}.spell-stage{min-height:155px;display:flex;align-items:center;justify-content:center;gap:10px;position:relative;z-index:2}.spell-stage>p{color:#838b86;text-align:center;font-size:12px;max-width:340px;line-height:1.5}.spell-result{text-align:center}.spell-result h2{font:600 25px Cinzel;color:#f0d89d;margin:8px}.spell-result p{font-size:12px;color:#b8bfba}.element-pair{font-size:12px;text-transform:uppercase;letter-spacing:.14em}.action-area{z-index:3;display:flex;align-items:flex-start;justify-content:center;gap:9px;min-height:42px;overflow:visible}.action-button,.minor-button{border:1px solid #b99a5b;background:#7f6334;color:#fff;padding:9px 15px;border-radius:3px;cursor:pointer;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.minor-button{background:#15181d;border-color:#ffffff26;color:#bfc3be}.action-button:disabled{opacity:.35;cursor:not-allowed}.market{min-width:0;max-width:100%;padding:11px;overflow:hidden}.section-title{display:flex;justify-content:space-between;font:600 11px Cinzel;text-transform:uppercase;letter-spacing:.14em;color:#d6c391;margin:0 3px 9px}.market-cards{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x proximity;scrollbar-color:#8f7040 #090b10;scrollbar-width:thin}
.card{--card-edge:color-mix(in srgb,var(--card-color) 64%,#d7bd7e);aspect-ratio:5/7;min-width:0;position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--card-edge);border-radius:9px;background:#11141a;box-shadow:0 7px 18px #000b,inset 0 0 0 1px #fff1;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,filter .18s ease;user-select:none}
.card::before{content:"";position:absolute;z-index:7;inset:3px;border:1px solid color-mix(in srgb,var(--card-color) 45%,#e7d4a3);border-radius:6px;pointer-events:none;opacity:.75}
.card::after{content:"";position:absolute;z-index:1;inset:0;background:radial-gradient(circle at 50% 14%,color-mix(in srgb,var(--card-color) 22%,transparent),transparent 42%),linear-gradient(115deg,#fff1,transparent 20% 80%,#0004);pointer-events:none}
.card-frame{position:absolute;z-index:6;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 7px,color-mix(in srgb,var(--card-color) 22%,transparent) 8px,transparent 10px calc(100% - 10px),color-mix(in srgb,var(--card-color) 22%,transparent) calc(100% - 8px),transparent calc(100% - 7px)),linear-gradient(180deg,transparent 7px,#e8d5a51f 8px,transparent 10px calc(100% - 10px),#0008 calc(100% - 8px),transparent calc(100% - 7px))}
.card-art{position:absolute;z-index:0;inset:0;background:var(--art) center/cover;filter:saturate(1.08) contrast(1.04);transform:scale(1.01)}
.card-tint{position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,#03050a22 0%,transparent 22%,#0e111722 34%,#0d1017 49%,#0a0d13 100%);opacity:.18;transition:opacity .45s cubic-bezier(.22,1,.36,1)}
.card-header{position:absolute;z-index:4;top:8px;left:8px;right:8px;min-height:29px;display:flex;align-items:flex-start;justify-content:space-between;gap:4px;padding:5px 5px 4px 7px;background:linear-gradient(90deg,#080b10eb,#14181de0 72%,#080b10d4);border:1px solid #ead9aa5c;border-left:2px solid var(--card-color);box-shadow:0 3px 10px #0008;clip-path:polygon(0 0,93% 0,100% 30%,100% 100%,7% 100%,0 70%);opacity:.28;transition:opacity .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,backdrop-filter .45s ease}
.card-title{min-width:0;display:flex;flex-direction:column}.card-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 clamp(10px,.76vw,13px)/1.08 Cinzel,serif;color:#fff7df;text-shadow:0 1px 3px #000}.card-title span{margin-top:3px;color:color-mix(in srgb,var(--card-color) 60%,#fff4d5);font-size:clamp(7px,.47vw,9px);font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.card-cost{flex:0 0 auto;width:21px;height:21px;display:grid;place-items:center;margin-top:-1px;border:1px solid #f1d996;border-radius:50%;background:radial-gradient(circle at 35% 28%,color-mix(in srgb,var(--card-color) 52%,#332d22),#080a0e 64%);box-shadow:0 0 0 2px #080a0ed9,0 2px 6px #000;color:#fff3cb;font:800 9px/1 Inter,sans-serif}
.card-crest{position:absolute;z-index:5;top:36%;left:50%;width:27px;height:27px;display:grid;place-items:center;transform:translate(-50%,-50%) rotate(45deg);border:1px solid #e7d4a3;background:radial-gradient(circle,color-mix(in srgb,var(--card-color) 36%,#171a20),#080a0e 72%);box-shadow:0 0 0 3px #090c11cc,0 0 13px color-mix(in srgb,var(--card-color) 45%,transparent);color:var(--card-color);font-size:10px}.card-crest span{transform:rotate(-45deg)}
.card-content{position:absolute;z-index:3;inset:37% 8px 8px;display:flex;flex-direction:column;min-height:0;padding-top:4px}
.card-symbols{display:flex;justify-content:center;gap:3px;min-height:15px;margin:0 0 3px}.element-symbol{width:15px;height:15px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;background:#07090dc7;box-shadow:inset 0 0 6px currentColor;font-size:7px;opacity:.3;transition:opacity .45s cubic-bezier(.22,1,.36,1),backdrop-filter .45s ease}
.card-rules{display:flex;flex:1;min-height:0;flex-direction:column;border:1px solid #d8c99b4f;background:linear-gradient(135deg,rgba(24,29,35,.98),rgba(5,8,12,.99));box-shadow:inset 0 1px #ffffff14,0 2px 8px #0008;opacity:.24;transition:opacity .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,backdrop-filter .45s ease}
.card-half{flex:1;min-height:0;padding:4px 7px;color:#f1f3ef;font-size:clamp(8.5px,.62vw,10.5px);font-weight:500;line-height:1.25;overflow:hidden;text-shadow:0 1px 1px #000}.card-half+.card-half{border-top:1px solid color-mix(in srgb,var(--card-color) 48%,#ffffff28)}.card-half b{display:flex;align-items:center;gap:4px;margin-bottom:3px;color:#fff0c8;font-size:clamp(7px,.5vw,9px);font-weight:800;line-height:1.05;letter-spacing:.06em;text-transform:uppercase}.card-half b i{width:15px;height:15px;display:grid;place-items:center;flex:0 0 15px;border:1px solid var(--card-color);border-radius:50%;color:var(--card-color);font:800 8px Inter,sans-serif}.card-half span{display:block}
.card-foot{display:grid;grid-template-columns:1fr auto;gap:3px 6px;align-items:center;padding:5px 2px 0;color:#d4d9d4;font-size:clamp(7px,.48vw,9px);font-weight:700;line-height:1.1}.card-foot>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-foot b{color:var(--card-color)}.reaction-badge{grid-column:1/-1;color:#d8ca9e;text-transform:uppercase;letter-spacing:.08em}
.card:is(:hover,.selected,:focus-visible) .card-tint,.card:is(:hover,.selected,:focus-visible) .card-header,.card:is(:hover,.selected,:focus-visible) .element-symbol,.card:is(:hover,.selected,:focus-visible) .card-rules{opacity:1}.card:is(:hover,.selected,:focus-visible) .card-header,.card:is(:hover,.selected,:focus-visible) .element-symbol,.card:is(:hover,.selected,:focus-visible) .card-rules{backdrop-filter:blur(2px)}.card.selected{transform:translateY(-13px) scale(1.025);border-color:#fff0b4;box-shadow:0 0 0 2px #fff0b44d,0 0 25px color-mix(in srgb,var(--card-color) 58%,transparent),0 12px 22px #000c}.card.selected::before{border-color:#fff0b4}.card.clickable{cursor:pointer}.card:hover{z-index:9}.card.clickable:hover{transform:translateY(-6px) scale(1.018);border-color:#f7dea0;box-shadow:0 0 18px color-mix(in srgb,var(--card-color) 38%,transparent),0 11px 22px #000c}.card.clickable:focus-visible{outline:3px solid #fff1b6;outline-offset:3px}.card.counter-playable{z-index:8;border-color:#dff8ff;box-shadow:0 0 0 2px #b9f2ffcc,0 0 18px 5px #55d6ffb8,0 0 38px 10px color-mix(in srgb,var(--card-color) 72%,#54d9ff),0 10px 24px #000d;animation:counter-ready-glow 1.25s ease-in-out infinite}.card.counter-playable::before{border-color:#eaffff;opacity:1;box-shadow:inset 0 0 12px #63dcff88}.card.counter-playable .card-frame::after{content:"CONTROELEMENTO";position:absolute;z-index:10;left:50%;bottom:7px;transform:translateX(-50%);padding:4px 7px;border:1px solid #dff9ff;background:#07151deb;color:#e9fcff;border-radius:3px;box-shadow:0 0 12px #50d7ff;text-shadow:0 0 6px #50d7ff;font:700 8px Cinzel,serif;letter-spacing:.09em;white-space:nowrap}.card.counter-playable:hover{border-color:#fff;box-shadow:0 0 0 3px #dff9ffee,0 0 25px 8px #67e1ff,0 0 46px 13px color-mix(in srgb,var(--card-color) 75%,#67e1ff),0 14px 27px #000e}.card.unaffordable{filter:saturate(.4);opacity:.56}@keyframes counter-ready-glow{0%,100%{filter:brightness(1);box-shadow:0 0 0 2px #b9f2ffb8,0 0 14px 4px #55d6ff91,0 0 30px 8px color-mix(in srgb,var(--card-color) 65%,#54d9ff),0 10px 24px #000d}50%{filter:brightness(1.13);box-shadow:0 0 0 3px #e5fbffed,0 0 25px 7px #67e1ffdc,0 0 46px 12px color-mix(in srgb,var(--card-color) 78%,#67e1ff),0 12px 27px #000e}}@media(prefers-reduced-motion:reduce){.card.counter-playable{animation:none;filter:brightness(1.08)}}
.market .card{width:190px;flex:0 0 190px;border-radius:7px;scroll-snap-align:start}.market .card-header{top:6px;left:6px;right:6px;min-height:27px;padding:4px 4px 4px 6px}.market .card-title strong{font-size:clamp(10px,.7vw,12px)}.market .card-title span{font-size:clamp(7px,.45vw,9px)}.market .card-cost{width:20px;height:20px;font-size:9px}.market .card-crest{width:23px;height:23px;font-size:9px}.market .card-content{inset:37% 6px 6px;padding-top:3px}.market .card-symbols{min-height:13px;margin-bottom:2px}.market .element-symbol{width:13px;height:13px;font-size:6px}.market .card-half{padding:4px 6px;font-size:clamp(8.5px,.56vw,10px);line-height:1.25}.market .card-half b{font-size:clamp(7px,.46vw,9px);margin-bottom:2px}.market .card-half b i{display:grid;width:12px;height:12px;flex-basis:12px;font-size:6px}.market .card-foot{font-size:clamp(7px,.45vw,9px);padding-top:3px}
.hand-section{margin-top:10px;border-top:1px solid var(--line);padding-top:9px}.hand-heading{display:flex;justify-content:space-between;align-items:center;font:600 10px Cinzel;text-transform:uppercase;color:#cabb91;letter-spacing:.13em}.hand-heading>div{display:flex;gap:10px;align-items:center}.hand{display:flex;justify-content:center;gap:9px;min-height:165px;padding:7px 20px 0}.hand .card{width:190px;flex:0 0 190px}.hand .card-name{font-size:10px}.hand .card-text{font-size:8px}.opponent-hand{display:flex;align-items:center;justify-content:flex-end;height:70px;padding-right:16px}.card-back{width:45px;height:64px;border:1px solid #ae8b4e;border-radius:4px;background:radial-gradient(circle,#98773a 0 3%,transparent 4% 13%,#98773a 14% 16%,transparent 17%),linear-gradient(135deg,#18151a,#090b10);margin-left:-15px;box-shadow:0 3px 8px #000;transform:rotate(var(--r))}.deck-meta{font-size:10px;color:#89908b;margin-left:17px;line-height:1.6}.growths{display:flex;gap:5px;margin-top:7px}.growth{font-size:9px;padding:4px 6px;border:1px solid #5b9f68;background:#16251a;border-radius:3px;color:#a9d5b1}
.log-toggle{position:fixed;right:14px;bottom:14px;z-index:12;background:#16191e;border:1px solid var(--line);color:#cbbd99;padding:9px 13px;border-radius:3px;cursor:pointer}.log-panel{position:fixed;z-index:30;top:58px;right:0;bottom:0;width:min(360px,92vw);background:#0a0c10f7;border-left:1px solid var(--line);padding:16px;transform:translateX(100%);transition:.2s}.log-panel.open{transform:none}.log-head{display:flex;justify-content:space-between;font:600 14px Cinzel;color:#e0cc99}.log-head button{background:0;border:0;font-size:25px}.log-panel ol{padding-left:20px;color:#a9afab;font-size:12px;line-height:1.6;display:flex;flex-direction:column-reverse}.log-panel li{padding:5px 0;border-bottom:1px solid #ffffff0a}
dialog{color:var(--ink);border:1px solid var(--line);background:#0d1016f7;box-shadow:0 30px 100px #000;border-radius:6px}dialog::backdrop{background:#020306d9;backdrop-filter:blur(5px)}.rules-dialog{width:min(920px,94vw);max-height:90vh;padding:0}.dialog-head{position:sticky;top:0;background:#0d1016;display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid var(--line);z-index:2}.dialog-head h2{font:600 27px Cinzel;margin:3px 0}.dialog-head button{border:0;background:0;font-size:27px}.rules-content{padding:15px 25px 35px;line-height:1.65;color:#c6cbc6;font-size:14px}.rules-content h1{display:none}.rules-content h2{font:600 20px Cinzel;color:#e2cc94;margin-top:30px}.rules-content h3{color:#e5ded0}.rules-content table{border-collapse:collapse;width:100%;font-size:12px;display:block;overflow:auto}.rules-content th,.rules-content td{border:1px solid #ffffff17;padding:7px;text-align:left}.rules-content blockquote{border-left:3px solid var(--gold);margin:12px 0;padding:8px 15px;background:#d8b76b0b}.choice-dialog{width:min(460px,92vw);padding:24px}.choice-dialog h2{font:600 21px Cinzel;color:#e3cc92}.choice-dialog p{color:#aeb4af;font-size:13px}.choice-dialog #choice-options{display:grid;gap:8px}.choice-dialog button{padding:11px;border:1px solid var(--line);background:#191d24;text-align:left;cursor:pointer}.end-dialog{padding:0;width:min(980px,96vw);max-height:94vh;display:none;grid-template-columns:36% 64%;overflow:hidden}.end-dialog[open]{display:grid}.end-art{background:url('assets/art/elementum-duel-key-art.png') center/cover;min-height:610px}.end-copy{padding:30px 34px;overflow-y:auto}.end-copy h2{font:600 30px Cinzel;color:#ecd69f;margin:8px 0}.end-copy>p:not(.eyebrow){color:var(--muted);margin:0 0 18px}.match-recap{display:grid;gap:16px}.final-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:14px;padding:14px 18px;border:1px solid var(--line);background:linear-gradient(90deg,#d8b76b0d,#ffffff08,#9b78db0d)}.final-score>div{display:flex;align-items:center;gap:10px}.final-score>div:last-child{flex-direction:row-reverse}.final-score span{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}.final-score strong{font:700 33px/1 Cinzel;color:#f1d99e}.final-score .score-label{padding-bottom:4px;color:#d7c18b}.recap-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.recap-meta>span{display:flex;flex-direction:column;gap:4px;padding:10px 12px;background:#ffffff08;border:1px solid #ffffff0d}.recap-meta small{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}.recap-meta b{font:600 14px Cinzel;color:#e9ddbf}.recap-chart{padding:14px 16px;border:1px solid #ffffff12;background:#080a0d80}.recap-legend{display:flex;justify-content:space-between;margin-bottom:10px;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.recap-legend span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px}.legend-player{color:#e1c47e}.legend-player::before{background:#d8b76b}.legend-rival{color:#bdaae8}.legend-rival::before{background:#8d71cb}.recap-metric{margin-top:11px}.recap-metric-values{display:grid;grid-template-columns:35px 1fr 35px;align-items:center;text-align:center;font-size:11px}.recap-metric-values b:first-child{text-align:left;color:#e9cc83}.recap-metric-values b:last-child{text-align:right;color:#c1adeb}.recap-metric-values span{color:#aab0aa}.recap-bars{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:5px}.recap-bar{height:5px;background:#ffffff0a;overflow:hidden}.recap-bar:first-child{direction:rtl}.recap-bar i{display:block;height:100%;min-width:2px}.recap-bar-player i{background:linear-gradient(90deg,#9b7438,#e3c477)}.recap-bar-rival i{background:linear-gradient(90deg,#765bab,#ad91e5)}.end-actions{display:flex;align-items:center;gap:20px;margin-top:20px}.end-copy .end-actions a{color:#bbaa80;font-size:12px}.end-copy .primary-button{padding:11px 20px}.score-line{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff14;padding:10px 0}.score-line b{color:#e8d29e}
.configuration-guide{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;width:100%;max-width:760px;margin:0 auto 8px}.configuration{padding:6px;border:1px solid #ffffff12;background:#0b0e13aa;border-radius:3px;text-align:center;transition:.2s}.configuration b{display:block;color:#c8b98f;font:600 9px Cinzel;text-transform:uppercase}.configuration span{display:block;color:#747b77;font-size:7px;margin-top:2px}.configuration.valid{border-color:#70bd7a;background:#18301dbb;box-shadow:0 0 12px #4f9b5833}.configuration.valid b{color:#b8e3bd}.configuration.invalid{opacity:.28}.preview-dialog{padding:0;width:min(680px,94vw)}.preview-dialog .dialog-head h2{margin:3px 0}.preview-dialog .dialog-head button{border:0;background:0;font-size:27px}.preview-plan{padding:18px 24px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:5px}.preview-plan b{font:600 17px Cinzel;color:#e3cc92}.preview-plan span{font-size:12px;color:#aeb4af}.preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff12;margin:18px 24px}.preview-grid div{background:#10131a;padding:13px;text-align:center}.preview-grid span{display:block;color:#858d88;text-transform:uppercase;font-size:8px;letter-spacing:.1em}.preview-grid b{display:block;font:600 21px Cinzel;color:#f0dda9;margin-top:4px}.preview-detail{padding:0 24px;color:#bbc1bc;font-size:12px}.preview-detail .danger{color:#f07a68}.preview-detail .warning{color:#e5b35e}.preview-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:18px 24px}.preview-actions .text-button{margin-right:auto;border:0;background:transparent;color:#d29a8c;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.preview-actions button:disabled{opacity:.45;cursor:wait}.tutorial-panel{position:fixed;z-index:45;left:24px;bottom:24px;width:min(390px,calc(100vw - 48px));padding:20px 22px;background:linear-gradient(145deg,#171c25f7,#0b0e13f7);border:1px solid #d8b76b77;box-shadow:0 20px 70px #000;border-radius:6px}.tutorial-panel::before{content:"";position:absolute;inset:5px;border:1px solid #d8b76b24;pointer-events:none}.tutorial-panel>button:first-child{position:absolute;right:10px;top:8px;border:0;background:0;font-size:22px;color:#999}.tutorial-panel h2{font:600 20px Cinzel;color:#ead59d;margin:6px 0 8px}.tutorial-panel p:not(.eyebrow){font-size:13px;line-height:1.55;color:#bdc3bd}.tutorial-actions{text-align:right}.tutorial-actions .primary-button{padding:9px 18px;font-size:11px}
@keyframes pulse{50%{box-shadow:0 0 15px #dc5f4d55}}
@media(max-width:1050px){.start-content{margin-right:35vw}.middle-zone{grid-template-columns:130px 1fr}.market{grid-column:1/-1}.market-cards{grid-template-columns:repeat(5,1fr)}.market .card-text{display:block}.player-zone{grid-template-columns:210px 1fr}}
@media(max-width:700px){
  html,body{overflow-x:hidden}.start-screen{background-position:62% center}.start-shade{background:rgba(5,6,10,.74)}.start-content{margin:70px auto 25px}.difficulty{flex-direction:column}.difficulty span{padding:9px}.table{padding:8px}.topbar{padding:0 10px}.player-zone{display:block}.mage-card{min-height:85px}.instability-board{margin-top:6px;gap:3px}.instability{padding:5px}.instability-head span{font-size:0}.instability-head span::first-letter{font-size:10px}.middle-zone{grid-template-columns:1fr;min-height:0}.catastrophe-deck{min-height:90px}.cat-count{font-size:27px;margin:7px 0 0}.arena{min-height:250px}.market-cards{overflow-x:auto;display:flex}.market .card{width:190px;flex:0 0 190px}.market .card-text{display:none}.hand{justify-content:flex-start;overflow-x:auto;padding-left:5px}.hand .card{width:190px;flex-basis:190px}.card-name{font-size:9px}.end-dialog[open]{grid-template-columns:1fr;overflow-y:auto}.end-art{min-height:192px}.end-copy{padding:22px;overflow:visible}.end-copy h2{font-size:25px}.final-score{padding:12px;gap:8px}.final-score strong{font-size:27px}.final-score>div{gap:6px}.recap-meta{gap:5px}.recap-meta>span{padding:8px}.end-actions{justify-content:space-between}.rules-content{padding:10px 15px 25px}}
/* Elementum v0.2: shared environment and three-card allocation */
.global-instability-zone{margin:0 0 10px;padding:9px 12px;border:1px solid var(--line);background:rgba(8,10,14,.68);border-radius:5px}.global-instability-zone::before{content:'INSTABILITÀ GLOBALE';display:block;margin-bottom:7px;color:var(--gold);font:600 10px Cinzel;letter-spacing:.2em;text-align:center}.global-instability{width:100%}.prepared-defense{display:inline-block;position:relative;z-index:1;margin-top:10px;padding:5px 9px;border:1px solid #72a9c755;border-radius:3px;background:#14202acc;color:#bde3f2;font-size:10px}.prepared-defense.empty{border-color:#ffffff12;color:#777;background:#080a0d99}.plan-button{width:100%;max-width:680px;text-align:left;line-height:1.35;padding:8px 11px!important}.action-area{max-height:145px;width:100%}.action-area.decision-list{overflow:auto;scrollbar-width:thin}.card-cost{font-size:9px!important}.opponent-hand .card-back{margin-left:-22px}.opponent-hand .card-back:first-child{margin-left:0}
@media(max-width:800px){.global-instability-zone{padding:7px}.global-instability-zone .instability-board{grid-template-columns:repeat(5,minmax(58px,1fr));overflow-x:auto}.plan-button{font-size:10px}.middle-zone{margin-top:0}.configuration-guide{grid-template-columns:repeat(5,minmax(88px,1fr));overflow-x:auto}.preview-grid{grid-template-columns:repeat(2,1fr);margin:12px}.preview-plan,.preview-detail{padding-left:14px;padding-right:14px}.preview-actions{flex-wrap:wrap;padding:14px}.preview-actions .text-button{width:100%;margin:0 0 2px;text-align:left}.tutorial-panel{left:12px;bottom:12px;width:calc(100vw - 24px)}}
@keyframes discard-choice-pulse{0%,100%{box-shadow:0 0 0 rgba(216,183,107,0)}50%{box-shadow:0 0 24px rgba(216,183,107,.38)}}
@media (prefers-reduced-motion:reduce){.hand.discard-choice .card.clickable{animation:none}}
/* v0.4 dual-action card anatomy */
.stage-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}.stage-slots>div{padding:12px;border:1px solid var(--line);background:#090b10cc;text-align:center}.stage-slots b{display:block;font-size:8px;color:var(--gold);letter-spacing:.14em}.stage-slots span{font-size:11px}.preview-detail{border-top:1px solid var(--line);margin-top:12px;padding-top:8px}.preview-detail p{margin:6px 0}.configuration-guide{grid-template-columns:1fr!important}.configuration-chip.valid{max-width:520px;margin:auto}.card-text,.card-uses{display:none!important}

/* Motion system: sparse particles support broader elemental silhouettes without intercepting input. */
.ambient-layer{position:fixed;inset:58px 0 0;width:100vw;height:calc(100dvh - 58px);display:block;z-index:12;pointer-events:none;contain:strict;opacity:.48;mix-blend-mode:screen}.game{position:relative;isolation:isolate}.game>.topbar,.game>.table,.game>.log-toggle,.game>.log-panel{position:relative}.game>.topbar{z-index:20}.game>.table{z-index:1}.game>.log-toggle{position:fixed;z-index:40}.game>.log-panel{position:fixed;z-index:50}.motion-layer{position:fixed;inset:0;z-index:120;pointer-events:none;overflow:hidden;contain:strict;isolation:isolate}.motion-particle{position:absolute;left:var(--x);top:var(--y);width:6px;height:6px;border-radius:50%;background:var(--color);box-shadow:0 0 12px var(--color),0 0 24px var(--color);will-change:transform,opacity}.motion-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,var(--flash-color),transparent 68%);mix-blend-mode:screen;will-change:opacity}.element-particle{position:absolute;left:var(--x);top:var(--y);z-index:2;width:var(--size);height:var(--size);background:var(--color);filter:drop-shadow(0 0 7px var(--color));mix-blend-mode:screen;will-change:transform,opacity}.element-ember{border-radius:65% 35% 55% 45%;background:radial-gradient(circle at 45% 35%,#fff6bd 0 12%,#ff9d32 28%,var(--color) 62%,transparent 70%)}.element-flame{height:calc(var(--size) * 1.7);border-radius:70% 30% 65% 35%;background:linear-gradient(to top,transparent 3%,var(--color) 24%,#ffd26a 68%,#fff 100%)}.element-drop{height:calc(var(--size) * 1.45);border-radius:55% 45% 65% 35%;background:linear-gradient(145deg,#e9fbff 8%,var(--color) 48%,#176bb3);box-shadow:inset 2px 2px 3px #fff9}.element-bubble{border:2px solid #c8f5ff;border-radius:50%;background:#57aee544;box-shadow:inset -3px -3px 6px #176bb388}.element-shard{border-radius:1px;clip-path:polygon(50% 0,100% 72%,62% 100%,0 68%);background:linear-gradient(135deg,#f2c488,var(--color) 45%,#6e4125)}.element-dust{border-radius:50%;background:#d7b17c;box-shadow:9px 3px 0 -2px #8d633d,-7px 5px 0 -3px #ebc995}.element-gust{height:3px;border-radius:50%;background:linear-gradient(90deg,transparent,#e9e1ff 25%,var(--color) 72%,transparent);box-shadow:0 5px 0 -1px #cabaff88;filter:drop-shadow(0 0 5px var(--color))}.element-leaf{border-radius:100% 0 100% 0;background:linear-gradient(135deg,#d8ffc1,var(--color) 55%,#276d3d)}.element-spore{border-radius:50%;background:#d8ffc1;box-shadow:0 0 8px var(--color)}.element-field{position:absolute;left:var(--x);top:var(--y);z-index:1;width:var(--field-width);height:var(--field-height);border-radius:50%;mix-blend-mode:screen;will-change:transform,opacity}.element-field-fire{background:radial-gradient(ellipse at 50% 70%,#fff0a833 0 10%,#ff7b2844 28%,transparent 68%);box-shadow:inset 0 -30px 50px #e65f4244}.element-field-water{background:repeating-radial-gradient(ellipse at 50% 55%,transparent 0 13px,#7dd7ff44 16px,transparent 20px);filter:drop-shadow(0 0 16px #57aee5)}.element-field-stone{background:repeating-conic-gradient(from 12deg at 50% 50%,#ce955833 0 7deg,transparent 8deg 26deg);clip-path:polygon(7% 63%,18% 28%,39% 16%,56% 27%,76% 11%,94% 52%,82% 81%,54% 89%,28% 82%)}.element-field-wind{background:repeating-radial-gradient(ellipse at 50% 50%,transparent 0 18px,#c8b9ff55 20px 22px,transparent 26px 38px);filter:blur(1px) drop-shadow(0 0 12px #a991e4)}.element-field-nature{background:radial-gradient(ellipse,#8cdb7b44,transparent 68%);box-shadow:inset 0 0 55px #5cb57444}.element-accent{position:absolute;left:var(--x);top:var(--y);z-index:1;width:var(--accent-width);height:var(--accent-height);pointer-events:none;mix-blend-mode:screen;will-change:transform,opacity}.element-accent-fire{border-radius:45% 55% 48% 52%;background:radial-gradient(ellipse at 50% 92%,#fff5b7aa 0 2%,transparent 12%),conic-gradient(from 244deg at 50% 92%,transparent 0 7%,#ffb13d99 9% 12%,transparent 15% 20%,#e65f4288 23% 28%,transparent 31% 67%,#ffcf6488 70% 75%,transparent 78%);filter:blur(.4px) drop-shadow(0 -8px 12px #e65f4266)}.element-accent-water{border:2px solid transparent;border-top-color:#bfeeffaa;border-radius:50%;background:repeating-radial-gradient(ellipse at 50% 60%,transparent 0 17px,#57aee555 19px 21px,transparent 24px 37px);filter:drop-shadow(0 7px 8px #57aee566)}.element-accent-stone{background:linear-gradient(152deg,transparent 0 43%,#f0bb7caa 44% 45%,transparent 46%),linear-gradient(28deg,transparent 0 51%,#ce955888 52% 53%,transparent 54%),repeating-conic-gradient(from 18deg at 50% 62%,transparent 0 16deg,#ce955866 17deg 18deg,transparent 19deg 38deg);clip-path:polygon(5% 45%,25% 28%,45% 39%,62% 17%,91% 42%,78% 70%,52% 82%,23% 73%);filter:drop-shadow(0 5px 5px #5d341f)}.element-accent-wind{border-top:3px solid #e9e1ffbb;border-right:1px solid #a991e488;border-radius:50%;background:repeating-radial-gradient(ellipse at 48% 52%,transparent 0 23px,#c8b9ff55 25px 27px,transparent 30px 47px);filter:drop-shadow(10px 0 7px #a991e488)}.element-accent-nature{border-radius:50% 45%;background:radial-gradient(ellipse at 50% 70%,#bdf5a044 0 13%,transparent 55%),conic-gradient(from 210deg at 50% 75%,transparent 0 9%,#79ce7988 10% 12%,transparent 13% 24%,#b6ef8e77 25% 28%,transparent 29% 72%,#79ce7988 73% 76%,transparent 77%);filter:drop-shadow(0 -3px 7px #5cb57477)}.stage-card{position:relative;overflow:hidden;isolation:isolate;will-change:transform,opacity,filter}.stage-card::after{content:"";position:absolute;inset:-60%;z-index:-1;background:conic-gradient(from 0deg,transparent,var(--spell-color),transparent 35%);opacity:0;animation:arcane-orbit 2.8s linear infinite}.spell-stage[data-casting] .stage-card{border-color:var(--spell-color);box-shadow:inset 0 0 24px color-mix(in srgb,var(--spell-color) 28%,transparent),0 0 18px color-mix(in srgb,var(--spell-color) 24%,transparent)}.spell-stage[data-casting] .stage-card::after{opacity:.25}.card,.card-back,.mage-card,.instability,.stat{will-change:transform,opacity}.game:not(.hidden) .table{animation:table-awaken .7s cubic-bezier(.2,.8,.2,1) both}.start-content{animation:start-reveal .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes arcane-orbit{to{transform:rotate(1turn)}}
@keyframes table-awaken{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes start-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes discard-choice-pulse{50%{filter:brightness(1.25);transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.ambient-layer,.motion-layer{display:none}.hand.discard-choice .card.clickable,.instability.critical,.card.counter-playable{animation:none!important}.card,.card-back,.mage-card,.instability,.stat{will-change:auto}}

/* Accessible turn decisions: opaque surfaces and explicit information hierarchy. */
.decision-heading{position:relative;z-index:1;width:min(560px,100%);padding:22px 24px 10px;text-align:center}.decision-step{display:inline-flex;align-items:center;gap:6px;color:#d8b76b;font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.decision-heading h2{margin:7px 0 5px;color:#f2e4bd;font:600 clamp(20px,2vw,29px)/1.1 Cinzel,serif;text-shadow:0 2px 16px #000}.decision-heading p{margin:0 auto;color:#c0c7c2;font-size:12px;line-height:1.55;max-width:500px}.action-area.decision-list{display:grid;align-content:start;gap:9px;width:min(720px,100%);max-height:205px;padding:2px 5px 8px;overflow:auto;scrollbar-color:#9f8149 #080a0f}.plan-button{appearance:none;border:1px solid rgba(231,212,163,.35);border-radius:7px;background:linear-gradient(135deg,#171b24 0%,#0b0e14 100%);color:#edf0e8;box-shadow:inset 0 1px rgba(255,255,255,.06),0 5px 18px rgba(0,0,0,.32);cursor:pointer;transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease}.plan-button:hover{border-color:#e7d4a3;background:linear-gradient(135deg,#242635,#10131a);transform:translateY(-1px);box-shadow:inset 0 1px rgba(255,255,255,.08),0 9px 25px rgba(0,0,0,.45)}.plan-button:focus-visible,.pass-choice:focus-visible{outline:3px solid #fff;outline-offset:3px}.fusion-choice{display:grid;gap:8px;padding:11px 13px!important}.choice-kicker{color:#bfa56b;font-size:8px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.fusion-roles{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:8px;align-items:center}.fusion-roles>span{display:flex;min-width:0;flex-direction:column;gap:3px}.fusion-roles small,.purchase-choice small{color:#9da8a2;font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.fusion-roles strong,.purchase-choice strong{overflow:hidden;color:#fff;font-size:11px;line-height:1.3;text-overflow:ellipsis}.fusion-roles>i{color:#806f48;font-size:15px;font-style:normal}.choice-outcome{display:flex;align-items:center;gap:5px;border-top:1px solid rgba(255,255,255,.08);padding-top:7px;color:#abb4ae;font-size:9px}.choice-outcome b{color:#d9c58f}.choice-outcome span{margin-left:auto;color:#d8b76b;font-size:16px}.purchase-heading{padding-top:16px}.arcane-orb{display:grid;width:38px;height:38px;margin:0 auto 8px;place-items:center;border:1px solid #efd38d;border-radius:50%;background:#4b381c;color:#ffe7a5;box-shadow:0 0 24px rgba(216,183,107,.3)}.purchase-heading h2{font-size:38px}.action-area.purchase-decision{width:min(760px,100%);max-height:300px}.purchase-option{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:12px}.purchase-card-preview{width:96px}.purchase-card-preview .card{width:100%;pointer-events:none}.purchase-card-preview .card-title strong{font-size:8px}.purchase-card-preview .card-title span,.purchase-card-preview .card-half{font-size:6px}.purchase-card-preview .card-header{inset:5px 5px auto;min-height:21px;padding:3px}.purchase-card-preview .card-content{inset:37% 5px 5px}.purchase-card-preview .card-half{padding:3px 4px}.purchase-card-preview .card-symbols{min-height:10px;margin-bottom:1px}.purchase-card-preview .element-symbol{width:10px;height:10px;font-size:5px}.purchase-card-preview .card-cost{width:17px;height:17px}.purchase-choice{display:grid!important;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;padding:10px 13px!important}.purchase-choice>span:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:4px}.purchase-cost{display:grid;width:34px;height:34px;place-items:center;border:1px solid #e1c77e;border-radius:50%;background:#3d2d17;color:#ffe6a4;font:700 17px Cinzel,serif}.choice-arrow{color:#d8b76b;font-size:18px}.pass-choice{display:flex;align-items:flex-start;flex-direction:column;gap:3px;width:100%;border:1px solid rgba(255,255,255,.18);border-radius:7px;background:#0c0f15;color:#e0e5df;padding:10px 13px;cursor:pointer;text-align:left}.pass-choice span{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.pass-choice small{color:#929b96;font-size:9px}.primary-button:focus-visible,.minor-button:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(max-width:800px){.spell-stage{min-height:135px}.decision-heading{padding:16px 10px 7px}.action-area.decision-list{max-height:225px}.action-area.purchase-decision{max-height:320px}.purchase-option{grid-template-columns:76px minmax(0,1fr);gap:8px}.purchase-card-preview{width:76px}.purchase-choice{grid-template-columns:32px minmax(0,1fr) auto;gap:8px;padding:8px!important}.purchase-cost{width:30px;height:30px;font-size:14px}.fusion-roles{grid-template-columns:1fr}.fusion-roles>i{display:none}.fusion-roles>span{border-left:2px solid #806f48;padding-left:8px}.fusion-choice{gap:6px}.choice-outcome{margin-top:2px}}
@media(prefers-reduced-motion:reduce){.plan-button{transition:none}.plan-button:hover{transform:none}}

/* Desktop board: compact, but never by stacking or shrinking cards into each other. */
@media(min-width:1200px) and (min-height:680px){
  .game{height:100dvh;overflow:hidden}
  .table{height:calc(100dvh - 58px);display:grid;grid-template-rows:minmax(92px,auto) minmax(280px,1fr) minmax(210px,31vh);gap:8px;padding:8px 18px 10px;overflow:hidden}
  .opponent-overview{display:grid;grid-template-columns:minmax(500px,42%) minmax(0,1fr);gap:10px;align-items:stretch;min-height:0}
  .opponent-zone{grid-template-columns:minmax(210px,240px) minmax(250px,1fr);margin:0;gap:8px;min-width:0}
  .opponent-overview .mage-card{min-height:92px;padding:10px 12px}
  .opponent-overview .stats{margin-top:7px;gap:5px}
  .opponent-overview .stat{padding:4px 7px}
  .opponent-overview .prepared-defense{margin-top:6px;padding:3px 7px}
  .opponent-hand{height:100%;min-width:0;padding:0 5px;justify-content:center;gap:5px}
  .opponent-hand .card-back,.opponent-hand .card-back:first-child{width:40px;height:58px;flex:0 0 40px;margin-left:0;transform:none}
  .global-instability-zone{display:flex;flex-direction:column;justify-content:center;min-width:0;margin:0;padding:8px 10px}
  .global-instability-zone::before{margin-bottom:5px;text-align:left}
  .global-instability-zone .instability{padding:6px 7px}
  .global-instability-zone .instability-bonus{display:none}
  .middle-zone{grid-template-columns:160px minmax(380px,1fr) 370px;gap:10px;min-height:0;height:100%}
  .catastrophe-deck{padding:11px}
  .cat-count{font-size:34px;margin-top:14px}
  .arena{min-height:0;padding:10px}
  .spell-stage{min-height:120px}
  .market{padding:9px}
  .market-cards{overflow-x:auto;display:flex;gap:8px;padding-bottom:5px}
  .market .card{width:168px;flex:0 0 168px}
  .player-overview{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px;align-items:stretch;min-height:0}
  .player-own{display:block;margin:0;min-width:0}
  .player-overview .mage-card{height:100%;min-height:0;padding:11px 13px}
  .player-overview .stats{flex-direction:column;align-items:flex-start;margin-top:8px;gap:5px}
  .player-overview .prepared-defense{margin-top:7px}
  .hand-section{min-width:0;margin:0;padding:0 0 0 12px;border-top:0;border-left:1px solid var(--line);overflow:hidden}
  .hand{justify-content:center;min-height:0;height:calc(100% - 25px);padding:5px 2px 0;overflow-x:auto;overflow-y:hidden}
  .hand .card{width:auto;height:100%;min-width:0;max-width:none;flex:0 0 auto;aspect-ratio:5/7}
}
@media(min-width:1200px) and (min-height:680px) and (max-height:820px){
  .topbar{height:50px}
  .table{height:calc(100dvh - 50px);grid-template-rows:84px minmax(270px,1fr) minmax(204px,30vh);padding-top:6px;padding-bottom:6px}
  .opponent-overview .mage-card{min-height:84px}
  .opponent-overview .prepared-defense{display:none}
  .middle-zone{grid-template-columns:145px minmax(350px,1fr) 360px}
  .cat-count{font-size:28px;margin-top:8px}
  .spell-stage{min-height:105px}
}
@media(max-width:1199px),(max-height:679px){
  .opponent-overview,.player-overview{display:block}
}

/* Played fusions use the same regular card size as the hand and Grimorio. */
.stage-slots{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:calc(var(--ritual-card-width,190px)*1.4)}
.stage-slots>.card{width:var(--ritual-card-width,190px);height:auto;flex:0 0 var(--ritual-card-width,190px);aspect-ratio:5/7;padding:0;text-align:initial;background:#11141a}
.stage-slots>.card:nth-child(1){transform:rotate(-2deg)}
.stage-slots>.card:nth-child(3){transform:rotate(2deg)}
.stage-slots>.card:hover{transform:translateY(-4px) scale(1.04)}
.stage-slots>.card:nth-child(1):hover{transform:translateY(-4px) rotate(-2deg) scale(1.04)}
.stage-slots>.card:nth-child(3):hover{transform:translateY(-4px) rotate(2deg) scale(1.04)}
.stage-role{position:absolute;z-index:9;left:7px;right:7px;bottom:7px;padding:4px 3px;border:1px solid color-mix(in srgb,var(--card-color) 72%,#f4dfaa);background:#07090ded;color:#fff2c8;text-align:center;font:800 7px/1 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 2px 9px #000}
.stage-played-card .card-foot{bottom:24px}
.spell-stage[data-casting] .stage-played-card{border-color:var(--spell-color);box-shadow:inset 0 0 24px color-mix(in srgb,var(--spell-color) 28%,transparent),0 0 18px color-mix(in srgb,var(--spell-color) 24%,transparent)}
@media(max-width:700px){.stage-slots{min-height:145px;gap:5px}.stage-slots>.card{width:min(30vw,136px);flex-basis:min(30vw,136px)}.stage-role{font-size:6px;letter-spacing:.08em}.stage-played-card .card-foot{display:none}}