*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden;background:#0d0b1a;font-family:Vazirmatn,sans-serif;color:#fff;user-select:none;touch-action:none}
#app{position:fixed;inset:0;max-width:540px;margin:0 auto;overflow:hidden}
#c{position:absolute;inset:0;width:100%;height:100%;display:block}
.screen{position:absolute;inset:0;z-index:5}
.hidden{display:none!important}
.dim{background:rgba(12,9,28,.72);backdrop-filter:blur(3px)}
button{font-family:inherit;color:#fff;border:0;cursor:pointer}
.pill{display:flex;align-items:center;gap:6px;background:rgba(22,20,48,.85);border:1px solid rgba(255,255,255,.15);border-radius:20px;padding:4px 14px;font-weight:900;font-size:17px}
.pill img{width:20px;height:20px}
.coin i{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3a0,#f5a623 60%,#b86b00)}
.round{width:46px;height:46px;border-radius:50%;background:rgba(30,26,60,.9);border:1px solid rgba(255,255,255,.2);font-size:30px;line-height:40px;display:grid;place-items:center}
.btnP{display:block;width:72%;margin:0 auto;height:58px;font-size:26px;font-weight:900;border-radius:12px;transform:skewX(-10deg);background:linear-gradient(90deg,#ffa24a,#ff4fa0 60%,#d83cf0);box-shadow:0 5px 0 #8a1f6a,0 0 24px rgba(255,0,127,.4);text-shadow:0 2px 0 rgba(0,0,0,.3)}
.btnS{display:block;width:58%;margin:12px auto 0;height:50px;font-size:21px;font-weight:700;border-radius:10px;transform:skewX(-10deg);background:#1d1a3f;border:1px solid rgba(255,255,255,.25)}
.btnP:active,.btnS:active{transform:skewX(-10deg) scale(.95)}
.topbar{position:absolute;top:calc(14px + env(safe-area-inset-top));inset-inline:14px;display:flex;justify-content:space-between}
.logo{position:absolute;top:9%;inset-inline:0;text-align:center}
.logo img{width:110px;filter:drop-shadow(0 0 20px #ff6b35)}
.logo h1{font-size:62px;font-weight:900;line-height:1.3;margin-top:-20px;background:linear-gradient(180deg,#ffe36b,#ff6b35 50%,#ff007f);-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 #2a0f4a) drop-shadow(0 0 18px rgba(255,0,127,.5));font-style:italic}
.logo p{font-weight:700;font-size:17px;opacity:.9;text-shadow:0 2px 6px #000}
.menuBtns{position:absolute;bottom:calc(9% + env(safe-area-inset-bottom));inset-inline:0}
.hdr{position:absolute;top:calc(14px + env(safe-area-inset-top));inset-inline:14px;display:flex;align-items:center;justify-content:space-between;z-index:2}
.hdr h2{font-size:24px;font-weight:900;font-style:italic}
#lvList{position:absolute;top:80px;bottom:10px;inset-inline:16px;overflow:auto;display:flex;flex-direction:column;gap:14px;padding-bottom:20px}
.lv{position:relative;height:150px;border-radius:14px;overflow:hidden;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.18);flex-shrink:0;cursor:pointer}
.lv:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,10,35,.95),transparent 70%)}
.lv .n{position:absolute;top:6px;inset-inline-start:12px;font-size:30px;font-weight:900;z-index:1;text-shadow:0 2px 6px #000}
.lv .t{position:absolute;bottom:30px;inset-inline-start:12px;font-weight:900;font-size:19px;z-index:1}
.lv .st{position:absolute;bottom:8px;inset-inline-start:12px;z-index:1;display:flex;gap:3px}
.st img,.rstars img{width:20px;height:20px}
.off{filter:grayscale(1) brightness(.4)}
.lv.locked{filter:grayscale(.7) brightness(.6)}
.lv .lock{position:absolute;inset:0;margin:auto;width:60px;height:60px;z-index:2}
.popup{position:absolute;inset:0;display:grid;place-items:center;background:rgba(5,3,15,.6);z-index:3}
.card{position:relative;width:86%;max-width:400px;background:linear-gradient(180deg,#221a4e,#140f30);border:1px solid rgba(255,255,255,.2);border-radius:18px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.6);animation:pop .35s cubic-bezier(.2,1.4,.4,1)}
@keyframes pop{from{transform:scale(.7);opacity:0}}
.card.small{position:absolute;inset:0;margin:auto;height:fit-content;padding:22px 18px;text-align:center}
.card h3{font-size:26px;font-weight:900;font-style:italic}
.x{position:absolute;top:10px;inset-inline-end:10px;width:34px;height:34px;border-radius:50%;background:#2a2050;z-index:2;font-size:16px}
.pimg{height:140px;background-size:cover;background-position:center}
.pbody{padding:14px 20px 22px}
.pbody small{color:#ff9a6b;font-weight:700}
ul{list-style:none;margin:10px 0 18px}
li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1);font-weight:700;font-size:15px;text-align:start}
li img{width:22px;height:22px}
.gbot{position:absolute;bottom:calc(20px + env(safe-area-inset-bottom));inset-inline:14px;background:rgba(20,15,45,.85);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:14px}
.gnav{display:flex;align-items:center;justify-content:space-between;text-align:center;margin-bottom:8px}
.gnav h3{font-size:22px;font-weight:900}.gnav small{opacity:.75}
.stat{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;margin:6px 0}
.stat span{width:70px}.stat div{flex:1;height:9px;background:#2e2758;border-radius:5px;overflow:hidden}
.stat div i{display:block;height:100%;background:linear-gradient(90deg,#ff6b35,#ff007f);border-radius:5px}
#gAct{margin-top:14px}
/* HUD */
.pause{position:absolute;top:calc(12px + env(safe-area-inset-top));inset-inline-start:12px}
.pause img{width:26px}
.timer{position:absolute;top:calc(6px + env(safe-area-inset-top));inset-inline:0;margin:auto;width:150px;text-align:center;text-shadow:0 3px 8px rgba(0,0,0,.5);pointer-events:none}
.timer span{font-size:13px;font-weight:700;display:block;line-height:1.2}
.timer b{font-size:46px;font-weight:900;font-style:italic;line-height:1.1}
.timer.low b{color:#ff4d6d;animation:pulse .5s infinite alternate}
@keyframes pulse{to{transform:scale(1.12)}}
.nm{position:absolute;top:calc(16px + env(safe-area-inset-top));inset-inline-end:12px}
.tri{width:0;height:0;border-inline:8px solid transparent;border-bottom:14px solid #ffd23f}
.rank{position:absolute;top:calc(56px + env(safe-area-inset-top));inset-inline-end:14px;font-weight:900;font-size:15px;text-shadow:0 2px 4px #000}
.prog{position:absolute;top:calc(96px + env(safe-area-inset-top));inset-inline:20%;height:4px;background:rgba(40,30,60,.7);border-radius:2px;direction:ltr}
.prog .me,.prog .dot{position:absolute;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:#ff6b35;border:3px solid #fff;left:0}
.prog .dot{width:10px;height:10px;margin:-5px 0 0 -5px;border:0;background:#9fd4ff}
.flag{position:absolute;right:-18px;top:-8px;width:16px;height:16px;background:conic-gradient(#000 25%,#fff 0 50%,#000 0 75%,#fff 0);background-size:8px 8px}
.steer{position:absolute;top:56%;width:64px;height:64px;border-radius:50%;background:rgba(20,15,40,.35);border:2px solid rgba(255,255,255,.75)}
.steer i{display:block;margin:auto;width:0;height:0;border-block:11px solid transparent}
.steer.L{left:6%}.steer.L i{border-right:15px solid #fff;margin-left:20px}
.steer.R{right:6%}.steer.R i{border-left:15px solid #fff;margin-left:26px}
.steer.on{background:rgba(255,107,53,.5)}
.speedo{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom));left:10px;width:126px;height:126px;border-radius:50%;background:radial-gradient(#1c1830,#0d0b1a);border:2px solid #3a3555;text-align:center;direction:ltr;pointer-events:none}
.speedo svg{position:absolute;inset:0;transform:rotate(135deg)}
.trk,.val{fill:none;stroke-width:7;stroke-dasharray:235.6 314.2}
.trk{stroke:#3a3555}.val{stroke:url(#sg);stroke-linecap:round}
.speedo b{display:block;margin-top:28px;font-size:40px;font-weight:900;font-style:italic;line-height:1}
.speedo span{font-size:10px;color:#ffb347;font-weight:700}
.speedo em{display:block;width:34px;margin:2px auto 0;background:#2e2a45;border-radius:5px;font-style:normal;font-size:12px;font-weight:900}
.brake{position:absolute;bottom:calc(150px + env(safe-area-inset-bottom));left:22px;width:96px;height:42px;border-radius:21px;background:rgba(150,20,50,.65);border:2px solid rgba(255,255,255,.5);font-weight:900;font-size:16px}
.brake.on{background:#e0204f}
.nitro{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));right:12px;width:110px;height:110px;border-radius:50%;background:#1c1830}
.nitro .ring{position:absolute;inset:0;border-radius:50%}
.nitro .core{position:absolute;inset:9px;border-radius:50%;background:radial-gradient(#3b4bd8,#1d2290);display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid #4a5cff}
.nitro img{width:38px}.nitro span{font-weight:900;font-size:14px}
.nitro.on .core{box-shadow:0 0 30px #00d2ff;background:radial-gradient(#00d2ff,#1d2290)}
.nitro:active{transform:scale(.94)}
#toast{position:absolute;top:30%;inset-inline:0;text-align:center;font-size:30px;font-weight:900;font-style:italic;color:#ffd23f;text-shadow:0 3px 0 #8a1f6a,0 0 16px #ff007f;opacity:0;pointer-events:none}
#toast.go{animation:toast .9s ease-out}
@keyframes toast{0%{opacity:0;transform:scale(.5)}20%{opacity:1;transform:scale(1.15)}70%{opacity:1;transform:scale(1) translateY(-10px)}100%{opacity:0;transform:translateY(-40px)}}
#count{position:absolute;top:36%;inset-inline:0;text-align:center;font-size:90px;font-weight:900;font-style:italic;text-shadow:0 0 30px #ff007f;pointer-events:none}
#speedlines{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;background:repeating-conic-gradient(from 0deg at 50% 45%,transparent 0 3deg,rgba(255,255,255,.22) 3deg 3.4deg,transparent 3.4deg 9deg);-webkit-mask:radial-gradient(circle at 50% 45%,transparent 32%,#000 75%);mask:radial-gradient(circle at 50% 45%,transparent 32%,#000 75%)}
#flash{position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(transparent 40%,rgba(255,30,60,.6));opacity:0;transition:opacity .4s}
.rstars{display:flex;justify-content:center;gap:8px;margin:12px 0}
.rstars img{width:56px;height:56px;animation:pop .4s backwards}
.rstars img:nth-child(2){width:70px;height:70px;margin-top:-12px;animation-delay:.2s}
.rstars img:nth-child(3){animation-delay:.4s}
.reward{font-weight:900;color:#ffd23f;font-size:19px;margin-bottom:14px}
.row{display:flex}.row .btnS{width:44%}