@import "https://fonts.googleapis.com/css2?family=Bangers&family=Fredoka:wght@400;500;600&family=Press+Start+2P&display=swap";:root{--bg:#07071a;--panel:#151530d9;--panel-border:#2f2f6b;--text:#f2f2ff;--muted:#a9a9d6;--pink:#ff2e97;--cyan:#19f0ff;--lime:#b6ff3b;--yellow:#ffd400;--purple:#8b5cff}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100%}body{background:radial-gradient(ellipse at top, #1a1050 0%, var(--bg) 60%) fixed;color:var(--text);-webkit-tap-highlight-color:transparent;font-family:Fredoka,system-ui,sans-serif;line-height:1.4;overflow-x:hidden}button{cursor:pointer;font-family:inherit}.app{z-index:1;max-width:1100px;margin:0 auto;padding:0 16px 56px;position:relative}.bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.bg-stars{opacity:.55;background-image:radial-gradient(2px 2px at 20px 30px, #fff, transparent), radial-gradient(2px 2px at 120px 90px, var(--cyan), transparent), radial-gradient(1.5px 1.5px at 210px 150px, #fff, transparent), radial-gradient(2px 2px at 60px 170px, var(--pink), transparent);background-size:260px 200px;animation:5s ease-in-out infinite twinkle;position:absolute;inset:0}@keyframes twinkle{0%,to{opacity:.35}50%{opacity:.7}}.bg-grid{background-image:linear-gradient(var(--pink) 2px, transparent 2px), linear-gradient(90deg, var(--pink) 2px, transparent 2px);transform-origin:50% 100%;opacity:.32;background-size:70px 70px;height:50%;animation:2.2s linear infinite gridmove;position:absolute;bottom:-5%;left:-50%;right:-50%;transform:perspective(320px)rotateX(62deg);-webkit-mask-image:linear-gradient(#0000,#000 90%);mask-image:linear-gradient(#0000,#000 90%)}@keyframes gridmove{to{background-position:0 70px}}.float{opacity:.22;animation:linear infinite floatup;position:absolute;bottom:-60px}@keyframes floatup{0%{transform:translateY(0)rotate(0)}to{transform:translateY(-120vh)rotate(360deg)}}.scanlines{z-index:50;pointer-events:none;background:repeating-linear-gradient(#ffffff08 0 1px,#0000 1px 3px);position:fixed;inset:0}.marquee{border-bottom:2px solid var(--panel-border);background:#00000073;margin:0 -16px;overflow:hidden}.marquee-track{width:max-content;animation:40s linear infinite marquee;display:flex}.marquee-track span{white-space:nowrap;color:var(--yellow);padding:10px 30px;font-family:"Press Start 2P",monospace;font-size:.6rem}@keyframes marquee{to{transform:translate(-50%)}}.hero{grid-template-columns:1.1fr .9fr;align-items:center;gap:24px;padding:36px 0 28px;display:grid}.insert-coin{color:var(--lime);letter-spacing:2px;margin-bottom:8px;font-family:"Press Start 2P",monospace;font-size:.7rem;animation:1.1s steps(2,end) infinite blink}@keyframes blink{50%{opacity:0}}.title{letter-spacing:4px;flex-direction:column;margin:6px 0 14px;font-family:Bangers,cursive;line-height:.9;display:flex;transform:rotate(-3deg)}.title span{font-size:clamp(4rem,15vw,8.5rem)}.t1{color:var(--cyan);text-shadow:3px 3px #0a7f99,6px 6px #0a4f6a,9px 9px #07304a,0 0 40px #19f0ff8c}.t2{color:var(--pink);text-shadow:3px 3px #a0125f,6px 6px #6a0b40,9px 9px #3a0624,0 0 40px #ff2e978c;animation:4s infinite flicker}@keyframes flicker{0%,90%,to{opacity:1}92%{opacity:.7}94%{opacity:1}96%{opacity:.8}}.tagline{color:var(--muted);max-width:30ch;font-size:clamp(1rem,3.4vw,1.3rem)}.actions{flex-wrap:wrap;gap:14px;margin-top:26px;display:flex}.btn{--c:#fff;--shade:#888;letter-spacing:2px;background:var(--c);color:#0b0b1a;min-height:52px;box-shadow:0 6px 0 var(--shade), 0 0 26px color-mix(in srgb, var(--c) 55%, transparent);border:none;border-radius:14px;padding:14px 24px;font-family:Bangers,cursive;font-size:1.35rem;transition:transform .12s,box-shadow .12s,filter .12s}.btn:hover{filter:brightness(1.12);transform:translateY(-2px)}.btn:active{box-shadow:0 1px 0 var(--shade), 0 0 14px color-mix(in srgb, var(--c) 55%, transparent);transform:translateY(5px)}.btn:focus-visible{outline-offset:4px;outline:3px solid #fff}.btn-pink{--c:var(--pink);--shade:#a0125f}.btn-cyan{--c:var(--cyan);--shade:#0a7f99}.btn-lime{--c:var(--lime);--shade:#6a9a10}.btn-xl{width:100%;padding:18px 24px;font-size:1.9rem;animation:1.8s ease-in-out infinite pulse}.btn-ghost{--c:transparent;--shade:#1c1c44;color:var(--text);border:2px solid var(--panel-border);background:#ffffff0f}@keyframes pulse{50%{transform:scale(1.025)}}.hero-boss{text-align:center;padding:10px;position:relative}.boss-glow{aspect-ratio:1;filter:blur(10px);background:radial-gradient(circle,#ff2e9773,#0000 65%);width:80%;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.boss-big{filter:drop-shadow(0 0 22px #ff2e9799);width:min(340px,78vw);animation:2.4s ease-in-out infinite bob;position:relative}@keyframes bob{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-14px)rotate(3deg)}}.boss-tag{background:var(--yellow);color:#0b0b1a;border-radius:6px;margin-top:6px;padding:6px 10px;font-family:"Press Start 2P",monospace;font-size:.6rem;display:inline-block;position:relative}.boss-title{letter-spacing:2px;color:var(--pink);margin-top:8px;font-family:Bangers,cursive;font-size:2rem;position:relative}.hp{align-items:center;gap:10px;max-width:320px;margin:10px auto 0;display:flex;position:relative}.hp-label{color:var(--muted);font-family:"Press Start 2P",monospace;font-size:.55rem}.hp-bar{border:2px solid var(--panel-border);background:#1a1a3a;border-radius:8px;flex:1;height:14px;overflow:hidden}.hp-fill{background:linear-gradient(90deg, var(--lime), var(--yellow), var(--pink));width:100%;height:100%;animation:5s ease-in-out infinite hpwobble}@keyframes hpwobble{0%,to{width:100%}50%{width:72%}}.grid{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px;margin-top:10px;display:grid}.panel{background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:2px solid var(--panel-border);border-radius:18px;padding:18px 18px 20px;box-shadow:0 0 0 1px #19f0ff14,0 10px 30px #00000059}.panel-title{letter-spacing:1px;color:var(--cyan);align-items:center;gap:10px;margin-bottom:16px;font-family:"Press Start 2P",monospace;font-size:.7rem;display:flex}.panel-title:before{content:"";background:var(--pink);width:10px;height:10px;box-shadow:0 0 10px var(--pink);border-radius:2px}.stats{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat{text-align:center;background:#05050f;border:2px solid #1d1d44;border-radius:12px;padding:12px}.stat-big{grid-column:1/-1;padding:18px 12px}.stat-label{color:var(--muted);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:8px;font-size:.8rem}.stat-value{color:var(--lime);text-shadow:0 0 12px #b6ff3bb3;font-family:"Press Start 2P",monospace;font-size:1.9rem}.stat-value.sm{color:var(--yellow);text-shadow:0 0 10px #ffd40099;font-size:1.1rem}.roster{flex-direction:column;gap:12px;display:flex}.roster-item{background:#ffffff0a;border-radius:14px;align-items:center;gap:14px;padding:8px 10px;transition:transform .15s;display:flex}.roster-item:hover{background:#ffffff14;transform:translate(6px)}.roster-mon{flex-shrink:0;width:64px;height:64px;animation:3s ease-in-out infinite bob}.roster-item:nth-child(2) .roster-mon{animation-delay:-1s}.roster-item:nth-child(3) .roster-mon{animation-delay:-2s}.roster-name{letter-spacing:1px;color:var(--text);font-family:Bangers,cursive;font-size:1.3rem}.roster-note{color:var(--muted);font-size:.85rem}.ach-list{flex-direction:column;gap:10px;display:flex}.ach{background:#ffffff0a;border:1px solid #0000;border-radius:14px;align-items:center;gap:12px;padding:8px 10px;display:flex}.ach.locked{opacity:.5;filter:grayscale(.85)}.ach.unlocked{border-color:var(--lime);box-shadow:0 0 14px #b6ff3b59}.ach-icon{border:2px solid var(--purple);background:radial-gradient(circle at 30% 30%,#3a2a8a,#12123a);border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;font-size:1.5rem;display:grid}.ach-name{letter-spacing:1px;font-family:Bangers,cursive;font-size:1.1rem}.ach-desc{color:var(--muted);font-size:.8rem}.placeholder{text-align:center;padding:90px 16px}.placeholder h2{color:var(--cyan);letter-spacing:3px;text-shadow:0 0 20px #19f0ff80;font-family:Bangers,cursive;font-size:3rem}.placeholder p{color:var(--muted);margin:12px 0 30px}.fade-in{animation:.4s fade}@keyframes fade{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (width<=800px){.hero{text-align:center;grid-template-columns:1fr;padding-top:24px}.hero-text{flex-direction:column;align-items:center;display:flex}.title{align-items:center}.tagline{max-width:none}.actions{justify-content:center;width:100%}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.screen{max-width:720px;margin:0 auto;padding-top:28px}.back-link{color:var(--muted);background:0 0;border:none;padding:10px 0;font-family:"Press Start 2P",monospace;font-size:.6rem}.back-link:hover:not(:disabled){color:var(--cyan)}.back-link:disabled{opacity:.4;cursor:not-allowed}.screen-title{letter-spacing:3px;color:var(--cyan);text-shadow:3px 3px #0a4f6a,0 0 30px #19f0ff80;margin-top:10px;font-family:Bangers,cursive;font-size:clamp(2.4rem,9vw,4rem)}.screen-sub{color:var(--muted);margin:6px 0 22px}.chips{flex-wrap:wrap;gap:10px;margin-bottom:24px;display:flex}.chip{min-height:48px;color:var(--text);background:var(--panel);border:2px solid var(--panel-border);border-radius:999px;align-items:center;gap:8px;padding:12px 16px;font-size:1rem;font-weight:500;transition:transform .12s,border-color .12s,box-shadow .12s;display:inline-flex}.chip:hover:not(:disabled){border-color:var(--cyan);transform:translateY(-2px)}.chip.active{border-color:var(--lime);background:#b6ff3b1f;box-shadow:0 0 16px #b6ff3b66}.chip:disabled{opacity:.55;cursor:not-allowed}.chip-emoji{font-size:1.2rem}.chip:focus-visible{outline-offset:3px;outline:3px solid #fff}.field-label{color:var(--yellow);margin-bottom:8px;font-family:"Press Start 2P",monospace;font-size:.6rem;display:block}.textarea{resize:vertical;width:100%;color:var(--text);border:2px solid var(--panel-border);background:#05050f;border-radius:14px;padding:14px;font-family:inherit;font-size:1.05rem}.textarea:focus{border-color:var(--cyan);outline:none;box-shadow:0 0 16px #19f0ff59}.textarea:disabled{opacity:.6}.field-meta{justify-content:space-between;gap:12px;min-height:28px;margin:6px 0 18px;font-size:.9rem;display:flex}.error{color:#ff6b8b}.count{color:var(--muted)}.btn:disabled{opacity:.7;cursor:wait;animation:none;transform:none}.spinner{vertical-align:-3px;border:3px solid #0b0b1a4d;border-top-color:#0b0b1a;border-radius:50%;width:18px;height:18px;margin-right:6px;animation:.7s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.boss-card{text-align:center;background:var(--panel);border:2px solid var(--pink);border-radius:22px;padding:24px 18px 28px;box-shadow:0 0 40px #ff2e974d}.boss-card-mon{filter:drop-shadow(0 0 18px #ff2e978c);width:min(220px,60vw);margin:6px auto 0;animation:2.4s ease-in-out infinite bob;display:block}.boss-card-name{letter-spacing:2px;color:var(--pink);margin-top:6px;font-family:Bangers,cursive;font-size:clamp(2rem,8vw,3rem)}.badge{color:#0b0b1a;border-radius:6px;margin:6px 0 12px;padding:6px 12px;font-family:"Press Start 2P",monospace;font-size:.6rem;display:inline-block}.badge-easy{background:var(--lime)}.badge-medium{background:var(--yellow)}.badge-hard{background:var(--pink)}.boss-card-desc{color:var(--text);max-width:46ch;margin:0 auto;font-size:1.05rem}.boss-card-mission{letter-spacing:1.5px;color:var(--yellow);margin-top:12px;font-family:Bangers,cursive;font-size:1.3rem}.meta-grid{text-align:left;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:20px 0 8px;display:grid}.meta{background:#05050f;border:2px solid #1d1d44;border-radius:12px;padding:10px 12px}.meta-title{color:var(--cyan);margin-bottom:6px;font-family:"Press Start 2P",monospace;font-size:.55rem}.meta-body{font-size:.95rem}.boss-actions{justify-content:center;align-items:center}.boss-actions .btn-xl{flex:240px;width:auto}.game{max-width:760px}.hud{grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:10px;display:grid}.hud-box{text-align:center;background:#05050f;border:2px solid #1d1d44;border-radius:12px;padding:8px 12px}.hud-label{color:var(--muted);margin-bottom:6px;font-family:"Press Start 2P",monospace;font-size:.5rem;display:block}.hud-score,.hud-time{color:var(--lime);text-shadow:0 0 10px #b6ff3b99;font-family:"Press Start 2P",monospace;font-size:1.3rem}.hud-time{color:var(--yellow)}.hud-box.urgent{border-color:var(--pink);animation:.6s ease-in-out infinite pulse}.hud-box.urgent .hud-time{color:var(--pink);text-shadow:0 0 12px var(--pink)}.hud-mid{text-align:center}.hud-boss{letter-spacing:1px;color:var(--pink);font-family:Bangers,cursive;font-size:1.3rem;line-height:1.1}.hud-goal{color:var(--muted);font-size:.8rem}.timebar{border:2px solid var(--panel-border);background:#1a1a3a;border-radius:6px;height:10px;margin:10px 0;overflow:hidden}.timebar-fill{background:linear-gradient(90deg, var(--pink), var(--yellow), var(--lime));height:100%;transition:width .1s linear}.arena{border:3px solid var(--cyan);touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(circle at 50% 40%,#1a1456,#07071a 75%);border-radius:18px;width:100%;height:clamp(340px,56vh,480px);position:relative;overflow:hidden;box-shadow:0 0 30px #19f0ff4d,inset 0 0 40px #0009}.countdown{z-index:5;color:var(--yellow);text-shadow:4px 4px 0 var(--pink), 0 0 40px var(--yellow);place-items:center;font-family:Bangers,cursive;font-size:7rem;animation:.8s ease-out countpop;display:grid;position:absolute;inset:0}@keyframes countpop{0%{opacity:0;transform:scale(2.2)}to{opacity:1;transform:scale(1)}}.target{border:3px solid var(--lime);touch-action:none;-webkit-user-select:none;user-select:none;width:64px;height:64px;animation:appear .15s ease-out, shrink var(--ttl) linear forwards;background:#0a0a28bf;border-radius:50%;place-items:center;padding:0;font-size:2.1rem;line-height:1;display:grid;position:absolute;box-shadow:0 0 14px #b6ff3b8c}.target:active{transform:scale(.85)}.target-golden{border-color:var(--yellow);box-shadow:0 0 24px var(--yellow), 0 0 8px var(--yellow) inset;background:#ffd40040}.target-coffee{border-color:var(--cyan);box-shadow:0 0 16px var(--cyan)}.target-bomb{border-color:var(--pink);box-shadow:0 0 18px var(--pink);background:#ff2e9740}@keyframes appear{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes shrink{0%{opacity:1}70%{opacity:1}to{opacity:.35}}.pop{z-index:4;pointer-events:none;font-family:Bangers,cursive;font-size:2rem;animation:.7s ease-out forwards floatpop;position:absolute}.pop.good{color:var(--lime);text-shadow:0 0 10px var(--lime)}.pop.bad{color:var(--pink);text-shadow:0 0 10px var(--pink)}@keyframes floatpop{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-50px)}}.legend{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:12px;font-size:.95rem;display:flex}.legend-bad{color:#ff8fb5}.result.won{border-color:var(--lime);box-shadow:0 0 40px #b6ff3b59}.result.lost{border-color:var(--purple);box-shadow:0 0 40px #8b5cff59}.defeated{filter:grayscale(.7)drop-shadow(0 0 12px #b6ff3b80);animation:1s ease-in-out infinite wobble}@keyframes wobble{0%,to{transform:rotate(-12deg)scale(.92)}50%{transform:rotate(12deg)scale(.92)}}.final-score{background:#05050f;border:2px solid #1d1d44;border-radius:14px;max-width:320px;margin:12px auto;padding:14px 20px}.new-best{color:var(--yellow);margin-top:8px;font-family:"Press Start 2P",monospace;font-size:.6rem;animation:1s steps(2,end) infinite blink}.goal-note{color:var(--muted);margin-top:8px;font-size:.9rem}.unlocks{text-align:left;margin:16px 0 6px}.unlocks .meta-title{text-align:center;color:var(--lime);margin-bottom:8px}@media (width<=520px){.hud-score,.hud-time,.hud-boss{font-size:1rem}.countdown{font-size:5rem}}.mode-toggle{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;display:grid}.mode{letter-spacing:2px;min-height:52px;color:var(--text);background:var(--panel);border:2px solid var(--panel-border);border-radius:14px;padding:14px;font-family:Bangers,cursive;font-size:1.4rem;transition:transform .12s,border-color .12s,box-shadow .12s}.mode:hover{transform:translateY(-2px)}.mode:focus-visible{outline-offset:3px;outline:3px solid #fff}.mode.active-roast{border-color:var(--pink);background:#ff2e9726;box-shadow:0 0 20px #ff2e978c}.mode.active-cheer{border-color:var(--lime);background:#b6ff3b1f;box-shadow:0 0 20px #b6ff3b80}.roast-card{text-align:center;background:var(--panel);border:2px solid var(--pink);border-radius:18px;margin-top:24px;padding:20px}.roast-card.cheer{border-color:var(--lime);box-shadow:0 0 30px #b6ff3b4d}.roast-card.roast{box-shadow:0 0 30px #ff2e974d}.roast-card .meta-title{margin-bottom:10px}.roast-input{color:var(--muted);margin-bottom:10px;font-size:.9rem;font-style:italic}.roast-line{margin-bottom:16px;font-family:Fredoka,sans-serif;font-size:clamp(1.1rem,4vw,1.4rem);font-weight:500;line-height:1.4}.announce{border:2px dashed var(--cyan);background:#05050f;border-radius:14px;max-width:520px;margin:18px auto 6px;padding:14px}.announce-text{margin-bottom:12px;font-size:1rem;font-weight:500}.voice-btn{min-height:46px;padding:10px 18px;font-size:1.1rem}.voice-status{color:var(--muted);margin-top:10px;font-size:.85rem}.source-tag{color:#0b0b1a;background:var(--purple);border-radius:6px;margin:0 0 10px 8px;padding:5px 9px;font-family:"Press Start 2P",monospace;font-size:.5rem;display:inline-block}.roast-card .announce{margin-bottom:16px}
