:root{--lav:#b9a7ef;--pink:#ffb8d6;--ink:#5a4a86;--cream:#fff8fc;--deep:#8a63d8}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:#d9c8f6;font-family:"Fredoka","Nunito","Quicksand","Trebuchet MS",system-ui,sans-serif;color:var(--ink)}
#c{position:fixed;inset:0;width:100%;height:100%;display:block}
#hud{position:fixed;inset:0;pointer-events:none;z-index:2}
#multbox{position:absolute;top:10px;left:50%;transform:translateX(-50%);text-align:center;min-width:240px;display:flex;flex-direction:column;align-items:center}
#mult{display:inline-block;padding:0 10px;font-size:58px;font-weight:900;line-height:1;color:#fff;letter-spacing:1px;-webkit-text-stroke:3px #a47de8;paint-order:stroke fill;text-shadow:0 4px 0 #ffb8d6,0 8px 24px rgba(140,100,220,.45);transition:transform .12s}
#mult.pop{animation:pop .22s}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.22) rotate(-3deg)}100%{transform:scale(1)}}
.pill{display:inline-block;max-width:calc(100vw - 20px);white-space:nowrap;overflow:visible;margin-top:6px;background:rgba(255,248,252,.8);border:2px solid #fff;border-radius:999px;padding:3px 14px;font-weight:800;font-size:14px;box-shadow:0 4px 14px rgba(150,120,220,.35)}
#prog{position:relative;height:9px;width:240px;margin:7px auto 0;border-radius:99px;background:rgba(255,255,255,.55);overflow:hidden;border:1.5px solid #fff}
#progfill{height:100%;width:0;background:linear-gradient(90deg,#ffb8d6,#b9a7ef,#9fd6ff);border-radius:99px;transition:width .2s}
#ticks{position:absolute;inset:0}#ticks i{position:absolute;top:0;bottom:0;width:2px;background:rgba(160,120,230,.6)}
.card{background:rgba(255,248,252,.74);backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,.95);border-radius:20px;padding:8px 14px;box-shadow:0 6px 24px rgba(150,120,220,.35),inset 0 0 18px rgba(255,200,230,.5)}
.stats{position:absolute;top:12px;right:12px;font-size:13px;line-height:1.55;min-width:150px}
#feed{position:absolute;top:14px;left:14px;display:flex;flex-direction:column;gap:6px;max-width:240px}
.ev{overflow-wrap:anywhere;white-space:normal;background:rgba(255,255,255,.85);border-radius:14px;padding:5px 12px;font-weight:800;font-size:14px;animation:floatin 2.4s forwards;box-shadow:0 3px 12px rgba(180,140,230,.35)}
.ev.pad{color:#e0559a}.ev.bump{color:#7a5cf0}.ev.lane{color:#4aa0c8}.ev.bin{color:#d08a00}.ev.storm{color:#6f63a0;background:rgba(220,212,240,.9)}.ev.sec{color:#b07ae8;background:rgba(255,246,210,.92)}
@keyframes floatin{0%{opacity:0;transform:translateX(-20px) scale(.8)}10%{opacity:1;transform:none}75%{opacity:1}100%{opacity:0;transform:translateY(-14px)}}
.muted{opacity:.6}.small{font-size:12px}
#overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:5;background:radial-gradient(ellipse at center,rgba(255,240,250,.15),rgba(120,90,190,.3));padding:10px}
#overlay.hidden{display:none}
.panel{background:rgba(255,248,252,.93);backdrop-filter:blur(10px);border:3px solid #fff;border-radius:28px;padding:16px 20px 12px;width:min(460px,100%);max-height:100%;overflow:auto;text-align:center;box-shadow:0 10px 50px rgba(140,100,220,.5),inset 0 0 30px rgba(255,190,225,.55)}
h1{margin:0 0 2px;font-size:28px;line-height:1.1;background:linear-gradient(90deg,#ff8fc4,#a68bff,#7ec8ff);-webkit-background-clip:text;background-clip:text;color:transparent;padding:2px 4px}
.tag{margin:0 0 6px;font-size:13px;font-style:italic;opacity:.85}
.prealpha{margin:0 0 8px;font-size:12px;font-weight:800;letter-spacing:.02em;color:#b05ad8}
#prealpha{margin-top:5px;font-size:11px;font-weight:800;letter-spacing:.03em;color:#7a5cc8;background:rgba(255,248,252,.8);border:1.5px solid #fff;border-radius:999px;padding:1px 10px;box-shadow:0 2px 8px rgba(150,120,220,.28)}
.chips{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin-bottom:8px}
.chips span{font-size:11px;font-weight:800;padding:2px 8px;border-radius:99px;background:#f3e9ff;color:#8a63d8;white-space:nowrap}
.chips span:nth-child(odd){background:#ffe6f2;color:#d9579a}
.bank{background:rgba(255,255,255,.7);border:2px solid #fff;border-radius:20px;padding:8px 10px;margin-bottom:10px;text-align:left}
.balrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}.balrow b{font-size:20px;color:#b05ad8}
#topup{font:inherit;font-size:12px;font-weight:800;border:none;border-radius:99px;padding:4px 10px;background:#ffe39a;color:#8a5a00;cursor:pointer}
.lbl{font-size:11px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:#9b7be6;margin:8px 0 4px}
.bets{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.bets button{min-width:0;font:inherit;font-weight:900;font-size:13px;padding:7px 2px;border-radius:14px;border:2px solid #e7dbff;background:#fff;color:#7a5cc8;cursor:pointer;white-space:nowrap}
.bets button.on{background:linear-gradient(180deg,#ffb3d6,#c9a8ff);color:#fff;border-color:#fff;box-shadow:0 3px 0 #9a7be0}
.bets button:disabled{opacity:.4;cursor:not-allowed}
.bonuses{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.bonus{display:flex;align-items:center;gap:6px;text-align:left;font:inherit;padding:6px 8px;border-radius:14px;border:2px solid #efe6ff;background:#fff;color:var(--ink);cursor:pointer;min-width:0}
.bonus .bi{font-size:18px;flex:none}
.bonus .bt{display:flex;flex-direction:column;min-width:0;flex:1}
.bonus .bt b{font-size:13px;line-height:1.15}
.bonus .bt small{font-size:10.5px;line-height:1.2;opacity:.75;overflow-wrap:anywhere}
.bonus .cost{flex:none;font-size:12px;font-weight:900;color:#d9579a;white-space:nowrap}
.bonus.on{border-color:#ff9cc9;background:#fff0f7;box-shadow:inset 0 0 0 1px #ff9cc9}
.bonus.on .bi::after{content:" ✓";font-size:12px;color:#d9579a}
.finalebuys{display:grid;grid-template-columns:1fr;gap:6px}
.fbuy{display:flex;align-items:center;gap:6px;text-align:left;font:inherit;padding:8px 10px;border-radius:16px;border:2px solid #efe6ff;background:linear-gradient(180deg,#fff,#fff6fb);color:var(--ink);cursor:pointer;min-width:0;box-shadow:0 3px 0 #f3e4ff}
.fbuy .bi{font-size:20px;flex:none}
.fbuy .bt{display:flex;flex-direction:column;min-width:0;flex:1}
.fbuy .bt b{font-size:13px;line-height:1.15}
.fbuy .bt small{font-size:10.5px;line-height:1.2;opacity:.8}
.fbuy .cost{flex:none;font-size:12px;font-weight:900;color:#d9579a;white-space:nowrap}
.fbuy.on{border-color:#ff9cc9;background:#fff0f7;box-shadow:inset 0 0 0 1px #ff9cc9,0 3px 0 #f3b6d4}
.fbuy.on .bi::after{content:" ✓";font-size:12px;color:#d9579a}
.fbuy[data-f="swirl"]{background:linear-gradient(180deg,#fff8ea,#fff)}
.fbuy[data-f="swirl"].on{background:#fff4dc;border-color:#f2c14d}
#total{margin-top:8px;font-size:13px;font-weight:800;color:#6d55b0}
#total.short{color:#d0436f}
#result{margin:2px 0 8px;white-space:normal}
#result .rline{font-size:14px}
#result .rwin{font-size:19px;font-weight:900;color:#b05ad8;margin:2px 0}
#result .rnet{font-size:13px;font-weight:900}#result .rnet.up{color:#3ea67a}#result .rnet.down{color:#d0436f}
#start{font:inherit;font-weight:900;font-size:20px;color:#fff;padding:11px 30px;border:none;border-radius:999px;cursor:pointer;background:linear-gradient(90deg,#ff9cc9,#b597ff);box-shadow:0 6px 0 #9a7be0,0 10px 30px rgba(255,150,200,.6);transition:transform .1s}
#start:hover{transform:translateY(-2px) scale(1.03)}#start:active{transform:translateY(3px);box-shadow:0 2px 0 #9a7be0}
#start:disabled{background:#c9c0dd;box-shadow:0 4px 0 #a9a0c0;cursor:not-allowed;transform:none}
.fine{font-size:11px;margin:8px 0 0;line-height:1.4}
#touch{position:fixed;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:16px;z-index:3}
#touch button{font:inherit;font-weight:800;padding:10px 18px;border-radius:999px;border:2px solid #fff;background:rgba(255,248,252,.78);color:var(--ink);cursor:pointer}
@media (min-width:1000px){#overlay{justify-content:flex-start;padding-left:6vw;background:linear-gradient(90deg,rgba(120,90,190,.3),rgba(255,240,250,0) 60%)}}
@media (max-width:640px){#mult{font-size:40px}.stats{top:auto;bottom:64px;right:8px;font-size:12px}#feed{top:auto;bottom:64px;left:8px;max-width:180px}#prog{width:180px}.bonuses{grid-template-columns:1fr}}
#overlay.done .chips,#overlay.done .tag{display:none}
/* ---------- touch + phone ---------- */
html,body{overscroll-behavior:none;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{position:fixed;inset:0;height:100dvh;width:100%}
#c{touch-action:none}
#hud{user-select:none;-webkit-user-select:none}
button{touch-action:manipulation}
.tch{display:none}
#multbox{top:max(10px,env(safe-area-inset-top))}
.stats{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}
#feed{left:max(14px,env(safe-area-inset-left))}
#touch{bottom:max(14px,calc(env(safe-area-inset-bottom) + 8px))}
#overlay{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
@media (pointer:coarse){.kb{display:none}.tch{display:inline}}
@media (max-width:640px){
  #multbox{min-width:0;width:calc(100% - 16px)}
  #mult{font-size:40px;-webkit-text-stroke:2.5px #a47de8}
  .pill{font-size:12px;padding:2px 10px;margin-top:4px}
  #prog{width:min(220px,70vw);height:8px;margin-top:5px}
  .stats{top:auto;right:auto;left:50%;transform:translateX(-50%);bottom:calc(max(14px,env(safe-area-inset-bottom) + 8px) + 70px);display:flex;flex-wrap:nowrap;gap:12px;align-items:center;justify-content:center;white-space:nowrap;padding:6px 14px;min-width:0;font-size:13px;line-height:1.3;border-radius:999px;max-width:calc(100vw - 16px)}
  .stats .opt,.stats .kb{display:none}
  #feed{top:calc(max(10px,env(safe-area-inset-top)) + 92px);bottom:auto;left:50%;transform:translateX(-50%);max-width:calc(100vw - 24px);align-items:center}
  #feed .ev{font-size:12.5px;padding:4px 11px}
  #feed .ev:nth-child(n+3){display:none}
  #touch{gap:12px;padding:0 max(12px,env(safe-area-inset-left)) 0 max(12px,env(safe-area-inset-right))}
  #touch button{flex:1 1 0;max-width:200px;min-height:58px;font-size:18px;border-radius:22px;background:rgba(255,248,252,.88);box-shadow:0 4px 0 #c9b2ff,0 6px 18px rgba(150,120,220,.35)}
  #touch button:active{transform:translateY(3px);box-shadow:0 1px 0 #c9b2ff}
  #overlay{align-items:stretch;background:rgba(120,90,190,.25)}
  .panel{width:100%;max-height:100%;display:flex;flex-direction:column;padding:14px 14px 0;border-radius:24px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  h1{font-size:25px}
  .tag{font-size:12.5px}
  .chips{gap:4px}.chips span{font-size:11px}
  .bank{padding:10px}
  .balrow b{font-size:21px}
  #topup{min-height:36px;padding:6px 12px;font-size:13px}
  .bets{gap:6px}
  .bets button{min-height:44px;font-size:12px;min-width:0;padding:6px 1px}
  .bonuses,.finalebuys{grid-template-columns:1fr;gap:7px}
  .fbuy{min-height:56px}
  .bonus{min-height:56px;padding:8px 10px}
  .bonus .bt b{font-size:14.5px}.bonus .bt small{font-size:12px}.bonus .cost{font-size:13.5px}
  #total{font-size:14px}
  #start{position:sticky;bottom:0;margin:4px -14px 0;width:calc(100% + 28px);border-radius:0 0 22px 22px;min-height:60px;font-size:21px;box-shadow:0 -6px 18px rgba(255,248,252,.95);order:10}
  .fine{font-size:11.5px}
  .fine.muted{margin-bottom:8px}
  #overlay.done .chips,#overlay.done .tag,#overlay.done h1{display:none}
  #result .rwin{font-size:22px}
}
@media (max-height:500px) and (orientation:landscape){
  #mult{font-size:34px}.pill{font-size:11px}
  .stats{font-size:11px;line-height:1.35;padding:6px 10px}.stats .opt{display:none}
  #touch button{min-height:48px}
  .bets button{min-height:44px}
  .panel{padding:10px 14px 0}
  #start{position:sticky;bottom:0;width:100%;border-radius:0 0 22px 22px;min-height:50px;margin-top:4px}
  .panel .chips,.panel .tag{display:none}
}
.walletline{margin:4px 0 0;font-size:12px;line-height:1.4;color:#7a64b8}
.walletline a,#result .rnote a{color:#b05ad8;font-weight:800}
#result .rnote{margin-top:6px;font-size:13px;font-weight:700;color:#6d55b0}
#result .rnote.bad{color:#d0436f}
#result .rnote button{font:inherit;font-weight:900;font-size:14px;min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid #fff;background:linear-gradient(90deg,#ffe39a,#ffc1dc);color:#7a4a00;cursor:pointer;box-shadow:0 3px 0 #e0b060}

/* game speed: exactly three levels, 1× / 1.5× / 2× */
#touch #spd{flex:0 0 auto;min-width:64px;max-width:none;padding-left:12px;padding-right:12px}
#touch #spd.on{background:#ffd6ec;color:#7a3a8c}
.rroute{margin-top:2px;font-size:11.5px;line-height:1.35;color:#7a64b8;opacity:.85;white-space:normal;overflow-wrap:anywhere}
.rseed{margin-top:4px;font-size:11px;opacity:.7}.rseed code{font:inherit;font-weight:800;letter-spacing:.04em}

.how{margin:6px auto 8px;padding:0 0 0 18px;max-width:440px;text-align:left;font-size:12px;line-height:1.45;color:#6b5a8e}.how li{margin:1px 0}.how b{color:#8a5cc8}
@media (max-height:620px){.how{font-size:11px;margin:4px auto}}
