:root{--or:#ff7a1a;--or2:#ffb347;--gr:#a6ff3d;--pu:#2a1838;--pu2:#1a1026;--ink:#f6efe4;--red:#ff3b3b;--blue:#38c8ff;--gold:#ffd23f;--font:'Barlow Condensed','Barlow',Impact,sans-serif}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
html,body{width:100%;height:100%;overflow:hidden;background:#1a1026;color:var(--ink);font-family:var(--font);touch-action:none}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block}
.hidden{display:none!important}
button{font-family:var(--font);cursor:pointer;border:0;color:inherit}
.ibtn{width:46px;height:46px;border-radius:12px;background:rgba(20,10,30,.7);border:2px solid rgba(255,179,71,.45);font-size:20px;font-weight:800;color:var(--or2);pointer-events:auto}
.coin{display:inline-block;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff4a8,#ffc21a 45%,#c97a00);box-shadow:0 0 0 2px #7a4300 inset;vertical-align:-3px}
.coin-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(20,10,30,.75);border:2px solid rgba(255,210,63,.5);border-radius:30px;padding:6px 14px 6px 8px;font-size:22px;font-weight:800;color:var(--gold)}

/* logo */
.logo{text-align:center;line-height:.82;filter:drop-shadow(0 6px 0 #2a0a00) drop-shadow(0 0 30px rgba(255,90,0,.45))}
.logo .l1{font-size:clamp(56px,11vw,130px);font-weight:900;font-style:italic;letter-spacing:-2px;background:linear-gradient(#fff3c4,#ffb347 45%,#ff5a00 70%,#a01a00);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo .l1 span{background:linear-gradient(#e8ffc0,#a6ff3d 50%,#3f9a00);-webkit-background-clip:text;background-clip:text}
.logo .l2{margin-top:10px;font-size:clamp(18px,3vw,30px);font-weight:800;letter-spacing:.45em;color:#d9b8ff;text-shadow:0 0 14px #8a3cff}

/* loading */
#loading{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:radial-gradient(ellipse at 50% 40%,#3b1f52,#140a1e 70%)}
.ltrack{width:min(380px,70vw);height:12px;border-radius:8px;background:#2b1a3a;overflow:hidden;border:2px solid #4a2d63}
.ltrack i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff5a00,#ffd23f);transition:width .2s}
#ltext{font-size:20px;font-weight:700;letter-spacing:.1em;color:#cdb6e6}

/* menu */
#menu{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:20px;background:linear-gradient(90deg,rgba(20,8,30,.85),rgba(20,8,30,.25) 55%,rgba(20,8,30,0));align-items:flex-start;padding-left:max(40px,6vw)}
#menu .logo{text-align:left}
.tag{font-family:'Barlow',sans-serif;font-size:20px;font-weight:600;color:#e4d6f2;max-width:420px}
.big-btn{min-width:280px;padding:16px 40px;font-size:42px;font-weight:900;font-style:italic;letter-spacing:.06em;border-radius:16px;color:#2a0e00;background:linear-gradient(#ffd27a,#ff7a1a 60%,#e04e00);box-shadow:0 7px 0 #8a2a00,0 0 40px rgba(255,120,30,.55);animation:pulse 1.6s infinite}
.big-btn:active{transform:translateY(5px);box-shadow:0 2px 0 #8a2a00}
@keyframes pulse{50%{box-shadow:0 7px 0 #8a2a00,0 0 70px rgba(255,140,40,.85)}}
.menu-row{display:flex;gap:14px}
.card-btn{display:flex;flex-direction:column;align-items:flex-start;min-width:150px;padding:12px 18px;border-radius:14px;background:rgba(40,20,60,.85);border:2px solid #6b3f8f;box-shadow:0 5px 0 #1a0a26}
.card-btn b{font-size:28px;font-weight:900;font-style:italic;color:var(--gr)}
.card-btn small{font-size:16px;font-weight:600;color:#cdb6e6}
.card-btn.gold{border-color:#a8781a}.card-btn.gold b{color:var(--gold)}
.menu-foot{position:fixed;top:16px;right:16px;display:flex;gap:10px;align-items:center}
.menu-best{font-size:18px;font-weight:700;letter-spacing:.1em;color:#b9a3d1}.menu-best b{color:var(--ink);font-size:24px;margin-left:6px}

/* HUD */
#hud{position:fixed;inset:0;z-index:5;pointer-events:none}
.hud-tl{position:absolute;top:max(12px,env(safe-area-inset-top));left:14px;width:min(270px,40vw)}
.night b{display:block;font-size:30px;font-weight:900;font-style:italic;color:var(--or2);text-shadow:0 3px 0 #000}
.night span{font-size:17px;font-weight:700;letter-spacing:.12em;color:#d9b8ff}
.obj{margin-top:6px;font-size:19px;font-weight:800;text-shadow:0 2px 0 #000}
.bar{height:12px;border-radius:7px;background:rgba(0,0,0,.55);border:2px solid rgba(255,255,255,.18);overflow:hidden;margin-top:4px}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7bd60f,#c8ff52);transition:width .15s}
.hud-tc{position:absolute;top:max(10px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);text-align:center;text-shadow:0 3px 0 #000}
#h-time{display:block;font-size:40px;font-weight:900;line-height:1}
#h-time.low{color:var(--red);animation:blink .5s infinite}
@keyframes blink{50%{opacity:.4}}
#h-score{font-size:22px;font-weight:800;color:var(--gold)}
#h-combo{margin-top:4px;opacity:0;transition:opacity .2s}
#h-combo.on{opacity:1}
#h-mult{display:block;font-size:38px;font-weight:900;font-style:italic;color:var(--gr);line-height:1}
#h-combobar{display:block;height:5px;width:120px;margin:4px auto 0;background:var(--gr);border-radius:3px;transform-origin:left}
.hud-tr{position:absolute;top:max(12px,env(safe-area-inset-top));right:14px;display:flex;gap:10px;align-items:center}
.hud-tr .coin-pill{font-size:20px}
#minimap{position:absolute;top:74px;right:14px;width:130px;height:130px;border-radius:50%;border:3px solid rgba(255,179,71,.5);background:rgba(10,5,18,.6)}
.hud-bl{position:absolute;left:14px;bottom:max(16px,env(safe-area-inset-bottom));width:min(300px,42vw)}
.gauge{margin-top:8px}.gauge label{font-size:16px;font-weight:800;letter-spacing:.12em;text-shadow:0 2px 0 #000}
.gauge .bar{height:16px}
.bar.hp i{background:linear-gradient(90deg,#ff3b3b,#ffb347)}
.bar.nitro i{background:linear-gradient(90deg,#1aa3ff,#9be7ff)}
.hud-br{position:absolute;right:20px;bottom:max(16px,env(safe-area-inset-bottom));text-align:right;text-shadow:0 3px 0 #000}
.hud-br b{display:block;font-size:64px;font-weight:900;font-style:italic;line-height:.9}
.hud-br span{font-size:18px;font-weight:800;letter-spacing:.15em;color:var(--or2)}
#frenzy{position:absolute;top:150px;left:50%;transform:translateX(-50%);font-size:26px;font-weight:900;color:#e08cff;text-shadow:0 0 16px #a020ff;animation:blink .6s infinite}
#count{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:150px;font-weight:900;font-style:italic;color:var(--or2);text-shadow:0 8px 0 #4a1500,0 0 50px #ff6a00;pointer-events:none}
#count.go{color:var(--gr);text-shadow:0 8px 0 #1a4a00,0 0 50px #6aff00}

/* popups / callouts / overlays */
#popups{position:fixed;inset:0;z-index:6;pointer-events:none;overflow:hidden}
.pop{position:absolute;left:0;top:0;font-size:28px;font-weight:900;font-style:italic;text-shadow:0 3px 0 #000,0 0 12px rgba(0,0,0,.6);white-space:nowrap;opacity:0;will-change:transform}
.pop.big{font-size:40px}
#callout{position:fixed;left:50%;top:30%;transform:translate(-50%,-50%);z-index:7;text-align:center;pointer-events:none;opacity:0}
#callout b{display:block;font-size:clamp(46px,8vw,86px);font-weight:900;font-style:italic;letter-spacing:.02em;text-shadow:0 6px 0 #000,0 0 30px currentColor;line-height:1}
#callout small{font-size:24px;font-weight:800;color:#fff;text-shadow:0 3px 0 #000}
#callout.show{animation:call 1.3s ease-out forwards}
@keyframes call{0%{opacity:0;transform:translate(-50%,-50%) scale(2.4) rotate(-6deg)}12%{opacity:1;transform:translate(-50%,-50%) scale(.92) rotate(-3deg)}22%{transform:translate(-50%,-50%) scale(1.05) rotate(-3deg)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-62%) scale(1) rotate(-3deg)}}
#screen-splats{position:fixed;inset:0;z-index:4;pointer-events:none;overflow:hidden}
#screen-splats i{position:absolute;border-radius:50%;background:radial-gradient(circle at 45% 45%,var(--c) 0 38%,transparent 40%),radial-gradient(circle at 75% 30%,var(--c) 0 12%,transparent 13%),radial-gradient(circle at 20% 72%,var(--c) 0 10%,transparent 11%),radial-gradient(circle at 70% 78%,var(--c) 0 8%,transparent 9%);opacity:.85;animation:drip 2.4s ease-in forwards;filter:drop-shadow(0 0 4px rgba(0,0,0,.6))}
@keyframes drip{0%{opacity:0;scale:.3}6%{opacity:.9;scale:1}60%{opacity:.75}100%{opacity:0;translate:0 60px;scale:1 1.25}}
#dmg{position:fixed;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 160px 40px rgba(255,0,0,.75);opacity:0;transition:opacity .25s}
#speedlines{position:fixed;inset:-10%;z-index:3;pointer-events:none;opacity:0;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,255,255,.0) 0deg 4deg,rgba(255,255,255,.18) 4.4deg 4.8deg,rgba(255,255,255,0) 5.2deg 9deg);-webkit-mask:radial-gradient(circle,transparent 32%,#000 70%);mask:radial-gradient(circle,transparent 32%,#000 70%);transition:opacity .2s}

/* touch */
#touch{position:fixed;inset:auto 0 0 0;z-index:8;display:flex;justify-content:space-between;align-items:flex-end;padding:0 14px max(14px,env(safe-area-inset-bottom));pointer-events:none}
#touch button{pointer-events:auto;width:86px;height:86px;border-radius:50%;background:rgba(30,15,45,.55);border:3px solid rgba(255,179,71,.6);font-size:34px;font-weight:900;color:#ffe2b8;touch-action:none}
#touch button.on{background:rgba(255,122,26,.55);transform:scale(.94)}
.t-left,.t-right{display:flex;gap:14px;align-items:flex-end}
#touch .sm{width:70px;height:70px;font-size:17px}
#touch .boost{width:96px;height:96px;font-size:20px;border-color:#38c8ff;color:#bdeeff}
body.touch .hud-bl{bottom:122px}
body.touch .hud-br{bottom:122px;right:16px}
body.touch .hud-br b{font-size:44px}

/* modal */
dialog#modal{margin:auto;border:0;background:transparent;color:var(--ink);max-width:min(760px,94vw);max-height:92vh;width:100%;overflow:visible}
dialog#modal::backdrop{background:rgba(10,4,18,.66);backdrop-filter:blur(3px)}
#modal-body{background:linear-gradient(#2c1a40,#1b1029);border:3px solid #6b3f8f;border-radius:20px;padding:22px;max-height:88vh;overflow:auto;box-shadow:0 18px 60px rgba(0,0,0,.6);touch-action:pan-y}
#modal-body h2{font-size:40px;font-weight:900;font-style:italic;color:var(--or2);text-align:center;line-height:1;margin-bottom:6px}
#modal-body h2.win{color:var(--gr)}#modal-body h2.lose{color:var(--red)}
.sub{text-align:center;font-size:19px;font-weight:700;color:#cdb6e6;margin-bottom:14px}
.btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.btn{padding:12px 22px;font-size:22px;font-weight:900;font-style:italic;border-radius:12px;background:#4a2d63;border:2px solid #7c52a0;box-shadow:0 4px 0 #160a20;min-width:130px}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #160a20}
.btn.pri{background:linear-gradient(#ffcf6b,#ff7a1a);color:#2a0e00;border-color:#ffd8a0}
.btn.ad{background:linear-gradient(#b4ff6a,#4fc400);color:#0f2a00;border-color:#d8ffb0}
.btn.ad::before{content:'▶ ';font-size:.8em}
.btn:disabled{opacity:.4;filter:grayscale(1)}
.close{position:absolute;top:-14px;right:-10px;width:44px;height:44px;border-radius:50%;background:#ff3b5c;border:3px solid #fff;font-size:24px;font-weight:900;z-index:2}
.levels{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.lvl{aspect-ratio:1;border-radius:14px;background:#3a2352;border:2px solid #6b3f8f;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:34px;font-weight:900;color:var(--ink);box-shadow:0 4px 0 #160a20}
.lvl small{font-size:16px;color:var(--gold);letter-spacing:2px}
.lvl.locked{opacity:.4}.lvl.next{border-color:var(--or);box-shadow:0 0 18px rgba(255,122,26,.6),0 4px 0 #160a20}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:10px 0}
.stat{background:rgba(0,0,0,.3);border-radius:12px;padding:10px;text-align:center}.stat small{display:block;font-size:15px;font-weight:700;color:#b9a3d1;letter-spacing:.1em}.stat b{font-size:30px;font-weight:900}
.stars{text-align:center;font-size:58px;letter-spacing:8px;line-height:1;margin:6px 0}.stars i{font-style:normal;color:#4a3a5a;display:inline-block}.stars i.on{color:var(--gold);text-shadow:0 0 18px #ffb000;animation:star .5s backwards}
.stars i:nth-child(2){animation-delay:.25s}.stars i:nth-child(3){animation-delay:.5s}
@keyframes star{0%{transform:scale(3);opacity:0}}
.goals{list-style:none;font-size:18px;font-weight:700;color:#cdb6e6;margin:8px auto;max-width:420px}.goals li{padding:3px 0}.goals li.ok{color:var(--gr)}
.cars{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.car{background:rgba(0,0,0,.3);border:2px solid #4a2d63;border-radius:14px;padding:10px;text-align:left}
.car.sel{border-color:var(--gr);box-shadow:0 0 16px rgba(166,255,61,.35)}
.car h3{font-size:24px;font-weight:900;font-style:italic}.car .sw{display:inline-block;width:16px;height:16px;border-radius:4px;vertical-align:-2px;margin-right:6px}
.car dl{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;font-size:15px;font-weight:700;margin:6px 0;align-items:center}.car dt{color:#b9a3d1}.car dd i{display:block;height:7px;border-radius:4px;background:var(--or)}
.car .btn{width:100%;min-width:0;font-size:18px;padding:8px}
.ups{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:12px}
.up{background:rgba(0,0,0,.3);border-radius:14px;padding:10px}.up h4{font-size:21px;font-weight:900}.up p{font-size:14px;font-weight:600;color:#b9a3d1;font-family:'Barlow',sans-serif;min-height:34px}
.pips{display:flex;gap:4px;margin:6px 0}.pips i{flex:1;height:8px;border-radius:3px;background:#4a3a5a}.pips i.on{background:var(--gr)}
.up .btn{width:100%;min-width:0;font-size:18px;padding:8px}
h3.sec{font-size:22px;font-weight:900;color:var(--gr);margin:16px 0 6px;letter-spacing:.06em}
.shop{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.item{background:rgba(0,0,0,.3);border:2px solid #4a2d63;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px}
.item.hot{border-color:var(--gold);box-shadow:0 0 18px rgba(255,210,63,.25)}
.item h4{font-size:22px;font-weight:900;font-style:italic;color:var(--gold)}.item p{font-size:15px;font-weight:600;font-family:'Barlow',sans-serif;color:#d8c8ea;flex:1}
.item .btn{min-width:0;width:100%;font-size:20px;padding:9px}
.tagline{display:inline-block;font-size:13px;font-weight:900;background:var(--red);color:#fff;border-radius:6px;padding:2px 8px;align-self:flex-start}
.row{display:flex;justify-content:space-between;align-items:center;padding:12px 4px;border-bottom:1px solid #3a2352;font-size:22px;font-weight:800}
.toggle{min-width:110px}
.help{font-family:'Barlow',sans-serif;font-size:16px;color:#cdb6e6;line-height:1.5;margin-top:12px}
.toast{position:fixed;left:50%;bottom:18%;transform:translateX(-50%);z-index:60;background:#1b1029;border:2px solid var(--gr);border-radius:12px;padding:10px 20px;font-size:22px;font-weight:800;animation:toast 2.2s forwards;pointer-events:none}
@keyframes toast{0%{opacity:0;transform:translate(-50%,20px)}10%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}
.test-ad{position:fixed;inset:0;z-index:100;background:#000d;color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800}

@media (max-width:760px),(max-height:520px){
  #menu{padding-left:20px;align-items:center;background:linear-gradient(rgba(20,8,30,.75),rgba(20,8,30,.35) 50%,rgba(20,8,30,.8));gap:12px}
  #menu .logo{text-align:center}.tag{text-align:center;font-size:17px}
  .big-btn{font-size:34px;min-width:230px;padding:12px 30px}
  #minimap{width:96px;height:96px;top:66px}
  .night b{font-size:24px}.night span{font-size:14px}.obj{font-size:16px}
  #h-time{font-size:32px}#h-mult{font-size:30px}
  #count{font-size:110px}
}
@media (max-height:520px){
  .logo .l1{font-size:64px}.logo .l2{font-size:16px;margin-top:4px}.tag{display:none}.menu-best{display:none}
  #touch button{width:70px;height:70px;font-size:28px}#touch .sm{width:58px;height:58px;font-size:15px}#touch .boost{width:78px;height:78px;font-size:17px}
  body.touch .hud-bl{bottom:96px;width:30vw}body.touch .hud-br{bottom:96px}
  #modal-body{padding:14px}#modal-body h2{font-size:30px}.stars{font-size:42px}
}
@media (orientation:portrait) and (max-width:760px){
  .hud-tl{width:46vw}#minimap{top:auto;bottom:250px;right:12px}
  body.touch .hud-bl{bottom:130px;width:55vw}
}
@media (orientation:portrait) and (max-width:760px){
  #touch{padding:0 8px max(10px,env(safe-area-inset-bottom))}
  .t-left,.t-right{gap:8px}
  #touch button{width:70px;height:70px;font-size:28px}
  #touch .sm{width:56px;height:56px;font-size:14px}
  #touch .boost{width:76px;height:76px;font-size:16px}
  body.touch .hud-bl{bottom:104px}body.touch .hud-br{bottom:104px}
}

/* BREYMANTECH branding */
.brand{display:flex;align-items:center;gap:12px;filter:drop-shadow(0 0 18px rgba(255,120,20,.35))}
.brand svg{width:58px;height:58px;flex:none;animation:brandGlow 3s ease-in-out infinite}
.brand div{display:flex;flex-direction:column;line-height:1}
.brand small{font-size:13px;font-weight:800;letter-spacing:.42em;color:#d9b8ff}
.brand b{font-size:34px;font-weight:900;font-style:italic;letter-spacing:.08em;background:linear-gradient(#fff4c8,#ffb347 45%,#ff6a00 75%,#c23a0a);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.5px rgba(255,220,160,.35)}
@keyframes brandGlow{50%{filter:drop-shadow(0 0 10px #ff8a1a)}}
.menu-brand{position:fixed;right:max(24px,3vw);bottom:max(20px,env(safe-area-inset-bottom));padding:12px 20px 12px 14px;border-radius:16px;background:linear-gradient(135deg,rgba(40,18,60,.85),rgba(20,8,30,.75));border:2px solid rgba(255,140,40,.45);box-shadow:0 0 30px rgba(255,100,20,.2),inset 0 0 20px rgba(255,120,30,.08)}
#loading .presents{margin-bottom:-6px;animation:fadeUp 1s ease-out both}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}}
@media (max-width:760px),(max-height:520px){
  .menu-brand{position:static;margin-top:6px;padding:8px 14px 8px 10px}
  .brand svg{width:44px;height:44px}.brand b{font-size:26px}.brand small{font-size:11px}
}
@media (max-height:520px){ .menu-brand{position:fixed;right:12px;bottom:10px;margin:0}.brand svg{width:36px;height:36px}.brand b{font-size:21px} }
#loading .presents .brand{transform:scale(1.35);margin-bottom:10px}