@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Italiana&display=swap');
:root{--ink:#203d36;--muted:#7a8780;--paper:#f5f3eb;--line:#dce0d5;--gold:#b6a06a;--jade:#276859}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:13px}button,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:transparent;transition:background .2s,transform .2s}button:hover{background:#e5e9de}button:active{transform:translateY(1px)}button:focus-visible,select:focus-visible{outline:2px solid #319a8b;outline-offset:4px}button:disabled{opacity:.4;cursor:default}header{height:84px;padding:0 38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:3}.brand{font-family:Georgia,serif;font-size:26px;letter-spacing:6px;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:14px}.brandmark{font-size:38px;line-height:1;color:#467163}.brandline{font-family:'DM Sans',sans-serif;font-size:8px;letter-spacing:2.4px;border-left:1px solid #c8cec2;padding-left:18px;margin-left:6px}.location{font-size:9px;letter-spacing:2px;display:flex;align-items:center;gap:9px}.live-dot{display:inline-block;width:5px;height:5px;background:#749b78;border-radius:50%;box-shadow:0 0 0 3px #719b6e15}.textbutton{border:0;font-size:11px;display:flex;gap:20px;align-items:center;padding:12px}.textbutton span{font-size:19px}main{display:grid;grid-template-columns:minmax(0,1fr) 310px;height:calc(100dvh - 84px);min-height:680px}.arena{position:relative;overflow:hidden;background:#c6d4c8}#world{display:block;width:100%;height:100%;touch-action:none}.scene-heading{position:absolute;top:32px;left:36px;z-index:1;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:600}.scene-heading h1{font-family:'Italiana',Georgia,serif;font-weight:400;font-size:clamp(36px,4vw,59px);line-height:1.05;letter-spacing:-1.5px;margin:16px 0 12px}.scene-heading h1 i{font-weight:400}.scene-heading p{font-size:12px;color:#557568}.scene-tools{position:absolute;right:25px;top:26px;display:flex;gap:8px}.scene-tools button{width:38px;height:38px;border:1px solid #647e6a30;background:#f5f5e8aa;backdrop-filter:blur(12px);font-size:20px}.scene-tools button:last-child{font-size:8px;font-weight:700;letter-spacing:1px}.board-caption{position:absolute;bottom:24px;left:30px;right:30px;display:flex;justify-content:space-between;letter-spacing:1.5px;font-size:8px;color:#456356}.turn-card{position:absolute;bottom:65px;left:50%;transform:translateX(-50%);width:300px;padding:18px 23px;background:#f8f6ebed;box-shadow:0 12px 50px #1b32262b;display:flex;align-items:center;gap:16px;border:1px solid #ffffffe0;backdrop-filter:blur(12px)}.turn-orb{width:31px;height:31px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#92c9ad,#326b5d 60%,#224d41);box-shadow:inset 0 0 0 3px #f1e0ac8a}.turn-card .eyebrow{font-size:7px;color:#678172;letter-spacing:1.8px;margin-bottom:5px}.turn-card strong{font-size:13px;font-weight:500}.turn-number{margin-left:auto;color:#a5b0a2;font-family:Georgia,serif;font-size:25px}aside{padding:25px 24px 15px;border-left:1px solid var(--line);overflow-y:auto;display:flex;flex-direction:column;background:#f6f5ee}.panel-heading{display:flex;justify-content:space-between;align-items:center}.small-count{font-size:8px;letter-spacing:1px;color:#8f998c}.creature-tabs{display:flex;gap:5px;margin:20px 0 10px}.creature-tabs button{width:39px;height:39px;font-size:21px;border-color:transparent;border-radius:4px;line-height:1}.creature-tabs button.active{background:#e4e9de;border-color:#afc0ae}.portrait-wrap{height:194px;position:relative;background:radial-gradient(ellipse at center,#e6ecdf,#f6f5ee 75%)}#portrait{width:100%;height:100%;display:block}.portrait-label{position:absolute;top:4px;left:4px;font-size:8px;letter-spacing:2px;color:#7f8f80}.portrait-note{position:absolute;bottom:4px;right:0;font-size:7px;letter-spacing:1.7px;color:#8c9a88;display:flex;align-items:center;gap:6px}.creature-info h2{font-family:'Italiana',Georgia,serif;font-size:31px;font-weight:400;letter-spacing:-.5px;margin:15px 0 10px}.creature-info>p{font-size:11px;line-height:1.85;color:#7b877d;margin:0}.movement{display:flex;gap:14px;align-items:center;margin:19px 0;border-top:1px solid var(--line);padding-top:15px}.movement>span{font-size:30px;color:#71917d;width:28px}.movement .eyebrow{font-size:7px;color:#91a08f}.movement p{margin:5px 0 0;font-size:10px}.primary{width:100%;padding:14px 16px;background:var(--ink);color:#f3eedc;border-color:var(--ink);font-size:11px;display:flex;justify-content:space-between;gap:12px;align-items:center}.primary:hover{background:#386552}.match-controls{margin-top:27px;border-top:1px solid var(--line);padding-top:20px}.mode-dot{height:5px;width:5px;border-radius:50%;background:#86a47c}.select-label{position:absolute;clip:rect(0,0,0,0)}select{margin-top:14px;background:#efefe6;color:var(--ink);border:1px solid #dce1d3;padding:11px 10px;width:100%;font-size:11px;border-radius:2px}.history{height:78px;overflow:auto;margin:12px 0;font-size:11px;color:#768674;line-height:1.9}.history>p{font-size:10px;margin:15px 0}.history-row{display:grid;grid-template-columns:25px 1fr 1fr}.history-row span:first-child{color:#acb4a5}.button-row{display:flex;gap:9px}.button-row button{flex:1;padding:10px 6px;font-size:10px}footer{font-size:6.7px;letter-spacing:1.65px;text-align:center;color:#98a48f;margin-top:auto;padding-top:25px}.loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;background:#d3decf;z-index:5;transition:opacity .8s}.loading.hidden{opacity:0;pointer-events:none}.loading p{font-size:12px;letter-spacing:1px}dialog{border:1px solid #d6ddcd;background:#f5f3e9;color:var(--ink);width:min(520px,90vw);padding:38px;box-shadow:0 30px 130px #12352b60}dialog::backdrop{background:#122e2980;backdrop-filter:blur(8px)}dialog h2{font-family:Georgia,serif;font-weight:400;font-size:32px;line-height:1.2}dialog p{font-size:13px;line-height:1.8;color:#687c69}.close{position:absolute;right:15px;top:12px;border:0;font-size:24px}.legend{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-block:1px solid var(--line);padding:18px 0;font-size:12px}.muted{font-size:11px!important}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);background:#203d36;color:#efe9cf;padding:13px 23px;font-size:12px;z-index:50;opacity:0;pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}#promotion-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}#promotion-options button{padding:17px}.hidden{display:none}@media(min-width:1500px){main{grid-template-columns:minmax(0,1fr) 350px}aside{padding-inline:32px}.portrait-wrap{height:230px}}@media(max-width:900px){header{padding:0 20px;height:68px}.brandline,.location{display:none}main{height:calc(100dvh - 68px);grid-template-columns:minmax(0,1fr) 260px;min-height:640px}aside{padding:20px 16px}.scene-heading{left:23px;top:28px}.scene-heading h1{font-size:38px}.scene-heading .eyebrow{font-size:7px}.scene-tools{top:auto;bottom:125px;right:15px;flex-direction:column}.board-caption span:last-child{display:none}.creature-tabs{gap:2px}.creature-tabs button{width:36px}.portrait-wrap{height:170px}.turn-card{width:250px}.creature-info h2{font-size:28px}}@media(max-width:650px){main{display:block;height:auto;min-height:0}.arena{height:73dvh;min-height:500px}.scene-heading h1{font-size:38px}.scene-heading{top:24px}.scene-heading p{font-size:10px}.turn-card{bottom:48px}.board-caption{bottom:17px}aside{border-left:0;padding:22px;display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px 20px}.panel-heading,.creature-tabs,.match-controls,footer{grid-column:1/-1}.portrait-wrap{height:160px;margin-top:12px}.portrait-note{display:none}.creature-info h2{font-size:27px}.creature-info>p{font-size:10px}.movement{margin:10px 0;padding-top:9px}.movement p{font-size:9px}.creature-tabs{justify-content:space-between;margin:4px 0}.creature-tabs button{width:42px}.match-controls{margin-top:14px;padding-top:18px}.history{height:55px}.brand{font-size:23px}.brandmark{font-size:31px}.textbutton{font-size:10px}.portrait-label{font-size:7px}.primary{padding:12px 10px;font-size:10px}footer{padding-top:12px}}

.home-link{font:500 11px 'DM Sans',Arial,sans-serif;color:var(--ink);text-decoration:none;display:flex;gap:8px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:4px}.home-link:hover{background:#e5e9de}.home-link:focus-visible{outline:2px solid #319a8b;outline-offset:4px}.noscript{padding:20px;text-align:center}@media(max-width:650px){header{padding-inline:14px;gap:8px}.brand{font-size:20px;letter-spacing:3px;gap:7px}.home-link{font-size:9px;padding:10px 7px}.home-link span{max-width:70px;line-height:1.4}.textbutton{padding:8px 3px;gap:5px}.brandline{display:none}}

/* Woodland sanctuary: keep the board quiet, give every control clear contrast. */
:root{--ink:#ecedda;--muted:#b7c4af;--paper:#172c23;--line:#b7c19b33;--gold:#d3b879;--jade:#9dbb8c;color-scheme:dark}
body{background:#14271f;color:var(--ink)}header{height:72px;background:linear-gradient(110deg,#182e24f5,#20392df2);border-bottom:1px solid #cfb87933;padding-inline:30px;box-shadow:0 4px 30px #081c181a}.brand{font-size:25px;color:#f1e9d1}.brandmark{color:#bdc99d}.brandline{color:#adbfaa;border-color:#b5bd9b44}.home-link{color:#d2d9c3;border-color:#b8c59f33;border-radius:7px;background:#d5d8a508}.home-link:hover,.textbutton:hover{background:#bed19d16}.textbutton{color:#dce1c9}.textbutton span{color:#d4bd84}main{height:calc(100dvh - 72px);grid-template-columns:minmax(0,1fr) 320px;min-height:700px}.arena{background:#647b60}.arena:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#10281c88,transparent 26%,transparent 77%,#10281c66);z-index:0}.scene-heading{top:28px;left:30px;z-index:1;color:#fff6df;text-shadow:0 2px 15px #112b20aa}.scene-heading .eyebrow{font-size:8px;letter-spacing:3px;color:#e4d3a9}.scene-heading h1{font-size:clamp(31px,3.1vw,48px);line-height:1.08;margin:13px 0 9px}.scene-heading p{color:#e4e8d5;font-size:11px}.scene-tools{z-index:2;top:23px;right:23px}.scene-tools button{border:1px solid #d8d3a65c;background:#1a3229d9;color:#f1e6c4;border-radius:9px;box-shadow:0 5px 18px #12271b22;width:42px;height:42px}.scene-tools button:hover{background:#3c5940}.board-caption{z-index:1;color:#e0e6d1;font-size:8px;text-shadow:0 1px 6px #102e22}.turn-card{z-index:2;background:#193328e8;color:#f1eed8;border:1px solid #c9c99a4d;border-radius:14px;box-shadow:0 10px 40px #0b271c55;bottom:58px;padding:16px 20px}.turn-card .eyebrow{color:#c3d1b4}.turn-card strong{font-size:13px}.turn-number{color:#b7bf9b}.turn-orb{box-shadow:inset 0 0 0 2px #ddc583a3,0 0 15px #8bb88c33}aside{background:linear-gradient(150deg,#243b2ff5,#152b24f7);border-left:1px solid #c3b7803d;padding:25px 24px 20px;scrollbar-width:thin;scrollbar-color:#6f8160 #1a3027}.panel-heading .eyebrow{color:#d2d8bd;font-size:8px;letter-spacing:2.2px}.small-count{color:#aabca0}.creature-tabs{padding:5px;background:#10291d66;border:1px solid #becb9d22;border-radius:12px;gap:3px;margin-top:18px}.creature-tabs button{flex:1;width:auto;height:37px;color:#c8d3b6}.creature-tabs button.active{background:#a6bc8050;border-color:#c2be8166;color:#f8e4b1;border-radius:8px}.creature-tabs button:hover{background:#a5b97e25}.portrait-wrap{background:radial-gradient(ellipse at 50% 64%,#78846a99,#324b3699 45%,#233a2d00 75%);border-bottom:1px solid #c5c99722;border-radius:18px}.portrait-label{color:#d5cba6;top:10px;left:10px}.portrait-note{color:#bccbac;right:10px}.live-dot{background:#c2d894;box-shadow:0 0 0 3px #c7dda415}.creature-info h2{color:#f3e9cc;font-size:33px;margin-top:17px}.creature-info>p{color:#c0ccb5;line-height:1.85}.movement>span{color:#c7bf89}.movement .eyebrow{color:#b6c1a7}.movement p{color:#ebead3;font-size:11px}.primary{background:linear-gradient(120deg,#c0a269,#dbbf85);border:1px solid #dbc894;color:#203326;font-weight:700;border-radius:8px;padding:14px}.primary:hover{background:#e0c58e;color:#142d20}.match-controls{background:#10291e40;border:1px solid #c7ca9c2b;border-radius:13px;padding:17px 14px;margin-top:23px}.mode-dot{background:#c7cf9a}.history{color:#d2dac4}.history-row span:first-child{color:#9fb293}.history>p{color:#acbea4}select{background:#193226;color:#e5e9d6;border:1px solid #a2b88966;border-radius:7px;min-height:43px}select option{background:#193226;color:#eef0dd}.button-row button{background:#b5c78c0d;color:#dce0c8;border-color:#bbca9f40;border-radius:7px;min-height:40px}.button-row button:hover{background:#bcc99424}.button-row .primary{background:#c7ad76;color:#203326}footer{color:#aabd9d;font-size:7px;letter-spacing:1.4px}.loading{background:radial-gradient(ellipse at center,#3d5740,#192f24);color:#e5e9d2}.loading .brandmark{color:#d7c58b}.loading p{color:#cbd3b6}dialog{background:linear-gradient(135deg,#294232f5,#172f24fa);color:#eee8d0;border:1px solid #c7bb8555;border-radius:18px;backdrop-filter:blur(16px)}dialog h2{color:#f4e7c8}dialog p{color:#c4d0b9}dialog .eyebrow{color:#d1c18c}dialog::backdrop{background:#071c17a3;backdrop-filter:blur(6px)}.legend{color:#dee4c9}.close{color:#d9dec6;border-radius:7px}.close:hover{background:#bdc99522}.toast{background:#19382cfa;border:1px solid #b6bb7c66;color:#f0e8cb;border-radius:11px;max-width:calc(100vw - 24px);width:max-content;text-align:center}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #ecd48d;outline-offset:3px}button:disabled{opacity:.48}
@media(min-width:1500px){main{grid-template-columns:minmax(0,1fr) 350px}.scene-heading{top:35px;left:40px}aside{padding-inline:28px}}
@media(max-width:1100px) and (min-width:901px){main{grid-template-columns:minmax(0,1fr) 285px}aside{padding-inline:18px}.scene-heading h1{font-size:34px}.scene-tools{top:auto;bottom:142px;right:16px;flex-direction:column}}
@media(max-width:900px){header{height:66px;padding-inline:20px}main{display:block;height:auto;min-height:0}.arena{height:72svh;min-height:530px;max-height:830px}.scene-heading{top:24px;left:24px}.scene-heading h1{font-size:37px}.scene-heading p{font-size:11px}.scene-tools{top:23px;bottom:auto;right:20px;flex-direction:row}.turn-card{bottom:50px}.board-caption{bottom:19px}aside{border-left:0;border-top:1px solid #c7bb8544;display:grid;grid-template-columns:180px minmax(0,1fr);padding:25px clamp(20px,6vw,55px);gap:8px 28px}.panel-heading,.creature-tabs,.match-controls,footer{grid-column:1/-1}.creature-tabs{gap:12px;margin:8px 0;padding:6px}.creature-tabs button{height:42px}.portrait-wrap{height:200px;margin-top:10px}.creature-info h2{margin-top:19px}.match-controls{margin-top:15px}.history{height:84px}.portrait-note{display:none}.board-caption span:last-child{display:block}}
@media(max-width:650px){header{height:64px;padding-inline:13px;gap:7px}.brand{font-size:19px;letter-spacing:3px}.brandmark{font-size:29px}.brandline{display:none}.home-link{font-size:9px;padding:8px;min-height:38px}.textbutton{font-size:10px;padding:8px 3px;gap:4px}.arena{height:70svh;min-height:500px;max-height:650px}.scene-heading{top:19px;left:18px}.scene-heading h1{font-size:30px;letter-spacing:-.6px;margin:10px 0 7px}.scene-heading .eyebrow{font-size:7px;letter-spacing:2px}.scene-heading p{font-size:10px;max-width:210px}.scene-tools{top:19px;bottom:auto;right:11px;gap:7px;flex-direction:column}.scene-tools button{width:38px;height:38px;border-radius:8px}.turn-card{width:min(280px,calc(100% - 54px));bottom:43px;padding:12px 16px;border-radius:12px}.board-caption{left:18px;right:18px;bottom:16px;font-size:7px;letter-spacing:1px}.board-caption span:last-child{display:none}aside{grid-template-columns:112px minmax(0,1fr);gap:8px 17px;padding:22px 18px}.creature-tabs{gap:3px}.creature-tabs button{height:39px}.portrait-wrap{height:165px}.creature-info h2{font-size:27px}.creature-info>p{font-size:10px}.movement p{font-size:10px}.movement{margin:11px 0;padding-top:10px}.primary{font-size:10px;padding:12px 10px;min-height:43px}.portrait-label{font-size:7px;left:5px}.match-controls{padding:17px}.button-row button{min-height:43px;font-size:11px}footer{padding-top:15px}.toast{font-size:11px;bottom:12px}dialog{padding:28px 23px}.legend{font-size:11px;gap:10px}.home-link span{max-width:65px}}
@media(max-width:360px){.brand{font-size:17px;gap:4px}.brandmark{font-size:24px}.textbutton span{display:none}.home-link{padding:7px;font-size:8px}.scene-heading h1{font-size:27px}aside{grid-template-columns:92px minmax(0,1fr);gap:8px 12px}.creature-info h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Royal Waterfall: a separate illustrated view over the shared match. */
#scene-mode{position:absolute;z-index:4;left:30px;top:174px;width:235px;margin:0;background:#14291fe8;border-color:#c8ae6a88;color:#f3e7cb;box-shadow:0 5px 25px #0003}
#royal-world{position:absolute;inset:0;background-size:cover;background-position:center 30%;overflow:hidden;z-index:1}
#royal-world[hidden]{display:none}#royal-world>svg{position:absolute;inset:70px 0 0;width:100%;height:calc(100% - 135px);filter:drop-shadow(0 18px 16px #0007)}
.royal-mode .arena{min-height:800px}.royal-mode .arena:after{z-index:1;background:linear-gradient(#07171266,transparent 24%,transparent 85%,#07171277)}
.royal-mode .scene-heading{z-index:2;top:24px}.royal-mode .scene-heading h1{font-size:clamp(25px,3vw,39px);margin:10px 0}.royal-mode .scene-heading p{font-size:11px}.royal-mode #scene-mode{top:129px}
.royal-mode #world{visibility:hidden}.royal-mode .scene-tools{z-index:3}.royal-mode .turn-card{bottom:37px;background:#101e20ed;border-color:#b99d6755}.royal-mode .board-caption{bottom:13px}.royal-mode .turn-orb{filter:none!important}
.royal-mode aside{background:linear-gradient(140deg,#202d2c,#111d20)}.royal-mode header{background:#132321}.royal-mode #portrait{visibility:hidden}#royal-portrait{display:none;position:absolute;inset:0;pointer-events:none}.royal-mode #royal-portrait{display:block}#royal-portrait svg{width:100%;height:100%}.royal-mode .portrait-label{z-index:2}.royal-mode .portrait-note{z-index:2}.royal-square{cursor:pointer;outline:none}.royal-square:hover{fill:#e7c878;fill-opacity:.17}.royal-square:focus-visible{stroke:#fff3b5;stroke-width:6;fill:#f7d477;fill-opacity:.22}
.royal-mist{position:absolute;left:15%;right:15%;top:17%;height:15%;background:radial-gradient(ellipse,#e3eee633,transparent 65%);filter:blur(15px);animation:royal-drift 13s ease-in-out infinite alternate;pointer-events:none}@keyframes royal-drift{to{transform:translateX(25px);opacity:.45}}
@media(max-width:1100px) and (min-width:901px){.royal-mode .scene-tools{top:22px;bottom:auto;right:14px;flex-direction:column}.royal-mode .scene-heading h1{font-size:29px}}
@media(max-width:900px){.royal-mode .arena{height:850px;min-height:0;max-height:none}.royal-mode #royal-world>svg{top:70px;height:calc(100% - 105px)}#scene-mode{left:24px;top:174px}.royal-mode #scene-mode{top:127px}.royal-mode .scene-tools{top:22px;right:18px;flex-direction:column}}
@media(max-width:650px){#scene-mode{left:18px;top:154px;width:215px;font-size:10px}.royal-mode .arena{height:calc(100vw + 270px);min-height:590px;max-height:850px}.royal-mode .scene-heading{left:18px;top:20px}.royal-mode .scene-heading h1{font-size:26px;max-width:260px}.royal-mode .scene-heading p{font-size:10px;max-width:240px}.royal-mode #scene-mode{top:126px}.royal-mode #royal-world{background-position:50% 20%}.royal-mode #royal-world>svg{top:140px;height:calc(100% - 205px)}.royal-mode .turn-card{bottom:33px}.royal-mode .scene-tools{right:10px;top:20px}.royal-mode .board-caption{font-size:7px}.royal-mode #royal-portrait{inset:15px -12px 0}.royal-mist{top:24%}}
@media(prefers-reduced-motion:reduce){.royal-mist{animation:none}}

.royal-mode.eco-quality .royal-mist{display:none}.royal-mode.eco-quality #royal-world>svg{filter:none}

/* Royal Wilds: the scene takes center stage; match controls remain one tap away. */
#match-panel-toggle,#close-match-panel,#view-angle{display:none}
.cinematic-mode{background:#101b1c}.cinematic-mode header{background:linear-gradient(90deg,#101e20,#192b28);border-color:#b7975d40;height:68px}
.cinematic-mode main{display:block;height:calc(100dvh - 68px);min-height:620px}.cinematic-mode .arena{height:100%;min-height:620px;max-height:none;width:100%;background:#445a55}
.cinematic-mode .scene-heading{top:26px;left:32px}.cinematic-mode .scene-heading h1{font-size:clamp(25px,3vw,40px);margin:12px 0 8px}.cinematic-mode .scene-heading .eyebrow{color:#ebd19b;letter-spacing:3.2px}.cinematic-mode .scene-heading p{color:#d6e1d5}.cinematic-mode #scene-mode{top:139px;left:32px;width:255px;background:#142722e8;border-color:#ccb07466}
.cinematic-mode .arena:after{background:linear-gradient(#0a191d66,transparent 25%,transparent 75%,#0a191d88);z-index:0}.cinematic-mode .turn-card{bottom:35px;border-radius:12px;background:#101f24e8;border-color:#bfa37166;box-shadow:0 12px 40px #0005}.cinematic-mode .turn-orb{filter:none!important}.cinematic-mode .board-caption{bottom:13px;left:26px;right:26px;color:#dce4d1}.cinematic-mode .scene-tools{top:25px;right:26px;bottom:auto;flex-direction:row}.cinematic-mode .scene-tools button{background:#102521df;border-color:#c6ac7644}.cinematic-mode #view-angle{display:block;width:64px;font-size:9px;letter-spacing:1px}
.cinematic-mode #match-panel-toggle{display:block;border:1px solid #b89a5a66;border-radius:7px;padding:10px 14px;color:#e7d1a0;background:#d5b8770a}.cinematic-mode #match-panel-toggle[aria-expanded=true]{background:#d5b87726}.cinematic-mode #close-match-panel{display:block;grid-column:1/-1;align-self:flex-end;padding:9px 12px;border-radius:6px;font-size:11px;margin-bottom:18px}
.cinematic-mode aside{display:none;position:fixed;z-index:15;right:22px;top:85px;bottom:20px;width:320px;max-height:calc(100dvh - 105px);padding:20px 23px;overflow-y:auto;border:1px solid #bfa77266;border-radius:16px;background:linear-gradient(145deg,#213a32f7,#101e23fa);box-shadow:0 18px 75px #0008;backdrop-filter:blur(20px)}.cinematic-mode.panel-open aside{display:flex}.cinematic-mode aside .portrait-wrap{flex:none;height:185px}.cinematic-mode aside .history{flex:none;height:90px}.cinematic-mode aside .panel-heading{flex-shrink:0}.cinematic-mode aside .creature-tabs{flex-shrink:0;gap:3px}.cinematic-mode aside .creature-tabs button{width:36px}.cinematic-mode aside .match-controls{flex:none}.cinematic-mode aside .creature-info h2{margin:10px 0}.cinematic-mode aside footer{font-size:7px}.cinematic-mode .portrait-note{display:flex}.cinematic-mode .brandmark{color:#d2b574}.cinematic-mode .scene-tools button:nth-child(3){font-size:8px;font-weight:700;letter-spacing:1px}
@media(max-width:900px){.cinematic-mode main{height:calc(100svh - 68px);min-height:650px}.cinematic-mode .arena{min-height:650px}.cinematic-mode .scene-heading{left:22px;top:25px}.cinematic-mode #scene-mode{left:22px;top:133px}.cinematic-mode .scene-tools{top:25px;right:18px;flex-direction:column}.cinematic-mode #view-angle{width:42px;font-size:7px}.cinematic-mode .brandline{display:none}.cinematic-mode aside{display:none;gap:0}.cinematic-mode aside .portrait-wrap{margin-top:0}.cinematic-mode .board-caption span:last-child{display:none}}
@media(max-width:650px){.cinematic-mode header{padding:0 12px;gap:6px;height:64px}.cinematic-mode header .brand{font-size:16px;letter-spacing:2px}.cinematic-mode header .brandmark{font-size:24px}.cinematic-mode .home-link{padding:8px 5px;font-size:8px}.cinematic-mode #match-panel-toggle{font-size:9px;padding:8px;max-width:72px;line-height:1.3}.cinematic-mode header #help{font-size:9px}.cinematic-mode header #help span{display:none}.cinematic-mode main{height:calc(100svh - 64px);min-height:620px}.cinematic-mode .arena{min-height:620px}.cinematic-mode .scene-heading{left:18px;top:23px}.cinematic-mode .scene-heading h1{font-size:26px;max-width:260px}.cinematic-mode .scene-heading .eyebrow{font-size:7px}.cinematic-mode .scene-heading p{font-size:10px;max-width:250px}.cinematic-mode #scene-mode{top:128px;left:18px;width:225px}.cinematic-mode .scene-tools{top:23px;right:10px;gap:7px}.cinematic-mode .scene-tools button{width:36px;height:36px}.cinematic-mode #view-angle{width:36px;font-size:6px}.cinematic-mode .turn-card{bottom:35px}.cinematic-mode aside{right:12px;left:12px;top:78px;bottom:14px;width:auto;max-height:calc(100svh - 92px);padding:18px 22px}.cinematic-mode .board-caption{font-size:7px;left:18px}.cinematic-mode aside .portrait-wrap{height:175px}.cinematic-mode .creature-info>p{font-size:11px}.cinematic-mode .movement p{font-size:11px}}