@charset "UTF-8";
:root{--paper:#f4f3eb;--ink:#23281f;--muted:#74776b;--line:#d8d9cf;--accent:#f15b3c;--soft:#e8e8de;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Helvetica Neue",sans-serif;transition:background .5s,color .5s;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #4472eb;outline-offset:6px}button{border:0}button svg{pointer-events:none}::selection{background:#f5bf74;color:#23281f}.page{max-width:1240px;margin:auto;padding:0 44px}.header{height:108px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px}.wordmark{text-decoration:none;display:flex;align-items:center;font-size:31px;font-weight:800;letter-spacing:-1.7px}.brand-mark{font-size:38px;font-weight:400;color:var(--accent);margin-right:12px;line-height:1}.brand-period{color:var(--accent)}.header-right{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted)}.live-dot{width:6px;height:6px;border-radius:50%;background:#809464}.counter{font-size:14px;font-variant-numeric:tabular-nums;border:1px solid var(--line);border-radius:24px;padding:11px 17px;margin-left:22px;color:var(--ink)}.counter-label{font-size:11px;margin-left:5px;color:var(--muted)}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:25px;align-items:center;padding:69px 0 64px;min-height:500px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;display:flex;align-items:center;gap:10px;margin:0 0 23px}.tiny-line{width:23px;height:1px;background:currentColor}h1{font-size:clamp(64px,7.8vw,104px);line-height:.98;letter-spacing:-7px;font-weight:700;margin:0 0 24px}h1 span{color:#78865d}.intro{color:var(--muted);font-size:15px;line-height:1.65;margin:0}.explore{display:inline-flex;gap:26px;align-items:center;font-size:12px;font-weight:600;text-decoration:none;margin-top:27px}.explore span{font-size:23px;font-weight:400}.hero-toy{height:340px;position:relative;display:grid;place-items:center}.big-button-base{width:225px;height:225px;border-radius:50%;padding:11px;background:#deded3;box-shadow:0 17px 0 #c5c6b9,0 20px 0 #fdfcf5,0 35px 24px -13px #363e3038;transform:rotate(-11deg)}.big-button{position:relative;background:radial-gradient(ellipse at 40% 20%,#ff8268 0%,#f15b3c 60%,#db442b 100%);border-radius:50%;height:100%;width:100%;color:#fff5df;box-shadow:inset 0 3px 3px #ffffff6b,inset 0 -3px 3px #a4302b80,0 13px 0 #b33b28,0 18px 10px #843f2733;transform:translateY(-12px);transition:transform .14s,box-shadow .14s;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:8px}.big-button>span:first-child{font-size:95px;letter-spacing:-7px;font-weight:800;line-height:1}.button-micro{font-size:9px;letter-spacing:2px;margin-top:13px}.big-button:active,.big-button.pressed{transform:translateY(-2px);box-shadow:inset 0 2px 3px #ffffff6b,0 3px 0 #b33b28,0 5px 5px #843f2733}.sticker{position:absolute;z-index:2;right:0;top:14px;border-radius:3px;background:#e3e9ad;color:#4c5536;box-shadow:0 2px 3px #20281b0b;padding:14px 17px;font-size:9px;line-height:1.6;letter-spacing:1px;font-weight:700;transform:rotate(10deg)}.toy-caption{position:absolute;bottom:0;right:5px;font-size:11px;line-height:1.5;color:var(--muted);transform:rotate(-7deg)}.scribble{position:absolute;right:120px;bottom:42px;font-size:56px;font-family:Georgia,serif;transform:rotate(5deg);color:var(--muted)}.orbit-star{position:absolute;left:25px;top:15px;font-size:55px;color:#919c72;transform:rotate(-16deg)}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:20px}h2{font-size:20px;letter-spacing:-.7px;margin:0}.section-heading>span{font-size:11px;color:var(--muted)}.section-heading>span>span{font-size:20px;margin-left:10px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.toy-card{border:1px solid #25291c0b;border-radius:18px;height:322px;overflow:hidden;display:flex;flex-direction:column;padding:23px 25px 24px;position:relative;color:#293021;transition:transform .25s,box-shadow .25s}.toy-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px -18px #29302140}.card-top{display:flex;align-items:center;justify-content:space-between;font-size:17px;min-height:17px}.card-number{font-size:9px;letter-spacing:1.3px;font-weight:600;opacity:.64}.toy-stage{flex:1;display:flex;justify-content:center;align-items:center;position:relative;min-height:178px}.card-bottom h3{font-size:21px;font-weight:600;letter-spacing:-.6px;margin:0 0 7px}.card-bottom p{font-size:11px;line-height:1.5;margin:0;opacity:.65}.card-party{background:#ece5a9}.round-base{width:104px;height:104px;border-radius:50%;background:#c5be85;padding:5px;transform:rotate(-8deg);box-shadow:0 4px 0 #d3ca8a,0 10px 10px #655f3426}.party-button{display:grid;place-items:center;border-radius:50%;width:100%;height:100%;background:linear-gradient(#829461,#687f49);box-shadow:inset 0 2px 2px #c0c79b,0 8px 0 #4e6238,0 10px 7px #474c2933;transform:translateY(-8px);transition:transform .1s,box-shadow .1s}.party-button svg{width:48px;height:48px;fill:#faf5d9}.party-button:active{transform:translateY(-1px);box-shadow:inset 0 2px 2px #c0c79b,0 1px 0 #4e6238}.party-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:#b4b578}.dot-one{left:19%;top:28%;width:5px;height:5px}.dot-two{right:17%;bottom:27%}.party-spark{position:absolute;right:20%;top:16%;color:#a4a96e;font-size:25px}.card-light{background:#dde5d3}.light-switch{width:163px;height:81px;border-radius:50px;position:relative;background:#a4b39a;box-shadow:inset 0 4px 7px #6c7a6d40,inset 0 -2px 1px #eef3e7,0 0 0 7px #d3ddc8;display:flex;justify-content:space-between;align-items:center;padding:0 16px}.switch-sun,.switch-moon{font-size:34px;color:#f7f8e9;line-height:1}.switch-knob{position:absolute;top:8px;left:8px;width:65px;height:65px;border-radius:50%;background:linear-gradient(135deg,#fffef2,#e5e5d2);box-shadow:0 3px 4px #3e49354d,inset 0 2px 2px #fff;transition:transform .4s cubic-bezier(.2,.7,.25,1)}.light-switch[aria-checked=true]{background:#565874}.light-switch[aria-checked=true] .switch-knob{transform:translateX(82px)}#light-label{font-size:10px;opacity:.6}.card-sound{background:#e4dff0}.keyboard{display:flex;gap:4px;background:#aaa0bd;padding:8px 8px 14px;border-radius:10px;box-shadow:0 6px 0 #958ca7,0 12px 14px #6e5e8526;position:relative;transform:rotate(-6deg);width:215px;height:111px}.piano-key{position:relative;flex:1;padding:0;background:linear-gradient(100deg,#fffefa,#efede6);border-radius:3px 3px 5px 5px;box-shadow:0 5px 0 #d3cfd7,0 7px 3px #65527145;transition:transform .08s,box-shadow .08s;color:#847b93;z-index:1}.piano-key span{position:absolute;bottom:8px;left:0;right:0;font-size:9px}.piano-key:active,.piano-key.playing{transform:translateY(4px);box-shadow:0 1px 0 #d3cfd7;background:#eee9ff}.black-key{position:absolute;top:8px;width:20px;height:49px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,#514a60,#6b617b);box-shadow:0 4px 0 #3f394a;z-index:2;pointer-events:none}.black-one{left:37px}.black-two{left:78px}.black-three{right:37px}.sound-symbol{font-size:20px}.card-sign{background:#f0ddd0}.sign-stage{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:17px;padding:13px 0}#fortune{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:25px;line-height:1.15;letter-spacing:-.7px;margin:0;min-height:58px;max-width:255px}.sign-button{display:flex;justify-content:space-between;align-items:center;gap:25px;background:#684b3e;color:#fff4e9;border-radius:9px;padding:13px 16px;font-size:9px;letter-spacing:1.4px;font-weight:700;box-shadow:0 4px 0 #402e27;transition:transform .1s,box-shadow .1s}.sign-button span{font-size:17px;line-height:.7}.sign-button:active{transform:translateY(3px);box-shadow:0 1px 0 #402e27}.card-bubbles{background:#d8e6e6}.reset-bubbles{font-size:10px;background:none;padding:4px 0;color:#566e70}.reset-bubbles:hover{text-decoration:underline}.bubble-sheet{display:grid;grid-template-columns:repeat(4,34px);gap:10px;transform:rotate(7deg);padding:16px 19px;background:#c5dadb;border-radius:13px;box-shadow:inset 0 1px 0 #eff9f799,0 6px 9px #54808512}.bubble{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#efffff,#b1d0d3 68%,#a3c3c8);box-shadow:inset 0 1px 1px #ffffffb3,0 3px 4px #527f855c;transition:transform .12s,box-shadow .12s}.bubble[aria-pressed=true]{background:radial-gradient(circle at 60% 70%,#cee1e0,#b4ccce);box-shadow:inset 0 2px 3px #608b8c59;transform:scale(.91)}.card-space{background:#333b58;color:#f4f0e3}.planet-button{position:relative;width:170px;height:132px;background:none;display:grid;place-items:center;transition:transform .3s}.planet-button:hover{transform:rotate(-8deg) scale(1.04)}.planet-ball{position:absolute;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle at 28% 24%,#eedba7,#cbb482 58%,#8e805f);box-shadow:inset -10px -9px 15px #52506a6b,0 0 35px #cfb88812}.planet-ring{position:absolute;width:161px;height:51px;border:9px solid #b5abd4;border-top-color:#847caa;border-radius:50%;transform:rotate(-25deg);box-shadow:0 3px 2px #141d3533}.planet-label{position:absolute;font-size:8px;letter-spacing:1.5px;bottom:0;left:0;right:0;text-align:center;opacity:.8}.little-star{position:absolute;color:#d8cbb9}.star-a{left:11%;top:25%;font-size:20px}.star-b{right:12%;bottom:30%;font-size:15px}.star-c{right:28%;top:13%;font-size:23px}.closing{display:flex;align-items:center;justify-content:center;gap:60px;text-align:center;padding:73px 0 66px}.closing>span{font-size:28px;color:#a2ab8b}.closing p{font-size:18px;line-height:1.5;letter-spacing:-.5px;color:var(--muted);margin:0}.closing strong{font-weight:500;color:var(--ink)}footer{border-top:1px solid var(--line);padding:25px 0 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;font-weight:700}.footer-note{font-size:10px;font-weight:400;color:var(--muted);margin-left:17px}#reset-all{background:none;padding:8px 0;font-size:10px;color:var(--muted)}#reset-all:hover{color:var(--ink)}#reset-all span{font-size:15px;padding-left:8px}#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:100}#toast{position:fixed;bottom:27px;left:50%;transform:translate(-50%,15px);padding:14px 23px;background:#252b23;color:#fff8e8;max-width:calc(100vw - 32px);border-radius:30px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:110;box-shadow:0 4px 18px #0002;text-align:center}#toast.visible{opacity:1;transform:translate(-50%,0)}body.night{--paper:#202520;--ink:#f1f0df;--muted:#afb6a3;--line:#424a3d;--soft:#30382c;color-scheme:dark}body.night h1 span{color:#b7c99b}body.night .big-button-base{background:#6b7362;box-shadow:0 17px 0 #424b3c,0 20px 0 #7e8870,0 35px 24px -13px #0005}body.night .sticker{background:#c9d49a}.noscript{padding:20px;text-align:center}#space-dialog{position:fixed;inset:0;border:0;max-width:none;max-height:none;width:100%;height:100%;height:100dvh;background:radial-gradient(ellipse at 45% 60%,#353451,#151d30 65%);color:#f3eddb;padding:35px 45px;overflow:hidden}#space-dialog::backdrop{background:#151d30}#space-dialog[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}.space-close{position:absolute;top:32px;right:38px;z-index:2;background:#ffffff0a;border:1px solid #ffffff2a;border-radius:30px;color:#ddd9c9;padding:12px 18px;font-size:11px}.space-close span{padding-left:15px;font-size:17px}.cosmic-copy{text-align:center;position:relative;z-index:1}.cosmic-copy .eyebrow{justify-content:center;font-size:9px;letter-spacing:2.4px;color:#c0b9d2;margin:30px 0 22px}.cosmic-copy h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(38px,6vw,75px);line-height:1.14;letter-spacing:-2.8px}.cosmic-orbit{font-size:75px;color:#bdb0da;display:inline-block;animation:float 6s ease-in-out infinite}#space-countdown{font-size:12px;color:#a6a6bb;margin-top:32px;font-variant-numeric:tabular-nums}.cosmic-footer{position:absolute;bottom:32px;font-size:10px;color:#8c90a5;letter-spacing:.5px}#stars{position:absolute;inset:0;pointer-events:none}#stars i{position:absolute;border-radius:50%;background:#ede4d4;animation:twinkle 5s ease-in-out infinite alternate}.no-scroll{overflow:hidden}@keyframes float{50%{transform:translateY(-12px) rotate(10deg)}}@keyframes twinkle{from{opacity:.25}to{opacity:.85}}
@media(hover:hover){.big-button:hover{filter:brightness(1.04)}.sign-button:hover{background:#755443}.reset-bubbles:focus-visible{outline-offset:2px}}
@media(min-width:1440px){.hero{padding-top:80px;padding-bottom:80px}.toy-card{height:340px}.hero-toy{height:360px}.big-button-base{width:243px;height:243px}}
@media(max-width:980px){.page{padding:0 28px}.header-right>span:not(.counter){display:none}.hero{gap:0;padding-top:52px;padding-bottom:50px}h1{font-size:80px;letter-spacing:-5px}.hero-toy{height:320px}.big-button-base{width:198px;height:198px}.big-button>span:first-child{font-size:82px}.sticker{right:0;top:20px;font-size:8px;padding:10px 13px}.orbit-star{left:5px;top:16px}.toy-caption{bottom:3px;right:0}.scribble{right:95px;bottom:45px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.toy-card{height:325px}.toy-stage{min-height:180px}.intro{font-size:13px}.eyebrow{font-size:8px;letter-spacing:1.5px}.closing{padding:55px 0}}
@media(max-width:600px){.page{padding:0 20px}.header{height:81px}.wordmark{font-size:27px}.brand-mark{font-size:33px;margin-right:9px}.counter{padding:8px 12px;margin-left:0;font-size:12px}.hero{grid-template-columns:1fr;padding-top:38px;padding-bottom:32px;gap:5px}.hero-copy{position:relative}h1{font-size:76px;letter-spacing:-5px;margin-bottom:19px}.eyebrow{font-size:8px;margin-bottom:20px}.intro{font-size:13px;line-height:1.7}.explore{margin-top:16px;font-size:11px;gap:20px}.hero-toy{height:265px;margin:7px 0 0}.big-button-base{width:180px;height:180px}.big-button>span:first-child{font-size:75px}.button-micro{font-size:8px;letter-spacing:1.7px}.sticker{right:4px;top:15px}.orbit-star{left:16px;top:10px;font-size:44px}.toy-caption{bottom:0;font-size:10px;right:6px}.scribble{right:110px;bottom:16px;font-size:42px}.section-heading{align-items:baseline;margin-bottom:17px;gap:10px}.section-heading h2{font-size:19px}.section-heading>span{font-size:9px;max-width:100px;text-align:right;line-height:1.5}.section-heading>span>span{display:none}.grid{grid-template-columns:1fr;gap:15px}.toy-card{height:305px;padding:21px 25px 24px}.card-number{font-size:9px}.card-bottom h3{font-size:22px}.card-bottom p{font-size:12px}.toy-stage{min-height:164px}.keyboard{width:215px}.sign-stage{align-items:center}#fortune{text-align:center;font-size:27px;max-width:270px}.closing{gap:24px;padding:48px 0}.closing p{font-size:16px}.closing>span{font-size:22px}.footer-note{display:block;margin:6px 0 0;font-size:9px}footer{padding:22px 0 26px;font-size:14px;align-items:flex-start}#reset-all{font-size:9px;padding:0;white-space:nowrap}.space-close{top:22px;right:20px}.cosmic-copy h2{letter-spacing:-1.5px}.cosmic-copy .eyebrow{font-size:7px;letter-spacing:1.5px}#space-dialog{padding:24px 20px}.cosmic-footer{font-size:9px;bottom:25px}#toast{font-size:12px;width:max-content;bottom:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.toy-card:hover{transform:none}}

/* Quiet, reachable sound controls; audio starts only after a gesture. */
.sound-control{display:flex;align-items:center;gap:5px;margin-left:12px}
.sound-toggle{display:flex;align-items:center;gap:7px;min-height:44px;background:none;padding:8px;color:var(--ink);font-size:11px;border-radius:12px}
.sound-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sound-toggle[aria-pressed=true] .sound-cross,.sound-toggle[aria-pressed=false] .sound-waves{display:none}
#sound-volume{width:66px;height:44px;margin:0;accent-color:#809464;cursor:pointer}
#sound-volume:focus-visible{outline:2px solid #4472eb;outline-offset:3px;border-radius:5px}
.header-right .counter{margin-left:12px}
#fortune{font-size:24px;line-height:1.2;max-width:270px;overflow-wrap:break-word}

/* A quiet planet, with slow constellations dissolving behind it. */
#space-dialog{padding:74px 32px 22px;overflow-y:auto;overscroll-behavior:contain}
#space-dialog[open]{justify-content:flex-start}
.cosmic-copy{width:min(100%,900px);margin:auto 0}
.cosmic-copy h2{font-size:clamp(30px,4vw,49px);letter-spacing:-1.5px;line-height:1.18;font-weight:400}
.cosmic-scene{position:relative;height:clamp(240px,49vh,460px);margin:0 0 23px;isolation:isolate}
#constellation-field{position:absolute;inset:0;z-index:0;pointer-events:none}
.constellation-layer{position:absolute;inset:0;opacity:.72;animation:sky-arrive 6s ease both}
.constellation-layer.retiring{animation:sky-leave 6s ease forwards}
.constellation-map{display:block;width:100%;height:100%;overflow:visible;animation:sky-drift 36s ease-in-out infinite alternate}
.constellation-line{fill:none;stroke:#c5bedf;stroke-width:1;stroke-linecap:round;opacity:.46;stroke-dasharray:1;stroke-dashoffset:1;animation:connect-stars 8s ease both}
.constellation-star{opacity:.2;animation:light-star 4s ease both}
.star-core{fill:#f2e5cf;filter:drop-shadow(0 0 5px #e8d1ff80)}
.star-halo{fill:#cdbbeb;opacity:.1;filter:blur(3px)}
.constellation-name{position:absolute;bottom:0;left:0;right:0;margin:0;color:#cec4e3;font-size:12px;font-weight:400;letter-spacing:1.8px;animation:sky-name 5s 4s ease both}
.constellation-layer.retiring .constellation-name{animation:sky-name-away 3s ease forwards}
.cosmic-planet{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:clamp(150px,25vw,240px);height:clamp(130px,21vw,205px);z-index:1;pointer-events:none}
.planet-float{display:grid;place-items:center;position:relative;width:100%;height:100%;animation:planet-breathe 18s ease-in-out infinite}
.cosmic-planet .planet-ball{width:58%;height:auto;aspect-ratio:1;z-index:1;box-shadow:inset -16px -12px 22px #52506a80,0 0 75px #cfb88812}
.cosmic-planet .planet-ring{width:100%;height:32%;border-width:9px;box-shadow:none}
.planet-ring-back{z-index:0}
.planet-ring-front{z-index:2;clip-path:polygon(0 48%,100% 48%,100% 100%,0 100%)}
.cosmic-caption{font-size:12px;line-height:1.8;color:#a6a6bb;margin:21px 0 0;letter-spacing:.3px}
.cosmic-footer{position:relative;bottom:auto;margin:28px 0 0;text-align:center;font-size:8px;line-height:1.8;letter-spacing:0;flex-shrink:0;z-index:1;color:#9393a8}
.cosmic-footer a{text-underline-offset:3px;text-decoration-color:#9a9bb060}
.sky-still *,#space-dialog:not([open]) *{animation-play-state:paused!important}
@keyframes connect-stars{from{stroke-dashoffset:1;opacity:0}to{stroke-dashoffset:0;opacity:.46}}
@keyframes light-star{from{opacity:.2}to{opacity:1}}
@keyframes sky-arrive{from{opacity:0}to{opacity:.72}}
@keyframes sky-leave{from{opacity:.72}to{opacity:0}}
@keyframes sky-name{from{opacity:0}to{opacity:.85}}
@keyframes sky-name-away{from{opacity:.85}to{opacity:0}}
@keyframes sky-drift{from{transform:translate(-6px,3px)}to{transform:translate(6px,-3px)}}
@keyframes planet-breathe{0%,100%{transform:translateY(3px) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}
@media(max-width:600px){
  .header{gap:10px}.header-right{gap:6px}.wordmark{font-size:25px}.brand-mark{font-size:30px;margin-right:7px}
  .sound-control{margin-left:0;gap:1px}.sound-toggle{padding:7px}#sound-state,.counter-label{display:none}
  #sound-volume{width:44px}.header-right .counter{margin-left:0;padding:8px}
  #fortune{font-size:24px}
  #space-dialog{padding:78px 20px 20px}.space-close{top:20px;right:20px}
  .cosmic-copy h2{font-size:34px;letter-spacing:-1.2px}.cosmic-scene{height:clamp(240px,42vh,350px);margin-bottom:21px}
  .cosmic-planet .planet-ring{border-width:7px}.constellation-name{font-size:11px;letter-spacing:1.5px}
  .cosmic-caption{font-size:11px;margin-top:18px}.cosmic-footer{margin-top:27px;font-size:8px}
}
@media(max-height:600px){.cosmic-scene{height:180px;margin-bottom:16px}.cosmic-copy h2{font-size:28px}.cosmic-caption{margin-top:12px}#space-dialog{padding-top:65px}.cosmic-footer{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.constellation-line{stroke-dashoffset:0;opacity:.46}.constellation-star{opacity:1}.constellation-layer.retiring{opacity:0}.constellation-name{opacity:.85}}
