:root{--nav-bar-height: 56px;--bg: #020617;--card: #080e20;--card-a: #080e20;--card-b: #151c34;--text: #ffffff;--dim: #9295a0;--muted: #b4b7c1;--faint: #42444f;--rule: #171d32;--gold: #f4c430;--gold-lo: rgba(244, 196, 48, .06);--gold-b: rgba(244, 196, 48, .18);--font: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--live-dot: #ef4444;--sp-xxs: 2px;--sp-xs: 4px;--sp-sm: 8px;--sp-md: 16px;--sp-lg: 24px;--sp-xl: 32px;--sp-xxl: 48px;--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--r-xl: 24px;--r-pill: 999px;--motion-ease: cubic-bezier(.22, 1, .36, 1);--motion-ease-out-back: cubic-bezier(.33, 1.08, .64, 1);--motion-ease-in-out: cubic-bezier(.45, .02, .55, .98);--motion-micro: .14s;--motion-fast: .18s;--motion-base: .24s;--motion-relaxed: .4s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}img{display:block;max-width:100%}picture{display:contents}a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:560px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}.wrap-wide{max-width:960px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}.nav{position:sticky;top:0;z-index:10;background:#020617c7;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--rule);transition:background var(--motion-base) var(--motion-ease),border-color var(--motion-base) var(--motion-ease),box-shadow var(--motion-base) var(--motion-ease)}.nav.is-scrolled{background:#020617f0;border-bottom-color:#ffffff14;box-shadow:0 10px 32px #00000059}body.nav-menu-open{overflow:hidden}.nav-bar{display:flex;align-items:center;justify-content:space-between;height:56px}.nav-logo{display:flex;align-items:center;gap:8px;text-decoration:none;border-radius:var(--r-sm);transition:opacity var(--motion-micro) var(--motion-ease)}@media(hover:hover)and (pointer:fine){.nav-logo:hover{opacity:.92;text-decoration:none}}.nav-mark{width:26px;height:26px;border-radius:6px}.nav-name{font-size:.9375rem;font-weight:700;color:var(--text);letter-spacing:-.01em}.nav-links{display:flex;gap:20px}.nav-links a{font-size:.8125rem;font-weight:500;color:var(--dim);transition:color var(--motion-micro) var(--motion-ease)}.nav-links a:hover{color:var(--text);text-decoration:none}.nav-links a.nav-active{color:var(--text)}.nav-links a.nav-cta{color:var(--gold);font-weight:600}.nav-links a.nav-cta:hover{color:#ffd65c}.nav-links a.nav-cta.nav-active{color:var(--text);font-weight:600}.nav-active{color:var(--text)!important}.nav-links a:focus-visible,.nav-burger:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:var(--r-sm)}.nav-burger{display:none;background:none;border:none;cursor:pointer;padding:6px;flex-direction:column;gap:5px;z-index:12}.nav-burger span{display:block;width:22px;height:2px;background:var(--text);border-radius:2px;transition:transform var(--motion-base) var(--motion-ease-out-back),opacity var(--motion-fast) var(--motion-ease)}.nav-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-burger.is-open span:nth-child(2){opacity:0}.nav-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.footer{border-top:1px solid var(--rule);padding:24px 0 calc(24px + env(safe-area-inset-bottom,0px))}.footer-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.footer-copy{font-size:.8125rem;color:var(--dim)}.footer-links{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}.footer-links a{font-size:.8125rem;color:var(--dim)}.footer-links a:hover{color:var(--text);text-decoration:none}[hidden]{display:none!important}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.chip{flex-shrink:0;appearance:none;padding:8px 18px;border-radius:999px;border:1px solid var(--card-b);background:var(--card);font-family:var(--font);font-size:.8125rem;font-weight:600;color:var(--dim);cursor:pointer;white-space:nowrap;transition:border-color var(--motion-fast) var(--motion-ease),color var(--motion-fast) var(--motion-ease),background var(--motion-fast) var(--motion-ease),transform var(--motion-micro) var(--motion-ease-out-back)}.chip:hover{border-color:var(--faint);color:var(--text)}.chip:active{transform:scale(.97)}.chip--active{border-color:#f4c43073;color:var(--gold);background:var(--gold-lo)}.chip:focus-visible{outline:2px solid rgba(244,196,48,.55);outline-offset:2px}.genre-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px}.genre-tile{appearance:none;display:flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:999px;border:1px solid var(--card-b);background:var(--card);font-family:var(--font);cursor:pointer;transition:border-color var(--motion-base) var(--motion-ease),background var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease-out-back),box-shadow var(--motion-base) var(--motion-ease)}.genre-tile:hover{border-color:var(--faint);background:#ffffff0a}@media(hover:hover)and (pointer:fine){.genre-tile:hover{transform:translateY(-2px);box-shadow:0 8px 22px #00000047}}.genre-tile:active{transform:scale(.98)}.genre-tile--active{border-color:#f4c43073;background:var(--gold-lo)}.genre-tile:focus-visible{outline:2px solid rgba(244,196,48,.55);outline-offset:2px}.genre-tile-name{font-size:.8125rem;font-weight:600;color:var(--dim)}.genre-tile--active .genre-tile-name{color:var(--gold)}.section-title{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:800;letter-spacing:-.04em;line-height:1.1;text-align:center;margin-bottom:16px}.section-sub{font-size:1rem;line-height:1.7;color:var(--dim);text-align:center;max-width:480px;margin:0 auto 56px}.gold{color:var(--gold);-webkit-text-fill-color:var(--gold)}.skip-link{position:absolute;top:-100%;left:max(20px,env(safe-area-inset-left,0px));z-index:10000;padding:12px 16px;background:var(--gold);color:var(--bg);font-weight:600;font-size:.875rem;text-decoration:none;border-radius:var(--r-sm)}.skip-link:focus{top:max(12px,env(safe-area-inset-top,0px))}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[role=tab]:focus-visible,[role=button]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}@media(max-width:640px){:root{--nav-bar-height: 50px}.wrap,.wrap-wide{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}.nav-bar{height:var(--nav-bar-height)}.nav-burger{display:flex}.nav-links{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:#020617f5;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--rule);padding:0 max(24px,env(safe-area-inset-right,0px)) 0 max(24px,env(safe-area-inset-left,0px));z-index:11;max-height:0;opacity:0;overflow:hidden;pointer-events:none;visibility:hidden;transform:translateY(-6px);transform-origin:top center;transition:max-height var(--motion-relaxed) var(--motion-ease),opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease-out-back),visibility 0s linear var(--motion-relaxed),padding var(--motion-relaxed) var(--motion-ease)}.nav-links.is-open{max-height:380px;opacity:1;pointer-events:auto;visibility:visible;transform:translateY(0);padding:8px max(24px,env(safe-area-inset-right,0px)) 16px max(24px,env(safe-area-inset-left,0px));transition:max-height var(--motion-relaxed) var(--motion-ease),opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease-out-back),visibility 0s linear 0s,padding var(--motion-relaxed) var(--motion-ease)}.nav-links a{font-size:.9375rem;padding:12px 0;border-bottom:1px solid var(--rule);opacity:0;transform:translate(-8px);transition:opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease-out-back),color var(--motion-micro) var(--motion-ease)}.nav-links.is-open a{opacity:1;transform:translate(0)}.nav-links.is-open a:nth-child(1){transition-delay:.04s}.nav-links.is-open a:nth-child(2){transition-delay:.07s}.nav-links.is-open a:nth-child(3){transition-delay:.1s}.nav-links.is-open a:nth-child(4){transition-delay:.13s}.nav-links.is-open a:nth-child(5){transition-delay:.16s}.nav-links.is-open a:nth-child(6){transition-delay:.19s}.nav-links:not(.is-open) a{transition-delay:0s}.nav-links a:last-child{border-bottom:none}.nav{position:sticky}.nav-bar{position:relative}.footer-bar{flex-direction:column;align-items:flex-start;gap:16px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}