:root{--color-bg:#0f0823;--color-bg-2:#1a0f3d;--color-surface:#ffffff0f;--color-surface-solid:#1c1340;--color-primary:#a855f7;--color-primary-dark:#7c3aed;--color-accent:#ff7ac6;--color-accent-2:#ffb347;--color-cyan:#38e8ff;--color-text:#f4ecff;--color-text-muted:#b9aee0;--color-border:#a855f747;--font-sans:"Nunito", system-ui, sans-serif;--font-display:"Baloo 2", "Fredoka", system-ui, sans-serif;--radius:20px;--radius-lg:28px;--shadow:0 18px 50px #7c3aed47;--shadow-glow:0 0 36px #a855f78c;--grad-hero:linear-gradient(120deg, #ff7ac6 0%, #a855f7 38%, #38e8ff 100%);--grad-warm:linear-gradient(120deg, #ffb347 0%, #ff7ac6 100%);--max-width:1080px}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;font-family:var(--font-sans);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;background-image:radial-gradient(1100px 600px at 12% -10%,#ff7ac638,#0000 60%),radial-gradient(1000px 620px at 92% 0,#38e8ff2e,#0000 55%),radial-gradient(900px 700px at 50% 110%,#a855f747,#0000 60%);background-attachment:fixed;margin:0;font-size:1rem;font-weight:600;line-height:1.65;overflow-x:hidden}a{color:var(--color-accent);font-weight:700;text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em;margin-top:0;line-height:1.12}p{margin-top:0}img{max-width:100%;height:auto}button,.btn{font-family:var(--font-display);cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;gap:.5rem;padding:.85rem 1.7rem;font-size:1.02rem;font-weight:700;text-decoration:none;transition:transform .18s,box-shadow .25s,filter .2s;display:inline-flex;position:relative;overflow:hidden}button:hover,.btn:hover{text-decoration:none;transform:translateY(-2px)scale(1.02)}button:active,.btn:active{transform:translateY(0)scale(.99)}.btn-primary{background:var(--grad-hero);color:#1a0b2e;box-shadow:var(--shadow), var(--shadow-glow);background-size:200% 200%;animation:6s infinite gradient-pan}.btn-primary:after{content:"";background:linear-gradient(100deg,#0000,#ffffff8c,#0000);width:60%;height:100%;transition:left .6s;position:absolute;top:0;left:-120%;transform:skew(-20deg)}.btn-primary:hover:after{left:130%}.btn-secondary{color:var(--color-text);border:1.5px solid var(--color-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff14}.btn-secondary:hover{border-color:var(--color-accent);box-shadow:0 0 24px #ff7ac666}.btn-ghost{color:var(--color-text);background:0 0;border:1.5px solid #ffffff38}.btn-ghost:hover{background:#ffffff14}.page{width:100%;max-width:var(--max-width);flex:1;margin:0 auto;padding:2.5rem 1.25rem 4rem}.page-narrow{max-width:760px}.auth-page{justify-content:center;align-items:center;display:flex}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:var(--shadow);padding:1.6rem}.glow-card{border:1px solid var(--color-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow);background:linear-gradient(160deg,#ffffff1a,#ffffff08);position:relative}.glow-card:before{content:"";border-radius:inherit;background:var(--grad-hero);-webkit-mask-composite:xor;opacity:.5;pointer-events:none;background-size:200% 200%;padding:1px;animation:8s infinite gradient-pan;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem;margin-top:2rem;display:grid}.muted{color:var(--color-text-muted)}.gradient-text{background:var(--grad-hero);-webkit-text-fill-color:transparent;color:#0000;background-size:200% 200%;-webkit-background-clip:text;background-clip:text;animation:7s infinite gradient-pan}.badge{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text);border:1px solid var(--color-border);background:#a855f733;border-radius:999px;padding:.3rem .9rem;font-size:.78rem;font-weight:700;display:inline-block}.badge-accent{color:#ffd9ee;background:#ff7ac62e;border-color:#ff7ac673}@keyframes gradient-pan{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes float-soft{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes twinkle{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.layout{flex-direction:column;min-height:100vh;display:flex}.site-header{border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20;background:#0f0823b3;position:sticky;top:0}.header-inner{max-width:var(--max-width);justify-content:space-between;align-items:center;gap:1rem;margin:0 auto;padding:.8rem 1.25rem;display:flex}.brand{color:var(--color-text);align-items:center;gap:.75rem;text-decoration:none;display:flex}.brand:hover{text-decoration:none}.brand-icon{background:var(--grad-hero);color:#1a0b2e;width:2.6rem;height:2.6rem;box-shadow:var(--shadow-glow);background-size:200% 200%;border-radius:14px;justify-content:center;align-items:center;font-size:1.3rem;animation:6s infinite gradient-pan;display:flex}.brand-text{flex-direction:column;line-height:1.2;display:flex}.brand-name{font-family:var(--font-display);font-size:1.15rem;font-weight:800}.brand-sub{color:var(--color-text-muted);letter-spacing:.02em;font-size:.72rem;font-weight:700}.site-nav ul{align-items:center;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.nav-link{font-family:var(--font-display);color:var(--color-text-muted);border-radius:999px;padding:.5rem 1rem;font-weight:600;text-decoration:none;transition:background .15s,color .15s;display:block}.nav-link:hover{color:var(--color-text);background:#a855f72e;text-decoration:none}.nav-link.active{color:#1a0b2e;background:var(--grad-hero);background-size:200% 200%}.nav-cta{padding:.55rem 1.2rem;font-size:.95rem}.nav-cta:hover{text-decoration:none}.nav-link-btn{font-family:var(--font-display);cursor:pointer;color:var(--color-text-muted);background:0 0;border:none;border-radius:999px;padding:.5rem 1rem;font-size:1rem;font-weight:600;transition:background .15s,color .15s}.nav-link-btn:hover{color:var(--color-text);background:#a855f72e;transform:none}.site-main{flex:1}.site-footer{border-top:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f0823b3;margin-top:auto}.footer-inner{max-width:var(--max-width);text-align:center;margin:0 auto;padding:1.75rem 1.25rem}.footer-inner p{margin:.25rem 0;font-size:.9rem}@media (width<=680px){.header-inner{flex-direction:column;align-items:stretch}.site-nav ul{flex-wrap:wrap;justify-content:center}.brand{justify-content:center}}.game-embed{margin-top:1.5rem}.game-embed-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.game-embed-hint{margin:0;font-size:.9rem}.game-embed-fullscreen{flex-shrink:0}.game-embed-frame-wrap{background:#1a1235;min-height:420px;padding:0;position:relative;overflow:hidden}.game-embed-iframe{background:#1a1235;border:0;width:100%;height:min(72vh,720px);min-height:420px;display:block}.game-embed-iframe.is-loading{opacity:0;pointer-events:none;position:absolute;inset:0}.game-embed-loading,.game-embed-error{text-align:center;z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:2rem;display:flex;position:absolute;inset:0}.game-embed-spinner{border:3px solid #e4ddf5;border-top-color:var(--color-primary);border-radius:50%;width:2.5rem;height:2.5rem;animation:.8s linear infinite game-embed-spin}@keyframes game-embed-spin{to{transform:rotate(360deg)}}.game-embed:fullscreen{background:#000;padding:0}.game-embed:fullscreen .game-embed-toolbar{background:var(--color-surface);padding:.75rem 1rem}.game-embed:fullscreen .game-embed-frame-wrap{border-radius:0;flex:1;height:calc(100vh - 4rem);min-height:0}.game-embed:fullscreen .game-embed-iframe{height:100%;min-height:0}.hero{text-align:center;padding:3rem 1rem 3.5rem;position:relative}.hero-eyebrow{margin-bottom:1rem}.hero h1{max-width:16ch;margin:.5rem auto 1rem;font-size:clamp(2.6rem,7vw,4.6rem)}.hero-lead{color:var(--color-text-muted);max-width:620px;margin:0 auto 2rem;font-size:clamp(1.05rem,2.4vw,1.3rem)}.hero-actions{flex-wrap:wrap;justify-content:center;gap:.9rem;display:flex}.hero-sparkles{pointer-events:none;position:absolute;inset:0;overflow:hidden}.hero-sparkle{font-size:1.6rem;animation:3.5s ease-in-out infinite twinkle;position:absolute}.hero-sparkle.s1{animation-delay:0s;top:12%;left:8%}.hero-sparkle.s2{font-size:2.2rem;animation-delay:.6s;top:22%;right:10%}.hero-sparkle.s3{font-size:1.3rem;animation-delay:1.2s;bottom:18%;left:14%}.hero-sparkle.s4{animation-delay:1.8s;bottom:24%;right:16%}.hero-sparkle.s5{font-size:1.1rem;animation-delay:2.4s;top:46%;left:4%}.hero-sparkle.s6{animation-delay:.9s;top:52%;right:5%}.section{margin-top:4rem}.section-head{text-align:center;max-width:640px;margin:0 auto 2rem}.section-head h2{margin-bottom:.6rem;font-size:clamp(1.8rem,4vw,2.6rem)}.section-head p{color:var(--color-text-muted)}.feature-card{transition:transform .25s,box-shadow .25s}.feature-card:hover{box-shadow:var(--shadow), 0 0 30px #a855f759;transform:translateY(-6px)}.feature-card h3{margin-bottom:.4rem;font-size:1.3rem}.feature-icon{margin-bottom:.6rem;font-size:2.4rem;animation:5s ease-in-out infinite float-soft;display:block}.character-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.1rem;display:grid}.character{align-items:flex-start;gap:.9rem;padding:1.1rem;display:flex}.character-emoji{filter:drop-shadow(0 4px 10px #00000059);flex-shrink:0;font-size:2.1rem}.character h3{margin-bottom:.2rem;font-size:1.1rem}.character p{color:var(--color-text-muted);margin:0;font-size:.92rem}.scene-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.1rem;display:grid}.scene{border-radius:var(--radius);border:1px solid var(--color-border);color:#fff;min-height:150px;box-shadow:var(--shadow);flex-direction:column;justify-content:flex-end;padding:1.4rem;display:flex;position:relative;overflow:hidden}.scene h3{margin-bottom:.25rem;font-size:1.25rem}.scene p{opacity:.92;margin:0;font-size:.9rem}.scene-tag{font-size:1.7rem;position:absolute;top:.9rem;right:.9rem}.scene-start{background:linear-gradient(150deg,#6d28d9,#2563eb)}.scene-school{background:linear-gradient(150deg,#1e293b,#475569)}.scene-playground{background:linear-gradient(150deg,#059669,#84cc16)}.scene-dogpit{background:linear-gradient(150deg,#b45309,#7c2d12)}.scene-aquarium{background:linear-gradient(150deg,#0891b2,#1d4ed8)}.scene-boston{background:linear-gradient(150deg,#db2777,#f97316)}.music-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.8rem;display:grid}.music-row{align-items:center;gap:.9rem;padding:.9rem 1.1rem;display:flex}.music-note{font-size:1.5rem;animation:4s ease-in-out infinite float-soft}.music-row h4{font-family:var(--font-display);margin:0;font-size:1.05rem}.music-row p{color:var(--color-text-muted);margin:0;font-size:.85rem}.roadmap{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.1rem;display:grid}.roadmap-card{padding:1.4rem;position:relative}.roadmap-card .rm-tag{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.06em;color:var(--color-cyan);font-size:.78rem;font-weight:700}.roadmap-card h3{margin:.4rem 0 .5rem;font-size:1.3rem}.roadmap-card p{color:var(--color-text-muted);margin:0;font-size:.95rem}.roadmap-card.is-featured{background:linear-gradient(160deg,#ff7ac629,#ffb3471a)}.rm-emoji{margin-bottom:.5rem;font-size:2rem;display:block}.cta-band{text-align:center;border-radius:var(--radius-lg);margin-top:4.5rem;padding:3rem 1.5rem}.cta-band h2{margin-bottom:.6rem;font-size:clamp(1.9rem,4.5vw,2.8rem)}.cta-band p{color:var(--color-text-muted);max-width:520px;margin:0 auto 1.6rem}.about-list,.play-steps{color:var(--color-text-muted);margin:.75rem 0 0;padding-left:1.25rem}.about-list li,.play-steps li{margin-bottom:.5rem}code{color:#e9d5ff;background:#a855f72e;border-radius:6px;padding:.15rem .45rem;font-family:ui-monospace,SFMono-Regular,monospace;font-size:.88em}.auth-card{width:100%;max-width:460px;margin:2rem auto 0;padding:2.4rem}.auth-card h1{margin:.5rem 0;font-size:2rem}.auth-form{flex-direction:column;gap:1rem;margin-top:1.5rem;display:flex}.auth-form label{font-family:var(--font-display);flex-direction:column;gap:.4rem;font-size:.95rem;font-weight:600;display:flex}.auth-form input{border:1.5px solid var(--color-border);color:var(--color-text);background:#0a06188c;border-radius:12px;padding:.75rem 1rem;font-family:inherit;font-size:1rem;font-weight:600;transition:border-color .15s,box-shadow .15s}.auth-form input::placeholder{color:#b9aee08c}.auth-form input:focus{border-color:var(--color-accent);outline:none;box-shadow:0 0 0 3px #ff7ac633}.auth-error{color:#ffd2d2;background:#dc26262e;border:1px solid #f8717180;border-radius:12px;margin:0;padding:.6rem .85rem;font-size:.9rem}.auth-notice{color:#d8fff0;background:#10b9812e;border:1px solid #34d39980;border-radius:12px;margin:0;padding:.6rem .85rem;font-size:.9rem}.auth-form .btn{width:100%;margin-top:.25rem}.auth-switch{text-align:center;color:var(--color-text-muted);margin-top:1.4rem;font-size:.95rem}.play-gate{text-align:center;width:100%;max-width:540px;margin:1rem auto 0;padding:2.6rem}.play-gate h1{margin:.6rem 0 .8rem;font-size:2.2rem}.play-gate-lead,.play-gate .hero-actions{margin-bottom:1.8rem}.play-gate-perks{text-align:left;max-width:320px;color:var(--color-text-muted);gap:.6rem;margin:0 auto;padding:0;font-size:.95rem;list-style:none;display:grid}.profile-card{max-width:560px;margin:2rem auto 0;padding:2.2rem}.profile-header{align-items:center;gap:1.25rem;margin-bottom:1.75rem;display:flex}.profile-avatar{background:var(--grad-hero);color:#1a0b2e;width:3.8rem;height:3.8rem;box-shadow:var(--shadow-glow);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1.6rem;font-weight:800;display:flex}.profile-header h1{margin-bottom:.1rem;font-size:1.6rem}.profile-stats{grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.75rem;display:grid}.stat{border:1px solid var(--color-border);text-align:center;background:#ffffff0d;border-radius:14px;padding:1rem}.stat-label{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);margin-bottom:.35rem;font-size:.72rem;font-weight:700;display:block}.stat-value{font-family:var(--font-display);background:var(--grad-hero);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.9rem;font-weight:800;display:block}.profile-actions{flex-wrap:wrap;gap:.75rem;display:flex}.profile-actions .btn{flex:1}@media (width<=520px){.profile-stats{grid-template-columns:1fr}}
