/* Premium visual layer: keyboard, mobile and reduced motion supported. */
:root { --panel:rgba(13,19,29,.94); --panel-edge:#35404b; --gold:#ffe060; --orange:#ff7a30; }
.screen.clear { background:linear-gradient(180deg,rgba(6,13,22,.55),transparent 42%,rgba(6,13,22,.9)); }
.panel {border:1px solid #ffffff28;box-shadow:0 24px 90px #0009, inset 0 1px #ffffff13;backdrop-filter:blur(18px);border-radius:26px;}
.hero {gap:12px}.hero img {filter:drop-shadow(0 16px 35px #ff942045);}
.hero .title {color:#fff9e9;text-shadow:0 5px 0 #101720,0 12px 40px #0008;}
.hero .tag {color:#ffdc72;-webkit-text-stroke:0;text-shadow:0 2px 8px #000;font-size:1.15rem;}
.edition-tag{font-size:10px;letter-spacing:4px;color:#fff9;font-weight:500;direction:ltr}
.btn {border:1px solid #ffffff24;border-image:none;background:linear-gradient(135deg,#ffac3d,#f26825);border-radius:18px;box-shadow:0 5px 0 #813817,0 12px 24px #0003;padding:0 18px;-webkit-text-stroke:0;text-shadow:0 1px 3px #0005;transition:transform .15s,filter .15s;}
.btn.xl,.btn.m,.btn.s {border-width:1px;border-image:none;padding:0 16px;-webkit-text-stroke:0;}
.btn.green{background:linear-gradient(135deg,#26b987,#148768);box-shadow:0 5px 0 #07523e;}
.btn.blue{background:linear-gradient(135deg,#348ed7,#3260b1);box-shadow:0 5px 0 #1a376a;}
.btn.purple{background:linear-gradient(135deg,#9870da,#6950b1);box-shadow:0 5px 0 #3f2d75;}
.btn.red{background:linear-gradient(135deg,#f57663,#dc435a);box-shadow:0 5px 0 #822239;}
.btn.grey{background:linear-gradient(135deg,#344352,#222d39);box-shadow:0 5px 0 #111923;}
.btn.yellow{background:linear-gradient(135deg,#ffe68b,#ffc34a);box-shadow:0 5px 0 #9c681d;}
.btn:hover{transform:translateY(-2px);filter:brightness(1.12)}.btn:active{transform:translateY(3px);}
.topbar .profile,.stats-box {background:#101823e8;border:1px solid #ffffff24;border-radius:20px;box-shadow:0 8px 28px #0003;backdrop-filter:blur(12px);}
.stats-box .bar{border-radius:10px;overflow:hidden;background:#060e17}.bar i{border-radius:10px}
#mission{background:#101823ed;border:1px solid #ffffff20;border-radius:15px;}
#prompt{background:#101823e8;border:1px solid #ffcd6466;border-radius:18px;backdrop-filter:blur(12px)}
#loading {background:radial-gradient(ellipse at 50% 36%,#3c2e24,#0b121d 70%)}
.loadbar{border:1px solid #ffffff25;border-radius:20px;overflow:hidden}.loadbar i{background:linear-gradient(90deg,#ef7829,#ffe378)}
#cinema-toggle{position:fixed;bottom:18px;left:18px;z-index:15;padding:10px 15px;border:1px solid #ffffff35;border-radius:30px;background:#111c2bea;backdrop-filter:blur(8px);font-size:12px;color:#ffdc72;}
#premium-score{position:fixed;top:26%;left:50%;transform:translate(-50%,20px);font-size:34px;font-weight:900;color:#ffe060;text-shadow:0 3px #15202f,0 0 24px #ffad3060;pointer-events:none;opacity:0;transition:opacity .15s,transform .2s;z-index:12;white-space:nowrap}
#premium-score.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:600px){.menu-actions{width:min(100%,380px)}.hero{gap:7px}.hero img{width:min(33vw,165px)}.hero .title{font-size:clamp(2.7rem,12vw,4.2rem)}.btn.xl{height:72px}.menu-grid{gap:13px}.menu-actions{gap:16px}#cinema-toggle{bottom:8px;left:8px;font-size:10px;padding:7px 11px}}
@media(prefers-reduced-motion:reduce){.btn,#premium-score{transition:none}.hero img{animation:none}}

#cinema-toggle{position:static;width:42px;height:42px;padding:0;flex:none;font-size:16px;border-radius:14px;color:#ffdc72;background:#101823;}
/* Sharp-corner HUD/profile treatment to match the supplied button set. */
.chip{border-radius:4px !important;border-width:2px !important;box-shadow:3px 3px 0 #10151d !important;background:#101823 !important;}
.topbar .profile{border-radius:4px !important;box-shadow:4px 4px 0 #10151d !important;}
.avatar{border-radius:4px !important;box-shadow:3px 3px 0 #10151d !important;}

/* Supplied CasualGameButtonsVol01 sharp-corner artwork. */
.btn,.btn.xl,.btn.m,.btn.s{--button-art:url('../assets/ui/orange_L_pill.png');background:none;border-style:solid;border-width:0 32px;border-image:var(--button-art) 0 64 fill / 0 32px stretch;border-radius:0;box-shadow:none;padding:0 5px 6px;color:white;text-shadow:0 2px 2px #0007;}
.btn.xl{border-width:0 42px;border-image-width:0 42px;padding-bottom:8px}.btn.m{border-width:0 26px;border-image-width:0 26px}.btn.s{border-width:0 22px;border-image-width:0 22px}
.btn.green{--button-art:url('../assets/ui/green_L_pill.png');background:none;box-shadow:none}
.btn.blue{--button-art:url('../assets/ui/blue_L_pill.png');background:none;box-shadow:none}
.btn.purple{--button-art:url('../assets/ui/purple_L_pill.png');background:none;box-shadow:none}
.btn.red{--button-art:url('../assets/ui/red_L_pill.png');background:none;box-shadow:none}
.btn.grey{--button-art:url('../assets/ui/grey_L_pill.png');background:none;box-shadow:none}
.btn.yellow{--button-art:url('../assets/ui/yellow_L_pill.png');background:none;box-shadow:none}
.btn.yellow{color:#472b00;text-shadow:none}.btn .ico{fill:currentColor}.ibtn svg{fill:white}
#s-install{background:radial-gradient(ellipse at top,#39452e,#111c26 65%);overflow-y:auto;justify-content:flex-start;padding-block:24px;}
#s-install .panel{margin:auto;max-width:460px;width:100%;flex-shrink:0}#s-install .phone-art{margin:8px auto}#s-install .phone-art img{width:90px;height:90px}
#install-status{color:#ffe075;line-height:1.6;text-align:center}#install-url{width:100%;direction:ltr;text-align:left;user-select:text;font-size:14px;padding:12px;background:#080e18;border:1px solid #697b86;border-radius:10px}
#install-external h2{font-size:24px;color:#ffdf70;text-align:center;margin:8px 0}#install-external p{font-weight:500;line-height:1.7}