
/* Theme and shared controls */
:root{--bg:#101329;--panel:#1b2040;--border:#60678e;--text:#f1f4ff;--muted:#c1cbe1;--p1:#66eddf;--p2:#ff8fbc;--gold:#ffe183;--danger:#ff7086;--radius:10px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Arial,sans-serif}button,select,input{font:inherit}button,select{font-weight:700;font-size:12px;color:var(--text);background:#252b50;border:1px solid var(--border);padding:11px 15px;border-radius:6px;cursor:pointer}button:hover{border-color:var(--p1);background:#343d6a}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.6}[hidden],button[hidden]{display:none!important}p{font-size:13px;line-height:1.6;color:var(--muted);margin:8px 0}h1{font-size:clamp(30px,5vw,65px);font-style:italic;line-height:1.05;margin:12px 0;color:var(--text)}h2{font-size:23px;margin:0 0 14px}h3{font-size:15px}small{line-height:1.5}canvas{display:block;object-fit:contain}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--gold)}.hint{font-size:12px}.active{border-color:var(--p1)!important;background:#384477!important;box-shadow:inset 0 -3px var(--p1)}.fight-button{font-size:clamp(20px,2vw,30px);padding:15px 28px;font-style:italic;color:#fff9ec;background:linear-gradient(120deg,#6f4ec6,#a83c81);border:2px solid var(--gold)}.fight-button:hover{background:linear-gradient(120deg,#835edc,#c34b99)}.section-title,.slide-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.section-title span{font-size:10px;color:var(--muted)}.slide-actions{margin-top:26px;padding-top:22px;border-top:1px solid var(--border)}kbd{display:inline-block;min-width:24px;margin:0 4px;padding:4px;border:1px solid var(--border);border-radius:4px;background:#282e50;text-align:center;font-size:12px}
/* Arena: fight information above, secondary information below */
.arcade-nav{position:fixed;inset:0 0 auto;height:46px;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 18px;background:#11172cf2;border-bottom:1px solid #6a79a455}.brand{font-size:25px;font-weight:900;font-style:italic;color:var(--p1);text-decoration:none;white-space:nowrap}.brand span{font-size:10px;letter-spacing:2px;margin-left:10px;color:var(--gold)}.arcade-nav>div{display:flex;gap:5px}.arcade-nav button{font-size:10px;padding:8px}.arcade-nav:has(~.guide:not([hidden])){z-index:25}main{width:100vw;height:100dvh;position:relative}.arena{position:absolute;inset:0;overflow:hidden;background:#10182c}#game{width:100%;height:100%;background:#10182c}#game:focus-visible{outline:2px solid var(--p1);outline-offset:-2px}.hud{position:absolute;top:65px;left:4%;right:4%;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 100px minmax(0,1fr);gap:22px;text-shadow:1px 2px #000}.names{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:800;min-height:28px;font-size:16px}.names strong{font-size:11px;color:var(--p1)}.hud>div:last-child .names strong{color:var(--p2)}.names strong span{color:var(--gold);font-size:17px}.track{position:relative;height:25px;border:2px solid var(--p1);background:#55233b;overflow:hidden;transform:skew(-8deg)}.hud>div:last-child .track{border-color:var(--p2);transform:skew(8deg)}.track div{height:100%;position:relative;z-index:1;transition:width .1s}.hud>div:last-child .track div{margin-left:auto}.damage-trail{display:block;position:absolute;inset:0 auto 0 0;background:#fff1b0;width:100%}.hud>div:last-child .damage-trail{left:auto;right:0}.resources{margin-top:7px}.resources>div{height:5px;background:#232942}.resources i{display:block;width:100%;height:100%;background:#8dccff}.meterlabel{font-size:10px;display:block;margin-top:5px}.hud small{display:block;margin-top:4px;color:var(--gold);font-weight:700;font-size:12px}.clock{text-align:center}.clock b{display:block;font-size:58px;font-style:italic;color:var(--gold);line-height:1}.clock span{font-size:10px}#announcement{position:absolute;top:37%;left:0;right:0;text-align:center;font-size:clamp(28px,6vw,78px);font-weight:900;font-style:italic;color:var(--gold);text-shadow:3px 4px #522b70;pointer-events:none;z-index:2}.winner-banner{position:absolute;top:26%;left:5%;width:90%;z-index:3;text-align:center;font-size:clamp(23px,4vw,55px);font-weight:900;font-style:italic;color:var(--gold);text-shadow:3px 4px #4e2e75;pointer-events:none}.arena-footer{position:absolute;bottom:0;left:0;right:0;min-height:42px;padding:8px 18px;display:flex;align-items:center;gap:16px;background:#0c1224e8;z-index:3;font-size:10px}.arena-footer label{margin-left:auto}.arena-footer button{font-size:11px;padding:7px 12px}.level-badge{color:var(--gold);font-weight:700}.match-banner{position:absolute;left:18px;bottom:49px;display:flex;gap:15px;align-items:center;z-index:2;text-shadow:1px 2px #000}.match-banner span{font-size:10px}.match-banner strong{font-size:15px}.crowd-bets{position:absolute;right:18px;bottom:47px;margin:0;font-size:10px;z-index:2;text-shadow:1px 2px #000}.movement-help{position:absolute;top:166px;left:4%;right:4%;text-align:center;font-size:11px;pointer-events:none;text-shadow:1px 2px #000}.coach{position:absolute;left:20%;right:20%;bottom:78px;text-align:center;font-size:12px;color:#f5e0b1;text-shadow:1px 2px #000;pointer-events:none}#build-label{position:fixed;top:48px;right:8px;z-index:12;font-size:9px;color:var(--muted);pointer-events:none}
@media(min-width:1100px){#characters{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
/* On-screen actions */
.touch-controls{position:absolute;bottom:106px;left:16px;right:16px;display:flex;justify-content:space-between;gap:16px;z-index:3}.touch-controls>div{display:flex;gap:5px;flex-wrap:wrap;max-width:44%}.touch-controls button{touch-action:none;user-select:none;min-width:44px;min-height:44px;font-size:11px;background:#151f3bdb}.touch-controls>div:last-child{padding-right:155px;max-width:58%;justify-content:flex-end}.touch-controls button.pressed,.roll-control.pressed{background:#607a91;border-color:var(--gold)}.roll-control{position:absolute;right:16px;bottom:106px;z-index:5;min-width:145px;min-height:44px;font-weight:900;font-size:12px;touch-action:none;user-select:none;background:#1f5371;border-color:var(--p1);color:#d8fff9}.roll-feedback{position:absolute;right:18px;bottom:153px;z-index:3;font-size:10px;max-width:240px;text-align:right;pointer-events:none;color:var(--p1)}html[data-controls=hide] .touch-controls{display:none}html[data-controls=hide] .roll-control{bottom:90px}html[data-controls=hide] .roll-feedback{bottom:136px}
/* Arena selection uses the same drawings as gameplay. */
.arena-picker{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}.arena-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.arena-card{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:8px;text-align:left;overflow:hidden;background:#172638}.arena-card canvas{width:100%;height:auto;aspect-ratio:2/1;border-radius:3px}.arena-card strong{font-size:16px;padding:0 3px}.arena-card small{font-size:11px;color:var(--muted);padding:0 3px 4px}#arena-description{min-height:22px;color:var(--gold)}#versus-arena{width:min(100%,440px);height:auto;aspect-ratio:2/1;margin:20px auto 8px;border:1px solid var(--border);border-radius:8px}
@media(max-width:900px){.arena-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.arena-card strong{font-size:14px}}
/* Menus and fighter selection */
.arcade-menu{position:fixed;inset:0;z-index:10;overflow:auto;background:linear-gradient(110deg,#182a3df5,#263f50ed),repeating-linear-gradient(90deg,#314c5d 0 120px,#203446 120px 130px)}.arcade-slide{min-height:100dvh;max-width:1500px;margin:auto;padding:72px 5vw 35px;animation:slide-arrive .22s ease-out}.slide-progress{position:fixed;top:0;left:0;right:0;z-index:2;background:#10182aed;padding:15px 5vw;color:var(--gold);font-size:11px;letter-spacing:1px}.title-slide{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:15px}.title-slide h1{font-size:clamp(40px,11vw,150px);line-height:.85;color:var(--p1);text-shadow:0 5px #433771}.title-slide h1 span{display:block;font-size:clamp(12px,1.6vw,22px);line-height:1.5;letter-spacing:.12em;margin-top:24px;color:var(--gold)}.title-slide>p{font-size:15px}.slide-heading{border-bottom:1px solid var(--border);padding-bottom:18px}.cpu-picker{padding:22px 0}.cpu-levels{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:16px 0}.cpu-levels button{text-align:left;padding:15px}.cpu-levels b{display:block;font-size:34px;color:var(--gold)}.cpu-levels span{display:block;font-size:12px;margin-top:7px}.settings{display:flex;align-items:flex-end;flex-wrap:wrap;gap:18px;padding:20px;background:#10192cbf;border:1px solid var(--border);border-radius:var(--radius)}.mode{display:flex;flex-direction:column;gap:9px;font-size:11px}.mode select{min-width:170px}.mode input[type=checkbox]{width:22px;height:22px;align-self:flex-start}.setup-notice{flex-basis:100%;font-size:12px}.bottom{margin-top:22px}.players{display:flex;gap:10px;margin:16px 0}.selection-heading{color:var(--gold)}#characters,#styles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}#characters{grid-template-columns:repeat(3,minmax(0,1fr))}#characters button,#styles button{display:flex;flex-direction:column;align-items:stretch;gap:7px;text-align:left;padding:14px;background:#17223bcc}#characters b{font-size:25px;color:var(--text)}#styles b{font-size:19px}#characters em,#styles em{font-style:normal;color:var(--gold);font-size:11px}#characters small,#styles small{font-size:12px;color:var(--muted)}.character-stats{font-size:11px;margin-top:auto;line-height:1.7}.selection-portrait{width:100%;height:145px;background:radial-gradient(ellipse at bottom,#4464a34d,transparent)}#slide-fighters aside{margin-top:26px;padding:18px;border:1px solid var(--border);border-radius:var(--radius)}.controls{display:grid;grid-template-columns:1fr 1fr;gap:20px}.controls p{font-size:12px}.versus-grid{display:grid;grid-template-columns:1fr 90px 1fr;align-items:center;max-width:1000px;margin:auto}.versus-fighter{text-align:center;border-bottom:2px solid var(--p1);background:linear-gradient(0deg,#12223ad9,transparent)}.versus-fighter:last-child{border-color:var(--p2)}.versus-fighter canvas{width:100%;height:min(46vh,390px)}.versus-fighter h2{font-size:42px;margin:8px}.versus-fighter p{font-size:13px}.versus-mark{text-align:center;font-size:64px;font-style:italic;color:var(--gold)}.versus-rules{text-align:center;font-size:12px;margin:24px auto;max-width:1000px}
/* Career and market */
.career-summary,.market-topline{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:22px;margin:22px 0;background:#25355f;border:1px solid #7b92c4;border-radius:var(--radius)}.career-summary strong{font-size:23px}.career-summary b,.market-topline strong{font-size:28px;color:var(--gold)}.career-summary span,.market-topline span{font-size:13px}.career-columns{display:grid;grid-template-columns:1fr 1.5fr;gap:25px}.account-box,.shop-box{background:#141d36db;padding:22px;border:1px solid var(--border);border-radius:var(--radius)}.account-box label{display:flex;flex-direction:column;gap:8px;font-size:12px;margin-top:16px}.account-box input,.account-box select{width:100%;padding:12px;background:#10162a;border:1px solid var(--border);color:var(--text);border-radius:5px}.account-box .password-toggle{flex-direction:row;align-items:center}.password-toggle input{width:20px;height:20px}.account-actions,.backup-actions,.shop-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}.shop-tabs{align-items:center}.shop-balance{font-size:23px;color:var(--gold);margin-right:auto}#account-message,#shop-message,#market-feedback{font-size:13px;line-height:1.6;color:var(--gold);min-height:24px}.save-status{padding:12px;background:#1e4b4c66;border-left:3px solid var(--p1);font-size:12px;color:#d1fff4}.save-help{margin:15px 0;font-size:12px;line-height:1.6}.save-help summary{cursor:pointer;color:var(--p1)}#upgrade-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}.upgrade-card{display:flex;flex-direction:column;gap:10px;align-items:flex-start;padding:18px;background:#25314b;text-align:left;min-width:0}.upgrade-card b{font-size:20px}.upgrade-card small{font-size:12px;font-weight:400;color:var(--muted)}.upgrade-card span{font-size:12px}.upgrade-card em{font-size:14px;color:var(--gold);font-style:normal;margin-top:auto}.economy-note{border-left:3px solid var(--gold);padding:12px;margin-top:24px}.market-filter{display:inline-flex;align-items:center;gap:10px;margin:10px 20px 10px 0;font-size:12px}.market-filter select{min-width:200px}.market-achievements,.market-rules{font-size:12px;line-height:1.8}#pinned-goal{padding:13px;border-left:3px solid var(--gold);background:#55462a33;color:#ffedba}.outfit-preview{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:20px;margin:20px 0;background:#141e36;border:1px solid var(--border);border-radius:var(--radius)}#outfit-preview{width:100%;height:260px;background:radial-gradient(ellipse,#664f8a44,transparent)}#preview-requirements label{display:block;font-size:12px;margin:10px 0}#preview-requirements progress{display:block;width:min(100%,400px);height:9px;margin-top:6px;accent-color:var(--p1)}#preview-buy,#preview-pin{margin:8px 8px 0 0}.cosmetic-screen #market-panel{display:block}.cosmetic-screen #market-panel>h2,.cosmetic-screen #market-panel>p{display:none}#cosmetic-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:20px}.market-miniature{width:100%;height:155px;background:radial-gradient(ellipse at bottom,#45578866,transparent)}.rarity-label{font-size:10px!important;letter-spacing:1px}.rarity-common{border-color:#8abb9e}.rarity-rare{border-color:#70b7f0}.rarity-epic{border-color:#bb95f0}.rarity-legendary{border-color:var(--gold)}.rarity-mythic{border-color:#ff9cb3;background:linear-gradient(130deg,#34334e,#472740)}.unlock-requirements{color:#ffdfb2!important;line-height:1.7}.market-view{grid-template-columns:1fr}.market-view .account-box{display:none}
/* Results, help and modal focus surfaces */
.result-panel{position:fixed;inset:0;z-index:9;overflow:auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:30px 20px;background:linear-gradient(130deg,#182a3d,#284953)}.result-panel h1{font-size:clamp(30px,5vw,64px);color:var(--gold);margin:8px}.result-panel p{font-size:15px;margin:4px}.result-panel.celebration-pending{opacity:0;pointer-events:none}#victory-canvas{width:min(600px,90vw);height:190px;flex-shrink:0}.result-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.reward-details{text-align:left;max-width:760px;padding:12px;background:#10172b88;border-radius:8px;font-size:12px}.reward-details summary{cursor:pointer;color:var(--p1)}#result-breakdown{font-size:12px;line-height:1.8;padding-left:20px}.resume-overlay{position:absolute;top:27%;left:50%;transform:translateX(-50%);width:min(520px,92%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:14px;background:#141d36f5;border:2px solid var(--p1);padding:25px;border-radius:var(--radius);box-shadow:0 12px 60px #000a}.resume-overlay strong{font-size:32px;color:var(--gold)}.pause-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.guide,.utility-dialog{position:fixed;z-index:30;inset:8% max(3%,calc((100vw - 1100px)/2));overflow:auto;background:#17213afc;border:2px solid #839bc3;border-radius:var(--radius);padding:25px;box-shadow:0 0 0 100vmax #060a18c9}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.guide-grid h3{color:var(--gold)}#guide-close,#settings-close{float:right;margin-bottom:15px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;clear:both;margin:24px 0}.settings-grid label{display:flex;flex-direction:column;gap:8px;font-size:13px}.settings-grid input[type=range]{width:100%;accent-color:var(--p1)}.settings-grid input[type=checkbox]{width:22px;height:22px}.binding-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.binding-buttons button{font-size:12px}.confirm-dialog{z-index:40;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);width:min(520px,92vw)}.confirm-dialog p{font-size:15px}.confirm-dialog button{margin:15px 10px 0 0}#training-panel{position:absolute;top:200px;left:16px;z-index:5;padding:12px;background:#101b32e8;border:1px solid var(--p1);max-width:min(520px,94%);font-size:12px}#training-panel label{display:inline-flex;gap:6px;align-items:center;margin:8px}#training-panel button,#training-panel select{font-size:11px;padding:8px}#training-panel p{font:11px/1.5 monospace}
/* Responsive layout */
@keyframes slide-arrive{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
@media(min-width:1000px) and (pointer:fine){html[data-controls=auto] .touch-controls{opacity:.7}html[data-controls=auto] .touch-controls:hover{opacity:1}}
@media(max-width:1000px){.brand span{display:none}.arcade-nav{padding:5px 10px}.arcade-nav button{font-size:10px;padding:8px 6px}.career-columns{grid-template-columns:1fr}#cosmetic-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.names{font-size:13px}.touch-controls>div:last-child{padding-right:145px}.roll-control{min-width:135px}.crowd-bets{max-width:42%;font-size:9px}.binding-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.arcade-nav{height:52px;gap:6px}.brand{font-size:18px}.arcade-nav>div{overflow-x:auto}.arcade-nav button{white-space:nowrap;font-size:10px;min-height:38px}.hud{top:70px;left:3%;right:3%;gap:10px;grid-template-columns:1fr 58px 1fr}.names{flex-direction:column;align-items:flex-start;gap:4px;min-height:40px;font-size:11px}.hud>div:last-child .names{align-items:flex-end}.names strong{font-size:9px}.clock b{font-size:42px}.clock span{font-size:8px}.track{height:19px}.meterlabel{font-size:9px}.hud small{font-size:10px}.movement-help{top:178px;font-size:10px}.arena-footer{padding:8px;gap:8px;flex-wrap:wrap;font-size:9px}.arena-footer #status,.arena-footer label{display:none}.level-badge{margin-left:auto}.match-banner{left:8px;bottom:59px;gap:9px}.match-banner strong{font-size:12px}.match-banner span{font-size:9px}.crowd-bets{display:none}.coach{display:none}.touch-controls{bottom:106px;left:8px;right:8px;gap:8px}.touch-controls>div{max-width:40%}.touch-controls>div:last-child{max-width:58%;padding-right:0;padding-bottom:48px}.touch-controls button{padding:8px;font-size:10px}.roll-control{right:8px;bottom:106px}.roll-feedback{bottom:75px;font-size:9px;right:10px}.arcade-slide{padding:75px 4vw 28px}.slide-progress{font-size:10px}.title-slide h1{font-size:clamp(32px,11vw,70px)}.cpu-levels{gap:5px}.cpu-levels button{padding:12px 5px}.cpu-levels b{font-size:27px}.cpu-levels span{font-size:10px}.slide-actions .fight-button{font-size:16px;padding:12px 16px}.section-title span{display:none}#characters,#styles{grid-template-columns:repeat(2,minmax(0,1fr))}.controls{grid-template-columns:1fr}.selection-portrait{height:140px}.versus-grid{grid-template-columns:1fr 45px 1fr}.versus-mark{font-size:35px}.versus-fighter h2{font-size:28px}.versus-fighter p{font-size:11px}.versus-fighter canvas{height:33vh}.guide-grid{grid-template-columns:1fr}.guide,.utility-dialog{inset:5% 3%;padding:18px}.confirm-dialog{inset:auto;top:50%;left:50%}#cosmetic-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.upgrade-card{padding:13px}.upgrade-card b{font-size:18px}.outfit-preview{grid-template-columns:100px 1fr;padding:12px;gap:12px}#outfit-preview{height:180px}.outfit-preview h2{font-size:19px}.market-filter{display:flex;margin-right:0}.market-miniature{height:130px}.settings-grid{grid-template-columns:1fr}.binding-buttons{grid-template-columns:1fr 1fr}.result-actions{flex-direction:column;width:min(100%,350px)}#victory-canvas{height:145px}.result-panel{padding-top:38px}#build-label{top:54px;font-size:8px}#training-panel{top:208px;left:8px;max-width:95%}#training-panel strong{display:block}}
@media(max-height:500px) and (orientation:landscape){.arcade-nav{height:36px}.arcade-nav button{min-height:28px;padding:5px}.hud{top:43px}.names{min-height:22px;font-size:12px;flex-direction:row}.clock b{font-size:36px}.track{height:17px}.movement-help{display:none}.hud small,.meterlabel{font-size:9px}.touch-controls{bottom:72px}.roll-control{bottom:72px}.roll-feedback{bottom:119px}.match-banner{bottom:44px}.coach,.crowd-bets{display:none}.arena-footer{min-height:35px}.resume-overlay{top:14%;padding:14px;gap:7px}.resume-overlay strong{font-size:23px}#training-panel{top:130px;max-width:400px;font-size:10px}.result-panel{padding:20px}#victory-canvas{height:100px}.result-panel h1{font-size:30px}#build-label{top:38px}.arcade-slide{padding-top:60px}}
/* RAGEBOUND title screen: atmosphere and a clear, keyboard-friendly menu. */
#menu[data-screen=title]>.slide-progress{background:#101b27c9;border-bottom:1px solid #8aafa02a;color:#c1d5cc;letter-spacing:.18em}
.title-slide{position:relative;isolation:isolate;display:block;overflow:hidden;max-width:none;min-height:100dvh;padding:95px 5vw 36px;background:radial-gradient(ellipse at 86% 26%,#633d515c,transparent 53%),radial-gradient(ellipse at 7% 86%,#27686155,transparent 53%),#111e2a}
.title-slide::before,.title-slide::after{content:'';position:absolute;pointer-events:none;z-index:-1}
.title-slide::before{inset:-20%;background:linear-gradient(120deg,transparent 36%,#78e3c70a 37%,#78e3c71c 39%,transparent 43%,transparent 62%,#ffc68b0c 64%,transparent 67%);animation:title-lights 14s ease-in-out infinite alternate}
.title-slide::after{inset:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#050d141f 4px 5px);opacity:.6}
.title-layout{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;grid-template-areas:'intro showcase' 'actions showcase' 'bottom showcase';align-content:center;gap:26px 18px;max-width:1380px;min-height:calc(100dvh - 131px);margin:auto}
.title-intro{grid-area:intro;align-self:end;animation:title-arrive .65s ease-out both}
.title-kicker{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:.24em;color:#a8d3c7;margin:0 0 24px}
.title-kicker>span{display:block;width:24px;height:3px;background:#71e4c2;box-shadow:0 0 16px #71e4c266}
.title-slide h1{font-size:clamp(42px,7.5vw,108px);font-weight:900;font-style:italic;line-height:.96;letter-spacing:-.065em;margin:0 0 24px;white-space:nowrap;color:#ffeac4;background:linear-gradient(170deg,#fff9e8 20%,#ffe4b3 60%,#df9b72);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 5px 0 #483644) drop-shadow(0 12px 22px #0005)}
.title-tagline{font-size:clamp(12px,1.2vw,17px);line-height:1.6;font-weight:700;letter-spacing:.15em;color:#ead6b8;margin:0 0 25px}
.title-stats{display:flex;flex-wrap:wrap;gap:11px 24px;color:#9eb3b8;font-size:9px;letter-spacing:.1em}
.title-stats>span{display:flex;gap:7px;align-items:center}.title-stats b{font-size:17px;color:#dbebdf;font-style:italic}
.title-actions{grid-area:actions;max-width:540px;width:100%;animation:title-arrive .65s .1s ease-out both}
.title-start{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:72px;padding:19px 23px;color:#17232d;background:linear-gradient(105deg,#e9c382,#ffe2ac);border:1px solid #ffe6b9;border-radius:4px;box-shadow:0 5px 0 #79624d,0 12px 35px #e5b8791c;animation:title-beacon 3.6s 1s ease-in-out infinite;font-size:clamp(23px,2vw,30px);letter-spacing:.025em;transition:transform .15s,filter .15s}
.title-start:hover,.title-start:focus-visible{background:linear-gradient(105deg,#ffdaa0,#fff0cf);color:#17232d;filter:brightness(1.05);transform:translateY(-2px)}
.title-start:active{transform:translateY(3px);box-shadow:0 2px 0 #79624d}.title-arrow{font-size:33px;font-style:normal;transition:transform .18s}.title-start:hover .title-arrow{transform:translate(3px,-3px)}
.title-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:19px}
.title-secondary button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;min-height:70px;padding:14px 16px;background:#182b36d9;border:1px solid #6e98935c;border-radius:4px;text-align:left;transition:background .18s,transform .18s,border-color .18s}
.title-secondary button:hover,.title-secondary button:focus-visible{background:#25404a;border-color:#7fe7cd;transform:translateX(3px)}.title-secondary button>span{font-size:11px;letter-spacing:.035em;color:#e4eadc}.title-secondary small{font-size:11px;font-weight:400;color:#a1b8bb}
.title-bottom{grid-area:bottom;display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:540px;animation:title-arrive .65s .2s ease-out both}.title-bottom p{margin:0;font-size:11px;color:#9ab0b5}.title-bottom button{padding:9px 0 9px 12px;background:transparent;border:0;border-radius:2px;color:#c6d4d1;font-size:10px;letter-spacing:.08em;white-space:nowrap}.title-bottom button:hover{color:#ffe1a4}.title-bottom button span{font-size:16px;margin-left:6px}
.title-showcase{grid-area:showcase;position:relative;align-self:center;width:100%;height:min(660px,72vh);pointer-events:none;animation:title-art-arrive .85s .1s ease-out both}
.title-showcase canvas{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 22px 24px #0005)}.title-showcase-label{position:absolute;top:4%;left:50%;transform:translateX(-50%);color:#d6c6b3;font-size:9px;letter-spacing:.25em;white-space:nowrap}
.title-sparks{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.title-sparks i{position:absolute;bottom:-30px;left:16%;width:3px;height:10px;background:#edc38b;opacity:0;animation:title-ember 12s linear infinite;transform:rotate(25deg)}.title-sparks i:nth-child(2){left:34%;animation-delay:-8s;animation-duration:16s;background:#83e2ca}.title-sparks i:nth-child(3){left:72%;animation-delay:-3s;height:6px}.title-sparks i:nth-child(4){left:89%;animation-delay:-6s;animation-duration:15s;background:#83e2ca}.title-sparks i:nth-child(5){left:53%;animation-delay:-10s;animation-duration:18s;height:4px}.title-sparks i:nth-child(6){left:7%;animation-delay:-4s;animation-duration:14s;height:5px}
@keyframes title-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes title-art-arrive{from{opacity:0;transform:translateX(25px) scale(.97)}to{opacity:1;transform:translateX(0) scale(1)}}
@keyframes title-lights{from{transform:translateX(-2%) rotate(-2deg)}to{transform:translateX(3%) rotate(2deg)}}
@keyframes title-beacon{0%,100%{box-shadow:0 5px 0 #79624d,0 12px 35px #e5b8791c}50%{box-shadow:0 5px 0 #79624d,0 12px 40px #e5b87945}}
@keyframes title-ember{0%{opacity:0;transform:translate(0,0) rotate(25deg)}12%,75%{opacity:.5}100%{opacity:0;transform:translate(90px,-95vh) rotate(25deg)}}
@media(max-width:900px){.title-slide{padding:84px 6vw 26px}.title-layout{grid-template-columns:1fr;grid-template-areas:'intro' 'showcase' 'actions' 'bottom';gap:16px;min-height:0;max-width:580px}.title-kicker{font-size:9px;margin-bottom:18px}.title-slide h1{font-size:clamp(42px,12.2vw,80px);margin-bottom:17px}.title-tagline{font-size:12px;letter-spacing:.1em;margin-bottom:16px}.title-stats{gap:17px}.title-stats b{font-size:15px}.title-showcase{height:230px;margin:-11px 0 -16px}.title-showcase-label{display:none}.title-actions,.title-bottom{max-width:none}.title-start{min-height:61px;padding:14px 19px}.title-secondary{gap:8px;margin-top:15px}.title-secondary button{min-height:64px;padding:12px}.title-secondary button>span{font-size:10px}.title-secondary small{font-size:10px}.title-bottom p{font-size:10px}}
@media(max-height:560px) and (min-width:901px){.title-layout{min-height:440px;gap:19px}.title-showcase{height:420px}.title-slide{padding-top:76px}.title-kicker{margin-bottom:16px}.title-slide h1{font-size:76px}.title-tagline{margin-bottom:16px}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}html[data-reduced-motion=true] *,html[data-reduced-motion=true] *::before,html[data-reduced-motion=true] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
