@font-face{font-family:Fredoka;src:url(/fonts/fredoka.woff2) format("woff2");font-weight:300 700;font-stretch:75% 125%;font-display:swap}
@font-face{font-family:Figtree;src:url(/fonts/figtree.woff2) format("woff2");font-weight:300 900;font-display:swap}
:root{--bg:#F4F0FF;--card:#FFFFFF;--ink:#2E2A5A;--dim:#6B6690;--peri:#7E7EFF;--pink:#F894C0;--butter:#FFE7A3;--mint:#BDEBD8;--line:#DED7FA;
--d:"Fredoka",ui-rounded,system-ui,sans-serif;--b:"Figtree",system-ui,sans-serif;--spring:cubic-bezier(.34,1.56,.64,1);--ease:cubic-bezier(.22,1,.36,1);--r:28px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--b);padding-bottom:100px;overflow-x:hidden;transition:background .8s}
html.is-playing body{background:#ECE6FF}
a{color:inherit;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:3px}a:hover{color:var(--peri)}
button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--peri);outline-offset:3px;border-radius:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:99px;z-index:99}.skip:focus{left:8px}
.sec-in,.hero-in,.top-in,.foot-in{width:min(1240px,100% - 36px);margin:0 auto}.narrow{width:min(760px,100% - 36px)}
.kick{display:inline-block;font:600 13px/1 var(--d);letter-spacing:.04em;text-transform:uppercase;color:var(--peri);background:#fff;border-radius:99px;padding:8px 14px;margin:0 0 18px;box-shadow:0 2px 0 var(--line)}
em{font-style:normal;color:var(--peri)}
.h1{font:600 clamp(46px,7.4vw,104px)/.95 var(--d);font-stretch:110%;letter-spacing:-.02em;margin:0 0 22px}.h1 span{display:block;color:var(--peri)}
.h1.sm{font-size:clamp(40px,5.6vw,76px)}
.lede{font-size:clamp(18px,1.5vw,20px);color:#4A4575;margin:0 0 26px;max-width:58ch}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;border:0;border-radius:99px;padding:15px 24px;font:600 17px/1 var(--d);text-decoration:none;box-shadow:0 5px 0 #1A1740;transition:transform .25s var(--spring),box-shadow .25s}
.btn:hover{color:#fff;transform:translateY(-3px);box-shadow:0 8px 0 #1A1740}.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #1A1740}
.btn.ghost{background:#fff;color:var(--ink);box-shadow:0 5px 0 var(--line)}.btn.ghost:hover{color:var(--peri)}.btn.sm{padding:11px 18px;font-size:15px}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
/* header */
.top{position:sticky;top:0;z-index:30;padding:12px 0;transition:background .3s}
.top-in{display:flex;align-items:center;gap:18px;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border-radius:99px;padding:8px 8px 8px 12px;box-shadow:0 4px 24px rgba(46,42,90,.08)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:600 20px/1 var(--d)}.brand b{color:var(--peri);font-weight:600}.lg{width:36px;height:36px}
.nav{margin-left:auto;display:flex;gap:4px}.nav a{font:500 15px/1 var(--d);text-decoration:none;padding:11px 15px;border-radius:99px;white-space:nowrap}
.nav a:hover{background:var(--bg)}.nav a[aria-current]{background:var(--ink);color:#fff}
@media(max-width:820px){.brand span{display:none}.nav{overflow-x:auto;scrollbar-width:none}.nav a{padding:10px 11px;font-size:14px}}
/* hero */
.hero{padding:28px 0 60px}.hero-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:center}
@media(max-width:960px){.hero-in{grid-template-columns:1fr}.room-w{order:-1}}
.hint{font-size:14px;color:var(--dim);margin:20px 0 0}
.room-w{position:relative}
.room{position:relative;border-radius:40px;overflow:hidden;background:#E9E3FF;box-shadow:0 30px 60px -20px rgba(46,42,90,.35),inset 0 0 0 6px #fff;--beat:2.6s;touch-action:manipulation}
.room-svg{display:block;width:100%;height:auto}
.wall{fill:#E9E3FF;transition:fill 1s}.floor{fill:#D9CFF7;transition:fill 1s}.rug{fill:#FBD3E5}.shade{fill:#FFE7A3}
.fur{fill:#8C84D6}.fur2{fill:#B9B3F0}.tail{stroke:#8C84D6}
.star{fill:#fff;animation:tw 3s ease-in-out infinite}.s2{animation-delay:-1s}.s3{animation-delay:-2s}@keyframes tw{50%{opacity:.3}}
.dim{fill:#1E1A4A;opacity:0;transition:opacity 1.2s var(--ease);pointer-events:none}.glow{opacity:.35;transition:opacity 1.2s;pointer-events:none}
.ec{opacity:0;transition:opacity .3s}.eo{transition:opacity .3s}
.breath{transform-box:fill-box;transform-origin:50% 100%}.head{transform-box:view-box;transform-origin:300px 440px;transition:transform .8s var(--ease)}
.tail{transform-box:fill-box;transform-origin:0 0;animation:tail 4s ease-in-out infinite}@keyframes tail{50%{transform:rotate(-2deg)}}
.leaves{transform-box:fill-box;transform-origin:50% 100%;animation:sway calc(var(--beat)*2) ease-in-out infinite}@keyframes sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(3deg)}}
.z{font:600 28px var(--d);fill:#fff;opacity:0}.nt{opacity:0}
.room.asleep .dim{opacity:.42}.room.asleep .glow{opacity:.95}.room.asleep .eo{opacity:0}.room.asleep .ec{opacity:1}
.room.asleep .head{transform:rotate(-4deg) translateY(6px)}
.room.asleep .breath{animation:breathe 3.6s ease-in-out infinite}@keyframes breathe{50%{transform:scale(1.025,1.06)}}
.room.asleep .z{animation:zz 4.2s ease-in infinite}.room.asleep .z2{animation-delay:1.4s}.room.asleep .z3{animation-delay:2.8s}
@keyframes zz{0%{opacity:0;transform:translate(0,0)}20%{opacity:1}100%{opacity:0;transform:translate(-30px,-70px)}}
.room.asleep .nt{animation:nt var(--beat) ease-out infinite}.room.asleep .n2{animation-delay:calc(var(--beat)/2)}
@keyframes nt{0%{opacity:0;transform:translate(0,0)}30%{opacity:1}100%{opacity:0;transform:translate(14px,-50px)}}
.room.asleep .leaves{animation-duration:var(--beat)}
.laser{position:absolute;left:-9px;top:-9px;width:18px;height:18px;border-radius:50%;background:#FF5C9A;box-shadow:0 0 0 6px rgba(255,92,154,.25),0 0 30px 10px rgba(255,92,154,.35);opacity:0;pointer-events:none;transition:opacity .2s}
.room::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(248,148,192,.18),transparent 70%)}
.room.lz .laser{opacity:1}.room.asleep .laser{opacity:0}
.cat-btn{position:absolute;left:28%;top:52%;width:44%;height:36%;border-radius:50%;background:transparent;border:0;cursor:pointer}
.cat-btn:hover~.room-st{transform:translateY(-3px)}
.room-st{position:absolute;left:18px;top:18px;margin:0;display:flex;align-items:center;gap:8px;background:#fff;border-radius:99px;padding:9px 14px;font:500 14px/1 var(--d);box-shadow:0 4px 0 var(--line);max-width:calc(100% - 36px);transition:transform .3s var(--spring)}
.room-st span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-st i{width:9px;height:9px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 3px #FFF3CF;flex:none}
.room.asleep .room-st i{background:var(--peri);box-shadow:0 0 0 3px #DCDCFF}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
/* sections */
section{position:relative}.sessions,.timer,.filter,.science,.faqs{padding:clamp(56px,8vw,110px) 0}
.sec-h{margin-bottom:34px}.sec-h h2,.timer h2{font:600 clamp(34px,4.6vw,62px)/1 var(--d);letter-spacing:-.01em;margin:0 0 14px}
/* cushions */
.cus{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}@media(max-width:900px){.cus{grid-template-columns:1fr 1fr}}@media(max-width:560px){.cus{grid-template-columns:1fr}}
.cu{position:relative;background:var(--bg2,#fff);border-radius:36px 36px 36px 36px/32px 32px 40px 40px;padding:26px 26px 30px;background:var(--bg);box-shadow:inset 0 -10px 0 rgba(46,42,90,.07);transition:transform .35s var(--spring),border-radius .5s var(--ease)}
.cu:hover{transform:translateY(-6px) rotate(-.6deg);border-radius:44px 30px 44px 30px/36px 44px 30px 40px}
.cu-i{width:54px;height:54px;border-radius:50%;background:#fff;display:grid;place-items:center;margin-bottom:18px}.cu-i svg{width:26px;height:26px}
.cu-k{margin:0;font:500 13px var(--d);color:#4A4575;text-transform:uppercase;letter-spacing:.04em}
.cu h3{margin:4px 0 8px;font:600 28px/1.05 var(--d)}.cu h3 a{text-decoration:none}.cu h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.cu-d{margin:0 0 14px;font-size:15.5px;color:#3F3A6A;max-width:34ch}.cu-m{margin:0;font:500 13px var(--d);color:#4A4575}
.cu-p{position:absolute;right:20px;bottom:20px;z-index:2;width:58px;height:58px;border-radius:50%;border:0;background:var(--ink);color:#fff;display:grid;place-items:center;box-shadow:0 4px 0 #1A1740;transition:transform .25s var(--spring)}
.cu-p:hover{transform:scale(1.1)}.cu-p svg{width:18px;height:18px;fill:currentColor;margin-left:3px}
/* timer */
.timer{background:var(--ink);color:#fff;border-radius:48px;margin:0 12px}.timer .lede{color:#CFCBFF}.timer em{color:var(--butter)}.timer .kick{background:rgba(255,255,255,.1);color:var(--butter);box-shadow:none}
.timer-g{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}@media(max-width:860px){.timer-g{grid-template-columns:1fr}}
.timer-g>div:first-child{grid-row:span 2}
.dial{position:relative;width:min(300px,72vw);aspect-ratio:1;justify-self:center}
.dial-r{width:100%;height:100%;transform:rotate(-90deg)}.dial-bg{fill:#3B3670;stroke:#4A4585;stroke-width:14}
.dial-fg{fill:none;stroke:var(--butter);stroke-width:14;stroke-linecap:round;stroke-dasharray:553;stroke-dashoffset:553;transition:stroke-dashoffset 1s linear}
.dial-c{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.dial-t{margin:0;font:600 64px/1 var(--d);font-variant-numeric:tabular-nums}.dial-s{margin:6px 0 0;font-size:14px;color:#CFCBFF}
.dial-b{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chip{border:0;background:rgba(255,255,255,.1);color:inherit;border-radius:99px;padding:12px 18px;font:500 15px/1 var(--d);text-decoration:none;transition:transform .2s var(--spring),background .2s}
.chip:hover{transform:translateY(-2px);background:rgba(255,255,255,.2)}.chip[aria-pressed=true]{background:var(--butter);color:var(--ink)}
.dial-b.mini{justify-content:flex-start}.dial-b.mini .chip,.chips .chip{background:var(--bg);color:var(--ink)}.dial-b.mini .chip[aria-pressed=true]{background:var(--ink);color:#fff}
/* filter / tracks */
.fl-g{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:start}@media(max-width:900px){.fl-g{grid-template-columns:1fr}}
.fl-l{margin:0;padding:0;list-style:none;counter-reset:f;display:grid;gap:14px}.fl-l li{counter-increment:f;background:#fff;border-radius:24px;padding:20px 20px 20px 70px;position:relative;font-size:16px}
.fl-l li::before{content:counter(f);position:absolute;left:18px;top:18px;width:36px;height:36px;border-radius:50%;background:var(--pink);color:#fff;display:grid;place-items:center;font:600 18px var(--d)}
.fl-l b{font-family:var(--d);font-weight:600}.fl-k{font:600 15px var(--d);margin:0 0 10px;color:var(--dim)}
.trs{list-style:none;margin:0;padding:0;background:#fff;border-radius:28px;padding:8px;box-shadow:0 4px 0 var(--line)}
.tr{display:grid;grid-template-columns:minmax(0,1fr) 110px 46px 40px;gap:12px;align-items:center;border-radius:20px;padding:0 8px 0 0;transition:background .2s}
.tr:hover{background:var(--bg)}.tr.on{background:#E7E5FF}
.tr-p{display:grid;grid-template-columns:28px 44px minmax(0,1fr);gap:12px;align-items:center;background:none;border:0;padding:8px;text-align:left;min-width:0;border-radius:20px}
.tr-n{font:500 13px var(--d);color:var(--dim);text-align:right}.tr-p img{width:44px;height:44px;aspect-ratio:1/1;object-fit:cover;border-radius:12px;flex:none}
.tr-p.now img{box-shadow:0 0 0 3px var(--peri)}
.tr-t{display:grid;min-width:0;line-height:1.25}.tr-t b{font:600 17px var(--d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tr-t span{font-size:13px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr.on .tr-t b{color:var(--peri)}
.tr-m{height:10px;border-radius:99px;background:var(--bg);overflow:hidden;position:relative}.tr-m i{position:absolute;inset:0;border-radius:99px;background:linear-gradient(90deg,var(--pink),var(--peri));transform-origin:left;transform:scaleX(var(--c))}
.tr-d{font-size:13px;color:var(--dim);font-variant-numeric:tabular-nums}
.tr-dl{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--dim)}.tr-dl:hover{background:var(--bg)}.tr-dl svg,.ib svg,.pb-sl svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:600px){.tr{grid-template-columns:minmax(0,1fr) 54px 34px}.tr-d{display:none}.tr-p{grid-template-columns:20px 40px minmax(0,1fr);gap:9px}.tr-p img{width:40px;height:40px}}
.more{margin:16px 0 0;font:500 16px var(--d)}
/* science */
.sc-g{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}@media(max-width:900px){.sc-g{grid-template-columns:1fr}}
.sc{background:#fff;border-radius:32px;padding:28px;box-shadow:0 4px 0 var(--line)}.sc.us{background:var(--butter);box-shadow:0 4px 0 #EED38A}
.sc-n{display:inline-block;margin:0 0 14px;font:600 14px var(--d);background:var(--bg);border-radius:99px;padding:6px 12px}.sc.us .sc-n{background:#fff}
.sc h3{font:600 24px/1.1 var(--d);margin:0 0 10px}.sc p{margin:0 0 12px;font-size:16px}.sc-s{font-size:13.5px!important;color:var(--dim)}.sc.us .sc-s{color:var(--ink);font:600 16px var(--d)!important}
/* faq */
.faq details{background:#fff;border-radius:24px;margin-bottom:10px;box-shadow:0 3px 0 var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:20px 24px;font:600 19px/1.3 var(--d)}.faq summary::-webkit-details-marker{display:none}
.faq summary span{width:30px;height:30px;flex:none;border-radius:50%;background:var(--bg);display:grid;place-items:center;transition:transform .3s var(--spring)}.faq details[open] summary span{transform:rotate(45deg);background:var(--pink);color:#fff}
.faq p{margin:0;padding:0 24px 22px;color:#4A4575}
/* page heads, sessions */
.pagehead{padding:40px 0 50px}.pg-sess .pagehead{background:var(--bg);margin:0 12px;border-radius:48px;padding:56px 0}
.ph-g{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}.ph-i{width:clamp(120px,16vw,200px);aspect-ratio:1;border-radius:50%;background:#fff;display:grid;place-items:center;animation:bob 5s ease-in-out infinite}.ph-i svg{width:50%;height:50%}
@keyframes bob{50%{transform:translateY(-10px) rotate(3deg)}}@media(max-width:700px){.ph-g{grid-template-columns:1fr}.ph-i{display:none}}
.sess-b{padding:40px 0}.sess-g{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:28px;align-items:start}@media(max-width:900px){.sess-g{grid-template-columns:1fr}}
.tips{position:sticky;top:90px;background:#fff;border-radius:32px;padding:28px;box-shadow:0 4px 0 var(--line)}.tips h2{font:600 26px/1.1 var(--d);margin:0 0 12px}.tips ul{margin:0;padding-left:20px}.tips li{margin:8px 0;font-size:16px}.tips li::marker{color:var(--pink)}
.tips-n{font-size:13px;color:var(--dim)}.tips-t{border-top:2px dashed var(--line);margin-top:18px;padding-top:16px}.tips-t h3{font:600 18px var(--d);margin:0 0 10px}
.others{padding:20px 0 60px}.chips{display:flex;flex-wrap:wrap;gap:10px}
.slide{display:flex;flex-wrap:wrap;align-items:center;gap:16px;background:#fff;border-radius:99px;padding:12px 14px 12px 24px;box-shadow:0 4px 0 var(--line);max-width:760px;font:500 16px var(--d)}
.slide input{flex:1;min-width:160px;accent-color:var(--peri)}.slide-n{margin:0}.slide b{color:var(--peri)}
@media(max-width:600px){.slide{border-radius:28px}}
.trs.big .tr[hidden]{display:none}
.prose{padding:10px 0 80px}.prose h2{font:600 clamp(26px,3vw,36px)/1.1 var(--d);margin:44px 0 12px}.prose p,.prose li{color:#3F3A6A}.prose li{margin:8px 0}.prose b{font-family:var(--d);font-weight:600;color:var(--ink)}.prose .ctas{margin-top:34px}
/* 404 */
.nf-g{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;min-height:56vh}@media(max-width:800px){.nf-g{grid-template-columns:1fr}}
.cup{background:none;border:0;padding:0;width:100%;max-width:420px;justify-self:center}.cup svg{width:100%;overflow:visible}
.cup-g{transform-box:view-box;transform-origin:120px 148px;transition:transform .9s var(--spring)}.cup.fell .cup-g{transform:translate(110px,52px) rotate(100deg)}
.steam{animation:tw 2s ease-in-out infinite}.cup.fell .steam{opacity:0}
/* footer */
.foot{padding:70px 0 40px}.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;border-bottom:2px dashed var(--line);padding-bottom:36px;margin-bottom:36px}
.foot-big{margin:0;font:600 clamp(40px,6vw,84px)/1 var(--d)}.foot-big span{color:var(--peri);display:block;font-size:.5em}
.foot-g{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.foot h2{font:600 15px var(--d);text-transform:uppercase;letter-spacing:.05em;color:var(--peri);margin:0 0 10px}.foot ul{list-style:none;margin:0;padding:0}.foot li{margin:6px 0}
.fine{font-size:13px;color:var(--dim);margin:34px 0 0;max-width:100ch}@media(max-width:640px){.foot-g{grid-template-columns:1fr 1fr}}
/* player: a floating cushion */
.pbar{position:fixed;left:0;right:0;bottom:max(14px,env(safe-area-inset-bottom));z-index:40;padding:0 14px;pointer-events:none}
.pb-in{pointer-events:auto;max-width:900px;margin:0 auto;display:grid;grid-template-columns:44px minmax(0,1fr) auto auto auto minmax(80px,1fr) auto auto;gap:12px;align-items:center;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-radius:99px;padding:8px 10px 8px 8px;box-shadow:0 14px 40px -10px rgba(46,42,90,.35),0 4px 0 var(--line);position:relative}
.pb-cov{width:44px;height:44px;aspect-ratio:1/1;object-fit:cover;border-radius:12px;flex:none}html.is-playing .pb-cov{box-shadow:0 0 0 3px var(--peri)}
.pb-txt{display:grid;min-width:0;line-height:1.2}.pb-txt b{font:600 15px var(--d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pb-txt span{font-size:12.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp{width:50px;height:50px;border-radius:50%;border:0;background:var(--ink);color:#fff;display:grid;place-items:center}.pp svg{width:16px;height:16px;fill:currentColor}
.ib{width:40px;height:40px;border-radius:50%;border:0;background:var(--bg);display:grid;place-items:center}.ib svg{fill:currentColor}
.pb-prog{grid-column:6;grid-row:1;height:8px;border-radius:99px;background:var(--bg);overflow:hidden;position:relative}.pb-prog i{position:absolute;inset:0;background:linear-gradient(90deg,var(--pink),var(--peri));transform-origin:left;transform:scaleX(0);border-radius:99px}
.pb-seek{grid-column:6;grid-row:1;width:100%;margin:0;opacity:0;height:24px;cursor:pointer}
.pb-time{font-size:12.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.pb-sl{display:flex;align-items:center;gap:6px;text-decoration:none;background:var(--bg);border-radius:99px;padding:10px 14px;font:500 14px/1 var(--d);white-space:nowrap}.pb-sl.on{background:var(--butter)}
@media(max-width:760px){.pb-in{grid-template-columns:44px minmax(0,1fr) auto auto auto;gap:8px}.ib[data-pc=prev],.pb-time,.pb-seek{display:none}.pb-prog{position:absolute;left:30px;right:30px;bottom:-1px;height:3px;grid-column:auto}.pb-sl{padding:10px 12px}.pb-sl span{display:none}}
.toast{position:fixed;left:50%;bottom:104px;transform:translate(-50%,16px);background:var(--ink);color:#fff;font:500 15px var(--d);padding:12px 18px;border-radius:99px;opacity:0;pointer-events:none;transition:.35s var(--spring);z-index:70;max-width:calc(100% - 32px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
