:root{color-scheme:dark;--bg:#102b2b;--panel:#183535;--panel2:#1c3c3b;--line:#34504b;--cream:#eee9d7;--muted:#9cb4aa;--gold:#edcb80;--mint:#b8dcc8;--red:#e49d8e;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream)}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #f4d797;outline-offset:4px}button{color:var(--cream)}.topbar{height:79px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 max(30px,calc((100vw - 1390px)/2));gap:36px}.brand{display:flex;gap:11px;align-items:center;letter-spacing:2.3px;font-weight:800;font-size:13px}.brand-icon{display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;font-size:28px;color:var(--gold);border:2px solid var(--gold);border-radius:50%;letter-spacing:-5px;padding-right:5px;line-height:0}.brand-icon span{color:#b8dcc8;font-size:29px}.backlink{font-size:12px;color:var(--muted);border-left:1px solid var(--line);padding-left:34px}.backlink span{margin-left:12px}.top-actions{display:flex;margin-left:auto;gap:9px}.icon-btn{border:1px solid var(--line);background:transparent;border-radius:50%;width:32px;height:32px;font-size:17px;position:relative}.sound-off{position:absolute;right:4px;bottom:0;font-size:11px}.top-actions .icon-btn:first-child{font-family:Georgia,serif}main{max-width:1390px;margin:0 auto;padding:32px 30px 0}.game-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:29px}.eyebrow,.overline{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--muted)}.eyebrow span{padding:0 9px;color:#536f61}h1{font-size:52px;line-height:1;margin:12px 0 10px;font-weight:900;letter-spacing:-2.5px}h1>span:first-child{color:var(--gold)}.title-spark{color:var(--gold);font-size:32px;vertical-align:top;margin-left:14px;display:inline-block;transform:rotate(8deg)}.game-heading p{font-family:Georgia,serif;font-size:15px;color:var(--muted);margin:0}.player-stats{display:flex;gap:30px;margin-right:10px}.player-stats>div{display:grid;grid-template-columns:24px 1fr;column-gap:9px}.stat-icon{color:var(--gold);grid-row:span 2;font-size:26px}.player-stats strong{font-size:22px}.player-stats>div>span:last-child{font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:5px}.game-layout{display:grid;grid-template-columns:minmax(210px,1fr) minmax(340px,470px) minmax(180px,.88fr);gap:34px;align-items:start}.sidebar{padding-top:10px}.side-title{display:flex;align-items:center;gap:13px;margin-bottom:28px}.small-crown{display:grid;place-content:center;width:42px;height:42px;border-radius:9px;color:var(--gold);border:1px solid #596752;background:#283f35;font-size:23px}.side-title h2{font-size:16px;margin:0 0 7px}.side-title p{font-size:11px;color:var(--muted);margin:0}.side-block{border-top:1px solid var(--line);padding:23px 0 20px}.label-row{display:flex;justify-content:space-between;align-items:center;gap:5px}.label-row h3,.side-block>h3{font-size:9px;letter-spacing:1.8px;margin:0;font-weight:700}.live-dot{font-size:7px;letter-spacing:.9px;color:var(--mint)}.live-dot:before{content:'';display:inline-block;width:4px;height:4px;background:var(--mint);border-radius:50%;margin-right:5px}.difficulty{display:flex;border:1px solid var(--line);border-radius:6px;padding:4px;margin-top:17px;gap:2px}.difficulty button{border:0;background:transparent;padding:10px 5px;border-radius:3px;flex:1;font-size:10px;color:var(--muted)}.difficulty button.active{background:#3b5749;color:#e4e7ce;box-shadow:inset 0 0 0 1px #64755b}.muted{font-size:10px;color:var(--muted);line-height:1.6;margin:11px 0 0}.text-btn{border:0;padding:0;background:transparent;color:var(--gold);font-size:10px}.deck-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:17px}.mini-card{border:1px solid #4c6253;border-radius:6px;background:linear-gradient(145deg,#2d5149,#233e3b);position:relative;min-width:0;aspect-ratio:.8;padding:3px}.mini-card svg{width:100%;height:85%}.mini-card .cost{position:absolute;left:3px;top:3px;font-size:9px}.mini-card>span:last-child{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:7px;white-space:nowrap}.cost{display:grid;place-content:center;width:18px;height:20px;background:#6d6698;border:1px solid #a7a4c1;clip-path:polygon(50% 0,95% 24%,95% 76%,50% 100%,5% 76%,5% 24%);color:#fff;font-weight:bold}.deck-summary{margin-top:14px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.aether-dot{color:#bbb0ed}.deck-summary strong{color:#ded9e9}.field-notes{padding-bottom:24px}.field-notes ol{list-style:none;padding:0;margin:22px 0}.field-notes li{display:flex;gap:13px;align-items:flex-start;margin-bottom:20px}.field-notes li>span{font-family:Georgia,serif;font-size:19px;color:#728e76}.field-notes li p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}.field-notes li b{font-weight:400;color:#d8dfcb}.field-notes .text-btn{display:flex;justify-content:space-between;width:100%}.local-note{background:#1a3732;border:1px solid #304e40;border-radius:5px;display:flex;gap:12px;padding:15px}.local-note>span{color:var(--gold)}.local-note p{font-size:11px;line-height:1.7;margin:0}.local-note p span{color:var(--muted);font-size:9px}.battle-panel{border:1px solid #506657;border-radius:13px;background:#173635;overflow:hidden;box-shadow:0 14px 60px #061b1a40}.scoreboard{display:flex;align-items:center;height:64px;padding:0 15px;gap:12px;background:#203e39}.opponent{display:flex;align-items:center;gap:9px;flex:1}.avatar{display:grid;place-content:center;border:1px solid #a66d63;background:#67564d;width:33px;height:35px;border-radius:7px;color:#f0b3a3;font-size:23px}.opponent b{display:block;font-size:11px}.opponent div>span{font-size:7px;letter-spacing:1.1px;color:var(--muted);display:block;margin-top:5px}.clock{text-align:center;border-left:1px solid #476052;border-right:1px solid #476052;padding:0 18px}.clock>span{display:block;font-size:6px;letter-spacing:1.3px;color:var(--muted);margin-bottom:4px}.clock strong{font-variant-numeric:tabular-nums;font-size:22px}.clock.overtime strong{color:var(--gold)}.crowns{display:flex;gap:6px;align-items:center;font-size:18px}.red-text{color:var(--red);font-size:23px}.arena-wrap{position:relative;background:#5e815f}.arena-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:480/680;touch-action:none;cursor:crosshair}.battle-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#102e3677;backdrop-filter:blur(2px);padding:24px}.start-card{padding:25px 22px 24px;text-align:center;background:#142f2feb;border:1px solid #98a77b;box-shadow:0 8px 40px #0c242a70;border-radius:10px;width:290px}.arena-tag{font-size:7px;letter-spacing:1.8px;color:var(--mint)}.crossed{color:var(--gold);font-size:35px;margin:14px 0 5px}.start-card h2{font-family:Georgia,serif;font-weight:400;font-size:37px;letter-spacing:-1px;margin:5px 0 13px;line-height:1.05}.start-card p{font-size:11px;line-height:1.7;color:var(--muted);margin:0 0 22px}.gold-btn{background:var(--gold);border:1px solid #f4dcab;border-radius:5px;color:#253b31;padding:13px 18px;font-size:12px;font-weight:700;box-shadow:0 3px 0 #94794c}.gold-btn:hover{background:#f5dca6}.gold-btn span{margin-left:23px}.start-note{display:block;color:var(--muted);font-size:8px;margin-top:15px}.hand-area{padding:13px 14px 8px}.your-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.your-row>span{font-size:7px;letter-spacing:1.5px;color:var(--mint)}.your-row i{display:inline-block;width:4px;height:4px;background:var(--mint);border-radius:50%;margin-right:4px}.your-row b{font-size:7px;letter-spacing:0;font-weight:400;color:var(--muted);margin-left:9px}.your-row .text-btn{color:var(--muted);font-size:9px}.hand-grid{display:flex;gap:11px}.hand{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;flex:1;min-width:0}.hand-card{aspect-ratio:.77;position:relative;border:1px solid #69806a;background:linear-gradient(145deg,#35564a,#213f3b);border-radius:7px;padding:0;min-width:0;transition:transform .15s,border-color .15s}.hand-card svg{width:100%;height:82%;position:absolute;left:0;top:4px}.hand-card .cost{position:absolute;top:4px;left:4px;z-index:1}.hand-card .card-name{position:absolute;bottom:7px;left:2px;right:2px;font-size:8px;white-space:nowrap}.hand-card .hotkey{font-size:7px;position:absolute;right:5px;top:4px;color:#a9bb9c}.hand-card.selected{transform:translateY(-7px);border:2px solid var(--gold);background:linear-gradient(#4c6650,#2a4940);box-shadow:0 0 18px #e4c57d20}.hand-card.unaffordable{filter:saturate(.35);opacity:.6}.next-card{width:43px;border-left:1px solid var(--line);padding-left:10px;display:flex;flex-direction:column;justify-content:center}.next-card>span{font-size:6px;letter-spacing:1.5px;text-align:center;color:var(--muted);margin-bottom:6px}.next-card>div{height:51px;background:#26463c;border:1px solid #526b57;border-radius:4px}.next-card svg{width:100%;height:100%}.energy-row{display:flex;align-items:center;gap:8px;margin-top:14px}.aether-symbol{font-size:23px;color:#aea4dd}.energy-row>strong{font-size:19px;min-width:32px}.energy-row small{font-size:9px;color:var(--muted);font-weight:400}.energy-bar{height:11px;display:flex;gap:3px;flex:1}.energy-bar i{height:11px;flex:1;background:#32484b;border:1px solid #516568;border-radius:2px;overflow:hidden;position:relative}.energy-bar i:before{content:'';position:absolute;inset:0;transform:scaleX(var(--fill));transform-origin:left;background:#a59ad0}.energy-label{font-size:6px;letter-spacing:1px;color:var(--muted)}.arena-foot{display:flex;justify-content:space-between;align-items:center;font-size:7px;letter-spacing:1px;color:#8ca79c;margin-top:9px;padding-top:8px;border-top:1px solid #29483e}.arena-foot>span:first-child{font-size:13px;color:var(--gold)}.arena-foot>span:nth-child(2){font-family:Georgia,serif;font-size:10px;letter-spacing:0}.rightbar{padding:24px 0 0 3px}.rightbar h2{font-family:Georgia,serif;font-size:34px;line-height:1.05;font-weight:400;letter-spacing:-.7px;margin:18px 0}.rightbar>p{font-size:11px;line-height:1.9;color:var(--muted);max-width:210px}.tip-art{height:125px;margin:20px 0 5px;display:flex;align-items:center;justify-content:center;max-width:210px}.tip-art svg{width:100px;height:115px;transform:rotate(-8deg)}.tip-art svg+svg{margin-left:-16px;transform:translateY(8px) rotate(11deg)}.tip-chip{display:inline-block;border:1px solid #526145;border-radius:3px;background:#304538;padding:7px 9px;color:#c5cd9d;font-size:6px;letter-spacing:1.1px}.rule-card{border-bottom:1px solid var(--line);padding:25px 0 20px;margin-bottom:24px}.rule-card>span,.match-stats>span,.other-game>span:first-child{font-size:7px;letter-spacing:1.8px;color:var(--muted)}.rule-card h3{font-family:Georgia,serif;font-size:26px;line-height:1.12;font-weight:400;margin:13px 0;color:#d1d8bf}.rule-card p{font-size:10px;line-height:1.8;color:var(--muted);max-width:200px}.match-stats>div{display:flex;align-items:center;gap:13px;margin-top:15px}.match-stats strong{font-size:22px;width:27px;color:#c4d9c5}.match-stats div span{font-size:10px;color:var(--muted)}.other-game{border-top:1px solid var(--line);display:block;margin-top:26px;padding-top:23px}.other-game b{font-family:Georgia,serif;display:block;font-weight:400;font-size:18px;margin:12px 0}.other-game>span:last-child{font-size:10px;color:var(--gold)}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:23px 0;margin-top:38px;color:var(--muted);font-size:9px}.keyboard-hint{font-size:8px;color:#728f80}.battle-toast{position:absolute;left:20px;right:20px;bottom:18px;pointer-events:none;text-align:center;background:#123735f0;color:#f2e6c7;border:1px solid #9ca47c;border-radius:7px;font-size:12px;line-height:1.5;padding:12px;opacity:0;transition:opacity .15s}.battle-toast.visible{opacity:1}#pause-banner{position:absolute;inset:0;background:#102d2bd9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;backdrop-filter:blur(3px)}#pause-banner[hidden]{display:none}#pause-banner>span{font-family:Georgia,serif;font-size:32px}#pause-banner button{background:var(--gold);color:#234236;border:0;border-radius:5px;padding:12px 25px}dialog{color:var(--cream);background:#183735;border:1px solid #809477;border-radius:13px;padding:28px;max-width:min(860px,calc(100vw - 30px));max-height:90dvh;overflow:auto;box-shadow:0 20px 100px #041a1ec9}dialog::backdrop{background:#061d22c9;backdrop-filter:blur(4px)}.modal-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.modal-head h2{font-family:Georgia,serif;font-size:30px;letter-spacing:-.5px;margin:10px 0;font-weight:400}.modal-head .icon-btn{flex-shrink:0}.modal-description{color:var(--muted);font-size:12px;line-height:1.7;max-width:600px}.deck-toolbar{display:flex;justify-content:space-between;margin:20px 0;font-size:12px;color:var(--gold)}.deck-toolbar span{color:var(--muted)}.collection{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.collection-card{position:relative;text-align:left;display:flex;flex-direction:column;align-items:center;border:1px solid #476555;background:#23453c;border-radius:7px;padding:6px 9px 12px;color:var(--cream)}.collection-card.active{border:2px solid var(--gold);padding:5px 8px 11px}.collection-card svg{height:100px;width:100%}.collection-card .cost{position:absolute;left:7px;top:7px;width:23px;height:26px;font-size:12px}.collection-card .check{position:absolute;right:7px;top:8px;color:var(--gold);font-size:12px}.collection-card b{font-size:12px;margin:4px 0}.collection-card .role{font-size:9px;color:var(--mint);margin-bottom:7px}.collection-card .description{font-size:9px;line-height:1.5;color:var(--muted);text-align:center}.modal-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}.secondary-btn{background:transparent;border:1px solid #63816b;border-radius:5px;color:var(--cream);font-size:11px;padding:13px 17px}.guide-content{max-width:620px;font-size:12px;line-height:1.8;color:var(--muted);margin:20px 0}.guide-content h3{font-size:15px;margin:20px 0 5px;color:var(--gold)}.guide-content p{margin:0}#result-dialog{width:420px;text-align:center;padding:33px 25px}.result-emblem{font-size:58px;color:var(--gold);margin-bottom:14px}#result-title{font-family:Georgia,serif;font-size:43px;font-weight:400;margin:10px 0}#result-reason{color:var(--muted);font-size:12px}.result-stats{display:flex;justify-content:space-around;padding:20px 0;margin:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.result-stats b{font-size:24px;color:var(--gold);display:block;margin-bottom:8px}.result-stats span{font-size:8px;color:var(--muted);letter-spacing:1px}.xp-line{display:flex;justify-content:space-between;font-size:10px;color:var(--mint)}#storage-note{font-size:10px;color:var(--gold)}
@media(min-width:1500px){main{max-width:1330px}.game-layout{grid-template-columns:280px 470px 240px;justify-content:space-between}}
@media(max-width:1100px){.game-layout{grid-template-columns:210px minmax(340px,470px);justify-content:center;gap:27px}.rightbar{display:none}.game-heading{max-width:707px;margin-left:auto;margin-right:auto}main{padding:26px 24px 0}.topbar{padding:0 24px}h1{font-size:47px}.keyboard-hint{display:none}}
@media(max-width:650px){.topbar{height:59px;padding:0 17px;gap:18px}.backlink{padding-left:16px;font-size:10px}.brand{font-size:10px;letter-spacing:1.7px;gap:8px}.brand-icon{width:26px;height:26px;font-size:23px}.game-heading{padding:0 3px;margin-bottom:20px}main{padding:23px 12px 0}h1{font-size:34px;letter-spacing:-1.8px;margin:8px 0}.title-spark{font-size:23px;margin-left:7px}.game-heading .eyebrow{font-size:7px;letter-spacing:1.2px}.game-heading p{font-size:12px}.player-stats{gap:15px;margin:0}.player-stats>div{grid-template-columns:1fr;text-align:center}.player-stats strong{font-size:17px}.stat-icon{display:none}.player-stats>div>span:last-child{font-size:6px;letter-spacing:1px}.game-layout{display:flex;flex-direction:column;gap:18px;align-items:stretch;max-width:470px;margin:auto}.sidebar{display:contents}.side-title,.field-notes,.local-note{display:none}.side-block{padding:0;border:0}.side-block:first-of-type{order:0}.side-block.deck-block{order:2;border:1px solid var(--line);border-radius:9px;padding:17px;margin-top:2px}.battle-panel{order:1;border-radius:10px}.side-block:first-of-type .label-row h3{display:none}.side-block:first-of-type .label-row{display:none}.difficulty{margin:0;padding:3px;border-color:#49614f}.difficulty button{padding:9px 5px;font-size:11px}.side-block>.muted{display:none}.deck-preview{gap:9px;margin-top:13px}.mini-card{aspect-ratio:1;max-height:90px}.mini-card>span:last-child{font-size:9px}.deck-summary{font-size:10px}.scoreboard{height:56px;padding:0 12px}.clock{padding:0 15px}.opponent b{font-size:10px}.clock strong{font-size:20px}.opponent div>span{font-size:6px}.hand-area{padding:11px 10px 8px}.hand-card .card-name{font-size:8px;bottom:6px}.next-card{width:37px;padding-left:7px}.hand-grid{gap:8px}.your-row b{font-size:6px;margin-left:6px}.start-card{padding:22px 15px;width:265px}.start-card h2{font-size:34px}.arena-tag{font-size:7px}.start-card p{font-size:11px}.start-card .gold-btn{padding:12px 20px}.crossed{font-size:32px}.collection{grid-template-columns:repeat(2,1fr);gap:10px}.collection-card svg{height:90px}.modal-head h2{font-size:26px}dialog{padding:20px}.modal-description{font-size:11px}.collection-card b{font-size:11px}.collection-card .description{font-size:9px}.modal-footer .gold-btn,.modal-footer .secondary-btn{font-size:10px;padding:12px}footer{max-width:470px;margin:24px auto 0;padding:20px 4px;font-size:8px}.battle-toast{font-size:11px;padding:10px;left:12px;right:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.in-battle .game-heading{display:none}.in-battle main{padding-top:18px}.in-battle .battle-panel{width:min(100%,calc((100dvh - 355px)*.70588));min-width:300px;margin-inline:auto}.in-battle .rightbar{padding-top:18px}
@media(max-width:650px){.in-battle .topbar,.in-battle .sidebar,.in-battle .side-block,.in-battle footer{display:none}.in-battle main{padding-top:8px}.in-battle .game-layout{display:block}.in-battle .battle-panel{width:min(100%,calc((100dvh - 225px)*.70588));min-width:280px}.in-battle .hand-card .card-name{font-size:7px}.in-battle .your-row b{font-size:6px}}
