/* Shared arcade shell. Game-specific styles are loaded after this file. */
:root{--bg:#101b30;--surface:#18263d;--text:#f1f5fc;--muted:#a7b6cd;--border:#30405a;--primary:#8aebc8;--primary-soft:#213e42;--success:#8aebc8;--danger:#ff8c99;--shadow:0 12px 36px #030a1620;--radius:18px;color-scheme:dark}
:root.dark{--bg:#080f1e;--surface:#111c30;--text:#f0f4fc;--muted:#9caec9;--border:#263650;--primary:#78e6bc;--primary-soft:#17372f;--shadow:0 12px 36px #0003}
body:not(.bot-race-active):not(.balloon-game-mode){background:radial-gradient(ellipse at 85% 2%,#233a5338,transparent 46%),var(--bg)}
body:not(.bot-race-active):not(.balloon-game-mode) main{max-width:1220px;padding-top:40px;padding-bottom:72px}
body:not(.bot-race-active):not(.balloon-game-mode) :is(.button:not(.danger)){background:var(--primary);color:#102a25;border-color:var(--primary);border-radius:11px;font-weight:750;min-height:46px}
body:not(.bot-race-active):not(.balloon-game-mode) .button.secondary{background:#ffffff04;color:var(--text);border-color:var(--border)}
body:not(.bot-race-active):not(.balloon-game-mode) .card:not(.balloon-page *){box-shadow:var(--shadow)}
body:not(.bot-race-active):not(.balloon-game-mode) .page-heading{padding:18px 0 27px;border-bottom:1px solid var(--border);margin-bottom:28px}
body:not(.bot-race-active):not(.balloon-game-mode) .page-heading h1{letter-spacing:-1.4px;font-size:clamp(28px,4vw,42px)}
body:not(.bot-race-active):not(.balloon-game-mode) :is(.field input,.field select,.field textarea,.search-input){background:var(--bg);border-radius:10px;min-height:45px}
body:not(.bot-race-active):not(.balloon-game-mode) .footer{max-width:1160px;padding-block:30px}
body:not(.bot-race-active):not(.balloon-game-mode) .auth-card{border-top:3px solid var(--primary)}
.arcade-home .eyebrow{font-size:10px;letter-spacing:1.8px;color:var(--primary);font-weight:750}
.arcade-hero{display:grid;grid-template-columns:1fr 1.03fr;align-items:center;gap:42px;padding:20px 0 50px}
.arcade-hero h1{font-size:clamp(44px,5.1vw,66px);letter-spacing:-3px;line-height:1.08;margin:20px 0}
.arcade-hero h1 em{color:var(--primary);font-style:normal}
.arcade-hero p{font-size:15px;line-height:1.9;margin-bottom:27px}
.arcade-hero .hero-note{margin-top:25px;font-size:11px}
.arcade-hero .hero-note kbd{background:var(--surface);font-size:10px;padding:2px 7px}
.arcade-scene{position:relative;isolation:isolate;min-height:350px;border:1px solid #40516c;border-radius:24px;overflow:hidden;background:radial-gradient(circle at 70% 19%,#64728b30,transparent 25%),linear-gradient(#172a46,#243b52 62%,#1b3042);box-shadow:0 28px 65px #0003;transform:rotate(-2deg)}
.scene-label{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:22px;color:#c4d7e7;font-size:8px;letter-spacing:1.2px}
.scene-label>span:first-child{display:flex;align-items:center;gap:8px;font-weight:750}
.scene-label .status-dot{background:#82ebc3}
.scene-moon{position:absolute;width:43px;height:43px;right:22%;top:67px;border-radius:50%;background:#fff0ca;box-shadow:0 0 45px #f4d69f25}
.scene-hills{position:absolute;inset:110px -12% auto;height:150px;background:#274857;clip-path:polygon(0 60%,14% 22%,30% 59%,47% 14%,69% 63%,81% 30%,100% 69%,100% 100%,0 100%)}
.scene-hills:after{content:"";position:absolute;inset:35px 0 0;background:#1b3947;clip-path:polygon(0 60%,24% 26%,43% 70%,71% 20%,100% 80%,100% 100%,0 100%)}
.scene-road{position:absolute;top:153px;left:-12px;right:-12px;height:151px;background:#17263a;border-block:5px solid #658172;transform:rotate(-8deg);box-shadow:0 7px 0 #0b1828}
.scene-lane{position:relative;height:47px;border-bottom:1px dashed #8ba0b14a}
.scene-lane:last-of-type{border-bottom:0}
.scene-lane .car-svg{position:absolute;width:100px;top:-6px;filter:drop-shadow(0 7px 4px #0004)}
.scene-lane-one .car-svg{left:56%}.scene-lane-two .car-svg{left:25%}.scene-lane-three .car-svg{left:40%}
.scene-player{position:absolute;left:calc(56% + 35px);top:-13px;font-size:8px;font-weight:800;color:#8aebc8}
.scene-finish{position:absolute;right:12%;top:0;height:100%;width:14px;opacity:.5;background:conic-gradient(#dce6ec 25%,transparent 0 50%,#dce6ec 0 75%,transparent 0) 0 0/14px 14px}
.scene-keyboard{position:absolute;bottom:13px;left:22px;right:22px;display:flex;gap:4px;align-items:center;font-size:9px;color:#b7c9d8}
.scene-keyboard kbd{display:grid;place-items:center;width:25px;height:25px;border:1px solid #537085;border-bottom-width:3px;border-radius:5px;background:#203a4e;color:#eaf7fa;font-family:inherit}
.scene-keyboard span{margin-left:auto;font-size:8px}
.arcade-home .stats-strip{background:transparent;border:0;border-block:1px solid var(--border);border-radius:0;padding:23px 0;margin:0 0 46px}
.arcade-home .stat-item{justify-content:center;gap:14px}.arcade-home .stat-icon{display:none}.arcade-home .stat-item b{font-size:26px;font-variant-numeric:tabular-nums}.arcade-home .stat-item small{font-size:11px}
.arcade-section-heading{scroll-margin-top:120px;margin-bottom:23px}.arcade-section-heading .eyebrow{display:block;margin-bottom:7px}.arcade-section-heading h2{font-size:28px;letter-spacing:-1px}.arcade-section-heading .tag{font-size:9px;letter-spacing:.7px;background:var(--surface);border:1px solid var(--border);padding:7px 10px}
.arcade-games{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.arcade-game{display:block;border:1px solid var(--border);border-radius:18px;background:var(--surface);overflow:hidden;transition:transform .2s,border-color .2s}
.arcade-game:hover{transform:translateY(-4px);border-color:var(--primary)}
.game-art{height:190px;position:relative;isolation:isolate;overflow:hidden}
.game-category{position:absolute;left:23px;top:20px;font-size:9px;letter-spacing:1.6px;font-weight:750;z-index:2}
.racing-art{background:linear-gradient(125deg,#21403f,#203649);color:#abe6d0}
.mini-road{position:absolute;left:-10%;right:-10%;height:95px;top:75px;transform:rotate(-13deg);background:#172638;border-block:3px solid #628b7c}
.mini-road:after{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px dashed #91a6aa5c}
.racing-art .car-svg{position:absolute;z-index:1;width:180px;left:calc(50% - 85px);top:66px;transform:rotate(-13deg);filter:drop-shadow(0 14px 9px #0005)}
.art-number{position:absolute;right:20px;bottom:8px;font-size:70px;line-height:1;font-weight:850;letter-spacing:-5px;opacity:.1}
.arcade-balloon-art{background:radial-gradient(ellipse at 47% 100%,#9b4d6540,transparent 65%),linear-gradient(120deg,#3c2d48,#29314c);color:#ffc0c7}
.art-balloon{position:absolute;width:80px;height:99px;border-radius:48% 48% 46% 46%;left:calc(50% - 40px);top:42px;background:radial-gradient(ellipse at 28% 24%,#ffd5d8 0,#ff8999 17%,#ed597d 65%,#b7385a);box-shadow:inset -8px -9px 14px #921a3d33,0 15px 25px #10051c33;transform:rotate(10deg)}
.art-balloon:before{content:"";position:absolute;width:12px;height:10px;left:34px;bottom:-7px;background:#e85d80;clip-path:polygon(50% 0,100% 100%,0 100%)}
.art-balloon:after{content:"";position:absolute;width:26px;height:50px;left:23px;top:107px;border-right:1px solid #f7adc7;border-radius:50%;transform:rotate(17deg)}
.arcade-balloon-orbit{position:absolute;left:calc(50% - 110px);top:42px;width:220px;height:130px;border:1px solid #ffb6c326;border-radius:50%;transform:rotate(-23deg);z-index:-1}
.arcade-balloon-orbit:before,.arcade-balloon-orbit:after{content:"";position:absolute;width:7px;height:7px;border:1px solid #efb5c5;transform:rotate(45deg);top:18px;left:15px}.arcade-balloon-orbit:after{top:90px;left:195px;width:4px;height:4px}
.game-copy{padding:23px 25px 22px}.game-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.game-title h3{font-size:21px;letter-spacing:-.6px;margin:0}.game-title>span{color:var(--primary);font-size:24px}.game-copy p{font-size:12px;line-height:1.85;margin:10px 0 19px;max-width:380px}.game-meta{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:1px;color:var(--muted);font-weight:650}.game-meta i{width:3px;height:3px;background:var(--muted);border-radius:50%}
.arcade-shortcuts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:17px 0 46px}.arcade-shortcuts>a{display:flex;align-items:center;gap:13px;border:1px solid var(--border);border-radius:12px;padding:19px 17px;background:#ffffff02;transition:background .2s}.arcade-shortcuts>a:hover{background:var(--primary-soft)}.shortcut-mark{color:var(--primary);font-size:10px;letter-spacing:1px;align-self:flex-start;padding-top:3px}.arcade-shortcuts h3{font-size:13px;margin:0 0 5px}.arcade-shortcuts p{font-size:10px;margin:0}.arcade-shortcuts>a>span:last-child{margin-left:auto;color:var(--muted)}
.arcade-home .home-bottom{grid-template-columns:1.2fr 1fr;gap:22px}.arcade-home .home-bottom>.card{padding:25px}.arcade-home .home-bottom .section-heading h2{font-size:18px}.arcade-home .practice-promo{background:linear-gradient(135deg,var(--surface),var(--primary-soft));border:1px solid var(--border)}.arcade-home .practice-promo h2{max-width:none;margin-top:12px;font-size:27px}.arcade-home .practice-promo .keycaps{margin:18px 0 26px}.arcade-home .practice-promo .keycaps kbd{background:var(--bg);border-color:var(--border);font-size:17px}.arcade-home .weekly-row .stars{color:#ffd087}.arcade-home .home-bottom .empty{padding-block:37px}
@media(max-width:960px){.arcade-hero{gap:25px}.arcade-hero h1{font-size:48px}.arcade-scene{min-height:325px}.scene-label{padding-inline:15px;font-size:7px}.scene-keyboard{left:15px;right:15px}.scene-keyboard span{max-width:85px}.arcade-shortcuts{gap:10px}.arcade-shortcuts>a{padding:16px 12px;gap:8px}.shortcut-mark{display:none}}
@media(max-width:700px){body:not(.bot-race-active):not(.balloon-game-mode) main{padding:24px 18px 45px}.arcade-hero{grid-template-columns:1fr;gap:30px;padding:12px 0 30px}.arcade-hero h1{font-size:51px;letter-spacing:-2.5px;margin:17px 0}.arcade-hero p{font-size:14px}.arcade-hero .eyebrow{font-size:8px;letter-spacing:1.3px}.arcade-hero .hero-note{margin-top:19px}.arcade-scene{transform:none;min-height:320px}.scene-road{top:138px}.scene-label{font-size:8px;padding:19px}.scene-keyboard span{max-width:none}.arcade-home .stats-strip{margin-bottom:32px;padding:19px 0}.arcade-home .stat-item{gap:5px}.arcade-home .stat-item b{font-size:23px}.arcade-home .stat-item small{font-size:8px}.arcade-section-heading h2{font-size:24px}.arcade-section-heading>.tag{display:none}.arcade-games{grid-template-columns:1fr;gap:17px}.game-art{height:174px}.game-copy{padding:20px}.game-title h3{font-size:20px}.arcade-shortcuts{grid-template-columns:1fr;gap:9px;margin:14px 0 32px}.arcade-shortcuts>a{padding:16px 18px;gap:14px}.shortcut-mark{display:block}.arcade-shortcuts h3{font-size:14px}.arcade-shortcuts p{font-size:11px}.arcade-home .home-bottom{grid-template-columns:1fr}.arcade-home .home-bottom>.card{padding:20px}.arcade-home .home-bottom .section-heading{flex-wrap:wrap;gap:8px}.game-meta{font-size:7px;letter-spacing:.6px}}
@media(max-width:360px){.arcade-hero h1{font-size:44px}.arcade-hero .actions{align-items:stretch}.arcade-hero .actions .button{padding-inline:13px;font-size:12px}.scene-keyboard span{font-size:7px;max-width:88px}.arcade-scene{min-height:310px}.scene-label{font-size:6px;padding-inline:15px}.arcade-home .stat-item small{font-size:7px}.arcade-section-heading h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.arcade-game,.arcade-shortcuts>a{transition:none}.arcade-game:hover{transform:none}}
@media(max-width:700px){.scene-road{top:120px}}
