:root{--sky:#ddf3ff;--paper:#fffdf8;--wall:#f5eddb;--ink:#20313b;--ink-soft:#46596a;--beak:#f48a20;--beak-deep:#d9700a;--garden:#88b95c;--garden-deep:#619e4d;--night:#252942;--night-deep:#171a2e;--disco:#3f2266;--moon:#fbf0c7;--font-display:"Fredoka Variable", "Fredoka", ui-rounded, system-ui, sans-serif;--font-body:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--space:8px;--gutter:16px;--max:1200px;--radius:16px;--line:3px solid var(--ink);--lift:0 6px 0 var(--ink);color-scheme:light}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}:root:lang(ja){--font-display:"Fredoka Variable", "Fredoka", "Hiragino Maru Gothic ProN", "Zen Maru Gothic", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;--font-body:-apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif}:lang(ja){line-break:strict;word-break:auto-phrase}:lang(ja) :is(h1,h2,h3){letter-spacing:0;line-height:1.25}:root:lang(ko){--font-display:"Fredoka Variable", "Fredoka", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;--font-body:-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif}:root:lang(zh-Hant){--font-display:"Fredoka Variable", "Fredoka", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;--font-body:-apple-system, BlinkMacSystemFont, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif}:lang(ko){word-break:keep-all}:lang(ko) :is(h1,h2,h3),:lang(zh-Hant) :is(h1,h2,h3){letter-spacing:0;line-height:1.25}body{background:var(--paper);color:var(--ink);font:400 1.0625rem/1.55 var(--font-body);margin:0;overflow-x:clip}img{max-width:100%;height:auto;display:block}.px{image-rendering:pixelated;image-rendering:crisp-edges}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em;text-wrap:balance;margin:0;font-weight:600;line-height:1.05}h2{font-size:clamp(2rem,1.3rem + 3vw,3.25rem)}h3{font-size:1.375rem;line-height:1.2}p{text-wrap:pretty;margin:0}a{color:inherit;text-underline-offset:3px;text-decoration-thickness:2px}:focus-visible{outline:3px solid var(--beak);outline-offset:3px;border-radius:6px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip{left:var(--gutter);z-index:10;background:var(--ink);color:var(--paper);border-radius:10px;padding:10px 16px;position:absolute;top:-100px}.skip:focus{top:12px}.wrap{width:100%;max-width:var(--max);padding-inline:var(--gutter);margin-inline:auto}.wrap.narrow{max-width:760px}@media (width>=768px){:root{--gutter:32px}}.button{border:var(--line);background:var(--beak);min-height:52px;color:var(--ink);font:600 1.125rem/1.1 var(--font-display);box-shadow:var(--lift);border-radius:999px;justify-content:center;align-items:center;padding:12px 26px;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.button:hover{background:#f69a3a}.button:active{box-shadow:0 2px 0 var(--ink);transform:translateY(4px)}.button.small{min-height:44px;box-shadow:0 4px 0 var(--ink);padding:8px 16px;font-size:1rem}.text-link{align-items:center;min-height:44px;font-weight:600;display:inline-flex}.site-header{background:var(--sky);z-index:5;position:relative}.header-row{align-items:center;gap:12px 24px;min-height:72px;display:flex}.brand{font:600 1.375rem/1 var(--font-display);align-items:center;gap:8px;min-height:44px;margin-right:auto;text-decoration:none;display:inline-flex}.brand img{width:32px;height:32px}.nav{gap:28px;display:none}.nav a{align-items:center;min-height:44px;font-weight:600;text-decoration:none;display:inline-flex}.nav a:hover,.nav a[aria-current=page]{text-decoration:underline}.lang{position:relative}.lang summary{cursor:pointer;align-items:center;gap:6px;min-height:44px;font-weight:600;list-style:none;display:inline-flex}.lang summary::-webkit-details-marker{display:none}.lang summary:after{content:"";border-bottom:2px solid;border-right:2px solid;width:8px;height:8px;transform:translateY(-2px)rotate(45deg)}.lang ul{background:var(--paper);border:var(--line);box-shadow:0 4px 0 var(--ink);border-radius:12px;min-width:160px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 4px);right:0}.lang a{border-radius:8px;align-items:center;min-height:44px;padding-inline:12px;text-decoration:none;display:flex}.lang a:hover{background:var(--sky)}.lang a[aria-current]{font-weight:700}@media (width<=559px){.site-header .button.small{display:none}}@media (width>=900px){.nav{display:flex}}.hero{background:var(--sky);padding-top:24px;position:relative;overflow:hidden}.hero-grid{gap:40px;padding-bottom:56px;display:grid;position:relative}.hero h1{font-size:clamp(2.75rem,1.7rem + 4.4vw,4.5rem);line-height:.98}.hero h1 span{text-wrap:balance;display:block}.lead{max-width:34em;margin-top:20px;font-size:1.1875rem}.actions{flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:32px;display:flex}.availability{color:var(--ink-soft);margin-top:20px;font-size:.9375rem}@media (width>=960px){.hero{padding-top:48px}.hero-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:56px;padding-bottom:88px}}.clouds span{opacity:.9;background:#fff;width:8px;height:8px;position:absolute;box-shadow:8px 0 #fff,16px 0 #fff,24px 0 #fff,-8px 8px #fff,0 8px #fff,8px 8px #fff,16px 8px #fff,24px 8px #fff,32px 8px #fff,40px 8px #fff,-16px 16px #fff,-8px 16px #fff,0 16px #fff,8px 16px #fff,16px 16px #fff,24px 16px #fff,32px 16px #fff,40px 16px #fff,48px 16px #fff}.clouds span:first-child{top:36px;left:46%}.clouds span:last-child{top:120px;right:6%;transform:scale(.75)}.ground{background:linear-gradient(var(--garden-deep) 0 4px, transparent 4px), repeating-linear-gradient(90deg, var(--garden) 0 40px, #7fb052 40px 48px, var(--garden) 48px 96px, #93c266 96px 104px);height:32px}.stage,.scene{aspect-ratio:3/2;background:var(--wall);position:relative;overflow:hidden}.layer{width:100%;height:100%;position:absolute;inset:0}.duck{aspect-ratio:1;width:37.5%;position:absolute;overflow:hidden}.duck img{width:calc(var(--n) * 100%);max-width:none;height:100%;animation:frames var(--speed) steps(var(--n)) infinite}@keyframes frames{to{transform:translate(-100%)}}.framed{border:var(--line);border-radius:var(--radius);box-shadow:var(--lift)}.demo{gap:16px;display:grid;position:relative}.stage{border:var(--line);box-shadow:0 10px 0 var(--ink);border-radius:20px}.demo .night,.demo .duck-focus,.demo .duck-nap,.demo .line-focus,.demo .line-nap,.demo:has(input[value=focus]:checked) .duck-talk,.demo:has(input[value=focus]:checked) .line-talk,.demo:has(input[value=nap]:checked) .duck-talk,.demo:has(input[value=nap]:checked) .line-talk,.demo:has(input[value=nap]:checked) .day{display:none}.demo:has(input[value=focus]:checked) .duck-focus,.demo:has(input[value=focus]:checked) .line-focus,.demo:has(input[value=nap]:checked) .duck-nap,.demo:has(input[value=nap]:checked) .line-nap,.demo:has(input[value=nap]:checked) .night{display:block}.demo.paused .duck img{animation-play-state:paused}.bubble{border:var(--line);text-align:center;z-index:2;background:#fff;border-radius:16px;width:min(86%,30em);margin:0;padding:12px 18px;font-size:clamp(.9375rem,.8rem + .6vw,1.125rem);line-height:1.35;position:absolute;top:4%;left:50%;translate:-50%}.bubble:after{content:"";border-right:var(--line);border-bottom:var(--line);background:#fff;width:16px;height:16px;position:absolute;bottom:-11px;left:46%;transform:rotate(45deg)}.stage-wrap{position:relative}.pause{z-index:3;border:var(--line);background:var(--paper);width:44px;height:44px;color:var(--ink);cursor:pointer;border-radius:50%;place-items:center;display:none;position:absolute;bottom:12px;right:12px}.demo.has-js .pause{display:grid}.pause svg path{fill:currentColor}.pause .icon-play,.demo.paused .pause .icon-pause{display:none}.demo.paused .pause .icon-play{display:inline}.moments,.tones{border:0;flex-wrap:wrap;gap:8px;min-width:0;margin:0;padding:0;display:flex}.moments label,.tones label{cursor:pointer;position:relative}.moments input,.tones input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.moments span,.tones span{border:var(--line);background:var(--paper);min-height:48px;font:600 1.0625rem/1 var(--font-display);border-radius:999px;align-items:center;padding:8px 20px;display:inline-flex}.moments input:checked+span,.tones input:checked+span{background:var(--ink);color:var(--paper)}.moments input:focus-visible+span,.tones input:focus-visible+span{outline:3px solid var(--beak);outline-offset:3px}.moments label:hover span,.tones label:hover span{background:var(--sky)}.moments label:hover input:checked+span,.tones label:hover input:checked+span{background:var(--ink)}.demo-note{color:var(--ink-soft);font-size:.875rem}.js-only{display:none}.demo.has-js .js-only{display:inline}.talk,.presence,.helps,.music,.world,.secrets,.origin,.faq,.final{padding-block:clamp(72px,10vw,128px)}.section-head{max-width:40rem;margin-bottom:48px}.section-head p,.body{max-width:36em;margin-top:16px;font-size:1.1875rem}.fine{color:var(--ink-soft);margin-top:24px;font-size:.875rem}.split{gap:56px;display:grid}@media (width>=960px){.split{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:start;gap:80px}}.chat{gap:16px;max-width:34rem;margin-top:40px;display:grid}.tones legend{width:100%;margin-bottom:8px;font-size:.9375rem;font-weight:600}.msg{border-radius:18px;max-width:88%;padding:12px 16px}.msg.user{background:var(--ink);color:var(--paper);border-bottom-right-radius:6px;justify-self:end}.duck-msg{align-items:end;gap:8px;padding:0;display:flex}.duck-msg .avatar{flex:none;width:56px;height:56px}.duck-msg p{border:var(--line);background:#fff;border-radius:18px 18px 18px 6px;padding:12px 16px}.reply-gentle,.reply-playful,.chat:has(input[value=gentle]:checked) .reply-snarky,.chat:has(input[value=playful]:checked) .reply-snarky{display:none}.chat:has(input[value=gentle]:checked) .reply-gentle,.chat:has(input[value=playful]:checked) .reply-playful{display:inline}.ai-note{border-left:4px solid var(--garden);max-width:34rem;color:var(--ink-soft);gap:10px;margin-top:48px;padding-left:20px;font-size:.9375rem;display:grid}.ai-note h3{color:var(--ink);font-size:1.125rem}.ai-note a{color:var(--ink);justify-self:start;font-weight:600}.phone-figure{justify-self:center;margin:0}.phone{border:10px solid var(--ink);background:#f2f2f7;border-radius:48px;width:min(300px,78vw);overflow:hidden;box-shadow:0 12px #20313b2e}.phone.small{width:min(260px,70vw)}.phone img{aspect-ratio:603/1000;object-fit:cover;object-position:top}.phone-figure figcaption{text-align:center;color:var(--ink-soft);margin-top:16px;font-size:.875rem}.presence{background:var(--sky)}.surfaces{gap:40px;margin:0;padding:0;list-style:none;display:grid}@media (width>=760px){.surfaces{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}}.surfaces h3{margin-top:20px}.surfaces p{margin-top:6px}.surface-art{border:var(--line);border-radius:var(--radius);place-items:center;height:240px;display:grid;position:relative;overflow:hidden}.wallpaper{background:linear-gradient(170deg,#7bb8e0,#b9a6e3)}.wallpaper.dusk{background:linear-gradient(#2e3561,#8b5f8f);align-content:center;gap:18px}.wallpaper.garden{background:linear-gradient(180deg, #a8dcf7, var(--garden))}.island{width:230px;height:52px;color:var(--beak);font:600 1.125rem/1 var(--font-body);font-variant-numeric:tabular-nums;background:#000;border-radius:999px;justify-content:space-between;align-self:start;align-items:center;margin-top:18px;padding:0 18px 0 8px;display:flex}.island-duck,.activity-duck{flex:none;width:44px;height:44px;overflow:hidden}.island-duck img,.activity-duck img{--n:2;width:200%;max-width:none;height:100%;animation:1.6s steps(2,end) infinite frames}.clock{color:#fff;font:600 3.25rem/1 var(--font-display);text-align:center}.activity{color:#fff;background:#141628b8;border-radius:20px;grid-template-columns:auto 1fr;align-items:center;gap:8px 12px;width:min(260px,86%);padding:12px 14px;display:grid}.activity-duck{grid-row:span 2;width:52px;height:52px}.activity-text{font-variant-numeric:tabular-nums;justify-content:space-between;font-size:.9375rem;display:flex}.activity-text span{color:var(--beak);font-weight:600}.bar{background:#ffffff40;border-radius:3px;height:6px}.bar span{background:var(--beak);border-radius:3px;width:26%;height:100%;display:block}.widget{background:#fff;border-radius:24px;width:172px;padding:10px;box-shadow:0 6px 18px #20313b2e}.widget-scene{border-radius:14px}.widget p{margin-top:8px;font-size:.8125rem;font-weight:600;line-height:1.25}.help-row{align-items:center;gap:32px;padding-block:32px;display:grid}.help-row+.help-row{border-top:2px dashed #20313b2e}.help-art{justify-items:center;display:grid}.help-art .scene{width:min(100%,432px)}.help-copy{max-width:30rem}.help-copy h3{font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem)}.help-copy p{margin-top:12px;font-size:1.125rem}@media (width>=860px){.help-row{grid-template-columns:1fr 1fr;gap:72px;padding-block:48px}.help-row.flip .help-art{order:2}}.reminder{gap:16px;width:min(100%,380px);display:grid}.reminder-card{border:var(--line);border-radius:var(--radius);box-shadow:var(--lift);background:#fff;grid-template-columns:64px 1fr;align-items:center;gap:4px 12px;padding:16px;display:grid}.reminder-card>img{object-fit:cover;object-position:0 0;grid-row:span 2;width:64px;height:64px}.reminder-card strong{font-size:1.0625rem;display:block}.reminder-card span{color:var(--ink-soft);font-size:.9375rem}.fake-button{text-align:center;background:var(--beak);font:600 1rem/1.2 var(--font-display);border-radius:999px;grid-column:1/-1;margin-top:12px;padding:10px;display:block;color:var(--ink)!important}.world{background:linear-gradient(180deg, var(--paper), #eef6e4)}.life{scroll-snap-type:x mandatory;overscroll-behavior-x:contain;grid-auto-columns:min(78%,320px);grid-auto-flow:column;gap:20px;margin:0;padding:0 0 8px;list-style:none;display:grid;overflow-x:auto}.life li{scroll-snap-align:start}.life img{border:var(--line);border-radius:var(--radius);width:100%}.life p{margin-top:12px;font-weight:600}@media (width>=860px){.life{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:40px 28px;overflow:visible}}.costumes-title{margin-top:88px;font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem)}.costumes{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 12px;margin:24px 0 0;padding:0;list-style:none;display:grid}.costumes li{text-align:center;justify-items:center;gap:4px;font-size:.9375rem;font-weight:600;display:grid}.costumes img{width:108px;height:108px}@media (width>=760px){.costumes{grid-template-columns:repeat(6,minmax(0,1fr))}.costumes img{width:144px;height:144px}}.promise{max-width:24em;font:500 clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem) / 1.25 var(--font-display);margin-top:88px}.secrets{background:var(--night);color:var(--paper);position:relative;overflow:hidden}.stars,.final:before{background:var(--moon);width:3px;height:3px;box-shadow:8vw 30px var(--moon), 22vw 90px #fff, 37vw 20px var(--moon), 51vw 120px #fff, 64vw 50px var(--moon), 78vw 10px #fff, 91vw 80px var(--moon), 15vw 220px #fff, 70vw 260px var(--moon), 95vw 300px #fff, 4vw 420px var(--moon), 46vw 360px #fff, 86vw 460px var(--moon);pointer-events:none;position:absolute;top:40px;left:0}.secrets .wrap{position:relative}.secrets h2{font-size:clamp(2.5rem,1.4rem + 4.6vw,4.5rem)}.secrets .section-head p{color:#d9dcef}.secret-grid{gap:20px;margin:0;padding:0;list-style:none;display:grid}@media (width>=640px){.secret-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1040px){.secret-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.secret{background:var(--night-deep);border:3px solid #4a4f7a;border-radius:20px;flex-direction:column;gap:16px;padding:20px;display:flex}.spot{aspect-ratio:4/3;background:radial-gradient(circle at 50% 40%, #fbf0c759, transparent 55%), linear-gradient(180deg, var(--disco), #241a40);border-radius:12px;place-items:center;display:grid;position:relative}.spot:after{content:"?";font:600 1.5rem/1 var(--font-display);color:var(--moon);opacity:.8;position:absolute;top:10px;right:14px}.spot img{filter:drop-shadow(0 0 2px #fbf0c7d9)drop-shadow(0 0 14px #fbf0c740);width:55%}.teaser{font:500 1.25rem/1.3 var(--font-display);flex:1}.ask{border:2px solid var(--moon);min-height:44px;color:var(--moon);font:600 .9375rem/1 var(--font-display);cursor:pointer;background:0 0;border-radius:999px;align-self:start;padding:8px 16px}.ask:hover{background:#fbf0c71f}.reply{min-height:1.5em;color:var(--beak);font-weight:600}.secret.answered .spot img{animation:.42s steps(4,end) wobble}@keyframes wobble{25%{transform:translate(-4px)}50%{transform:translate(4px)}75%{transform:translate(-2px)}}.secrets-more{font:500 1.375rem/1.3 var(--font-display);color:var(--moon);margin-top:48px}.origin{background:var(--paper)}.origin-row{gap:24px;max-width:760px;display:grid}.origin-row img{width:96px;height:96px}.origin-row p{margin-top:16px;font-size:1.25rem}@media (width>=640px){.origin-row{grid-template-columns:auto 1fr;align-items:center;gap:40px}.origin-row img{width:144px;height:144px}}.faq{background:var(--wall)}.faq h2{margin-bottom:32px}.faq details{border-top:2px solid #20313b33}.faq details:last-of-type{border-bottom:2px solid #20313b33}.faq summary{cursor:pointer;min-height:64px;font:600 1.1875rem/1.3 var(--font-display);justify-content:space-between;align-items:center;gap:16px;padding-block:12px;list-style:none;display:flex}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";flex:none;font-size:1.75rem;line-height:1}.faq details[open] summary:after{content:"−"}.faq details p{max-width:38em;padding-bottom:20px}.faq-more{margin-top:32px;font-weight:600}.final{background:var(--night);color:var(--paper);position:relative;overflow:hidden}.final:before{content:"";top:24px}.final-grid{align-items:center;gap:48px;display:grid;position:relative}.final .scene{border-color:var(--night-deep);width:min(100%,480px);box-shadow:0 10px 0 var(--night-deep)}.final h2{font-size:clamp(2.25rem,1.4rem + 3.6vw,4rem)}.final p{color:#d9dcef;margin-top:16px;font-size:1.1875rem}.final .button{box-shadow:0 6px 0 var(--night-deep);border-color:var(--night-deep);margin-top:32px}.final .availability{color:#b9bdd8;font-size:.9375rem}@media (width>=860px){.final-grid{grid-template-columns:1fr 1fr;gap:72px}}.site-footer{background:var(--night-deep);color:#c9cce3;padding-block:40px;font-size:.9375rem}.footer-row{gap:24px;display:grid}.footer-row small{color:#9a9ec0;font-size:.8125rem}.footer-links{flex-wrap:wrap;gap:4px 24px;margin:0;padding:0;list-style:none;display:flex}.footer-links a{min-height:44px;color:var(--paper);align-items:center;display:inline-flex}.store-badge{border-radius:10px;padding:4px;display:inline-flex}.store-badge img{width:auto;display:block}.footer-nav{gap:8px;display:grid}.footer-main{flex-wrap:wrap;align-items:center;gap:12px 24px;display:flex}.social{min-height:44px;color:var(--paper);border:2px solid;border-radius:999px;align-items:center;gap:8px;padding:0 16px;font-weight:600;text-decoration:none;display:inline-flex}.social:hover{background:var(--paper);color:var(--night-deep)}.footer-langs{flex-wrap:wrap;gap:0 16px;margin:0;padding:0;font-size:.8125rem;list-style:none;display:flex}.footer-langs a{color:#9a9ec0;align-items:center;min-height:32px;display:inline-flex}@media (width>=860px){.footer-row{grid-template-columns:1fr auto;align-items:center}.footer-main,.footer-langs{justify-content:flex-end}}.doc{padding-block:56px 96px}.doc h1{font-size:clamp(2.5rem,1.6rem + 3.6vw,3.75rem)}.doc .lead{color:var(--ink-soft)}.doc section{margin-top:48px}.doc h2{font-size:1.625rem}.doc ul{gap:10px;margin:16px 0 0;padding-left:1.25em;display:grid}.doc section p{margin-top:12px}.root{background:var(--sky)}.root-pick{min-height:100svh;padding:var(--gutter);text-align:center;place-content:center;justify-items:center;gap:24px;display:grid}.root-pick img{width:144px}.root-pick h1{font-size:3rem}.root-pick ul{flex-wrap:wrap;justify-content:center;gap:16px;margin:0;padding:0;list-style:none;display:flex}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}.lang-hint{background:var(--ink);color:var(--paper)}.lang-hint-row{flex-wrap:wrap;align-items:center;gap:8px 16px;padding-block:10px;display:flex}.lang-hint-row[hidden]{display:none}.lang-hint p{margin:0;font-weight:600}.lang-hint-stay{min-height:44px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;padding-inline:8px;text-decoration:underline}.consent{z-index:20;left:var(--gutter);right:var(--gutter);background:var(--paper);max-width:560px;color:var(--ink);border:var(--line);box-shadow:0 6px 0 var(--ink);border-radius:16px;gap:12px;margin-inline:auto;padding:16px 20px;display:grid;position:fixed;bottom:16px}.consent[hidden]{display:none}.consent p{margin:0}.consent-actions{flex-wrap:wrap;gap:12px;display:flex}button.button{cursor:pointer}.button.secondary{background:var(--paper)}.button.secondary:hover{background:var(--sky)}.link-button{min-height:44px;color:var(--paper);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.music{background:var(--wall)}.music-grid{gap:48px;display:grid}@media (width>=960px){.music-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:72px}}.dj{gap:20px;margin-top:32px;display:grid}.look{min-height:1.6em;font:600 1.25rem/1.3 var(--font-display);margin:0}.music [data-genre]{display:none}.music:has(input[value=rock]:checked) [data-genre=rock],.music:has(input[value=forro]:checked) [data-genre=forro],.music:has(input[value=pop]:checked) [data-genre=pop],.music:has(input[value=hiphop]:checked) [data-genre=hiphop],.music:has(input[value=samba]:checked) [data-genre=samba],.music:has(input[value=reggae]:checked) [data-genre=reggae],.music:has(input[value=classical]:checked) [data-genre=classical]{display:block}.music-notes{color:var(--ink-soft);gap:8px;margin:32px 0 0;padding-left:1.2em;font-size:.9375rem;display:grid}.music-teaser{margin-top:16px;font-weight:600}