@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:500 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:500 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Sans;font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/dm-sans-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Sans;font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/dm-sans-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-mono-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-mono-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}:root{--bg:#f7f3f2;--ink:#111;--ink-soft:#3a3533;--muted:#6b6563;--yellow:#ebd52a;--yellow-hover:#e2cb1c;--card:#d9d9d9;--card-button:#bdb8b8;--card-track:#bdb9b9;--card-artist:#5f5a59;--tile:#d9d9d9;--line:#e6e1df;--f-display:"Bricolage Grotesque", system-ui, sans-serif;--f-body:"DM Sans", system-ui, sans-serif;--f-mono:"DM Mono", ui-monospace, monospace;--dock-h:116px}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;padding:0}html.locked{overflow:hidden}body{font-family:var(--f-body)}a{color:var(--ink)}a:hover{color:#000}::selection{background:var(--yellow);color:var(--ink)}:focus-visible{outline:2px solid var(--ink);outline-offset:3px}[hidden]{display:none!important}.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}.root{height:1030vh;position:relative}.stage{height:100vh;height:100svh;position:sticky;top:0;overflow:hidden}.backdrop{z-index:0;position:absolute;inset:0}.backdrop canvas,.backdrop .poster{width:100%;height:100%;display:block;position:absolute;inset:0}.backdrop .poster{object-fit:cover;object-position:30% 100%}.backdrop.is-drawn .poster,.card-media.is-drawn .poster{opacity:0}.stage-inner{z-index:2;height:100%;padding:72px clamp(20px, 14.5vw, 280px) calc(var(--dock-h) + 24px) clamp(20px, 10.2vw, 200px);grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:clamp(24px,4vw,72px);display:grid;position:relative}.text{z-index:4;align-items:center;max-width:560px;display:grid;position:relative}.layer{opacity:0;visibility:hidden;pointer-events:none;will-change:transform, opacity;grid-area:1/1;align-self:center}.layer-intro{opacity:1;visibility:visible;pointer-events:auto;flex-direction:column;align-items:flex-start;display:flex}.display{font-family:var(--f-display);letter-spacing:-.02em;text-wrap:balance;margin:0;font-size:clamp(44px,5.2vw,76px);font-weight:700;line-height:1.05}.lede{text-wrap:pretty;margin:14px 0 0;font-size:clamp(18px,1.85vw,24px);line-height:1.35}.start{flex-direction:column;align-items:flex-start;gap:14px;margin-top:clamp(28px,5vh,52px);display:flex}.btn{appearance:none;background:var(--yellow);color:var(--ink);font-family:var(--f-body);cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;height:64px;padding:0 32px;font-size:19px;font-weight:600;text-decoration:none;transition:transform .15s,background .15s;display:inline-flex}.btn:hover{background:var(--yellow-hover);color:var(--ink)}.btn:active{transform:scale(.98)}.btn:disabled{cursor:progress;background:var(--yellow);transform:none}.btn-play{min-width:min(360px,100%);height:68px;padding:0 40px;font-size:21px}.sound-note{color:var(--ink-soft);margin:0;padding-left:4px;font-size:17px}.loader{font-family:var(--f-mono);letter-spacing:.04em;color:var(--muted);align-items:center;gap:10px;padding-left:4px;font-size:12px;display:flex}.loader-track{background:var(--line);width:96px;height:2px}.loader-bar{background:var(--ink);width:0;height:2px;transition:width .2s}.hint{color:var(--ink-soft);margin:clamp(28px,5vh,52px) 0 0;font-size:17px}.layer h2,.outro h2{font-family:var(--f-display);letter-spacing:-.02em;text-wrap:balance;margin:0 0 14px;font-size:clamp(32px,3.75vw,50px);font-weight:700;line-height:1.05}.body{text-wrap:pretty;max-width:32ch;margin:0;font-size:clamp(18px,1.75vw,23px);line-height:1.36}.outro{display:none}.cta-row{flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:24px;display:flex}.link-site{text-underline-offset:5px;font-size:19px;font-weight:500}.card-slot{z-index:3;justify-content:center;align-items:center;display:flex;position:relative}.card{width:clamp(220px, min(27vw, calc((100svh - var(--dock-h) - 150px) / 1.43)), 380px);background:var(--card);will-change:opacity;border-radius:24px;padding:18px 18px 20px}.card-media{aspect-ratio:311/317;background:#eee9e8;border-radius:12px;position:relative;overflow:hidden}.card-media canvas,.card-media .poster{width:100%;height:100%;display:block;position:absolute;inset:0}.card-media canvas{transform-origin:50% 60%}.card-media .poster{object-fit:cover}.card-title{margin:12px 0 0;padding-left:7px;font-size:clamp(18px,1.75vw,23px);font-weight:600;line-height:1.25}.card-artist{color:var(--card-artist);margin:2px 0 0;padding-left:7px;font-size:clamp(15px,1.4vw,19px);line-height:1.3}.card-controls{align-items:center;gap:16px;margin-top:12px;display:flex}.card-play{background:var(--card-button);width:56px;height:56px;color:var(--ink);cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;padding:0;transition:transform .15s,background .15s;display:grid}.card-play:hover{background:#b2acac}.card-play:active{transform:scale(.95)}.card-play:disabled{cursor:progress}.card-play svg{fill:currentColor;grid-area:1/1;width:16px;height:16px}.card-play .icon-pause,.card-play.is-playing .icon-play{display:none}.card-play.is-playing .icon-pause{display:block}.card-progress{background:var(--card-track);border-radius:3px;flex:1;height:5px;overflow:hidden}.card-progress-bar{background:var(--ink);transform-origin:0;border-radius:3px;height:100%;transform:scaleX(0)}.fx-back{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.fx{z-index:3;pointer-events:none;position:absolute;inset:0;overflow:hidden}.fx-light{opacity:0;background:radial-gradient(#ffeea08c,#ffeea000 68%);width:42%;height:160%;position:absolute;top:-30%;left:0;transform:translate(-80%)rotate(14deg)}.fx-dim{opacity:0;background:#1e1b1a;position:absolute;inset:0}.fx-burst{position:absolute;inset:0}.fx-burst>i{display:block;position:absolute}.dock{z-index:10;justify-content:center;padding:0 clamp(12px,6.9vw,96px);display:flex;position:fixed;bottom:30px;left:0;right:0}.dock-track{scrollbar-width:none;grid-auto-columns:minmax(140px,1fr);grid-auto-flow:column;gap:15px;width:100%;max-width:1110px;margin:0;padding:6px 4px 4px;list-style:none;display:grid;overflow-x:auto}.dock-track::-webkit-scrollbar{display:none}.tile{background:var(--tile);border-radius:8px;height:86px;transition:transform .2s;display:block;overflow:hidden}.tile:hover,.tile:focus-visible{transform:translateY(-5px)}.tile:focus-visible{outline-offset:1px}.tile img{object-fit:cover;width:100%;height:100%;display:block}@media (max-width:767px){.stage{height:100dvh}.stage-inner{padding:56px 20px calc(var(--dock-h) + 8px);flex-direction:column;align-items:stretch;row-gap:12px;display:flex}.text{flex:none;max-width:none}.card-slot{flex:auto;align-items:flex-end;min-height:0;container-type:size}.card{border-radius:20px;width:min(340px,100cqw,100cqh - 104px);min-width:0;padding:12px 12px 14px}.card-title{margin-top:8px;font-size:17px}.card-artist{font-size:14px}.card-controls{gap:12px;margin-top:8px}.card-play{width:44px;height:44px}.btn-play{height:60px;font-size:18px}.dock{bottom:14px}.dock-track{grid-auto-columns:130px;gap:10px}.tile{height:72px}}@media (max-width:767px) and (max-height:720px){.start{gap:8px;margin-top:16px}.sound-note{font-size:14px}}@media (prefers-reduced-motion:reduce){.btn,.tile,.card-play,.loader-bar{transition:none}.tile:hover,.tile:focus-visible{transform:none}}.no-js .root{height:auto}.no-js .stage{height:auto;position:static;overflow:visible}.no-js .backdrop{position:fixed}.no-js .fx,.no-js .start,.no-js .hint,.no-js canvas,.no-js .card-controls{display:none}.no-js .stage-inner{flex-direction:column;align-items:flex-start;row-gap:56px;height:auto;padding:72px clamp(20px,10.2vw,200px) 40px;display:flex}.no-js .text{flex-direction:column;gap:56px;display:flex}.no-js .layer{opacity:1;visibility:visible;pointer-events:auto;will-change:auto;align-self:stretch}.no-js .outro{display:block}.no-js .card{width:min(340px,100%)}.no-js .dock{padding-bottom:40px;position:static}