@font-face{font-family:Normalidad;src:url('../assets/normalidad.woff2') format('woff2');font-display:swap}@font-face{font-family:Montserrat;src:url('../assets/montserrat.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--bg:#080909;--text:#f4f5ee;--muted:#969d96;--accent:var(--brand,#00FF72);--line:#313a30;--danger:#ff9383;font-family:Montserrat,Arial,sans-serif;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 52% 72%,#181a19 0,transparent 55%),var(--bg)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:wait}button:focus-visible,a:focus-visible,#stage:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{border:0;background:none}a{color:inherit}button:hover{color:var(--accent)}[hidden]{display:none!important}.app{max-width:1536px;margin:auto;padding:22px 32px 16px;height:100svh;min-height:610px;display:flex;flex-direction:column;gap:22px}header{display:flex;align-items:center;justify-content:space-between;height:38px;flex-shrink:0}.brand img{width:128px;display:block}nav{display:flex;align-items:center;gap:22px}#help{font-size:14px;padding:10px 0}.divider{display:none}.icon-button{width:42px;height:42px;display:grid;place-items:center;border:0;background:#ffffff06;border-radius:50%;flex-shrink:0}.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sound-waves{display:none}[aria-pressed=true] .sound-waves{display:initial}[aria-pressed=true] .sound-off{display:none}.intro{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0}h1{font-family:Normalidad,Arial,sans-serif;font-size:clamp(27px,4.4vw,66px);font-weight:800;line-height:1.12;letter-spacing:-.045em;margin:4px 0 10px}h1 span{color:var(--accent)}.intro p{color:#b9beb7;font-size:clamp(14px,1.7vw,23px);margin:0}.record{text-align:right;min-width:125px}.record>span{font-size:14px;color:#b9beb7}.record>div{font-size:36px;font-variant-numeric:tabular-nums;margin:3px 0} .record strong{color:var(--text);font-weight:600}.record>div>span{color:#b9beb7;font-weight:400}.record small{font-size:10px;color:var(--muted)}#stage{position:relative;flex:1;min-height:330px;isolation:isolate;overflow:hidden;border:0;border-radius:22px;touch-action:none;background:radial-gradient(ellipse at 50% 100%,#ffffff04,transparent 65%)}#stage>canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.hud{position:absolute;top:20px;left:22px;right:20px;display:flex;justify-content:space-between;gap:15px;z-index:3;pointer-events:none}.hud button{pointer-events:auto}.progress{width:min(260px,34%);font-size:26px;font-variant-numeric:tabular-nums}.progress strong{font-weight:600;color:var(--accent)}.progress small{font-size:11px;display:inline-block;margin-left:12px;color:var(--accent)}progress{appearance:none;height:5px;display:block;width:100%;margin-top:9px;border:0;border-radius:5px;overflow:hidden;background:#282c29}progress::-webkit-progress-bar{background:#282c29}progress::-webkit-progress-value{background:var(--accent);border-radius:5px}progress::-moz-progress-bar{background:var(--accent)}.status{display:flex;align-items:center;gap:22px;align-self:flex-start}#timer{font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted)}#lives{display:flex;gap:10px}#lives i{display:block;width:11px;height:11px;border-radius:50%;background:var(--accent);transition:background .2s}#lives i.spent{background:#333b31}#start-copy{position:absolute;top:19%;text-align:center;width:100%;pointer-events:none}h2{font-family:Normalidad,Arial,sans-serif;font-size:clamp(20px,2.3vw,30px);line-height:1.25;letter-spacing:-.025em;margin:0 0 13px}#start-copy p{font-size:13px;color:#b6beb0;margin:0}#jar-start{position:absolute;width:180px;height:260px;left:50%;bottom:60px;transform:translateX(-50%);border-radius:60px;z-index:2}#jar-start:hover{background:radial-gradient(ellipse,#00ff7206,transparent 70%)}#start-hint{position:absolute;bottom:26px;width:100%;text-align:center;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;color:#d1dac8;pointer-events:none}.pulse-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 14px #00ff7226}#effect-status{position:absolute;top:83px;left:22px;font-size:12px;color:var(--brand);z-index:2}#effects{position:absolute;inset:0;pointer-events:none;z-index:4}.float-text{position:absolute;font-size:17px;font-weight:600;white-space:nowrap;animation:float 1s ease-out forwards;color:var(--accent);transform:translateX(-50%)}.float-text.bad{color:var(--danger)}@keyframes float{from{opacity:1;translate:0 0}to{opacity:0;translate:0 -55px}}#countdown{position:absolute;inset:0;display:grid;place-items:center;font-family:Normalidad,Arial,sans-serif;font-size:70px;color:var(--accent);pointer-events:none}#overlay{position:absolute;inset:0;background:#080909b8;backdrop-filter:blur(12px);display:grid;place-items:center;z-index:8;padding:20px}.dialog-card{max-width:450px;text-align:center}.dialog-card p{font-size:14px;line-height:1.65;color:#bdc6b6;margin:12px auto 22px;max-width:380px}.primary{display:inline-flex;justify-content:center;align-items:center;min-height:48px;padding:12px 27px;border-radius:30px;background:#e9edeb;color:#111513;font-weight:600;font-size:14px}.primary:hover{background:#fff;color:#101513}.text-button{display:block;margin:15px auto 0;font-size:12px;color:#b3bea8}#dialog-symbol{display:block;color:var(--accent);font-size:44px;margin-bottom:18px}#result-stats{font-size:13px;color:#c6d1bc;margin-bottom:24px}#result-stats:empty{display:none}footer{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:30px;font-size:11px;flex-shrink:0}.control-tip{display:flex;align-items:center;gap:5px;color:#b9c0b3}.control-tip>span{margin-left:9px}kbd{font:13px Montserrat,sans-serif;border:0;background:#ffffff09;border-radius:5px;min-width:23px;height:23px;display:grid;place-items:center}.legend{display:flex;gap:22px}.legend>span{display:flex;align-items:center;gap:6px;white-space:nowrap;color:#b9c0b3}.legend b{font-weight:500;color:var(--text)}.capsule-icon{display:inline-block;width:9px;height:19px;border-radius:7px;background:linear-gradient(#eee7cf 49%,#c1baa5 50%,#ddd5bc 54%);rotate:25deg;margin-right:4px}dialog{background:#151716;border:0;border-radius:24px;color:var(--text);padding:38px;width:min(510px,calc(100% - 28px));max-height:90svh}dialog::backdrop{background:#080909c9;backdrop-filter:blur(10px)}dialog h2{padding-right:30px;font-size:23px}dialog p{font-size:13px;color:#bac6b3;line-height:1.7}dialog ul{padding:0;margin:24px 0;list-style:none;display:grid;gap:17px}dialog li strong,dialog li span{display:block;font-size:13px;line-height:1.6}dialog li span{color:#a5b59b;font-size:12px}.close{position:absolute;right:16px;top:16px;width:32px;height:32px;font-size:23px}.help-note{font-size:11px!important}.touch-guide{display:none;position:absolute;bottom:15px;width:100%;text-align:center;color:#93a383;font-size:18px;pointer-events:none}.touch-guide span{font-size:10px;margin:0 24px}#save-note{font-size:10px;color:#eac284;margin:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:700px){.app{padding:16px 14px max(12px,env(safe-area-inset-bottom));gap:18px;min-height:620px}header{height:32px}.brand img{width:100px}nav{gap:13px}#help{font-size:12px}.icon-button{width:36px;height:36px}.intro{align-items:flex-end}h1{max-width:260px;font-size:29px;line-height:1.18;letter-spacing:-.045em;margin:0 0 8px}.intro p{font-size:12px}.record{min-width:75px}.record>div{font-size:25px}.record>span{font-size:11px}.record small{font-size:8px}.hud{top:17px;left:16px;right:13px}.progress{font-size:23px;width:125px}.status{gap:12px}#lives{gap:7px}#lives i{width:9px;height:9px}#timer{display:none}#streak{display:block;height:13px;margin:5px 0 0;font-size:10px}progress{margin-top:2px}.touch-guide{display:block}body[data-phase=ready] .touch-guide,body[data-phase=opening] .touch-guide{display:none}#start-copy{top:23%}#start-copy h2{font-size:20px}#start-copy p{font-size:11px}#start-hint{font-size:11px;bottom:30px}#stage{border-radius:18px;min-height:350px}footer{justify-content:center}.control-tip{display:none}.legend{gap:16px;flex-wrap:wrap;justify-content:center;font-size:9px}.legend>span{gap:5px}.legend b{font-size:9px}#effect-status{top:96px;left:16px;font-size:10px}#jar-start{bottom:57px}dialog{padding:28px 24px}dialog h2{font-size:19px}}
@media(max-width:390px){h1{font-size:25px}.legend{gap:9px;font-size:8px}.legend b{font-size:8px}.record small{max-width:72px;display:block}}
@media(prefers-reduced-motion:reduce){.float-text{animation-duration:.25s}*{scroll-behavior:auto!important}}
.brand img{filter:brightness(0) invert(1)}
@media(max-width:700px){.legend{font-size:11px;gap:10px 16px}.legend b{font-size:11px}}
@media(min-width:701px){footer{font-size:13px}.record>div{font-size:44px}.record>span{font-size:16px}.record small{font-size:11px}}
@media(min-width:1400px){footer{font-size:15px}.record>div{font-size:48px}.progress{width:340px}}
.status{border-radius:30px;background:#080909e8;box-shadow:0 0 18px 9px #080909bb}

.item-icon{width:21px;height:21px;display:inline-block;flex-shrink:0}.item-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.junk-icon{color:#b6beb9}.coin-icon{color:var(--brand);background:#191d1b;border-radius:50%;padding:3px}h1{font-size:clamp(25px,4vw,60px);letter-spacing:-.045em}#stage{border-radius:0}.primary::after{content:"↗";color:#00833b;margin-left:16px}.record strong{color:var(--text)}
@media(max-width:700px){h1{font-size:27px;max-width:250px}#stage{border-radius:0}.legend{font-size:10px}.legend b{font-size:10px}}

/* Original studio: neutral rear beam, borderless field and quiet accents. */
:root{--bg:#030303}body{background:radial-gradient(ellipse at 50% 48%,#2b2b2b 0,#202020 18%,#0d0d0d 42%,#030303 72%);background-attachment:fixed}#stage{background:none}.record>span{white-space:nowrap}.record>div{margin-bottom:0}.touch-guide{bottom:5px;opacity:.65}

#start-hint{bottom:6px}#jar-start{bottom:24px}

.showcase-back{color:inherit;text-decoration:none;font-size:12px;padding:12px 8px;cursor:pointer}.showcase-back:hover{color:var(--brand,#00FF72)}.showcase-back:focus-visible{outline:2px solid var(--brand,#00FF72);outline-offset:3px}

@media(max-width:700px){header{height:auto;min-height:44px;flex-wrap:wrap;gap:8px}nav{gap:5px}.showcase-back{font-size:10px;padding:10px 4px}#help{font-size:10px}.brand img{width:82px}}
