/* BEATROOM refine layer: one calm type scale, crisp SVG icons, consistent surfaces.
   Loaded last on the library page; colors follow the active theme via --tone/--glow/--soft/--warm. */
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/fonts/inter-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{--tone:188;--glow:24;--soft:#a9dfcb;--warm:#e6c3a7}

:root[data-theme] .libraryPage{
  --r-bg:hsl(var(--tone) 32% 7%);
  --r-surface:hsl(var(--tone) 24% 12% / .72);
  --r-surface-2:hsl(var(--tone) 26% 8% / .7);
  --r-line:hsl(0 0% 100% / .075);
  --r-line-strong:hsl(0 0% 100% / .13);
  --r-text:#eef2ef;
  --r-muted:hsl(var(--tone) 8% 70%);
  --r-faint:hsl(var(--tone) 8% 56%);
  --r-on-accent:hsl(var(--tone) 40% 10%);
  --r-ease:cubic-bezier(.2,.7,.2,1);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:14px;line-height:1.5;color:var(--r-text);
  font-feature-settings:"cv11","ss01","ss03";
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
  background:var(--r-bg);

  & button,& input,& select{font-family:inherit}
  & .ambientScene{display:none}
  & .i{width:18px;height:18px;flex:none;display:block}

  /* Header */
  & .soundHeader{background:hsl(var(--tone) 30% 7% / .72);border-bottom:1px solid var(--r-line);box-shadow:none;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
  & .soundTopNav{gap:4px}
  & .soundTopNav a,& .soundTopNav button{font-size:14px;font-weight:500;color:var(--r-muted);padding:8px 12px;border-radius:999px;transition:color .2s,background .2s}
  & .soundTopNav a:hover,& .soundTopNav button:hover{color:var(--r-text);background:hsl(0 0% 100% / .05);opacity:1}
  & .soundTopNav a.selected,& .soundTopNav button[aria-pressed=true]{color:var(--r-text);background:hsl(0 0% 100% / .07)}
  & .themeToggle{width:40px;height:40px;border-color:var(--r-line-strong);background:hsl(0 0% 100% / .03);color:var(--r-muted);transition:color .2s,background .2s}
  & .themeToggle:hover{color:var(--r-text);opacity:1}
  & .themeToggle svg{width:19px;height:19px}
  & .headerActions,& .profileActions{gap:8px;font-size:14px}
  & .headerActions>button:not(.joinButton),& .profileActions>*{font-weight:500;color:var(--r-muted);padding:10px 14px;border-radius:999px;transition:color .2s,background .2s}
  & .headerActions>button:not(.joinButton):hover,& .profileActions>*:hover{color:var(--r-text);background:hsl(0 0% 100% / .05);opacity:1}
  & .joinButton{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 18px;border-radius:999px;background:var(--soft);color:var(--r-on-accent);font-weight:600;font-size:14px;box-shadow:0 0 0 1px hsl(0 0% 100% / .12) inset,0 8px 24px -10px var(--soft);transition:transform .2s var(--r-ease),box-shadow .2s,filter .2s}
  & .joinButton:hover{opacity:1;filter:brightness(1.06);transform:translateY(-1px)}
  & .joinButton svg{width:16px;height:16px}

  /* Hero */
  & .libraryIntro{position:relative;min-height:0;margin:0 0 32px;padding:40px 0 8px;align-items:center}
  & .libraryIntro>div:first-child{position:relative;z-index:1;max-width:820px}
  & .eyebrow{font-size:11px;font-weight:600;letter-spacing:.18em;color:var(--soft);margin:0 0 16px}
  & h1{font-size:clamp(40px,4.3vw,60px);font-weight:650;line-height:1.04;letter-spacing:-.038em;margin:0 0 16px;padding-bottom:.06em;background-image:linear-gradient(100deg,#f5f7f2 20%,var(--soft) 70%,var(--warm));-webkit-background-clip:text;background-clip:text;color:transparent}
  & .libraryIntro p:last-child{font-size:16px;color:var(--r-muted);max-width:520px}
  & .collectionNote{display:none}
  & .liveSoundCanvas{position:static;display:block;width:100%;height:100%;opacity:1}

  /* Library panel */
  & .libraryPanel{border-radius:24px;border:1px solid var(--r-line-strong);background:linear-gradient(180deg,hsl(var(--tone) 24% 13% / .9),hsl(var(--tone) 26% 9% / .92));box-shadow:0 1px 0 hsl(0 0% 100% / .06) inset,0 40px 100px -40px hsl(var(--tone) 60% 2% / .9);backdrop-filter:none;-webkit-backdrop-filter:none}
  & .librarySearch{height:60px;gap:14px;padding:0 8px 0 20px;border-radius:16px;border:1px solid var(--r-line-strong);background:var(--r-surface-2);box-shadow:none;transition:border-color .2s,box-shadow .2s}
  & .librarySearch:focus-within{border-color:color-mix(in srgb,var(--soft) 55%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--soft) 14%,transparent)}
  & .librarySearch>svg{width:20px;height:20px;color:var(--r-faint)}
  & .librarySearch input{font-size:15px;padding:0;height:100%;outline:none}
  & .librarySearch input::placeholder{color:var(--r-faint)}
  & .librarySearch button{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 18px;border:0;border-radius:11px;background:var(--soft);color:var(--r-on-accent);font-size:14px;font-weight:600;transition:filter .2s}
  & .librarySearch button:hover{opacity:1;filter:brightness(1.07)}
  & .librarySearch button svg{width:16px;height:16px;color:inherit}

  & .libraryToolbar{margin:24px 0 20px}
  & .typeTabs{gap:2px;padding:4px;border-radius:999px;border:1px solid var(--r-line);background:var(--r-surface-2)}
  & .typeTabs button{height:36px;padding:0 18px;border-radius:999px;font-size:13px;font-weight:500;color:var(--r-muted);box-shadow:none;background:none}
  & .typeTabs button:hover{color:var(--r-text);opacity:1}
  & .typeTabs button[aria-pressed=true]{background:var(--soft);color:var(--r-on-accent);font-weight:600;box-shadow:0 2px 10px -2px hsl(var(--tone) 60% 3% / .6)}
  & .libraryToolbar>span{font-size:13px;color:var(--r-faint);font-variant-numeric:tabular-nums}

  & .soundFilters{gap:12px;padding-bottom:24px;border-bottom:1px solid var(--r-line)}
  & .soundFilters label{gap:8px;font-size:12px;font-weight:500;color:var(--r-muted)}
  & .soundFilters input,& .soundFilters select{height:42px;padding:0 14px;font-size:14px;color:var(--r-text);border-radius:11px;border:1px solid var(--r-line-strong);background-color:var(--r-surface-2);transition:border-color .2s,box-shadow .2s}
  & .soundFilters select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3b0ab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px}
  & .soundFilters select option{background:hsl(var(--tone) 25% 12%);color:#eef2ef}
  & .soundFilters input::placeholder{color:var(--r-faint)}
  & .soundFilters :is(input,select):hover{border-color:hsl(0 0% 100% / .2)}
  & .soundFilters :is(input,select):focus-visible{outline:none;border-color:color-mix(in srgb,var(--soft) 55%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--soft) 14%,transparent)}
  & .soundFilters label:nth-of-type(n+3){max-width:120px}
  & .soundFilters button{height:42px;padding:0 16px;border-radius:11px;border:1px solid var(--r-line-strong);font-size:13px;font-weight:500;color:var(--r-muted);transition:color .2s,background .2s}
  & .soundFilters button:hover{opacity:1;color:var(--r-text);background:hsl(0 0% 100% / .05)}

  & .catalogTitle{padding:28px 0 16px}
  & .catalogTitle h2{font-size:20px;font-weight:600;letter-spacing:-.02em}
  & .catalogTitle>span{font-size:13px;color:var(--r-faint)}
  & .freeSectionNote{font-size:14px;color:var(--r-muted);max-width:720px;margin:0 0 16px}
  & #favoriteFeedback{font-size:13px;color:var(--soft);margin:0 0 8px}

  /* Sound list */
  & .soundTableHeading{font-size:11px;font-weight:600;letter-spacing:.12em;color:var(--r-faint);padding:0 16px 12px;border-bottom:1px solid var(--r-line)}
  & .soundRows{padding:6px 0}
  & .soundRow{padding:12px 16px;border:0;border-radius:14px;position:relative;transition:background .2s}
  & .soundRow+.soundRow:before{content:"";position:absolute;left:16px;right:16px;top:0;height:1px;background:var(--r-line);transition:opacity .2s}
  & .soundRow:hover,& .soundRow.isActive{background:hsl(0 0% 100% / .04)}
  & .soundRow:hover:before,& .soundRow:hover+.soundRow:before,& .soundRow.isActive:before,& .soundRow.isActive+.soundRow:before{opacity:0}
  & .soundIdentity{gap:16px}
  & .soundIdentity h3{font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:0 0 3px;color:var(--r-text)}
  & .soundRow.isActive .soundIdentity h3{color:var(--soft)}
  & .soundIdentity small{font-size:12.5px;color:var(--r-faint)}
  & .soundTags{font-size:14px;color:var(--r-text)}
  & .soundTags small{font-size:12.5px;color:var(--r-faint);margin-top:2px}
  & .soundBpm,& .soundKey{font-size:14px;font-weight:500;color:var(--r-text);font-variant-numeric:tabular-nums}

  & .soundPlay{width:52px;height:52px;border-radius:12px;background:hsl(var(--tone) 30% 20%);box-shadow:0 0 0 1px hsl(0 0% 100% / .08) inset;isolation:isolate}
  & .soundPlay img{position:absolute;inset:0;opacity:1;z-index:-1;transition:transform .35s var(--r-ease),filter .25s}
  & .soundPlay .playGlyph{position:absolute;inset:0;display:grid;place-items:center;background:hsl(var(--tone) 40% 4% / .28);transition:background .25s}
  & .soundPlay .playGlyph>*{grid-area:1/1}
  & .soundPlay .playGlyph .i{width:30px;height:30px;padding:8px;border-radius:50%;background:hsl(0 0% 100% / .94);color:hsl(var(--tone) 40% 10%);box-shadow:0 4px 14px hsl(0 0% 0% / .35);transform:scale(.92);transition:transform .25s var(--r-ease),opacity .2s}
  & .soundPlay .playGlyph .iPause,& .soundPlay .playGlyph .eqBars{opacity:0}
  & .soundPlay:hover img{transform:scale(1.08)}
  & .soundPlay:hover .playGlyph{background:hsl(var(--tone) 40% 4% / .45)}
  & .soundPlay:hover .playGlyph .i{transform:scale(1)}
  & .soundRow.isPlaying .soundPlay .playGlyph{background:hsl(var(--tone) 40% 4% / .55)}
  & .soundRow.isPlaying .playGlyph .iPlay{opacity:0}
  & .soundRow.isPlaying .playGlyph .eqBars{opacity:1}
  & .soundRow.isPlaying .soundPlay:hover .eqBars{opacity:0}
  & .soundRow.isPlaying .soundPlay:hover .iPause{opacity:1}
  & .soundPlay .eqBars{position:static;inset:auto;display:flex;place-items:initial;align-items:flex-end;gap:3px;height:16px;transition:opacity .2s}
  & .eqBars i{display:block;width:3px;height:100%;border-radius:2px;background:#fff;transform-origin:bottom;animation:rEq 1s var(--r-ease) infinite alternate}
  & .eqBars i:nth-child(2){animation-delay:-.4s;animation-duration:.8s}
  & .eqBars i:nth-child(3){animation-delay:-.7s;animation-duration:1.15s}
  & .soundPlay:focus-visible{outline:2px solid var(--soft);outline-offset:3px}

  & .favoriteButton{display:inline-flex;align-items:center;gap:6px;min-height:0;margin-top:6px;padding:3px 8px 3px 6px;margin-left:-6px;border-radius:999px;font-size:12px;font-weight:500;color:var(--r-faint);transition:color .2s,background .2s}
  & .favoriteButton svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round}
  & .favoriteButton:hover:not(:disabled){opacity:1;color:var(--r-text);background:hsl(0 0% 100% / .05)}
  & .favoriteButton[aria-pressed=true]{color:var(--warm)}
  & .favoriteButton[aria-pressed=true] svg{fill:currentColor}

  & .soundLicense{justify-self:end;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px 0 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--soft) 38%,transparent);background:color-mix(in srgb,var(--soft) 7%,transparent);color:var(--soft);font-size:13px;font-weight:600;white-space:nowrap;transition:background .2s,color .2s,border-color .2s,transform .2s var(--r-ease)}
  & .soundLicense .i{width:15px;height:15px;transition:transform .2s var(--r-ease)}
  & .soundLicense:hover{opacity:1;background:var(--soft);border-color:var(--soft);color:var(--r-on-accent)}
  & .soundLicense:hover .iArrow{transform:translate(1px,-1px)}
  & .soundLicense:hover .iDownload{transform:translateY(1px)}

  & .libraryBottom{padding:18px 0;font-size:13px;color:var(--r-faint);border-top:1px solid var(--r-line)}

  & .workflow{gap:16px;padding:32px 0 8px}
  & .workflow>div{gap:16px;padding:22px;border-radius:18px;border:1px solid var(--r-line);background:var(--r-surface);box-shadow:none}
  & .workflow>div>span{width:34px;height:34px;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--soft);border-color:color-mix(in srgb,var(--soft) 30%,transparent);background:color-mix(in srgb,var(--soft) 8%,transparent)}
  & .workflow strong{font-size:15px;font-weight:600;color:var(--r-text)}
  & .workflow small{font-size:13.5px;line-height:1.5;color:var(--r-muted);margin-top:4px}

  & .discoverFooter{padding-top:28px;font-size:13px;color:var(--r-faint);border-top:1px solid var(--r-line)}
  & .discoverFooter nav{gap:24px}
  & .discoverFooter nav a{color:var(--r-muted);transition:color .2s}

  /* Icon buttons: glyph-free, geometrically centered */
  & .iconButton{width:40px;height:40px;font-size:0;color:var(--r-muted);transition:color .2s,background .2s}
  & .iconButton:hover{color:var(--r-text);background:hsl(0 0% 100% / .07)}
  & .iconButton svg{width:20px;height:20px}
  & .closeDialog{right:14px;top:14px}

  /* Mini player */
  & .miniPlayer{bottom:20px;width:min(760px,calc(100vw - 32px));gap:14px;padding:10px 12px 10px 10px;border-radius:20px;border:1px solid var(--r-line-strong);background:hsl(var(--tone) 26% 11% / .86);box-shadow:0 24px 60px -12px hsl(0 0% 0% / .6);backdrop-filter:saturate(1.4) blur(24px);-webkit-backdrop-filter:saturate(1.4) blur(24px);transition:transform .45s var(--r-ease)}
  & .miniPlayer>img{width:48px;height:48px;border-radius:11px}
  & .miniInfo{min-width:0;flex:0 1 220px}
  & .miniInfo strong{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  & .miniInfo small{font-size:12px;letter-spacing:0;color:var(--r-faint);margin-top:2px}
  & .miniPlay{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--soft);color:var(--r-on-accent);transition:transform .2s var(--r-ease),filter .2s}
  & .miniPlay:hover{opacity:1;transform:scale(1.05);filter:brightness(1.06)}
  & .miniPlay svg{width:20px;height:20px}
  & .miniPlayer>input[type=range]{--p:0%;appearance:none;-webkit-appearance:none;height:20px;background:transparent;cursor:pointer}
  & .miniPlayer>input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--soft) var(--p),hsl(0 0% 100% / .14) var(--p))}
  & .miniPlayer>input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:hsl(0 0% 100% / .14)}
  & .miniPlayer>input[type=range]::-moz-range-progress{height:4px;border-radius:4px;background:var(--soft)}
  & .miniPlayer>input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border-radius:50%;background:#fff;box-shadow:0 2px 6px hsl(0 0% 0% / .4);transform:scale(.8);transition:transform .15s}
  & .miniPlayer>input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff}
  & .miniPlayer>input[type=range]:hover::-webkit-slider-thumb{transform:scale(1)}

  /* Cookie banner: compact card instead of a full-width bar */
  & .cookieBanner{left:24px;right:auto;bottom:24px;width:min(440px,calc(100vw - 48px));display:block;padding:22px;border-radius:20px;border:1px solid var(--r-line-strong);background:hsl(var(--tone) 26% 11% / .92);box-shadow:0 24px 60px -12px hsl(0 0% 0% / .6);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
  & .cookieBanner strong{font-size:15px;font-weight:600}
  & .cookieBanner p{font-size:13px;line-height:1.55;color:var(--r-muted);margin:8px 0 0}
  & .cookieActions{justify-content:flex-start;flex-wrap:wrap;gap:8px;margin-top:18px}
  & .cookieActions a,& .cookieActions button{display:inline-flex;align-items:center;height:38px;padding:0 14px;font-size:13px;font-weight:500;border-radius:999px;border:1px solid var(--r-line-strong);color:var(--r-text);transition:background .2s,filter .2s}
  & .cookieActions a{border-color:transparent;color:var(--r-muted);padding:0 8px}
  & .cookieActions button:hover{opacity:1;background:hsl(0 0% 100% / .06)}
  & .cookieActions button:last-child{margin-left:auto;background:var(--soft);border-color:var(--soft);color:var(--r-on-accent);font-weight:600}
  & .cookieActions button:last-child:hover{filter:brightness(1.06)}

  /* Dialogs */
  & :is(.authDialog,.creditsDialog){border:1px solid var(--r-line-strong);border-radius:24px;background:hsl(var(--tone) 26% 11%);color:var(--r-text);box-shadow:0 40px 120px -20px hsl(0 0% 0% / .7)}
  & :is(.authDialog,.creditsDialog)::backdrop{background:hsl(var(--tone) 40% 3% / .7);backdrop-filter:blur(10px)}
  & .continueButton.active,& .pricingCards button{background:var(--soft);color:var(--r-on-accent);font-weight:600}
  & .pricingCards button{align-items:center}
  & .pricingCards button svg{width:16px;height:16px}
  & .freeDownloadLinks a{display:inline-flex;align-items:center;gap:8px}
  & .freeDownloadLinks a .i{width:16px;height:16px}

  /* Theme panel */
  & .themePanel{border-color:var(--r-line-strong);background:hsl(var(--tone) 26% 11% / .96)}
  & .themePanel>p{font-size:13px;color:var(--r-muted)}
  & .themeChoices button{font-size:14px}
  & .themeChoices small{font-size:11px;color:var(--r-faint)}
  & .motionToggle{font-size:13px;color:var(--r-muted)}
  & .motionToggle span{font-size:11px}
  & .motionToggle[aria-pressed=true] span{background:var(--soft);color:var(--r-on-accent);border-color:var(--soft)}
}

/* Desktop layout */
@media(min-width:651px){
  :root[data-theme] .libraryPage{
    & .soundHeaderInner{height:76px;gap:32px}
    & .libraryPanel{padding:28px 32px 0}
    & .soundHeader.isCompact .soundHeaderInner{height:64px}
    & .libraryIntro{min-height:260px;padding-right:380px}
    & .heroVisual{position:absolute;right:-16px;top:50%;width:420px;height:280px;transform:translateY(-50%);pointer-events:none;-webkit-mask-image:radial-gradient(closest-side,#000 72%,transparent);mask-image:radial-gradient(closest-side,#000 72%,transparent)}
    & .directMotionToggle{position:absolute;right:4px;bottom:12px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--r-line-strong);background:hsl(var(--tone) 26% 10% / .6);color:var(--r-muted);font-size:0;backdrop-filter:blur(10px);transition:color .2s,background .2s,opacity .2s;opacity:.7}
    & .libraryIntro:hover .directMotionToggle,& .directMotionToggle:focus-visible{opacity:1}
    & .directMotionToggle:hover{color:var(--r-text);background:hsl(var(--tone) 26% 16% / .8)}
    & .directMotionToggle svg{width:14px;height:14px}
    & .soundTableHeading,& .soundRow{grid-template-columns:minmax(0,2.6fr) minmax(110px,1.3fr) 80px 96px 150px;gap:20px}
    & .soundTableHeading span:last-child{text-align:right;padding-right:4px}
  }
}
@media(min-width:651px) and (max-width:1000px){
  :root[data-theme] .libraryPage{
    & .libraryIntro{padding-right:280px}
    & .heroVisual{width:300px;height:200px;opacity:.8}
  }
}
@media(max-width:650px){
  :root[data-theme] .libraryPage{
    & .heroVisual{display:none}
    & .libraryPanel{border-radius:18px}
    & .typeTabs{flex-wrap:nowrap}
    & .libraryToolbar{flex-wrap:wrap;row-gap:10px}
    & .typeTabs button{height:32px;padding:0 11px;font-size:12px;white-space:nowrap}
    & .libraryToolbar>span{font-size:12px;white-space:nowrap}
    & .directMotionToggle{display:none}
    & .libraryIntro{padding-top:12px}
    & h1{font-size:36px}
    & .libraryIntro p:last-child{font-size:14px}
    & .librarySearch{height:54px;padding-left:14px}
    & .librarySearch button{font-size:0;gap:0;width:40px;height:40px;padding:0;justify-content:center}
    & .soundPlay{width:46px;height:46px}
    & .soundIdentity h3{font-size:14px}
    & .soundLicense{height:34px;padding:0 10px;font-size:12px}
    & .soundLicense .i{display:none}
    & .soundRow{padding:12px 4px}
    & .soundRow+.soundRow:before{left:4px;right:4px}
    & .cookieBanner{left:12px;bottom:12px;width:calc(100vw - 24px)}
  }
}
@keyframes rEq{0%{transform:scaleY(.3)}50%{transform:scaleY(1)}100%{transform:scaleY(.55)}}
@media(prefers-reduced-motion:reduce){:root[data-theme] .libraryPage .eqBars i{animation:none;transform:scaleY(.7)}}

/* Ambient backdrop: aurora color drift + rising dust. Only transform/opacity animate (GPU compositor). */
.ozBackdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict;
  background:radial-gradient(120vmax 80vmax at 50% 120%,hsl(var(--tone) 40% 4% / .9),transparent 70%)}
.ozAurora{position:absolute;width:78vmax;height:78vmax;border-radius:50%;will-change:transform,opacity;backface-visibility:hidden}
.ozAurora.a1{left:-28vmax;top:-38vmax;background:radial-gradient(closest-side,hsl(var(--tone) 70% 34% / .55),hsl(var(--tone) 70% 30% / .18) 55%,transparent);animation:ozDrift1 32s ease-in-out infinite alternate,ozFade1 22s ease-in-out infinite alternate}
.ozAurora.a2{right:-34vmax;top:-12vmax;background:radial-gradient(closest-side,hsl(var(--glow) 72% 46% / .26),hsl(var(--glow) 70% 40% / .08) 55%,transparent);animation:ozDrift2 38s ease-in-out -9s infinite alternate,ozFade2 26s ease-in-out -6s infinite alternate}
.ozAurora.a3{left:12vmax;top:18vmax;background:radial-gradient(closest-side,hsl(calc(var(--tone) + 64) 68% 44% / .24),hsl(calc(var(--tone) + 64) 68% 40% / .07) 55%,transparent);animation:ozDrift3 44s ease-in-out -17s infinite alternate,ozFade3 30s ease-in-out -3s infinite alternate}
.ozDust{position:absolute;inset:0}
.ozDust i{position:absolute;left:var(--x);bottom:-12px;width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  background:radial-gradient(circle,var(--c,var(--soft)) 0 35%,color-mix(in srgb,var(--c,var(--soft)) 35%,transparent) 60%,transparent 72%);
  will-change:transform,opacity;animation:ozRise var(--d) linear var(--delay) infinite}
@keyframes ozDrift1{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(14vmax,8vmax,0) scale(1.12)}100%{transform:translate3d(6vmax,16vmax,0) scale(.94)}}
@keyframes ozDrift2{0%{transform:translate3d(0,0,0) scale(1.05)}50%{transform:translate3d(-16vmax,10vmax,0) scale(.92)}100%{transform:translate3d(-6vmax,24vmax,0) scale(1.1)}}
@keyframes ozDrift3{0%{transform:translate3d(0,0,0) scale(.9)}50%{transform:translate3d(20vmax,-8vmax,0) scale(1.08)}100%{transform:translate3d(-10vmax,10vmax,0) scale(1)}}
@keyframes ozFade1{from{opacity:1}to{opacity:.45}}
@keyframes ozFade2{from{opacity:.35}to{opacity:1}}
@keyframes ozFade3{from{opacity:.15}to{opacity:.9}}
@keyframes ozRise{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:var(--o)}85%{opacity:var(--o)}100%{transform:translate3d(var(--dx),-108vh,0);opacity:0}}
.libraryPage[data-motion=off] .ozDust{opacity:.6}
@media(prefers-reduced-motion:reduce){.ozAurora,.ozDust i{animation:none!important}.ozDust{display:none}}
