@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#0c091a;--panel:#17122c;--panel2:#211a3b;--purple:#9565ff;--cyan:#62e5db;--text:#f8f6ff;--muted:#aaa3c2;--line:rgba(255,255,255,.09)}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100vh;color:var(--text);font-family:Manrope,Arial,sans-serif;background:radial-gradient(ellipse at 10% 0%,#29194b 0,transparent 38%),radial-gradient(ellipse at 95% 35%,#102e3c 0,transparent 30%),var(--bg);overflow-x:hidden}.ambient{position:fixed;border-radius:50%;filter:blur(70px);opacity:.16;pointer-events:none;z-index:0}.ambient-one{width:190px;height:190px;background:#9b5cff;top:20%;left:-100px}.ambient-two{width:220px;height:220px;background:#24d9cf;right:-130px;bottom:8%}.app-shell{position:relative;z-index:1;width:min(100% - 30px,720px);margin:0 auto;padding:22px 0 28px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;font-weight:900;font-size:14px;background:linear-gradient(135deg,#a76aff,#5b42d7);box-shadow:0 7px 25px #8655ff55}.brand-name{font-weight:900;letter-spacing:1.2px;font-size:15px}.brand-name span{color:var(--cyan)}.brand-sub{font-size:8px;letter-spacing:1.1px;color:var(--muted);margin-top:3px}.balance-box{background:#211a39;border:1px solid var(--line);border-radius:13px;padding:8px 12px;text-align:right;min-width:104px}.balance-label,.eyebrow{display:block;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:1.5px}.balance-box strong{display:block;font-size:15px;margin-top:2px}.panel{background:linear-gradient(145deg,rgba(35,27,61,.96),rgba(19,16,37,.96));border:1px solid var(--line);border-radius:22px;box-shadow:0 16px 45px #0003}.welcome{min-height:205px;padding:23px 20px;position:relative;overflow:hidden;display:flex;align-items:center}.welcome-copy{position:relative;z-index:2;max-width:66%}.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);margin-right:6px}.welcome h1{font-size:29px;line-height:1.13;letter-spacing:-1.2px;margin:13px 0 9px;font-weight:900}.welcome h1 span{color:var(--cyan)}.welcome p{font-size:11px;line-height:1.6;color:var(--muted);max-width:260px;margin:0}.car-art{position:absolute;right:4px;top:25px;width:42%;height:155px;display:grid;place-items:center}.car-glow{position:absolute;width:130px;height:90px;background:#6f4cff;filter:blur(45px);opacity:.5}.car-shape{position:relative;font-size:76px;filter:drop-shadow(0 12px 10px #0008);transform:rotate(-8deg);animation:float 3s ease-in-out infinite}.car-caption{position:absolute;bottom:0;right:10px;font-size:7px;line-height:1.5;letter-spacing:2px;text-align:right;color:#b5a7e4;font-weight:800}@keyframes float{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-8px) rotate(-5deg)}}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:17px 0 23px}.tab{position:relative;border:1px solid var(--line);border-radius:13px;padding:12px 5px;background:#17132b;color:#b9b2ce;font:800 11px Manrope,Arial;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}.tab.active{background:linear-gradient(120deg,#8354e8,#563bb5);border-color:#a98aff;color:white;box-shadow:0 7px 22px #7548d344}.tab b{font-size:9px;background:#ffffff26;padding:2px 5px;border-radius:7px}.page{display:none;animation:appear .25s ease}.page.active{display:block}@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:0 2px 13px}.section-heading h2{font-size:21px;letter-spacing:-.6px;margin:4px 0 0}.pill{font-size:9px;font-weight:900;letter-spacing:1px;color:var(--cyan);border:1px solid #62e5db55;background:#62e5db12;border-radius:20px;padding:7px 10px}.case-card{padding:17px;display:grid;grid-template-columns:115px 1fr;gap:16px;align-items:center}.case-visual{height:125px;border-radius:17px;background:radial-gradient(circle,#7050c9 0,#32235c 55%,#211a3c 100%);display:grid;place-items:center;position:relative;overflow:hidden}.case-orbit{position:absolute;width:90px;height:90px;border:1px solid #c1a4ff66;border-radius:50%;box-shadow:0 0 22px #9e75ff55}.case-icon{font-size:55px;z-index:1;filter:drop-shadow(0 8px 9px #0007);animation:float 3s ease-in-out infinite}.spark{position:absolute;color:#fff;font-size:20px}.spark-a{top:13px;right:17px}.spark-b{bottom:14px;left:15px}.case-info h3{font-size:16px;margin:0 0 7px}.case-info p{font-size:10px;line-height:1.6;color:var(--muted);margin:0 0 12px}.primary-btn{width:100%;border:0;border-radius:12px;padding:13px 14px;background:linear-gradient(100deg,#9a65ff,#6b4ce0);color:white;font:900 10px Manrope,Arial;letter-spacing:1px;box-shadow:0 8px 20px #8053ec40;cursor:pointer;transition:transform .15s,filter .15s}.primary-btn:active{transform:scale(.98);filter:brightness(1.15)}.primary-btn span{float:right;font-size:15px;line-height:10px}.hint{font-size:9px!important;margin:8px 0 0!important}.compact{margin-top:23px}.chance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.chance-item{display:flex;align-items:center;gap:9px;background:#17132b;border:1px solid var(--line);border-radius:13px;padding:10px}.car-emoji{font-size:24px;width:32px;text-align:center}.chance-name{font-size:10px;font-weight:800}.chance-rate{font-size:9px;color:var(--cyan);margin-top:3px}.garage-list{display:grid;gap:10px}.garage-car{display:flex;align-items:center;gap:12px;padding:13px;background:#19142e;border:1px solid var(--line);border-radius:15px}.garage-car .car-emoji{font-size:31px;width:42px}.car-details{flex:1;min-width:0}.car-details strong{font-size:12px;display:block}.car-details small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.sell-btn{border:1px solid #ff8a9b55;background:#ff718012;color:#ff9aaa;border-radius:9px;padding:8px 10px;font:800 9px Manrope;white-space:nowrap;cursor:pointer}.empty-state{text-align:center;padding:35px 18px;color:var(--muted);background:#17132b;border:1px dashed #ffffff20;border-radius:16px}.empty-state div{font-size:38px;margin-bottom:9px}.empty-state strong{display:block;color:white;font-size:13px}.empty-state p{font-size:10px;line-height:1.5}.income-card{text-align:center;padding:24px 20px}.income-icon{width:48px;height:48px;margin:0 auto 15px;border-radius:16px;display:grid;place-items:center;background:#62e5db19;color:var(--cyan);font-size:25px;font-weight:900}.income-value{display:block;font-size:34px;letter-spacing:-1px;margin:8px 0}.income-card p{font-size:10px;line-height:1.6;color:var(--muted);max-width:280px;margin:0 auto 17px}.income-card .primary-btn{max-width:300px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:11px}.stat{padding:15px}.stat span{font-size:9px;color:var(--muted)}.stat strong{display:block;font-size:17px;margin-top:5px}.small-note{font-size:9px;line-height:1.6;color:#817995;margin:13px 3px}footer{text-align:center;color:#716987;font-size:8px;font-weight:800;letter-spacing:2px;margin-top:30px}footer span{color:var(--cyan);padding:0 5px}.modal{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:20px}.modal.hidden{display:none}.modal-backdrop{position:absolute;inset:0;background:#080611d9;backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(100%,340px);padding:27px 22px;text-align:center;z-index:1}.close-btn{position:absolute;right:13px;top:10px;border:0;background:transparent;color:#aaa;font-size:26px;cursor:pointer}.modal-car{font-size:66px;margin:8px 0 14px;filter:drop-shadow(0 8px 12px #8b5cff55)}.modal-card h2{font-size:22px;margin:8px 0}.modal-card p{font-size:11px;color:var(--muted);line-height:1.6;margin:0 0 20px}.toast{position:fixed;z-index:20;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#2b2444;border:1px solid #ffffff20;color:white;padding:11px 16px;border-radius:12px;font-size:11px;box-shadow:0 10px 30px #0006;transition:.25s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:600px){.app-shell{padding-top:35px}.welcome{min-height:230px;padding:30px}.welcome h1{font-size:36px}.car-shape{font-size:95px}.case-card{grid-template-columns:150px 1fr;padding:22px}.case-visual{height:145px}.chance-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:380px){.app-shell{width:calc(100% - 22px)}.welcome{padding:18px 15px}.welcome h1{font-size:25px}.case-card{grid-template-columns:94px 1fr;gap:11px;padding:12px}.case-visual{height:118px}.case-icon{font-size:46px}.case-info h3{font-size:14px}.case-info p{font-size:9px}}

/* DRIVE EMPIRE — black & gold mobile redesign */
:root{--bg:#080808;--panel:#15130e;--panel2:#211c10;--purple:#d6a83f;--cyan:#f2c65d;--text:#fffaf0;--muted:#aaa18d;--line:rgba(226,181,75,.19)}
html{background:#080808}body{background:radial-gradient(ellipse at 12% 0%,#3a2a0b 0,transparent 38%),radial-gradient(ellipse at 95% 55%,#211807 0,transparent 32%),#080808;color:var(--text);padding-bottom:88px}
.ambient-one{background:#d6a83f;opacity:.13}.ambient-two{background:#8d641b;opacity:.12}
.brand-mark{background:linear-gradient(135deg,#f6d77b,#9b6a17);color:#171107;box-shadow:0 7px 25px #d6a83f44}
.brand-name span,.pill,.chance-rate,.income-icon{color:#f2c65d}
.balance-box{background:linear-gradient(145deg,#29200d,#15120b);border-color:#d6a83f66;box-shadow:0 0 18px #d6a83f12}
.panel{background:linear-gradient(145deg,rgba(34,28,16,.98),rgba(17,16,13,.98));border:1px solid rgba(226,181,75,.2);box-shadow:0 16px 45px #0008}
.welcome h1 span{color:#f2c65d}.eyebrow i{background:#f2c65d;box-shadow:0 0 10px #f2c65d}
.car-glow{background:#d6a83f}.car-caption{color:#e6c779}
.case-visual{background:radial-gradient(circle,#8d681d 0,#3e2e10 55%,#21190c 100%)}.case-orbit{border-color:#f5d47c88;box-shadow:0 0 22px #d6a83f55}
.primary-btn{background:linear-gradient(100deg,#f0cb68,#a97920);color:#1b1407;box-shadow:0 8px 20px #b8872b38}
.pill{border-color:#d6a83f66;background:#d6a83f12}.chance-item,.garage-car,.empty-state,.shop-panel,.profile-card{background:#17140d;border-color:#5d481e66}
.sell-btn{border-color:#d6a83f77;background:#d6a83f12;color:#f1cf78}
.income-icon{background:#d6a83f1c}.toast{background:#211b0f;border-color:#d6a83f66}
.home-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.home-stats .stat{padding:13px}.home-income{margin-top:10px}
.shop-panel{text-align:center;padding:28px 22px}.shop-emblem{font-size:42px;color:#f2c65d}.shop-panel h3{margin:8px 0}.shop-panel p{font-size:11px;line-height:1.7;color:var(--muted);margin:0 auto 18px;max-width:330px}
.profile-card{text-align:center;padding:25px}.profile-avatar{width:66px;height:66px;border-radius:22px;display:grid;place-items:center;margin:0 auto 12px;background:linear-gradient(135deg,#f0cb68,#916116);color:#171107;font-weight:900;font-size:20px;box-shadow:0 8px 25px #d6a83f33}.profile-card h3{margin:6px 0}.profile-card p{font-size:10px;color:var(--muted);margin:0}
.bottom-nav{position:fixed;z-index:8;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 22px),520px);display:grid;grid-template-columns:repeat(5,1fr);gap:3px;padding:7px;background:rgba(17,15,11,.96);border:1px solid #8d6a2c88;border-radius:19px;box-shadow:0 12px 35px #000b;backdrop-filter:blur(16px)}
.nav-item{border:0;background:transparent;color:#a99d83;border-radius:12px;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;font-family:Manrope,Arial,sans-serif}.nav-item span{font-size:19px;line-height:20px}.nav-item small{font-size:8px;font-weight:800}.nav-item.active{background:linear-gradient(145deg,#8d681d,#4a3510);color:#fff0c2;box-shadow:inset 0 0 0 1px #e8c66a66}.nav-case span{font-size:22px}
footer{margin-top:25px;padding-bottom:10px;color:#8c7951}footer span{color:#f2c65d}
@media(max-width:380px){.brand-name{font-size:13px}.balance-box{min-width:96px;padding:7px 9px}.balance-box strong{font-size:13px}.welcome{min-height:190px}.welcome h1{font-size:24px}}

/* DRIVE EMPIRE — pure black, minimal text navigation */
:root{--bg:#000;--panel:#101010;--panel2:#151515;--text:#fff;--muted:#a7a7a7;--line:rgba(255,255,255,.12)}
html,body{background:#000!important;color:#fff}
body{background:#000!important;padding-bottom:105px}
.ambient{display:none!important}
.app-shell{padding-top:max(18px,env(safe-area-inset-top));padding-bottom:34px}
.topbar{position:relative;min-height:46px;justify-content:center;margin-bottom:24px}
.brand{justify-content:center;flex:1;text-align:center}
.brand-name{font-size:17px;font-weight:900;letter-spacing:2px;color:#fff}
.brand-mark,.brand-sub{display:none!important}
.balance-box{position:absolute;right:0;top:50%;transform:translateY(-50%);min-width:0;padding:6px 0 6px 10px;background:transparent;border:0;border-radius:0;box-shadow:none;text-align:right}
.balance-label{font-size:8px;color:#929292;letter-spacing:1.2px}
.balance-box strong{font-size:16px;color:#fff;font-weight:800}
.panel{background:#101010;border:1px solid #242424;box-shadow:none}
.welcome{background:#101010}
.welcome h1 span,.brand-name span{color:#fff}
.eyebrow,.balance-label{color:#999}
.eyebrow i{background:#fff;box-shadow:0 0 8px #fff}
.car-glow{background:#777;opacity:.18}
.car-caption{color:#aaa}
.case-visual{background:#151515}
.case-orbit{border-color:#777;box-shadow:0 0 18px #ffffff18}
.primary-btn{background:#fff;color:#000;box-shadow:none}
.pill{color:#fff;border-color:#555;background:#151515}
.chance-item,.garage-car,.empty-state,.shop-panel,.profile-card{background:#101010;border-color:#292929}
.chance-rate,.income-icon{color:#fff}
.sell-btn{border-color:#777;background:#191919;color:#fff}
.income-icon{background:#202020}
.toast{background:#171717;border-color:#555}
.profile-avatar{background:#252525;color:#fff;box-shadow:none}
.bottom-nav{position:fixed;z-index:8;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 30px),460px);display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px;background:#050505;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}
.nav-item{position:relative;min-height:42px;padding:0 12px;border:1px solid transparent;border-radius:999px;background:transparent;color:#fff;font:800 11px Manrope,Arial,sans-serif;letter-spacing:1px;display:flex;align-items:center;justify-content:center;white-space:nowrap}
.nav-item.active{background:transparent;color:#fff;border:1px solid #fff;box-shadow:none}
.nav-item span,.nav-item small{display:none!important}
.menu-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.menu-link{display:flex;justify-content:space-between;align-items:center;padding:15px 14px;border:1px solid #292929;border-radius:13px;background:#101010;color:#fff;font:700 12px Manrope,Arial,sans-serif;text-align:left}
.menu-link b{font-size:17px;font-weight:400;color:#aaa}
footer{color:#777}footer span{color:#fff}
@media(max-width:380px){.brand-name{font-size:15px}.balance-box strong{font-size:14px}.bottom-nav{width:calc(100% - 22px)}.nav-item{font-size:10px}}