:root{--cool-pink: #ff6fb2;--cool-pink-soft: #ffd2e6;--cool-pink-bg: #fff0f6;--cool-blue: #6fb8ff;--cool-blue-soft: #d2e8ff;--cool-mint: #9be3a8;--cool-cream: #fff7ea;--cool-ink: #2b1a3f;--cool-ink-soft: #6b5a82;--cool-gold: #ffd56a;--cool-lavender: #e6d5ff;--cool-peach: #ffd5b8;--cool-candy-red: #ff4f9e;--cabinet-border: #ff9ed4;--cabinet-glow: 0 0 0 4px #fff, 0 0 0 8px var(--cool-pink-soft), 0 8px 40px rgba(255, 111, 178, .45), 0 2px 8px rgba(43, 26, 63, .12);--cabinet-bg: linear-gradient(160deg, #fff8fc 0%, #ffe6f3 100%);--radius-pill: 9999px;--radius-card: 24px;--radius-cabinet: 32px;--shadow-soft: 0 6px 18px rgba(255, 111, 178, .18);--font-display: "Baloo 2", "Comic Sans MS", system-ui, sans-serif;--font-body: system-ui, -apple-system, sans-serif;--safe-top: env(safe-area-inset-top);--safe-bottom: env(safe-area-inset-bottom);--safe-left: env(safe-area-inset-left);--safe-right: env(safe-area-inset-right)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}html,body,#root{margin:0;padding:0;height:100%;width:100%;overflow:hidden;font-family:var(--font-body);color:var(--cool-ink);background:var(--cool-pink-bg)}#root{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left);padding-right:var(--safe-right)}.screen{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;gap:20px}.title-display{font-family:var(--font-display);font-size:clamp(48px,10vw,96px);font-weight:900;letter-spacing:.02em;color:var(--cool-pink);text-shadow:0 4px 0 #ffffff,0 6px 18px rgba(255,111,178,.3);margin:0;text-align:center;line-height:1}.subtitle{font-family:var(--font-display);font-size:20px;color:var(--cool-ink-soft);margin:0;text-align:center}.btn{font-family:var(--font-display);font-weight:800;font-size:22px;min-height:64px;min-width:64px;padding:16px 32px;border:none;border-radius:var(--radius-pill);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease;color:#fff;background:var(--cool-pink);box-shadow:var(--shadow-soft)}.btn:active{transform:scale(.96)}.btn-secondary{background:#fff;color:var(--cool-pink);box-shadow:0 2px 8px #2b1a3f1a}.btn-blue{background:var(--cool-blue)}.btn-big{font-size:28px;padding:22px 48px;min-height:80px}.card{background:#fff;border-radius:var(--radius-card);padding:20px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;align-items:center;gap:10px}.card-row{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}.text-input{font-family:var(--font-display);font-size:24px;padding:16px 20px;border:3px solid var(--cool-pink-soft);border-radius:var(--radius-pill);background:#fff;text-align:center;outline:none;width:min(320px,80vw)}.text-input:focus{border-color:var(--cool-pink)}.char-choice{width:140px;height:200px;border-radius:24px;border:4px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:transform .12s ease,border-color .12s ease;background:#fff;box-shadow:var(--shadow-soft);font-family:var(--font-display);font-weight:800;font-size:24px;color:var(--cool-ink)}.char-choice.sophia{background:linear-gradient(180deg,#fff0f6,#ffd2e6)}.char-choice.ashley{background:linear-gradient(180deg,#f0f7ff,#d2e8ff)}.char-choice.selected{border-color:var(--cool-pink);transform:scale(1.05)}@keyframes avatarBob{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}.avatar-bob{animation:avatarBob 2.4s ease-in-out infinite}@keyframes avatarWave{0%{transform:rotate(-12deg) scale(1.08)}25%{transform:rotate(8deg) scale(1.08)}50%{transform:rotate(-12deg) scale(1.08)}75%{transform:rotate(8deg) scale(1.08)}to{transform:rotate(0) scale(1)}}.avatar-wave{animation:avatarWave .7s ease-in-out}.topbar{position:fixed;top:calc(var(--safe-top) + 8px);left:calc(var(--safe-left) + 8px);right:calc(var(--safe-right) + 8px);display:flex;align-items:center;gap:12px;pointer-events:none;z-index:200}.topbar>*{pointer-events:auto}.topbar-circle{width:52px;height:52px;border-radius:50%;border:none;background:#fff;color:var(--cool-pink);font-size:28px;font-weight:900;font-family:var(--font-display);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #2b1a3f26;cursor:pointer;transition:transform .12s ease}.topbar-circle:active{transform:scale(.92)}.topbar-back{background:#fff;color:var(--cool-pink)}.topbar-spacer{background:transparent;box-shadow:none;cursor:default}.topbar-title{flex:1;font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--cool-ink);text-align:center;text-shadow:0 2px 0 white}.topbar-right{display:flex;align-items:center;gap:8px}.topbar-home{background:var(--cool-pink);color:#fff;font-size:26px;line-height:1}.screen-swap{animation:screen-fade .18s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}@keyframes screen-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.screen-swap{animation:none}}.game-overlay{position:fixed;top:calc(var(--safe-top) + 12px);right:calc(var(--safe-right) + 12px);display:flex;gap:10px;z-index:200}.game-overlay button{width:56px;height:56px;border-radius:50%;border:3px solid white;background:var(--cool-pink);color:#fff;font-size:24px;font-weight:900;font-family:var(--font-display);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 12px #2b1a3f4d;transition:transform .12s ease}.game-overlay button:active{transform:scale(.92)}.game-overlay .game-pause{background:var(--cool-gold);color:var(--cool-ink)}.pause-overlay{position:fixed;inset:0;background:#2b1a3f8c;display:flex;align-items:center;justify-content:center;z-index:300;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.pause-card{background:#fff;border-radius:var(--radius-card);padding:32px;display:flex;flex-direction:column;gap:16px;align-items:center;box-shadow:0 10px 40px #00000040;min-width:260px}.settings-list{width:min(420px,92vw);display:flex;flex-direction:column;gap:12px}.setting-row{display:flex;align-items:center;gap:16px;padding:16px 20px;background:#fff;border:none;border-radius:var(--radius-card);box-shadow:var(--shadow-soft);cursor:pointer;text-align:left;font-family:var(--font-display);color:var(--cool-ink);transition:transform .12s ease}.setting-row:active{transform:scale(.98)}.setting-row-text{flex:1}.setting-row-label{font-size:22px;font-weight:800}.setting-row-help{font-size:14px;color:var(--cool-ink-soft);margin-top:2px;font-family:var(--font-body);font-weight:400}.toggle{position:relative;width:58px;height:32px;border-radius:999px;background:#e0d6e8;transition:background .16s ease;flex-shrink:0}.toggle.on{background:var(--cool-pink)}.toggle-knob{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 2px 4px #00000026;transition:transform .16s ease}.toggle.on .toggle-knob{transform:translate(26px)}body{background:var(--cool-pink-bg)}@keyframes bgDrift{0%{transform:translate(0) scale(1)}33%{transform:translate(3%,2%) scale(1.04)}66%{transform:translate(-2%,4%) scale(.97)}to{transform:translate(0) scale(1)}}@keyframes bgDrift2{0%{transform:translate(0) scale(1)}40%{transform:translate(-4%,-2%) scale(1.06)}80%{transform:translate(2%,-3%) scale(.96)}to{transform:translate(0) scale(1)}}@keyframes candyFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-18px) rotate(6deg)}}@keyframes candyFloat2{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-5deg)}}@keyframes candySpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes candyWobble{0%,to{transform:rotate(-8deg) scale(1)}50%{transform:rotate(8deg) scale(1.08)}}.candy-room{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.candy-room__orb{position:absolute;border-radius:50%;will-change:transform}.candy-room__orb--a{width:60vmax;height:60vmax;top:-20vmax;left:-10vmax;background:radial-gradient(circle,rgba(255,210,230,.65) 0%,transparent 70%);animation:bgDrift 18s ease-in-out infinite}.candy-room__orb--b{width:55vmax;height:55vmax;top:-5vmax;right:-15vmax;background:radial-gradient(circle,rgba(230,213,255,.55) 0%,transparent 70%);animation:bgDrift2 22s ease-in-out infinite}.candy-room__orb--c{width:45vmax;height:45vmax;bottom:-10vmax;left:20%;background:radial-gradient(circle,rgba(255,213,184,.5) 0%,transparent 70%);animation:bgDrift 26s ease-in-out infinite reverse}.candy-room__orb--d{width:38vmax;height:38vmax;bottom:-5vmax;right:5%;background:radial-gradient(circle,rgba(155,227,168,.35) 0%,transparent 70%);animation:bgDrift2 20s ease-in-out infinite 4s}.candy-room__candy{position:absolute;opacity:.22;will-change:transform}@media(prefers-reduced-motion:reduce){.candy-room__orb,.candy-room__candy{animation:none!important}}.screen--game{padding:0;background:transparent;position:relative}.game-cabinet-wrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.game-cabinet-frame{width:100%;height:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;background:transparent;border:none;padding:0;box-shadow:none;border-radius:0;gap:0}.game-host{width:100%;height:100%;flex:1 1 auto;display:flex;align-items:center;justify-content:center;background:transparent;position:relative;z-index:1}.game-host canvas{display:block;max-width:100%;max-height:100%;touch-action:none;border-radius:0}.game-cabinet-side,.game-cabinet-header,.game-cabinet-footer{display:none}@media(min-width:900px){.screen--game{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0}.game-cabinet-wrap{width:auto;height:100%;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:0 24px}.game-cabinet-frame{background:var(--cabinet-bg);border:3px solid var(--cabinet-border);border-radius:var(--radius-cabinet);box-shadow:var(--cabinet-glow);padding:10px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:8px;position:relative}.game-cabinet-header{font-family:var(--font-display);font-weight:900;font-size:18px;color:var(--cool-pink);letter-spacing:.06em;text-shadow:0 2px 0 #fff,0 3px 8px rgba(255,111,178,.3);display:flex;align-items:center;gap:6px;white-space:nowrap}.game-cabinet-frame .game-host{aspect-ratio:9 / 16;height:min(1100px,calc(100dvh - 80px));width:auto;border-radius:16px;overflow:hidden;background:#ffe0ec}.game-cabinet-frame .game-host canvas{border-radius:0}.game-cabinet-footer{display:flex;gap:10px;align-items:center}.game-cabinet-footer__dot{width:10px;height:10px;border-radius:50%}.game-cabinet-side{display:flex;flex:1 1 0;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:24px;opacity:.55;pointer-events:none;max-width:220px;min-width:80px}.game-cabinet-side svg{filter:drop-shadow(0 4px 8px rgba(255,111,178,.3))}}.game-overlay button{width:60px;height:60px;min-width:44px;min-height:44px}.score-card{background:#fff;border-radius:var(--radius-card);padding:28px;box-shadow:var(--shadow-soft);max-width:380px;width:90vw;display:flex;flex-direction:column;align-items:center;gap:14px}.score-big{font-family:var(--font-display);font-weight:900;font-size:64px;color:var(--cool-pink);line-height:1}.score-stat-row{display:flex;gap:24px}.score-stat{text-align:center}.score-stat-value{font-family:var(--font-display);font-weight:800;font-size:28px;color:var(--cool-ink)}.score-stat-label{font-size:14px;color:var(--cool-ink-soft);text-transform:uppercase;letter-spacing:.05em}.credit{font-size:12px;color:var(--cool-ink-soft);text-align:center;margin-top:8px}.menu-card{background:#ffffffb8;border:3px solid var(--cabinet-border);border-radius:36px;box-shadow:0 0 0 6px #ffffff8c,0 0 0 10px #ff9ed438,0 16px 48px #ff6fb247,0 4px 12px #2b1a3f1a;padding:32px 28px 28px;display:flex;flex-direction:column;align-items:center;gap:12px;width:min(420px,90vw);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);position:relative}.menu-card__sparkle-row{display:flex;gap:6px;align-items:center;margin-bottom:2px}@keyframes letterBounce{0%{transform:translateY(32px) scale(.7);opacity:0}55%{transform:translateY(-8px) scale(1.08);opacity:1}75%{transform:translateY(4px) scale(.97)}to{transform:translateY(0) scale(1);opacity:1}}.title-letter{display:inline-block;animation:letterBounce .55s cubic-bezier(.34,1.56,.64,1) both}.nav-icon-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.nav-icon-btn{display:flex;flex-direction:column;align-items:center;gap:5px;background:#fff;border:3px solid transparent;border-radius:50%;width:68px;height:68px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;box-shadow:0 4px 12px #ff6fb233;position:relative;padding:0}.nav-icon-btn:focus-visible,.nav-icon-btn:hover{border-color:var(--cool-pink);box-shadow:0 0 0 4px #ff6fb240,0 4px 12px #ff6fb233;transform:translateY(-2px)}.nav-icon-btn:active{transform:scale(.93)}.nav-icon-wrap{display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;min-width:68px;min-height:88px}.nav-icon-label{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--cool-ink-soft);text-align:center;white-space:nowrap;pointer-events:none}.stats-candy-frame{border:2px solid var(--cool-pink-soft);border-radius:20px;padding:12px 20px;background:#ffffffb3;display:flex;gap:24px;position:relative;box-shadow:0 2px 8px #ff6fb21f}.stats-candy-frame:before{content:"";position:absolute;bottom:-3px;left:16px;right:16px;height:3px;background:linear-gradient(90deg,var(--cool-gold) 0%,var(--cool-pink-soft) 50%,var(--cool-gold) 100%);border-radius:0 0 4px 4px;opacity:.7}.stat-cell{text-align:center}.stat-cell-value{font-family:var(--font-display);font-weight:800;font-size:28px;color:var(--cool-ink);line-height:1}.stat-cell-label{font-size:12px;color:var(--cool-ink-soft);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}@keyframes profileSparkle{0%{transform:scale(1) translateY(0);box-shadow:var(--shadow-soft)}50%{transform:scale(1.04) translateY(-4px);box-shadow:0 12px 28px #ff6fb24d}to{transform:scale(1) translateY(0);box-shadow:var(--shadow-soft)}}.char-choice:hover,.char-choice:focus-visible{animation:profileSparkle .6s ease-in-out both}.char-crown-badge{position:absolute;top:-10px;right:-10px;pointer-events:none;filter:drop-shadow(0 2px 4px rgba(255,111,178,.4))}@keyframes btnPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.btn-pulse{animation:btnPulse 2.2s ease-in-out infinite}.text-input--candy{box-shadow:0 0 0 4px #ff6fb21f,0 4px 12px #ff6fb226}.text-input--candy:focus{box-shadow:0 0 0 4px #ff6fb247,0 4px 16px #ff6fb238}.setting-row-icon{flex-shrink:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;opacity:.8}@keyframes sparklePop{0%{transform:scale(0) rotate(-20deg);opacity:0}60%{transform:scale(1.2) rotate(10deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.toggle-sparkle{display:inline-flex;align-items:center;margin-left:6px;animation:sparklePop .35s cubic-bezier(.34,1.56,.64,1) both}.rank-badge{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:900;font-size:16px;flex-shrink:0}.rank-badge--1{background:#ffd56a;color:#7a4a00}.rank-badge--2{background:#d8d8e8;color:#4a4a6a}.rank-badge--3{background:#d4956a;color:#5a2a00}.rank-badge--n{background:var(--cool-lavender);color:var(--cool-ink)}.lb-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;transition:transform .12s ease,box-shadow .12s ease;cursor:default}.lb-row:hover,.lb-row:focus-within{transform:scale(1.01);box-shadow:0 4px 16px #ff6fb22e}.lb-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 0}.lb-empty__subtitle{font-family:var(--font-display);font-size:15px;color:var(--cool-ink-soft);text-align:center}.score-garland-row{width:100%;display:flex;gap:0;pointer-events:none;overflow:hidden;margin-bottom:-4px}.score-goal-hint{font-family:var(--font-display);font-size:15px;color:var(--cool-ink-soft);text-align:center;background:var(--cool-lavender);border-radius:12px;padding:6px 14px;margin-top:2px}@keyframes heartPulse{0%,to{transform:scale(1)}40%{transform:scale(1.22)}60%{transform:scale(1.1)}}.heart-pulse{display:inline-block;animation:heartPulse 1.4s ease-in-out infinite;color:var(--cool-pink);font-style:normal}.about-tagline{font-family:var(--font-display);font-size:16px;color:var(--cool-pink);text-align:center;opacity:.8;margin-top:4px}@media(prefers-reduced-motion:reduce){.title-letter,.btn-pulse,.char-choice:hover,.char-choice:focus-visible,.toggle-sparkle,.heart-pulse{animation:none!important;transform:none!important;opacity:1!important}}
