:root{--night:#1B1340;--deep:#0F0A2A;--ink:#F6F1FF;--soft:#B9A6FF;--dim:#8f85c8;--gold:#FFE08A;--mint:#7FE0C2;--coral:#FF8A5B;--line:rgba(185,166,255,.16);--disp:"Unbounded",system-ui,sans-serif;--body:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--deep);color:var(--ink);font-family:var(--body);overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
button{font-family:var(--body);font-weight:700;font-size:15px;color:var(--night);background:var(--ink);border:0;border-radius:14px;padding:14px 22px;cursor:pointer}
button:active{transform:scale(.97)}
button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.gold{color:var(--gold)}.mint{color:var(--mint)}.dim{color:var(--dim)}
#hud{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);left:0;right:0;pointer-events:none;display:none}
.hudrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;padding:0 14px;gap:8px}
#coinsH{font-family:var(--disp);font-size:14px;color:var(--gold);padding-top:8px}
.hudrow>div:first-child{padding-left:50px}
#pauseB{position:absolute;left:12px;top:calc(env(safe-area-inset-top,0px) + 14px);width:40px;height:40px;padding:0;border-radius:50%;background:rgba(27,19,64,.85);border:1px solid var(--line);color:var(--ink);font-size:14px;font-weight:900;display:none;z-index:7}
#score{font-family:var(--disp);font-size:clamp(40px,9vw,64px);font-weight:900;line-height:1;text-align:center}
#mult{font-size:13px;color:var(--soft);text-align:center;margin-top:6px;min-height:18px;font-weight:600}
#mult b{color:var(--gold)}
#pus{display:flex;flex-direction:column;gap:5px;align-items:flex-end;padding-top:6px}
.pu{font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;color:#1B1340;white-space:nowrap}
#rel{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 14px);display:none;gap:6px;justify-content:center;flex-wrap:wrap;padding:0 14px;pointer-events:none}
.rl{font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;background:rgba(15,10,42,.8);border:1px solid;white-space:nowrap}
#offer{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 50px);display:none;flex-direction:column;gap:8px;padding:0 14px;max-width:460px;margin:0 auto;z-index:6}
#offer .oh{text-align:center;font-size:13px;font-weight:700;color:var(--gold);text-shadow:0 1px 4px #0F0A2A}
.ocard{display:grid;grid-template-columns:4px minmax(0,1fr);gap:12px;text-align:left;padding:12px 14px;border-radius:16px;background:rgba(27,19,64,.95);border:1px solid var(--line);color:var(--ink);font-family:var(--body);font-weight:400;width:100%}
.ocard i{border-radius:4px}.ocard b{font-size:15px}.ocard .tg{font-size:12px;color:var(--dim);font-weight:600;margin-left:6px}
.ocard small{display:block;font-size:13px;color:var(--soft);line-height:1.4;margin-top:3px}.ocard em{display:block;font-style:normal;font-size:12px;color:var(--gold);font-weight:700;margin-top:4px}
.ocard.sy{border-color:var(--gold)}
#revB{position:absolute;left:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);display:none;padding:12px 16px;border-radius:14px;border:1.5px solid rgba(185,166,255,.5);background:rgba(27,19,64,.92);color:var(--ink);z-index:6;font-family:var(--body);font-size:14px;font-weight:700}
#actB{position:absolute;right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);display:none;text-align:right;padding:10px 14px;border-radius:14px;border:1.5px solid;background:rgba(27,19,64,.92);color:var(--ink);z-index:6;font-family:var(--body);max-width:44vw}
#actB b{display:block;font-size:13px}#actB span{font-size:12px;color:var(--soft);font-weight:600}#actB.ready span{color:#1B1340}
#tip{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 80px);text-align:center;font-size:15px;font-weight:600;color:var(--soft);pointer-events:none;display:none}
#toast{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + 110px);transform:translateX(-50%);font-size:14px;font-weight:700;padding:10px 16px;border-radius:999px;background:var(--gold);color:var(--night);opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap;z-index:9}
#toast.on{opacity:1}
#banner{position:absolute;left:0;right:0;top:34%;text-align:center;pointer-events:none;opacity:0;transition:opacity .4s}
#banner.on{opacity:1}
#banner .k{font-size:14px;color:var(--soft);font-weight:600}
#secH{font-size:12px;color:var(--soft);margin-top:6px;font-weight:600;line-height:1.35;max-width:130px}
#banner .d{font-size:15px;color:var(--gold);font-weight:600;margin-top:8px;padding:0 20px}
#banner .n{font-family:var(--disp);font-size:clamp(26px,7vw,44px);font-weight:900;margin-top:4px}
.screen{position:absolute;inset:0;overflow-y:auto;touch-action:pan-y;transition:opacity .25s;z-index:5}
.screen.hide{opacity:0;pointer-events:none}
.wrap{max-width:440px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top,0px) + 16px) 18px calc(env(safe-area-inset-bottom,0px) + 20px)}
.res{display:flex;gap:16px;justify-content:center;font-family:var(--disp);font-size:14px}
.hero{text-align:center;margin-top:auto}
h1{font-family:var(--disp);font-size:clamp(54px,15vw,84px);font-weight:900;letter-spacing:-.05em;line-height:.9;margin:0}
.rank{font-size:14px;color:var(--soft);margin-top:10px;font-weight:600}
.planet{width:140px;height:140px;border-radius:50%;padding:0;margin:48px auto 44px;background:#FFB38A;color:#3A1A10;font-family:var(--disp);font-size:18px;font-weight:900;box-shadow:inset -22px -18px 0 rgba(120,40,20,.22),inset 14px 12px 0 rgba(255,255,255,.2);display:block}
.sect{font-size:12px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin:0 0 8px}
.mis{padding:10px 0;border-top:1px solid var(--line);font-size:14px}
.mis:first-of-type{border-top:0}
.mrow{display:flex;justify-content:space-between;gap:10px}
.bar{height:5px;border-radius:9px;background:rgba(185,166,255,.14);overflow:hidden;margin-top:8px}
.bar i{display:block;height:100%;background:var(--mint);border-radius:9px}
.nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.nav button{position:relative}
.badge{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--gold);color:var(--night);font-size:12px;display:none;align-items:center;justify-content:center}
.top{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;margin-bottom:18px}
.top h2{font-family:var(--disp);font-size:18px;margin:0}
.back{width:44px;height:44px;padding:0;border-radius:50%;background:transparent;color:var(--ink);border:1px solid var(--line);font-size:20px}
.tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--night);border-radius:14px;padding:4px;margin-bottom:16px}
.tabs button{background:transparent;color:var(--soft);padding:11px;border-radius:10px}
.tabs button.on{background:var(--ink);color:var(--night)}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.item:first-child{border-top:0}
.item b{font-size:15px}
.item .d{font-size:13px;color:var(--soft);margin-top:3px;line-height:1.45}
.item .n{font-size:12px;color:var(--dim);margin-top:3px}
.lv{font-size:12px;color:var(--dim);font-weight:600;margin-left:6px}
.buy{padding:10px 14px;font-size:14px;border-radius:12px;background:var(--gold);white-space:nowrap}
.buy.no{background:rgba(246,241,255,.08);color:var(--dim)}
.done{font-size:13px;font-weight:700;color:var(--mint)}
.lead{font-size:14px;color:var(--soft);line-height:1.55;margin:0 0 14px}
.pres{background:var(--night);border-radius:18px;padding:16px;margin-bottom:18px}
.pres b{font-size:16px}
.pres p{font-size:13px;color:var(--soft);line-height:1.5;margin:6px 0 12px}
.pres button{width:100%}
.skins{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.skin{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;background:var(--night);color:var(--ink);text-align:left;border:1px solid transparent;font-size:14px}
.skin.on{border-color:var(--gold)}
.skin small{font-weight:500;color:var(--dim);font-size:13px}
.trail{height:24px;position:relative;margin-bottom:6px}
.trail i{position:absolute;inset:0;clip-path:polygon(0 47%,86% 14%,86% 86%,0 53%)}
.trail em{position:absolute;right:6%;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#fff}
.over{justify-content:center;text-align:center}
#cause{font-size:15px;color:var(--soft);margin:0;font-weight:600}
.big{font-family:var(--disp);font-size:clamp(64px,18vw,104px);font-weight:900;margin:4px 0;line-height:1}
#bestO{margin:0 0 6px;font-size:14px;color:var(--gold);font-weight:600}
#earn{font-size:15px;margin:0 0 18px;font-weight:600}
.notes{font-size:13px;color:var(--mint);line-height:1.6;margin-bottom:14px}
.shop{text-align:left;background:var(--night);border-radius:18px;padding:6px 16px;margin-bottom:18px}
.shop .item{border-color:rgba(185,166,255,.12)}
.again{width:100%;padding:17px;font-size:16px}
.menuL{margin-top:10px;background:transparent;color:var(--soft);font-weight:600}
.ascsel{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px;margin:-26px auto 12px;max-width:320px;text-align:center}
.ascsel b{font-size:15px}.ascsel .small{font-size:12px;color:var(--soft);line-height:1.4;margin-top:2px}
.ab{width:44px;height:44px;padding:0;border-radius:50%;background:transparent;color:var(--ink);border:1px solid var(--line);font-size:20px}
.ab:disabled{opacity:.3}
.daily{width:100%;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}
.daily span{font-size:13px;color:var(--gold);font-weight:600}
.nav3{grid-template-columns:1fr 1fr 1fr}
.rrow{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-top:1px solid var(--line);font-size:14px}
.rrow:first-child{border-top:0}.rrow.me{color:var(--gold);font-weight:700}
.rrow .pos{font-family:var(--disp);font-size:13px;color:var(--dim)}
.col{padding:14px 0;border-top:1px solid var(--line)}.col:first-child{border-top:0}
.col b{font-size:15px}.col .d{font-size:13px;color:var(--soft);margin-top:3px;line-height:1.45}
.col .lk{font-size:13px;color:var(--dim);margin-top:4px}
.col.locked b{color:var(--dim)}
.gal{padding-top:calc(env(safe-area-inset-top,0px) + 22px)}
.ghead{text-align:center}
.map{position:relative;width:100%;aspect-ratio:1/1.05;margin:18px 0 10px}
.map svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.star:active{transform:translate(-50%,-50%) scale(.94)}
.star{position:absolute;transform:translate(-50%,-50%);background:transparent;border:0;padding:10px 12px;min-width:56px;min-height:56px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink);font-size:12px;font-weight:700;border-radius:14px}
.star i{display:block;width:18px;height:18px;border-radius:50%;background:#2a2350;box-shadow:0 0 0 2px rgba(185,166,255,.25)}
.star.lit i{box-shadow:0 0 18px 6px var(--sc),0 0 0 2px var(--sc);background:var(--sc)}
.star.open i{background:#1B1340;box-shadow:0 0 0 2px var(--sc);animation:pulseS 1.6s ease-in-out infinite}
.star.lock{color:var(--dim)}
.star.sel{background:rgba(185,166,255,.1)}
@keyframes pulseS{50%{box-shadow:0 0 12px 3px var(--sc),0 0 0 2px var(--sc)}}
.spanel{background:var(--night);border-radius:18px;padding:16px;margin-bottom:14px}
.spanel h3{font-family:var(--disp);font-size:20px;margin:0}
.spanel p{font-size:14px;color:var(--soft);line-height:1.5;margin:8px 0 0}
.spanel .zr{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.spanel .zr span{font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;background:rgba(185,166,255,.1);color:var(--soft)}
.spanel button{width:100%;margin-top:14px;padding:16px;font-size:16px}
.story{font-size:16px;line-height:1.6;color:var(--soft);max-width:34ch;margin:10px auto 18px}
.gifts{display:flex;flex-direction:column;gap:8px;margin:0 auto 16px;max-width:360px;width:100%}
.gifts div{background:var(--night);border-radius:14px;padding:12px 14px;text-align:left;font-size:14px;line-height:1.45}
.gifts b{display:block;color:var(--gold);font-size:13px;margin-bottom:2px}
.prog{display:flex;gap:6px;justify-content:center;margin:0 0 14px}
.prog span{width:44px;height:6px;border-radius:9px;background:rgba(185,166,255,.16)}
.prog span.on{background:var(--gold)}
.obB{width:100%;margin-bottom:10px;padding:16px;font-size:16px;background:var(--gold);color:var(--night);display:flex;justify-content:space-between;align-items:center}
.obB span{font-family:var(--disp);font-size:14px}
.kslot{background:var(--night);border-radius:16px;padding:14px;margin-bottom:10px}
.kslot b{font-size:15px}.kpick{display:flex;flex-direction:column;gap:6px;margin-top:10px;max-height:320px;overflow:auto}
.kpick button{text-align:left;padding:10px 12px;border-radius:12px;background:rgba(185,166,255,.08);color:var(--ink);font-weight:600;font-size:14px}
@media (prefers-reduced-motion:reduce){.screen,#toast,#banner{transition:none}}

.save-note{font-size:12px;line-height:1.5;color:var(--dim);text-align:center;margin:12px 0 0}