:root{
  --bg:#071329; --panel:#0d2142; --panel2:#102b54; --text:#f7fbff; --muted:#93a9c9;
  --line:rgba(255,255,255,.10); --primary:#ffc62e; --primary2:#ff8d18;
  --accent:#29c8ff; --green:#28dc7d; --purple:#9c5cff; --danger:#ff5470;
  --shadow:0 18px 45px rgba(0,0,0,.28); --radius:22px;
}
body.light{
  --bg:#eef7ff; --panel:#ffffff; --panel2:#f4f9ff; --text:#12213b; --muted:#65758e;
  --line:rgba(18,33,59,.10); --shadow:0 18px 45px rgba(41,91,140,.14);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}
body{overflow-x:hidden}
button{font:inherit;color:inherit;border:0;cursor:pointer}
.app-shell{min-height:100vh;max-width:520px;margin:auto;padding:14px 14px 92px;position:relative}
.ambient{position:fixed;width:220px;height:220px;border-radius:50%;filter:blur(70px);opacity:.18;pointer-events:none;z-index:0}
.ambient-a{background:#008cff;top:70px;left:-80px}.ambient-b{background:#9c35ff;right:-90px;bottom:120px}
.topbar,.screen,.bottom-nav{position:relative;z-index:2}
.topbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.profile{display:flex;align-items:center;gap:9px;flex:1}
.avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#ffd64a,#ff8a00);color:#13223e;font-weight:1000;box-shadow:0 8px 20px rgba(255,168,0,.25)}
.eyebrow{font-size:10px;letter-spacing:1.2px;font-weight:900;color:var(--accent)}
.username{font-weight:850;font-size:14px;margin-top:2px}
.balance-pill,.icon-btn{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
.balance-pill{border-radius:15px;padding:10px 12px;font-weight:900;font-size:12px}.icon-btn{width:42px;height:42px;border-radius:14px}
.screen{display:none;animation:rise .25s ease}.screen.active{display:block}
@keyframes rise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.hero-card{padding:22px;border-radius:28px;background:linear-gradient(145deg,#102f61,#091a39 60%,#17205d);border:1px solid rgba(70,199,255,.25);box-shadow:var(--shadow);overflow:hidden;position:relative}
body.light .hero-card{background:linear-gradient(145deg,#dff5ff,#fff 62%,#e9e5ff)}
.hero-orb{width:100px;height:100px;border-radius:32px;display:grid;place-items:center;font-size:30px;font-weight:1000;color:#222;background:radial-gradient(circle at 35% 25%,#fff3a0,#ffbf17 45%,#ff7b00);box-shadow:0 0 50px rgba(255,190,30,.35);margin-bottom:16px}
.hero-copy h1{font-size:32px;margin:0 0 6px;letter-spacing:-1px}.hero-copy p{margin:0 0 18px;color:var(--muted);line-height:1.5;font-size:13px}
.primary-btn,.secondary-btn{min-height:46px;border-radius:15px;padding:0 18px;font-weight:950}
.primary-btn{background:linear-gradient(135deg,#ffd34a,#ff9c18);color:#17233b;box-shadow:0 10px 25px rgba(255,166,25,.24)}
.secondary-btn{background:var(--panel);border:1px solid var(--line)}
.hero-card .primary-btn{width:100%}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:12px 0}
.stat-card,.feature-card,.wallet-card{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px}
.stat-card{padding:13px 8px;text-align:center}.stat-card span{display:block;font-size:19px}.stat-card small{display:block;color:var(--muted);font-size:10px;margin:4px 0}.stat-card b{font-size:14px}
.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.feature-card{padding:15px 7px;text-align:center}.feature-icon{font-size:24px;display:block;margin-bottom:7px}.feature-card b{display:block;font-size:12px}.feature-card small{display:block;color:var(--muted);font-size:9px;margin-top:3px}
.notice{margin-top:12px;padding:12px;border-radius:15px;background:rgba(41,200,255,.08);border:1px solid rgba(41,200,255,.14);color:var(--muted);font-size:11px;text-align:center}
.game-head,.page-head{display:flex;align-items:center;gap:12px;margin:7px 0 13px}.game-head>div:nth-child(2){flex:1}.back-btn{width:40px;height:40px;border-radius:14px;background:var(--panel);border:1px solid var(--line);font-size:26px}
.goal-text{font-size:13px;font-weight:800;margin-top:3px}.moves-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:7px 11px;text-align:center}.moves-box small{display:block;color:var(--muted);font-size:8px}.moves-box b{font-size:18px}
.goal-row{display:flex;gap:7px;align-items:center;margin-bottom:10px}.goal-chip{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px 10px;font-size:11px;font-weight:900}.level-stars{margin-left:auto;font-size:16px;color:#ffc52f;letter-spacing:2px}
.board-wrap{padding:9px;border-radius:25px;background:linear-gradient(145deg,#0d2854,#071329);border:1px solid rgba(41,200,255,.25);box-shadow:var(--shadow)}
body.light .board-wrap{background:linear-gradient(145deg,#d9efff,#f7fbff)}
.board{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;aspect-ratio:1;border-radius:18px;overflow:hidden}
.tile{border-radius:10px;display:grid;place-items:center;font-size:clamp(19px,6.2vw,31px);user-select:none;transition:transform .12s,filter .12s;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 8px rgba(0,0,0,.2)}
.tile:active{transform:scale(.9)}.tile.selected{outline:3px solid #fff;transform:scale(1.04);filter:brightness(1.2)}
.tile.t0{background:linear-gradient(145deg,#ffd85a,#ff9b00)}.tile.t1{background:linear-gradient(145deg,#a970ff,#5f2dca)}.tile.t2{background:linear-gradient(145deg,#56eaff,#078dd9)}.tile.t3{background:linear-gradient(145deg,#4fe2a0,#089a67)}.tile.t4{background:linear-gradient(145deg,#ff72a6,#d72e75)}.tile.t5{background:linear-gradient(145deg,#e5efff,#7188ad)}
.boost-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0}.boost{height:45px;background:var(--panel);border:1px solid var(--line);border-radius:14px;font-size:18px}.boost span{font-size:10px;color:var(--muted);margin-left:2px}.game-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.page-head h2{margin:0;font-size:20px}.wallet-card{padding:20px;margin-top:10px}.wallet-label{color:var(--muted);font-size:12px}.wallet-balance{font-size:30px;font-weight:1000;margin-top:5px}.wallet-usd{color:var(--muted);font-size:12px;margin:4px 0 18px}.progress{height:9px;border-radius:99px;background:var(--panel2);overflow:hidden}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffc52f,#28dc7d);border-radius:inherit}.wallet-card p{font-size:11px;color:var(--muted);line-height:1.5}.wallet-card .primary-btn{width:100%;margin:7px 0 10px}.muted{color:var(--muted);font-size:10px}
.bottom-nav{position:fixed;bottom:10px;left:50%;transform:translateX(-50%);width:min(492px,calc(100% - 20px));display:grid;grid-template-columns:repeat(4,1fr);padding:7px;background:rgba(7,19,41,.9);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.12);border-radius:20px;box-shadow:0 18px 45px rgba(0,0,0,.3)}
body.light .bottom-nav{background:rgba(255,255,255,.9);border-color:rgba(18,33,59,.09)}
.nav-btn{background:transparent;padding:6px;border-radius:13px;font-size:18px;color:var(--muted)}.nav-btn.active{background:rgba(41,200,255,.12);color:var(--accent)}.nav-btn small{display:block;font-size:9px;font-weight:800;margin-top:2px}
.modal{position:fixed;inset:0;background:rgba(2,7,18,.72);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px;z-index:20}.modal.hidden{display:none}.modal-card{width:min(390px,100%);background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:25px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.45)}.modal-icon{font-size:55px}.modal-card h2{margin:8px 0}.modal-card p{color:var(--muted);font-size:13px}.modal-card .primary-btn{width:100%;margin-top:10px}.text-btn{background:transparent;color:var(--muted);padding:12px}
@media(min-width:600px){.app-shell{padding-top:25px}.bottom-nav{bottom:18px}.board{gap:7px}.tile{border-radius:12px}}

.mock-ad{position:fixed;inset:0;z-index:50;background:rgba(2,7,18,.88);backdrop-filter:blur(12px);display:grid;place-items:center;padding:22px}
.mock-ad.hidden{display:none}
.mock-ad-card{width:min(340px,100%);background:var(--panel);border:1px solid rgba(41,200,255,.35);border-radius:28px;padding:28px;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.5)}
.mock-ad-badge{display:inline-block;padding:6px 10px;border-radius:99px;background:rgba(255,197,47,.14);color:#ffc52f;font-size:9px;font-weight:1000;letter-spacing:1px}
.mock-ad-icon{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;margin:18px auto 10px;background:linear-gradient(145deg,#29c8ff,#6555ff);font-size:30px}
.mock-ad-card h2{margin:8px 0}.mock-ad-card p,.mock-ad-card small{display:block;color:var(--muted);font-size:11px;line-height:1.5}
.mock-ad-card small{margin-top:12px}.mock-ad-progress{height:9px;background:var(--panel2);border-radius:99px;overflow:hidden;margin:18px 0 9px}.mock-ad-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#29c8ff,#9c5cff);border-radius:inherit}

.withdraw-form{margin-top:12px}.field-label{display:block;font-size:10px;font-weight:900;color:var(--muted);margin:10px 0 5px}
.field{width:100%;min-height:45px;border-radius:13px;border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:0 12px;outline:none}
.withdraw-form .primary-btn{margin-top:14px}