/* Generated by scripts/build-theme-assets.php. Do not edit directly. */

/* Source: assets/css/player/station-actions.css */
/* Playlist actions live inside each station-track row, before its heart. */
/* Keep the compact mobile actions aligned without hiding any listener controls. */
/* Every row owns its playlist control; it is never conditionally hidden by hover state. */
/* The parent Play Block may append its older share action after an AJAX update.
   The replacement control is the one marked data-ofm-share. */
[data-ofm-station-root] [data-ofm-station-row] [data-ofm-share-track]{display:none!important}
[data-ofm-station-root] button.ofm-station-track__share{display:grid;place-items:center;width:30px;height:30px;min-height:30px;padding:0;border:1px solid #444;border-radius:50%;background:transparent;color:#aaa;cursor:pointer}[data-ofm-station-root] button.ofm-station-track__share svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}[data-ofm-station-root] button.ofm-station-track__share:hover,[data-ofm-station-root] button.ofm-station-track__share:focus-visible{border-color:#f4c430;color:#f4c430;outline:none}@media(max-width:680px){[data-ofm-station-root] button.ofm-station-track__share{width:28px;height:28px;min-height:28px}}
[data-ofm-station-root] .ofm-station-track__playlist-controls{display:flex!important;align-items:center;gap:6px;visibility:visible!important;opacity:1!important}
@media(max-width:680px){[data-ofm-station-root] .ofm-station-track__playlist-controls{display:flex!important;flex:0 0 auto}[data-ofm-station-root] .ofm-station-track__favorite{flex:0 0 auto}[data-ofm-station-root] button.ofm-station-track__playlist{display:inline-flex!important}[data-ofm-station-root] button.ofm-station-track__playlist-remove[hidden]{display:none!important}}
@media(max-width:680px){[data-ofm-station-root] .ofm-station-track{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;gap:6px!important}[data-ofm-station-root] .ofm-station-track__trigger{width:100%;min-width:0}[data-ofm-station-root] .ofm-station-track__details{gap:8px!important;min-width:0}[data-ofm-station-root] .ofm-station-track__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-ofm-station-root] .ofm-station-track__stats{margin-left:auto;white-space:nowrap}[data-ofm-station-root] .ofm-station-track__playlist-controls{gap:4px}}
[data-ofm-station-root] .ofm-station-track{display:flex!important;align-items:center!important;gap:10px!important}[data-ofm-station-root] .ofm-station-track__trigger{flex:1 1 auto;min-width:0}[data-ofm-station-root] .ofm-station-track__playlist-controls{display:flex;align-items:center;gap:6px;flex:0 0 auto}[data-ofm-station-root] button.ofm-station-track__playlist{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 11px;border:1px solid #454545;border-radius:999px;background:transparent;color:#d6d6d6;font:inherit;font-size:.8rem;font-weight:700;line-height:1;white-space:nowrap;cursor:pointer;transition:border-color .18s ease,color .18s ease,background .18s ease}[data-ofm-station-root] button.ofm-station-track__playlist svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}[data-ofm-station-root] button.ofm-station-track__playlist:hover,[data-ofm-station-root] button.ofm-station-track__playlist:focus-visible{border-color:#f4c430;background:rgb(244 196 48 / .1);color:#f4c430;outline:none}[data-ofm-station-root] button.ofm-station-track__playlist.is-added{border-color:rgb(244 196 48 / .65);color:#f4c430}[data-ofm-station-root] button.ofm-station-track__playlist-remove{display:grid;place-items:center;width:30px;height:30px;min-height:30px;padding:0;border:1px solid #444;border-radius:50%;background:transparent;color:#aaa;font:inherit;font-size:1.25rem;line-height:1;cursor:pointer}[data-ofm-station-root] button.ofm-station-track__playlist-remove:hover,[data-ofm-station-root] button.ofm-station-track__playlist-remove:focus-visible{border-color:#f4c430;color:#f4c430;outline:none}[data-ofm-station-root] .ofm-station-track__stats{margin-left:auto;color:#aaa;font-size:.8rem;font-weight:500;white-space:nowrap}.ofm-track-playlist-modal__list{display:grid;gap:9px}.ofm-track-playlist-modal__item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid #353535;border-radius:12px;background:#101010}.ofm-track-playlist-modal__item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ofm-track-playlist-modal__item button{flex:0 0 auto;min-width:78px;padding:8px 11px;border:1px solid #f4c430;border-radius:999px;background:transparent;color:#f4c430;font:inherit;font-weight:800;cursor:pointer}.ofm-track-playlist-modal__item button:hover{background:#f4c430;color:#171717}.ofm-track-playlist-modal__new{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid #343434}.ofm-track-playlist-modal__new input{min-width:0;flex:1;padding:11px 12px;border:1px solid #414141;border-radius:10px;background:#101010;color:#fff;font:inherit}.ofm-track-playlist-modal__new button{padding:10px 13px;border:0;border-radius:10px;background:#f4c430;color:#171717;font:inherit;font-weight:800;cursor:pointer}@media(max-width:680px){[data-ofm-station-root] .ofm-station-track{gap:7px!important}[data-ofm-station-root] button.ofm-station-track__playlist{width:32px;min-width:32px;height:32px;min-height:32px;padding:0;justify-content:center}[data-ofm-station-root] button.ofm-station-track__playlist span{display:none}[data-ofm-station-root] button.ofm-station-track__playlist-remove{width:28px;height:28px;min-height:28px}[data-ofm-station-root] .ofm-station-track__stats{font-size:.72rem}.ofm-track-playlist-modal__new{flex-direction:column}.ofm-track-playlist-modal__new button{width:100%}}
[data-ofm-station-root] [data-ofm-station-row] button:not([data-ofm-station-id]):not([data-ofm-track-like]):not([data-ofm-favorite]):not([data-ofm-track-playlist-picker]):not([data-ofm-share]):not([data-ofm-share-track]):not([data-ofm-station-comment-marker]){display:none!important}

/* Billboard links are true navigation controls, kept outside the play button
   so they remain valid markup and survive the first PJAX enhancement. */
[data-ofm-station-root] .ofm-station-track__chart-links{display:flex;align-items:center;gap:4px;flex:0 0 auto}[data-ofm-station-root] .ofm-station-track__chart-links .ofm-chart-rank-links{display:flex;align-items:center;gap:4px}[data-ofm-station-root] .ofm-chart-rank-link{min-height:22px;padding:3px 6px;font-size:.62rem}
@media(max-width:680px){[data-ofm-station-root] .ofm-station-track{grid-template-columns:minmax(0,1fr) auto auto!important;grid-template-areas:"trigger controls favorite" "charts charts charts"}[data-ofm-station-root] .ofm-station-track__trigger{grid-area:trigger}[data-ofm-station-root] .ofm-station-track__playlist-controls{grid-area:controls}[data-ofm-station-root] .ofm-station-track__favorite{grid-area:favorite}[data-ofm-station-root] .ofm-station-track__chart-links{grid-area:charts;gap:3px}[data-ofm-station-root] .ofm-station-track__chart-links .ofm-chart-rank-links{gap:3px}[data-ofm-station-root] .ofm-chart-rank-link{min-height:20px;padding:3px 5px;font-size:.58rem}}

/* Final alignment guard for every compact Station playlist icon. */
[data-ofm-station-root] button.ofm-station-track__playlist,[data-ofm-station-root] button.ofm-station-track__share,[data-ofm-station-root] button.ofm-station-track__playlist-remove{box-sizing:border-box!important;display:inline-grid!important;place-items:center!important;flex:0 0 34px!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;margin:0!important;padding:0!important;border-radius:50%!important;line-height:0!important;font-size:0!important}[data-ofm-station-root] button.ofm-station-track__playlist span{display:none!important}[data-ofm-station-root] button.ofm-station-track__playlist svg,[data-ofm-station-root] button.ofm-station-track__share svg,[data-ofm-station-root] button.ofm-station-track__playlist-remove svg{display:block!important;flex:none!important;width:16px!important;height:16px!important;margin:0!important}
@media(max-width:680px){[data-ofm-station-root] button.ofm-station-track__playlist,[data-ofm-station-root] button.ofm-station-track__share,[data-ofm-station-root] button.ofm-station-track__playlist-remove{flex-basis:32px!important;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important}}

/* The public Station release uses a labelled track wrapper plus an inner
   player surface.  This file is loaded after the core bundle, so keep the
   older flat-row flex/grid helpers from flattening that label back alongside
   its controls.  Chart links stay a valid, separate navigation row. */
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track{display:block!important;align-items:normal!important;gap:0!important;grid-template-columns:none!important;grid-template-areas:none!important}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;min-width:0}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__trigger{display:grid;order:1;flex:1 1 auto;grid-area:auto!important;width:auto!important;min-width:0}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__playlist-controls{display:flex!important;order:3;flex:0 0 auto!important;grid-area:auto!important}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__favorite{order:4;flex:0 0 auto!important;grid-area:auto!important}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__chart-links{display:flex;flex-wrap:wrap;gap:4px;margin:6px 4px 0}
@media(max-width:680px){[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface{gap:7px!important}[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__playlist-controls{gap:4px!important}[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__chart-links{grid-area:auto!important;gap:3px;margin-top:5px}}

/* The v0.1.84 48px trigger and its direct waveform sibling. Keep the range
 * beside, rather than inside, the button so seeking remains valid markup. */
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__trigger{display:grid!important;place-items:center!important;order:1!important;flex:0 0 48px!important;grid-template-columns:1fr!important;gap:0!important;width:48px!important;min-width:48px!important;padding:5px!important}
[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__waveform{display:block!important;position:relative!important;order:2!important;flex:1 1 0!important;width:0!important;min-width:76px!important;max-width:none!important;align-self:center!important;visibility:visible!important}
@media(max-width:680px){[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__trigger{flex-basis:42px!important;width:42px!important;min-width:42px!important;padding:4px!important}[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__waveform{min-width:48px!important}}
@media(max-width:420px){[data-ofm-station-root] [data-ofm-station-content] [data-ofm-station-row].ofm-station-track>.ofm-station-track__surface>.ofm-station-track__waveform{min-width:36px!important}}

/* A signed-in listener reaches the shareable release download page from the
 * same compact control cluster. The control itself never contains a file URL. */
[data-ofm-station-root] .ofm-station-track__download{box-sizing:border-box!important;display:inline-grid!important;place-items:center!important;flex:0 0 34px!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;margin:0!important;padding:0!important;border:1px solid #454545!important;border-radius:50%!important;background:transparent!important;color:#aaa!important;line-height:0!important;text-decoration:none!important;transition:border-color .18s ease,color .18s ease,background .18s ease}
[data-ofm-station-root] .ofm-station-track__download svg{display:block!important;width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important}
[data-ofm-station-root] a.ofm-station-track__download:hover,[data-ofm-station-root] a.ofm-station-track__download:focus-visible{border-color:#f4c430!important;background:rgb(244 196 48 / .1)!important;color:#f4c430!important;outline:none!important}
[data-ofm-station-root] .ofm-station-track__download.is-unavailable{border-color:#343434!important;color:#686868!important;cursor:not-allowed!important;opacity:.72}
@media(max-width:680px){[data-ofm-station-root] .ofm-station-track__download{flex-basis:32px!important;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important}}

/* Source: assets/css/ui-polish.css */
/* Shared finishing touches for controls that appear across player and modal surfaces. */
.ofm-icon-button--close {
    appearance: none;
    display: grid !important;
    place-items: center;
    box-sizing: border-box;
    width: 42px !important;
    min-width: 42px;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #f8f8f8 !important;
    background: rgba(255,255,255,.055) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    cursor: pointer;
    font-size: 0 !important;
    line-height: 1 !important;
    transition: transform .16s ease, color .16s ease, background-color .16s ease, border-color .16s ease;
}

.ofm-icon-button--close::before {
    content: '\00d7';
    display: block;
    font-family: Arial, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 1;
    transform: translateY(-1px);
}

.ofm-icon-button--close:hover,
.ofm-icon-button--close:focus-visible {
    color: #171717 !important;
    background: #ffc72c !important;
    border-color: #ffc72c !important;
    outline: none !important;
    transform: scale(1.04);
}

.ofm-icon-button--close:focus-visible {
    box-shadow: 0 0 0 3px rgba(255,199,44,.28) !important;
}

#ofm-queue-close.ofm-icon-button--close {
    width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    color: #f8f8f8 !important;
    background: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.14) !important;
    box-shadow: none !important;
}

#ofm-queue-close.ofm-icon-button--close::before {
    font-size: 30px;
    line-height: 1;
}

#ofm-queue-close.ofm-icon-button--close:hover,
#ofm-queue-close.ofm-icon-button--close:focus-visible {
    color: #171717 !important;
    background: #ffc72c !important;
    border-color: #ffc72c !important;
}

#ofm-queue-close.ofm-icon-button--close:focus-visible {
    box-shadow: 0 0 0 3px rgba(255,199,44,.28) !important;
}

@media (max-width: 600px) {
    .ofm-icon-button--close,
    #ofm-queue-close.ofm-icon-button--close {
        width: 44px !important;
        min-width: 44px;
        height: 44px !important;
        min-height: 44px !important;
    }
}

/* Source: assets/css/font-theme.css */
/*
 * Reviewed Controller typography presets.
 *
 * Values live only in this static child stylesheet. PHP renders an allowlisted
 * `data-ofm-font-theme` value (or nothing for Site default), so no user input
 * can become a font family, URL, or CSS declaration.
 */

:root{
    --ofm-font-body:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-display:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-ui:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-body-line-height:1.55;
    --ofm-font-display-line-height:1.12;
    --ofm-font-display-letter-spacing:-.035em;
}

html[data-ofm-font-theme="system-sans"]{
    --ofm-font-body:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-display:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-ui:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ofm-font-body-line-height:1.55;
    --ofm-font-display-line-height:1.08;
    --ofm-font-display-letter-spacing:-.03em;
}

html[data-ofm-font-theme="humanist-sans"]{
    --ofm-font-body:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --ofm-font-display:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --ofm-font-ui:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --ofm-font-body-line-height:1.6;
    --ofm-font-display-line-height:1.12;
    --ofm-font-display-letter-spacing:-.022em;
}

html[data-ofm-font-theme="editorial"]{
    --ofm-font-body:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --ofm-font-display:Georgia,Cambria,"Times New Roman",Times,serif;
    --ofm-font-ui:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --ofm-font-body-line-height:1.62;
    --ofm-font-display-line-height:1.18;
    --ofm-font-display-letter-spacing:-.012em;
}

/* The default emits no attribute. For a selected preset, affect only the
 * child application shells, overlays, and content documents. This leaves
 * third-party parent widgets alone while retaining the chosen font in the
 * persistent player and child dialogs mounted beside the route content. */
html[data-ofm-font-theme] body.ofm-app-route{
    font-family:var(--ofm-font-body);
    line-height:var(--ofm-font-body-line-height);
}

html[data-ofm-font-theme] body.ofm-app-route :is(
    [data-ofm-app-shell-header],
    [data-ofm-app-shell-content],
    .ofm-app-shell__footer,
    [data-ofm-content-root],
    [data-ofm-player],
    [data-ofm-player-overlay],
    .ofm-player__reveal,
    [data-ofm-access-modal],
    .ofm-child-dialog,
    [data-ofm-overlay-active]
) :is(button,input,select,textarea){
    font-family:var(--ofm-font-ui);
}

html[data-ofm-font-theme] body.ofm-app-route :is(
    [data-ofm-app-shell-header],
    [data-ofm-app-shell-content],
    .ofm-app-shell__footer,
    [data-ofm-content-root],
    [data-ofm-player],
    [data-ofm-player-overlay],
    [data-ofm-access-modal],
    .ofm-child-dialog,
    [data-ofm-overlay-active]
) :is(h1,h2,h3,h4,h5,h6,.ofm-eyebrow){
    font-family:var(--ofm-font-display);
    letter-spacing:var(--ofm-font-display-letter-spacing);
    line-height:var(--ofm-font-display-line-height);
}

/* The small opt-in list covers child-owned surfaces with their own inherited
 * family rules. It stays deliberately narrow instead of resetting every
 * descendant on the page. */
html[data-ofm-font-theme] body.ofm-app-route :is(
    .ofm-home,
    .ofm-listener-home,
    .ofm-explore,
    .ofm-public-profile,
    .ofm-public-playlist-page,
    .ofm-releases-archive,
    .ofm-playlist-chart-archive,
    .ofm-billboard,
    .ofm-member-profile,
    .ofm-artist-studio,
    .ofm-editor-review,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-following-feed,
    .ofm-library,
    .ofm-playlist,
    .ofm-history,
    .ofm-insights,
    [data-ofm-content-root],
    [data-ofm-station-root].ofm-station-page,
    [data-ofm-station-root] .ofm-station-page
){
    font-family:var(--ofm-font-body);
}

/* Theme-controlled title metrics leave room for taller ascenders/descenders
 * and allow long names to wrap inside their existing grid/flex column. */
html[data-ofm-font-theme] :is(
    .ofm-public-profile__title-row h1,
    .ofm-public-playlist-detail__body h1,
    [data-ofm-station-root] .ofm-station-release-fallback h1,
    [data-ofm-station-root] .ofm-station-release-hero h1,
    .ofm-releases-archive__heading h1,
    .ofm-billboard__hero h1
){
    min-inline-size:0;
    overflow-wrap:anywhere;
    letter-spacing:var(--ofm-font-display-letter-spacing);
    line-height:var(--ofm-font-display-line-height);
}

/* Controller presentation selector. It is intentionally a compact select
 * field rather than an arbitrary font or stylesheet entry point. */
.ofm-controller-font-theme{
    margin-top:18px;
    padding:clamp(18px,2.7vw,28px);
    border:1px solid rgba(244,196,48,.24);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(35,29,16,.95),rgba(13,14,16,.98));
    box-shadow:0 20px 48px rgba(0,0,0,.15);
}

.ofm-controller-font-theme__heading{
    display:flex;
    align-items:start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:10px;
}

.ofm-controller-font-theme__heading h2{
    margin:5px 0 0;
    color:#fff;
    font-size:clamp(1.4rem,2.7vw,2.1rem);
    letter-spacing:-.045em;
    line-height:1.08;
}

.ofm-controller-font-theme__heading>span{
    display:grid;
    place-items:center;
    min-height:31px;
    max-width:min(52vw,250px);
    padding:6px 9px;
    overflow:hidden;
    border:1px solid rgba(244,196,48,.34);
    border-radius:10px;
    background:rgba(244,196,48,.08);
    color:#ffe28a;
    font-size:.72rem;
    font-weight:800;
    line-height:1.2;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.ofm-controller-font-theme__intro{
    max-width:760px;
    margin:0 0 15px;
    color:#b6b1a0;
    font-size:.8rem;
    font-weight:650;
    line-height:1.5;
}

.ofm-controller-font-theme__notice{
    margin:0 0 12px;
    padding:11px 13px;
    border:1px solid rgba(134,218,163,.25);
    border-radius:12px;
    background:rgba(134,218,163,.06);
    color:#c2edcc;
    font-size:.78rem;
    font-weight:700;
    line-height:1.4;
}

.ofm-controller-font-theme__notice--error{
    border-color:rgba(245,145,145,.35);
    background:rgba(245,145,145,.07);
    color:#ffc1c1;
}

.ofm-controller-font-theme__form{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(180px,.62fr) auto;
    gap:12px;
    align-items:end;
    min-width:0;
    padding:14px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:15px;
    background:rgba(255,255,255,.018);
}

.ofm-controller-font-theme__form>label{
    display:grid;
    gap:6px;
    min-width:0;
}

.ofm-controller-font-theme__form>label>span{
    color:#bdb6a4;
    font-size:.64rem;
    font-weight:800;
    letter-spacing:.055em;
    text-transform:uppercase;
}

.ofm-controller-font-theme__form select{
    box-sizing:border-box;
    width:100%;
    min-width:0;
    min-height:40px;
    padding:8px 34px 8px 11px;
    border:1px solid rgba(244,196,48,.29);
    border-radius:10px;
    background:#121212;
    color:#f8f4e8;
    font:inherit;
    font-size:.78rem;
    font-weight:750;
    line-height:1.25;
}

.ofm-controller-font-theme__form select:focus{
    border-color:rgba(244,196,48,.82);
    outline:0;
    box-shadow:0 0 0 3px rgba(244,196,48,.1);
}

.ofm-controller-font-theme__preview{
    display:grid;
    gap:3px;
    min-width:0;
    margin:0;
    padding:2px 0;
}

.ofm-controller-font-theme__preview strong{
    overflow:hidden;
    color:#f6f1df;
    font-size:.78rem;
    font-weight:800;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.ofm-controller-font-theme__preview span{
    color:#999487;
    font-size:.67rem;
    font-weight:650;
    line-height:1.35;
}

.ofm-controller-font-theme__form button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    min-height:40px;
    margin:0;
    padding:8px 13px;
    border:1px solid rgba(244,196,48,.62);
    border-radius:10px;
    background:rgba(244,196,48,.13);
    color:#ffe8a1;
    font:inherit;
    font-size:.72rem;
    font-weight:850;
    line-height:1.1;
    white-space:nowrap;
    cursor:pointer;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}

.ofm-controller-font-theme__form button:hover,
.ofm-controller-font-theme__form button:focus-visible{
    border-color:rgba(244,196,48,.95);
    background:rgba(244,196,48,.23);
    color:#fff;
    outline:0;
    transform:translateY(-1px);
}

@media(max-width:720px){
    .ofm-controller-font-theme__form{
        grid-template-columns:1fr;
    }

    .ofm-controller-font-theme__form button{
        justify-self:start;
    }
}

@media(max-width:560px){
    .ofm-controller-font-theme{
        padding:17px;
    }

    .ofm-controller-font-theme__heading>span{
        max-width:44vw;
    }
}

/* Source: assets/css/release-card.css */
/*
 * Child-owned release-card contract.
 *
 * The compatibility phase intentionally keeps the legacy Song Card classes in
 * the markup. New child code should target data-ofm-release-card and the
 * ofm-release-card__* descendants; cached parent output can continue using
 * .song-card until it is retired in a later migration.
 */
[data-ofm-release-card].ofm-release-card{
    --ofm-release-card-accent:#f4c430;
    --ofm-release-card-ink:#fff;
    --ofm-release-card-muted:#a9a9a9;
    --ofm-release-card-surface:#141414;
    --ofm-release-card-line:rgb(255 255 255 / .1);
    --ofm-release-card-radius:22px;
    --ofm-release-card-shadow:0 10px 30px rgb(0 0 0 / .35);
    --ofm-release-card-hover-shadow:0 18px 42px rgb(0 0 0 / .42),0 0 0 1px rgb(244 196 48 / .1);
    --ofm-release-card-body-padding:22px;
    --ofm-release-card-title-size:1.2rem;
    --ofm-release-card-artist-size:1rem;
    --ofm-release-card-genre-size:.8rem;
    position:relative;
    min-inline-size:0;
    min-block-size:0;
    isolation:isolate;
}

/* Generic cards are now fully drawn by the child component. The three
 * bespoke discovery surfaces below retain their route-local composition in
 * this compatibility release, rather than forcing a visual regression. */
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card){
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--ofm-release-card-line);
    border-radius:var(--ofm-release-card-radius);
    background:var(--ofm-release-card-surface);
    color:var(--ofm-release-card-ink);
    box-shadow:var(--ofm-release-card-shadow);
    transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):focus-within{
    border-color:rgb(244 196 48 / .5);
    box-shadow:var(--ofm-release-card-hover-shadow);
    transform:translateY(-3px);
}

/* Public-profile cards share the generic renderer but retain their existing
 * editorial values through tokens instead of the legacy Song Card selector. */
.ofm-public-profile__release-grid [data-ofm-release-card].ofm-release-card{
    --ofm-release-card-surface:linear-gradient(150deg,#191a1d,#101114);
    --ofm-release-card-line:rgb(255 255 255 / .12);
    --ofm-release-card-radius:20px;
    --ofm-release-card-shadow:0 12px 28px rgb(0 0 0 / .25);
    --ofm-release-card-hover-shadow:0 20px 38px rgb(0 0 0 / .36),0 0 0 3px rgb(244 196 48 / .055);
    --ofm-release-card-body-padding:15px 16px 17px;
    --ofm-release-card-title-size:1.05rem;
    --ofm-release-card-artist-size:.8rem;
    --ofm-release-card-genre-size:.66rem;
}

/* Library/history cards may collapse inside disclosure content. Their copy
 * is deliberately content-led, so a font change cannot force a fixed row. */
.ofm-library [data-ofm-release-card].ofm-release-card,
.ofm-history [data-ofm-release-card].ofm-release-card{
    --ofm-release-card-radius:16px;
    --ofm-release-card-body-padding:14px;
    --ofm-release-card-title-size:1rem;
    --ofm-release-card-artist-size:.88rem;
}

.ofm-history [data-ofm-release-card].ofm-release-card{
    --ofm-release-card-body-padding:12px;
    --ofm-release-card-title-size:.92rem;
    --ofm-release-card-artist-size:.8rem;
}

[data-ofm-release-card].ofm-release-card,
[data-ofm-release-card].ofm-release-card *{
    box-sizing:border-box;
}

/* A release grid is child-owned whenever it contains the new contract. The
 * legacy .song-grid declaration remains as the fallback for cached output. */
@supports selector(.song-grid:has(> [data-ofm-release-card])){
    .song-grid:not(.ofm-public-profile__release-grid):has(> [data-ofm-release-card]){
        display:grid;
        grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
        gap:clamp(14px,2vw,28px);
        margin-top:clamp(24px,3vw,40px);
    }
}

[data-ofm-release-card] .ofm-release-card__cover{
    position:relative;
    display:block;
    min-inline-size:0;
    overflow:hidden;
}

[data-ofm-release-card] .ofm-release-card__image{
    display:block;
    inline-size:100%;
    max-inline-size:100%;
    block-size:100%;
    object-fit:cover;
}

/* Defensive equivalent for a cached server image that has not yet acquired
 * the descendant class. Canonical markup above always supplies it. */
[data-ofm-release-card] .ofm-release-card__cover>img{
    display:block;
    inline-size:100%;
    max-inline-size:100%;
    block-size:100%;
    object-fit:cover;
}

[data-ofm-release-card] .ofm-release-card__placeholder{
    min-inline-size:0;
    min-block-size:0;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__cover{
    aspect-ratio:1;
    background:#202020;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__cover::after{
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    z-index:1;
    block-size:42%;
    background:linear-gradient(to top,rgb(0 0 0 / .65),transparent);
    content:"";
    pointer-events:none;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__image{
    aspect-ratio:1;
    transition:transform .35s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):hover .ofm-release-card__image,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):focus-within .ofm-release-card__image{
    transform:scale(1.035);
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__overlay{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgb(0 0 0 / .12);
    opacity:0;
    transition:opacity .2s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):hover .ofm-release-card__overlay,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):focus-within .ofm-release-card__overlay,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card).is-playing .ofm-release-card__overlay{
    opacity:1;
}

[data-ofm-release-card] .ofm-release-card__overlay{
    pointer-events:none;
}

[data-ofm-release-card]:hover .ofm-release-card__overlay,
[data-ofm-release-card]:focus-within .ofm-release-card__overlay,
[data-ofm-release-card].is-playing .ofm-release-card__overlay{
    pointer-events:auto;
}

[data-ofm-release-card] .ofm-release-card__play{
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__play{
    display:grid;
    place-items:center;
    inline-size:54px;
    block-size:54px;
    padding:0;
    border:1px solid rgb(255 255 255 / .8);
    border-radius:50%;
    background:rgb(0 0 0 / .5);
    box-shadow:0 8px 22px rgb(0 0 0 / .25);
    color:#fff;
    cursor:pointer;
    transition:border-color .18s ease,background .18s ease,transform .18s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__play svg{
    inline-size:21px;
    block-size:21px;
    fill:currentColor;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__play:hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__play:focus-visible{
    border-color:#fff;
    background:rgb(0 0 0 / .64);
    color:#fff;
    outline:2px solid #fff;
    outline-offset:3px;
    transform:scale(1.06);
}

[data-ofm-release-card] .ofm-release-card__play .icon-pause{
    display:none;
    fill:none;
    stroke:currentColor;
    stroke-width:2.4;
    stroke-linecap:round;
}

[data-ofm-release-card].is-playing .ofm-release-card__play .icon-play{
    display:none;
}

[data-ofm-release-card].is-playing .ofm-release-card__play .icon-pause{
    display:block;
}

[data-ofm-release-card] .ofm-release-card__body,
[data-ofm-release-card] .ofm-release-card__title,
[data-ofm-release-card] .ofm-release-card__artist,
[data-ofm-release-card] .ofm-release-card__detail,
[data-ofm-release-card] .ofm-release-card__genre,
[data-ofm-release-card] .ofm-release-card__meta{
    min-inline-size:0;
}

[data-ofm-release-card] .ofm-release-card__title{
    margin-block-start:0;
    overflow-wrap:anywhere;
}

[data-ofm-release-card] .ofm-release-card__title a,
[data-ofm-release-card] .ofm-release-card__artist a{
    color:inherit;
    overflow-wrap:anywhere;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__body{
    position:relative;
    display:block;
    padding:var(--ofm-release-card-body-padding);
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):has(.ofm-release-card__share) .ofm-release-card__body{
    padding-inline-end:48px;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__title{
    margin:0;
    color:var(--ofm-release-card-ink);
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
    font-size:var(--ofm-release-card-title-size);
    font-weight:700;
    letter-spacing:-.012em;
    line-height:1.22;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__title a{
    color:inherit;
    text-decoration:none;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__title a:hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__title a:focus-visible{
    color:var(--ofm-release-card-accent);
    outline:0;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__artist{
    margin:8px 0 0;
    color:var(--ofm-release-card-muted);
    font-size:var(--ofm-release-card-artist-size);
    line-height:1.35;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__artist a:hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__artist a:focus-visible{
    color:var(--ofm-release-card-accent);
    outline:0;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__detail{
    margin:9px 0 0;
    color:#b8b8b8;
    font-size:.82rem;
    line-height:1.45;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__genre{
    display:inline-block;
    max-inline-size:100%;
    margin-top:16px;
    padding:6px 14px;
    overflow:hidden;
    border-radius:999px;
    background:#222;
    color:var(--ofm-release-card-accent);
    font-size:var(--ofm-release-card-genre-size);
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
}

[data-ofm-release-card] .ofm-release-card__like,
[data-ofm-release-card] .ofm-release-card__playlist,
[data-ofm-release-card] .ofm-release-card__share{
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like{
    position:absolute;
    z-index:4;
    inset-block-start:12px;
    inset-inline-end:12px;
    display:grid;
    place-items:center;
    inline-size:30px;
    block-size:30px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    color:rgb(255 255 255 / .9);
    cursor:pointer;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like svg{
    inline-size:21px;
    block-size:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    filter:drop-shadow(0 1px 2px rgb(0 0 0 / .55));
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like:hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like:focus-visible,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like.is-saved{
    color:var(--ofm-release-card-accent);
    outline:0;
    transform:scale(1.08);
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like.is-saved svg{
    fill:currentColor;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist{
    position:absolute;
    z-index:4;
    inset-block-start:10px;
    inset-inline-start:10px;
    display:grid;
    place-items:center;
    inline-size:30px;
    block-size:30px;
    min-block-size:30px;
    margin:0;
    padding:0;
    border:1px solid rgb(255 255 255 / .38);
    border-radius:50%;
    background:rgb(12 12 12 / .52);
    color:#fff;
    cursor:pointer;
    opacity:0;
    transition:opacity .18s ease,transform .18s ease,background .18s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist svg{
    display:block;
    inline-size:16px;
    block-size:16px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card):hover .ofm-release-card__playlist,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist:focus-visible{
    opacity:1;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist:hover{
    background:var(--ofm-release-card-accent);
    color:#151515;
    transform:scale(1.06);
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__share{
    position:absolute;
    inset-inline-end:13px;
    inset-block-end:13px;
    display:grid;
    place-items:center;
    inline-size:30px;
    block-size:30px;
    padding:0;
    border:1px solid transparent;
    border-radius:50%;
    background:transparent;
    color:#9b9b9b;
    cursor:pointer;
    transition:color .18s ease,border-color .18s ease,background .18s ease;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__share svg{
    inline-size:16px;
    block-size:16px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__share:hover,
[data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__share:focus-visible{
    border-color:#4d4d4d;
    background:#202020;
    color:var(--ofm-release-card-accent);
    outline:0;
}

@media (max-width:580px){
    @supports selector(.song-grid:has(> [data-ofm-release-card])){
        .song-grid:not(.ofm-public-profile__release-grid):has(> [data-ofm-release-card]){
            grid-template-columns:repeat(2,minmax(0,1fr));
            gap:14px;
            margin-top:24px;
        }
    }

    [data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card){
        --ofm-release-card-radius:16px;
        --ofm-release-card-body-padding:14px;
        --ofm-release-card-title-size:1rem;
    }

    [data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__play{
        inline-size:48px;
        block-size:48px;
    }

    [data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__like{
        inset-block-start:10px;
        inset-inline-end:10px;
    }

    [data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist{
        inset-block-start:10px;
        inset-inline-start:10px;
    }
}

/* A 370px viewport must still leave two readable profile cards side by side.
 * Copy height is content-led here so a selected site font or translated title
 * cannot spill beneath adjacent actions. */
@media (max-width:370px){
    .ofm-public-profile__release-grid.song-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .ofm-public-profile__release-grid [data-ofm-release-card] .ofm-release-card__body,
    .ofm-listener-home [data-ofm-release-card] .ofm-release-card__body,
    .ofm-following-feed [data-ofm-release-card] .ofm-release-card__body,
    .ofm-explore [data-ofm-release-card] .ofm-release-card__body,
    .ofm-explore .ofm-explore__for-you-list [data-ofm-release-card] .ofm-release-card__body{
        min-block-size:0;
        block-size:auto;
        flex-basis:auto;
    }

    .ofm-public-profile__release-grid [data-ofm-release-card] .ofm-release-card__body{
        padding:10px;
    }

    [data-ofm-release-card] .ofm-release-card__title,
    [data-ofm-release-card] .ofm-release-card__artist,
    [data-ofm-release-card] .ofm-release-card__detail{
        overflow-wrap:anywhere;
        white-space:normal;
    }
}

@media (hover:none), (pointer:coarse){
    [data-ofm-release-card] .ofm-release-card__overlay{
        opacity:1;
    }

    [data-ofm-release-card] .ofm-release-card__overlay,
    [data-ofm-release-card] .ofm-release-card__overlay .ofm-release-card__play{
        pointer-events:auto;
    }

    [data-ofm-release-card].ofm-release-card:not(.ofm-listener-home__card):not(.ofm-following-feed__card):not(.ofm-explore-card) .ofm-release-card__playlist{
        opacity:.94;
    }
}

@media (prefers-reduced-motion:reduce){
    [data-ofm-release-card],
    [data-ofm-release-card] *{
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
    }
}

/* Source: assets/css/typography-safety.css */
/*
 * Late typography safety baseline.
 *
 * The selectable site font is supplied through custom properties by the
 * Controller setting. Every declaration keeps a local system fallback so
 * first paint remains stable before that setting's stylesheet is available.
 * These selectors intentionally target text-bearing child surfaces only: SVG,
 * icon-font, and emoji rendering are left to their own component rules and
 * platform fallbacks.
 */

/* Child-owned public surfaces inherit the chosen body face rather than the
 * parent theme's hard-coded sans stack. */
.ofm-public-profile,
.ofm-public-playlist-page,
[data-ofm-station-root].ofm-station-page,
[data-ofm-station-root] .ofm-station-page,
.ofm-releases-archive,
.ofm-playlist-chart-archive,
.ofm-billboard {
    font-family:var(--ofm-font-body,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}

/* Large display text needs a line box that accommodates fonts with ascenders,
 * descenders, or taller internal metrics. `min-inline-size` matters inside
 * grid/flex heroes, where a long title otherwise forces its column wider. */
.ofm-public-profile__title-row h1,
.ofm-public-profile__section-heading h2,
.ofm-public-profile__empty h2,
.ofm-public-profile .ofm-public-profile-mixes__heading h2,
.ofm-public-playlist-detail__body h1,
.ofm-public-playlist-detail__tracks h2,
.ofm-public-playlist-detail__related h2,
.ofm-public-playlist-not-found h1,
[data-ofm-station-root] .ofm-station-release-fallback h1,
[data-ofm-station-root] .ofm-station-release-hero h1,
[data-ofm-station-root] .ofm-station-release-details__credits h2,
[data-ofm-station-root] .ofm-station-release-related__heading h2,
.ofm-releases-archive__heading h1,
.ofm-playlist-chart-archive .ofm-releases-archive__heading h1,
.ofm-billboard__hero h1,
.ofm-billboard__heading h2,
.ofm-playlist-billboard__heading h2,
.ofm-review-playlist-charts__heading h2 {
    min-inline-size:0;
    max-inline-size:100%;
    overflow-wrap:anywhere;
    font-family:var(--ofm-font-display,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}

.ofm-public-profile__title-row h1,
.ofm-public-playlist-detail__body h1,
.ofm-public-playlist-not-found h1,
[data-ofm-station-root] .ofm-station-release-fallback h1,
[data-ofm-station-root] .ofm-station-release-hero h1,
.ofm-releases-archive__heading h1,
.ofm-playlist-chart-archive .ofm-releases-archive__heading h1,
.ofm-billboard__hero h1 {
    /* Existing .90-.98 line heights clipped real glyph bounds in the profile
     * hero. This leaves enough room for every curated display face. */
    letter-spacing:-.04em;
    line-height:1.14;
}

.ofm-public-profile__section-heading h2,
.ofm-public-profile__empty h2,
.ofm-public-profile .ofm-public-profile-mixes__heading h2,
.ofm-public-playlist-detail__tracks h2,
.ofm-public-playlist-detail__related h2,
[data-ofm-station-root] .ofm-station-release-details__credits h2,
[data-ofm-station-root] .ofm-station-release-related__heading h2,
.ofm-billboard__heading h2,
.ofm-playlist-billboard__heading h2,
.ofm-review-playlist-charts__heading h2 {
    letter-spacing:-.03em;
    line-height:1.16;
}

/* Selected presets set a document-wide heading line height with a selector
 * that is deliberately more specific than ordinary component CSS. Keep the
 * audited display surfaces above that minimum as well: a font choice must
 * never reintroduce the clipping this file prevents. */
html[data-ofm-font-theme] :is(
    .ofm-public-profile__title-row h1,
    .ofm-public-playlist-detail__body h1,
    .ofm-public-playlist-not-found h1,
    [data-ofm-station-root] .ofm-station-release-fallback h1,
    [data-ofm-station-root] .ofm-station-release-hero h1,
    .ofm-releases-archive__heading h1,
    .ofm-playlist-chart-archive .ofm-releases-archive__heading h1,
    .ofm-billboard__hero h1,
    .ofm-public-profile__section-heading h2,
    .ofm-public-profile__empty h2,
    .ofm-public-profile .ofm-public-profile-mixes__heading h2,
    .ofm-public-playlist-detail__tracks h2,
    .ofm-public-playlist-detail__related h2,
    [data-ofm-station-root] .ofm-station-release-details__credits h2,
    [data-ofm-station-root] .ofm-station-release-related__heading h2,
    .ofm-billboard__heading h2,
    .ofm-playlist-billboard__heading h2,
    .ofm-review-playlist-charts__heading h2
){
    line-height:1.16;
}

/* Match frequently repeated compact UI text that previously declared a local
 * sans family. Keep icon-only controls out of this list. */
.ofm-playlist-card--mix h3,
.ofm-release-row__main>a,
.ofm-station-track__title,
.ofm-playlist-save-button,
.ofm-playlist-save-button__count,
.ofm-playlist-card--mix>.ofm-playlist-card__rank-link,
.ofm-chart-rank-link,
.ofm-billboard__rank,
.ofm-billboard__trend,
.ofm-billboard__tabs a,
.ofm-billboard__heading>a,
.ofm-review-playlist-charts__count,
.ofm-review-playlist-charts__summary,
[data-ofm-station-root] button.ofm-station-track__playlist,
[data-ofm-station-root] .ofm-station-track__stats {
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}

/* Long names on compact public cards should use the available content column,
 * rather than overflow when a wider selected typeface is active. */
.ofm-playlist-card--mix .ofm-playlist-card__body,
.ofm-public-playlist-detail__body,
.ofm-public-playlist-detail__tracks>header,
.ofm-public-playlist-detail__related>header,
.ofm-billboard__heading,
.ofm-billboard__identity,
.ofm-releases-archive__heading {
    min-inline-size:0;
}

.ofm-playlist-card--mix h3,
.ofm-billboard__identity strong,
.ofm-billboard__identity span,
.ofm-public-playlist-detail__owner strong,
.ofm-public-playlist-detail__owner small,
.ofm-public-playlist-detail__owner em {
    line-height:1.32;
}

@supports (text-wrap:balance) {
    .ofm-public-profile__title-row h1,
    .ofm-public-playlist-detail__body h1,
    [data-ofm-station-root] .ofm-station-release-fallback h1,
    [data-ofm-station-root] .ofm-station-release-hero h1,
    .ofm-releases-archive__heading h1,
    .ofm-playlist-chart-archive .ofm-releases-archive__heading h1,
    .ofm-billboard__hero h1 {
        text-wrap:balance;
    }
}

@media (max-width:660px) {
    /* A small extra margin keeps the larger safe line boxes from crowding
     * adjacent metadata on single-column public heroes. */
    .ofm-public-profile__title-row,
    .ofm-public-playlist-detail__body h1,
    [data-ofm-station-root] .ofm-station-release-hero h1 {
        margin-block-end:.08em;
    }
}

/* Source: assets/css/content-surface.css */
/*
 * Child-owned baseline for the few deliberate `the_content()` surfaces.
 *
 * This is opt-in: only content roots emit the hook. It does not reset parent
 * templates, native player controls, Station track rows, or comment posting.
 */

/* WordPress core, comments, Station, search, and child dialogs share this
 * utility. Keeping it app-scoped makes it independent of the parent theme
 * while allowing a keyboard user to reveal the focused skip link/control. */
body.ofm-app-route .screen-reader-text{
    position:absolute !important;
    inline-size:1px !important;
    block-size:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    clip-path:inset(50%) !important;
    white-space:nowrap !important;
    border:0 !important;
}

body.ofm-app-route .screen-reader-text:focus-visible{
    position:fixed !important;
    inset:12px auto auto 12px !important;
    z-index:100000 !important;
    inline-size:auto !important;
    block-size:auto !important;
    margin:0 !important;
    padding:.7rem .9rem !important;
    overflow:visible !important;
    clip:auto !important;
    clip-path:none !important;
    border:1px solid rgba(244,196,48,.95) !important;
    border-radius:8px !important;
    background:#15120c !important;
    color:#fff !important;
    box-shadow:0 10px 28px rgba(0,0,0,.35) !important;
    outline:3px solid rgba(244,196,48,.38) !important;
    outline-offset:2px !important;
    white-space:normal !important;
}

body.ofm-app-route [data-ofm-content-root]{
    min-inline-size:0;
}

/* The normal Page/Post fallback has child-owned geometry. Station keeps its
 * release layout and uses only the semantic surface rules below. */
body.ofm-app-route [data-ofm-content-root].ofm-content-document{
    inline-size:min(100% - 32px,900px);
    margin:clamp(28px,5vw,72px) auto;
}

body.ofm-app-route [data-ofm-content-root] .ofm-content-document__article,
body.ofm-app-route [data-ofm-content-root].ofm-content-document--fallback > [data-ofm-content-surface]{
    min-inline-size:0;
    padding:clamp(22px,4vw,48px);
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
    box-shadow:0 22px 56px rgba(0,0,0,.16);
}

body.ofm-app-route [data-ofm-content-root] .ofm-content-document__header{
    margin:0 0 clamp(22px,3vw,36px);
}

body.ofm-app-route [data-ofm-content-root] .ofm-content-document__title{
    max-inline-size:100%;
    margin:0;
    color:#fff;
    font-family:var(--ofm-font-display);
    font-size:clamp(2rem,5vw,4rem);
    font-weight:800;
    letter-spacing:var(--ofm-font-display-letter-spacing);
    line-height:var(--ofm-font-display-line-height);
    overflow-wrap:anywhere;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface]{
    position:relative;
    min-inline-size:0;
    color:#f4f2eb;
}

/* Keep Gutenberg layout blocks responsive without collapsing their native
 * alignment, gallery, cover, column, or media-text semantics. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(
    .wp-block-group,
    .wp-block-columns,
    .wp-block-column,
    .wp-block-media-text,
    .wp-block-cover,
    .wp-block-gallery,
    .wp-block-image,
    .wp-block-embed,
    .wp-block-audio,
    .wp-block-video,
    .wp-block-quote,
    .wp-block-pullquote
):not(.ofm-station-track):not(.ofm-station-track *){
    min-inline-size:0;
}

/* Deliberate content rhythm. The complex Station player row is explicitly
 * excluded so waveform sizing, seeking, and its control hierarchy stay owned
 * by the Station modules. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(
    p,ul,ol,dl,figure,table,blockquote,pre,
    .wp-block,.wp-block-group,.wp-block-columns,.wp-block-pullquote
):not(.ofm-station-track):not(.ofm-station-track *){
    margin-block:0 clamp(16px,2.4vw,26px);
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(
    p,li,dt,dd,figcaption,blockquote,cite,
    .wp-block-post-excerpt__excerpt
):not(.ofm-station-track):not(.ofm-station-track *){
    min-inline-size:0;
    font-family:var(--ofm-font-body);
    font-size:clamp(1rem,.98rem + .1vw,1.075rem);
    line-height:var(--ofm-font-body-line-height);
    overflow-wrap:anywhere;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(
    h1,h2,h3,h4,h5,h6,.wp-block-post-title
):not(.ofm-station-track):not(.ofm-station-track *){
    max-inline-size:100%;
    margin:clamp(26px,4vw,44px) 0 clamp(12px,1.8vw,18px);
    color:#fff;
    font-family:var(--ofm-font-display);
    font-weight:800;
    letter-spacing:var(--ofm-font-display-letter-spacing);
    line-height:var(--ofm-font-display-line-height);
    overflow-wrap:anywhere;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(h1,.wp-block-post-title):not(.ofm-station-track):not(.ofm-station-track *){ font-size:clamp(2rem,5vw,3.55rem); }
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] h2:not(.ofm-station-track):not(.ofm-station-track *){ font-size:clamp(1.6rem,3.5vw,2.55rem); }
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] h3:not(.ofm-station-track):not(.ofm-station-track *){ font-size:clamp(1.3rem,2.5vw,1.85rem); }
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(h4,h5,h6):not(.ofm-station-track):not(.ofm-station-track *){ font-size:clamp(1.05rem,2vw,1.3rem); }

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(a):not(.ofm-station-track):not(.ofm-station-track *){
    color:#f4c430;
    text-decoration-color:rgba(244,196,48,.58);
    text-underline-offset:.16em;
    text-decoration-thickness:1px;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(a,button,input,select,textarea,summary):not(.ofm-station-track):not(.ofm-station-track *):focus-visible{
    outline:3px solid rgba(244,196,48,.72);
    outline-offset:3px;
}

/* Native media and oEmbed output retain WordPress' own markup. These limits
 * only prevent an intrinsic asset from escaping the child content surface. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(
    img,video,audio,iframe,embed,object
):not(.wp-block-cover__image-background):not(.ofm-station-track):not(.ofm-station-track *){
    max-inline-size:100%;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-audio audio:not(.ofm-station-track audio){
    display:block;
    inline-size:100%;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(figcaption,.wp-element-caption):not(.ofm-station-track):not(.ofm-station-track *){
    margin-top:.65rem;
    color:#bdb9ad;
    font-size:.88rem;
    line-height:1.45;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(blockquote,.wp-block-quote,.wp-block-pullquote):not(.ofm-station-track):not(.ofm-station-track *){
    padding-inline:clamp(16px,3vw,28px);
    border-inline-start:3px solid rgba(244,196,48,.78);
    color:#eeece5;
    font-family:var(--ofm-font-display);
    font-size:clamp(1.15rem,2.3vw,1.45rem);
    line-height:1.42;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(code,kbd,samp,pre,.wp-block-code):not(.ofm-station-track):not(.ofm-station-track *){
    font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(pre,.wp-block-code):not(.ofm-station-track):not(.ofm-station-track *){
    max-inline-size:100%;
    padding:1rem 1.1rem;
    overflow:auto;
    border:1px solid rgba(255,255,255,.13);
    border-radius:12px;
    background:rgba(0,0,0,.26);
    color:#f7f3e7;
    line-height:1.55;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-table:not(.ofm-station-track):not(.ofm-station-track *){
    max-inline-size:100%;
    overflow-x:auto;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-table table:not(.ofm-station-track table){
    inline-size:100%;
    min-inline-size:34rem;
    border-collapse:collapse;
}

/* A raw editor/shortcode table has no Gutenberg wrapper to provide scroll.
 * Give only that bare table a scroll container rather than changing block
 * table display or its alignment semantics. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] table:not(.wp-block-table table):not(.ofm-station-track table){
    display:block;
    max-inline-size:100%;
    overflow-x:auto;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-table :where(th,td):not(.ofm-station-track *),
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] table:not(.ofm-station-track table) :where(th,td){
    padding:.72rem .82rem;
    border:1px solid rgba(255,255,255,.14);
    text-align:start;
    vertical-align:top;
}

/* Core button blocks retain any editor-selected colors. The baseline only
 * makes their hit area, typography, wrapping, and focus state dependable. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-button:not(.ofm-station-track):not(.ofm-station-track *){
    max-inline-size:100%;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-button__link:not(.ofm-station-track):not(.ofm-station-track *){
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    min-block-size:42px;
    max-inline-size:100%;
    padding:.72em 1.1em;
    font-family:var(--ofm-font-ui);
    font-weight:800;
    line-height:1.15;
    text-align:center;
    white-space:normal;
}

/* WordPress multipage posts retain their core `wp_link_pages()` contract but
 * receive an app-owned, keyboard-sized pager instead of a parent .page-links
 * treatment. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :is(
    .ofm-content-document__pages,
    .ofm-station-page-links
){
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.5rem;
    margin:clamp(22px,3vw,34px) 0 0;
    padding-top:clamp(16px,2.5vw,24px);
    border-top:1px solid rgba(255,255,255,.13);
    color:#c9c3b6;
    font-family:var(--ofm-font-ui);
    font-size:.82rem;
    font-weight:750;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :is(
    .ofm-content-document__page-number,
    .ofm-station-page-number
){
    display:inline-grid;
    place-items:center;
    min-inline-size:2.2rem;
    min-block-size:2.2rem;
    border:1px solid rgba(255,255,255,.2);
    border-radius:8px;
    background:rgba(255,255,255,.025);
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :is(
    .ofm-content-document__page-number,
    .ofm-station-page-number
):not(:has(a)){
    border-color:rgba(244,196,48,.72);
    background:rgba(244,196,48,.13);
    color:#ffe187;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :is(
    .ofm-content-document__page-number,
    .ofm-station-page-number
) a{
    display:grid;
    place-items:center;
    inline-size:100%;
    block-size:100%;
    color:#f4f2eb;
    text-decoration:none;
}

/* Form selectors deliberately do not change action, method, names, values,
 * validation, or submission. They apply only to forms embedded in content;
 * the existing comment form lifecycle remains outside this surface. */
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] :where(form,fieldset):not(.ofm-station-track):not(.ofm-station-track *){
    min-inline-size:0;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .post-password-form:not(.ofm-station-track):not(.ofm-station-track *){
    display:grid;
    gap:1rem;
    margin:0;
    padding:0;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .post-password-form:not(.ofm-station-track) p{
    display:flex;
    flex-wrap:wrap;
    align-items:end;
    gap:.8rem;
    margin:0;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(label,legend){
    display:block;
    margin:0 0 .6rem;
    color:#f4f2eb;
    font-family:var(--ofm-font-ui);
    font-size:.86rem;
    font-weight:750;
    line-height:1.35;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) label + label{
    margin-inline:0;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .post-password-form:not(.ofm-station-track) label{
    flex:1 1 14rem;
    margin:0;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    select,
    textarea
){
    box-sizing:border-box;
    inline-size:100%;
    max-inline-size:100%;
    min-block-size:2.65rem;
    padding:.65rem .75rem;
    border:1px solid rgba(255,255,255,.22);
    border-radius:9px;
    background:rgba(0,0,0,.2);
    color:#fff;
    font:inherit;
    line-height:1.35;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) textarea{
    min-block-size:8rem;
    resize:vertical;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    select,
    textarea
):focus-visible{
    border-color:rgba(244,196,48,.88);
    background:rgba(0,0,0,.3);
    outline:3px solid rgba(244,196,48,.32);
    outline-offset:2px;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"]
){
    box-sizing:border-box;
    min-block-size:42px;
    max-inline-size:100%;
    padding:.68rem 1rem;
    border:1px solid rgba(244,196,48,.64);
    border-radius:9px;
    background:#f4c430;
    color:#17130a;
    font-family:var(--ofm-font-ui);
    font-size:.94rem;
    font-weight:800;
    line-height:1.15;
    cursor:pointer;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"]
):hover:not(:disabled){
    border-color:#ffe384;
    background:#ffd045;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    input,
    select,
    textarea
):disabled{
    opacity:.58;
    cursor:not-allowed;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    input[type="checkbox"],
    input[type="radio"]
){
    inline-size:1.1rem;
    block-size:1.1rem;
    margin-inline-end:.45rem;
    appearance:auto !important;
    -webkit-appearance:auto !important;
    -moz-appearance:auto !important;
    accent-color:#f4c430;
    vertical-align:-.15em;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    input[type="checkbox"],
    input[type="radio"]
)::before,
body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) :where(
    input[type="checkbox"],
    input[type="radio"]
)::after{
    display:none !important;
    content:none !important;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) input[type="file"]{
    box-sizing:border-box;
    max-inline-size:100%;
    min-block-size:2.65rem;
    padding:.35rem;
    border:1px dashed rgba(255,255,255,.32);
    border-radius:9px;
    color:#f4f2eb;
    font:inherit;
}

body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] form:not(.ofm-station-track form) input[type="file"]::file-selector-button{
    margin-inline-end:.65rem;
    padding:.45rem .65rem;
    border:1px solid rgba(244,196,48,.58);
    border-radius:6px;
    background:rgba(244,196,48,.12);
    color:#f8e7a0;
    font:inherit;
    font-weight:750;
    cursor:pointer;
}

@media(max-width:560px){
    body.ofm-app-route [data-ofm-content-root].ofm-content-document{
        inline-size:min(100% - 20px,900px);
        margin-block:20px 36px;
    }

    body.ofm-app-route [data-ofm-content-root] .ofm-content-document__article,
    body.ofm-app-route [data-ofm-content-root].ofm-content-document--fallback > [data-ofm-content-surface]{
        padding:20px;
        border-radius:16px;
    }

    body.ofm-app-route [data-ofm-content-root] [data-ofm-content-surface] .wp-block-table table:not(.ofm-station-track table){
        min-inline-size:30rem;
    }
}

/* Source: assets/css/fallback-routes.css */
/*
 * Child-owned WordPress fallback documents.
 *
 * The data hook lives on the direct <main> PJAX swaps, so a generic archive
 * or 404 cannot inherit its geometry from a retained parent wrapper.
 */
main[data-ofm-fallback-route]{
    --ofm-fallback-edge:clamp(18px,4vw,52px);
    position:relative;
    box-sizing:border-box;
    display:block;
    inline-size:100%;
    min-inline-size:0;
    min-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance,var(--ofm-app-shell-header-height,72px)));
    margin:0;
    padding:clamp(44px,8vw,112px) var(--ofm-fallback-edge) calc(148px + env(safe-area-inset-bottom));
    overflow:clip;
    background:
        radial-gradient(58% 44% at 2% 0%,rgb(244 196 48 / .105),transparent 74%),
        radial-gradient(46% 42% at 98% 8%,rgb(85 99 173 / .09),transparent 72%),
        #090a0d;
    color:#f7f4eb;
    isolation:isolate;
    float:none;
    transform:none;
}

main[data-ofm-fallback-route],
main[data-ofm-fallback-route] *,
main[data-ofm-fallback-route] *::before,
main[data-ofm-fallback-route] *::after{
    box-sizing:border-box;
}

main[data-ofm-fallback-route] .ofm-fallback-route__surface{
    display:block;
    inline-size:min(100%,1040px);
    min-inline-size:0;
    margin:0 auto;
    padding:clamp(24px,4vw,50px);
    border:1px solid rgb(255 255 255 / .12);
    border-radius:24px;
    background:linear-gradient(145deg,rgb(27 28 32 / .92),rgb(12 13 16 / .96));
    box-shadow:0 26px 68px rgb(0 0 0 / .26),inset 0 1px 0 rgb(255 255 255 / .035);
}

main[data-ofm-fallback-route] .ofm-fallback-route__header{
    display:grid;
    gap:0;
    max-inline-size:720px;
}

main[data-ofm-fallback-route] .ofm-eyebrow{
    margin:0;
    color:#f4c430;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.15em;
    line-height:1.25;
}

main[data-ofm-fallback-route] .ofm-fallback-route__title{
    max-inline-size:100%;
    margin:9px 0 14px;
    color:#fff;
    font-family:var(--ofm-font-display,ui-sans-serif,system-ui,sans-serif);
    font-size:clamp(2.3rem,5.5vw,4.85rem);
    font-weight:850;
    letter-spacing:var(--ofm-font-display-letter-spacing,-.055em);
    /* Keep room for ascenders/descenders in every controller font preset.
       The compact .98 display line-height that older route shells used can
       visibly clip larger glyphs on a first render. */
    line-height:1.14;
    overflow-wrap:anywhere;
}

main[data-ofm-fallback-route] .ofm-fallback-route__description{
    max-inline-size:640px;
    margin:0;
    color:#c1c0bb;
    font-family:var(--ofm-font-body,ui-sans-serif,system-ui,sans-serif);
    font-size:clamp(1rem,.96rem + .16vw,1.1rem);
    line-height:1.58;
    overflow-wrap:anywhere;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entries{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(13px,2vw,20px);
    margin-top:clamp(30px,5vw,58px);
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry{
    display:flex;
    min-inline-size:0;
    min-block-size:194px;
    padding:clamp(18px,2.4vw,26px);
    flex-direction:column;
    align-items:flex-start;
    border:1px solid rgb(255 255 255 / .11);
    border-radius:18px;
    background:linear-gradient(145deg,rgb(255 255 255 / .04),rgb(255 255 255 / .015));
    color:#f7f4eb;
    box-shadow:inset 0 1px 0 rgb(255 255 255 / .025);
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-type{
    margin:0 0 9px;
    color:#f4c430;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.67rem;
    font-weight:850;
    letter-spacing:.1em;
    line-height:1.2;
    text-transform:uppercase;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-title{
    margin:0;
    color:#fff;
    font-family:var(--ofm-font-display,ui-sans-serif,system-ui,sans-serif);
    font-size:clamp(1.25rem,2vw,1.65rem);
    font-weight:800;
    letter-spacing:var(--ofm-font-display-letter-spacing,-.035em);
    line-height:1.16;
    overflow-wrap:anywhere;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-title a{
    color:inherit;
    text-decoration:none;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-title a:hover,
main[data-ofm-fallback-route] .ofm-fallback-route__entry-title a:focus-visible{
    color:#ffe17a;
    outline:0;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-meta{
    margin:10px 0 0;
    color:#999894;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.75rem;
    font-weight:700;
    line-height:1.35;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-excerpt{
    display:-webkit-box;
    overflow:hidden;
    margin:11px 0 0;
    color:#c8c6c0;
    font-family:var(--ofm-font-body,ui-sans-serif,system-ui,sans-serif);
    font-size:.9rem;
    line-height:1.52;
    text-overflow:ellipsis;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-link{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-top:auto;
    padding-top:18px;
    color:#f4c430;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.78rem;
    font-weight:850;
    line-height:1.2;
    text-decoration:none;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-link:hover,
main[data-ofm-fallback-route] .ofm-fallback-route__entry-link:focus-visible{
    color:#ffe17a;
    outline:0;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-link span{
    font-size:1.05em;
    transition:transform .18s ease;
}

main[data-ofm-fallback-route] .ofm-fallback-route__entry-link:hover span,
main[data-ofm-fallback-route] .ofm-fallback-route__entry-link:focus-visible span{
    transform:translateX(3px);
}

main[data-ofm-fallback-route] .ofm-fallback-route__empty{
    display:grid;
    justify-items:start;
    gap:18px;
    max-inline-size:600px;
    margin-top:clamp(30px,5vw,58px);
    padding:clamp(20px,3vw,28px);
    border:1px dashed rgb(255 255 255 / .2);
    border-radius:17px;
    background:rgb(255 255 255 / .025);
}

main[data-ofm-fallback-route] .ofm-fallback-route__empty p{
    margin:0;
    color:#c4c2bd;
    font-family:var(--ofm-font-body,ui-sans-serif,system-ui,sans-serif);
    font-size:.98rem;
    line-height:1.55;
}

main[data-ofm-fallback-route] .ofm-fallback-route__action{
    display:inline-flex;
    min-block-size:42px;
    padding:0 16px;
    align-items:center;
    justify-content:center;
    border:1px solid rgb(244 196 48 / .82);
    border-radius:10px;
    background:#f4c430;
    color:#18140a;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.82rem;
    font-weight:850;
    line-height:1;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,transform .18s ease;
}

main[data-ofm-fallback-route] .ofm-fallback-route__action:hover,
main[data-ofm-fallback-route] .ofm-fallback-route__action:focus-visible{
    border-color:#ffe17a;
    background:#ffe17a;
    outline:0;
    transform:translateY(-1px);
}

main[data-ofm-fallback-route] .navigation.pagination{
    display:flex;
    margin-top:clamp(26px,4vw,42px);
    padding-top:clamp(20px,3vw,28px);
    border-top:1px solid rgb(255 255 255 / .11);
}

main[data-ofm-fallback-route] .navigation.pagination .nav-links{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

main[data-ofm-fallback-route] .navigation.pagination :is(a,span.page-numbers){
    display:grid;
    min-inline-size:38px;
    min-block-size:38px;
    padding-inline:10px;
    place-items:center;
    border:1px solid rgb(255 255 255 / .16);
    border-radius:9px;
    background:rgb(255 255 255 / .025);
    color:#e8e5dc;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.78rem;
    font-weight:800;
    line-height:1;
    text-decoration:none;
}

main[data-ofm-fallback-route] .navigation.pagination a:hover,
main[data-ofm-fallback-route] .navigation.pagination a:focus-visible,
main[data-ofm-fallback-route] .navigation.pagination .current{
    border-color:rgb(244 196 48 / .7);
    background:rgb(244 196 48 / .11);
    color:#ffe17a;
    outline:0;
}

@media (max-width:700px){
    main[data-ofm-fallback-route]{
        --ofm-fallback-edge:16px;
        padding-block:36px calc(128px + env(safe-area-inset-bottom));
    }

    main[data-ofm-fallback-route] .ofm-fallback-route__surface{
        padding:22px;
        border-radius:19px;
    }

    main[data-ofm-fallback-route] .ofm-fallback-route__entries{
        grid-template-columns:1fr;
    }

    main[data-ofm-fallback-route] .ofm-fallback-route__entry{
        min-block-size:0;
    }
}

@media (prefers-reduced-motion:reduce){
    main[data-ofm-fallback-route] :is(.ofm-fallback-route__entry-link span,.ofm-fallback-route__action){
        transition:none;
    }
}

/* Source: assets/css/app-shell.css */
/*
 * Child-owned document shell. Every rule is scoped to the route class emitted
 * by inc/app-shell.php, so parent-theme admin, embeds, and plugin documents
 * retain their own layout contract.
 */
body.ofm-app-route{
    --ofm-app-shell-bg:#090a0d;
    --ofm-app-shell-surface:#111216;
    --ofm-app-shell-elevated:#17191d;
    --ofm-app-shell-border:rgb(255 255 255 / .11);
    --ofm-app-shell-text:#f7f4eb;
    --ofm-app-shell-muted:#a9a8a4;
    --ofm-app-shell-accent:#f4c430;
    /* Keep the base chrome size separate from viewport/admin-bar clearance.
       The header stays in normal document flow while sticky, so the content
       never jumps when it reaches the top of the viewport. */
    --ofm-app-shell-header-height:72px;
    --ofm-app-shell-safe-top:env(safe-area-inset-top,0px);
    --ofm-app-shell-sticky-top:0px;
    --ofm-app-shell-header-block-size:calc(var(--ofm-app-shell-header-height) + var(--ofm-app-shell-safe-top));
    --ofm-app-shell-header-clearance:calc(var(--ofm-app-shell-header-block-size) + var(--ofm-app-shell-sticky-top));
    min-block-size:100dvh;
    margin:0;
    padding:0;
    /* Match the persistent player's body-level clearance contract so the
       footer ends above the fixed player without double-spacing #content. */
    padding-block-end:calc(var(--player-height,118px) + env(safe-area-inset-bottom));
    background:var(--ofm-app-shell-bg);
    color:var(--ofm-app-shell-text);
}

/* WordPress keeps its admin bar in the viewport and offsets the document for
   it. Match that exact fixed-bar height so the sticky child header remains
   below it; do not add a second flow spacer here. Admin-bar chrome owns the
   top safe-area inset on these documents. */
body.ofm-app-route.admin-bar{
    --ofm-app-shell-safe-top:0px;
    --ofm-app-shell-sticky-top:var(--wp-admin--admin-bar--height,32px);
}

body.ofm-app-route #header.ofm-app-shell__header{
    position:-webkit-sticky;
    position:sticky;
    z-index:var(--ofm-layer-header,99800);
    inset:auto;
    top:var(--ofm-app-shell-sticky-top);
    display:block;
    width:100%;
    max-width:none;
    height:auto;
    min-block-size:var(--ofm-app-shell-header-block-size);
    margin:0;
    padding:0;
    border:0;
    border-bottom:1px solid var(--ofm-app-shell-border);
    background:linear-gradient(180deg,rgb(12 13 16 / .98),rgb(9 10 13 / .96));
    box-shadow:0 12px 30px rgb(0 0 0 / .13);
    color:var(--ofm-app-shell-text);
    float:none;
    transform:none;
    overflow:visible;
}

body.ofm-app-route .ofm-app-shell__header-inner{
    display:flex;
    width:min(1440px,100%);
    box-sizing:border-box;
    min-block-size:var(--ofm-app-shell-header-block-size);
    margin:0 auto;
    padding:var(--ofm-app-shell-safe-top) clamp(18px,3vw,42px) 0;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

body.ofm-app-route .ofm-app-shell__brand{
    display:inline-flex;
    min-inline-size:0;
    align-items:center;
    gap:10px;
    color:var(--ofm-app-shell-text);
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.94rem;
    font-weight:850;
    letter-spacing:-.02em;
    line-height:1.1;
    text-decoration:none;
}

body.ofm-app-route .ofm-app-shell__brand-mark{
    display:grid;
    inline-size:34px;
    block-size:34px;
    flex:0 0 34px;
    place-items:center;
    border:1px solid rgb(244 196 48 / .76);
    border-radius:50%;
    background:rgb(244 196 48 / .1);
    color:var(--ofm-app-shell-accent);
    font-size:.64rem;
    font-weight:900;
    letter-spacing:.04em;
}

body.ofm-app-route .ofm-app-shell__brand-name{
    min-inline-size:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

body.ofm-app-route .ofm-app-shell__brand:hover,
body.ofm-app-route .ofm-app-shell__brand:focus-visible{
    color:#fff;
    outline:0;
}

body.ofm-app-route .ofm-app-shell__brand:focus-visible,
body.ofm-app-route .ofm-app-shell__skip-link:focus-visible{
    outline:2px solid var(--ofm-app-shell-accent);
    outline-offset:4px;
}

body.ofm-app-route .ofm-app-shell__skip-link{
    position:fixed;
    z-index:var(--ofm-layer-skip-link,100020);
    inset:calc(var(--ofm-app-shell-sticky-top) + max(10px,var(--ofm-app-shell-safe-top))) auto auto max(12px,env(safe-area-inset-left,0px));
    padding:9px 12px;
    transform:translateY(-180%);
    border-radius:8px;
    background:var(--ofm-app-shell-accent);
    color:#17130a;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.82rem;
    font-weight:850;
    line-height:1.1;
    text-decoration:none;
    transition:transform .16s ease;
}

body.ofm-app-route .ofm-app-shell__skip-link:focus{
    transform:translateY(0);
}

body.ofm-app-route #content.ofm-app-shell__content{
    position:relative;
    z-index:1;
    inset:auto;
    width:100%;
    max-width:none;
    height:auto;
    box-sizing:border-box;
    min-inline-size:0;
    min-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance));
    margin:0;
    padding:0;
    padding-block-end:0;
    scroll-margin-block-start:var(--ofm-app-shell-header-clearance);
    background:var(--ofm-app-shell-bg);
    float:none;
    transform:none;
}

/* The player intentionally sits above ordinary chrome. Raise the header only
   while its mobile menu is open, so modal layers retain their normal priority. */
body.ofm-app-route #header.ofm-app-shell__header.is-nav-open{
    z-index:var(--ofm-layer-header-menu,99980);
}

body.ofm-app-route #footer.ofm-app-shell__footer{
    position:relative;
    z-index:2;
    inset:auto;
    display:block;
    width:100%;
    max-width:none;
    height:auto;
    margin:0;
    padding:0;
    border:0;
    border-top:1px solid var(--ofm-app-shell-border);
    background:#0b0c0f;
    color:var(--ofm-app-shell-muted);
    float:none;
    transform:none;
    overflow:visible;
}

body.ofm-app-route .ofm-app-shell__footer-inner{
    display:flex;
    width:min(1440px,100%);
    box-sizing:border-box;
    min-block-size:66px;
    margin:0 auto;
    padding:16px clamp(18px,3vw,42px) calc(16px + env(safe-area-inset-bottom));
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

body.ofm-app-route .ofm-app-shell__footer p{
    margin:0;
    color:inherit;
    font-size:.76rem;
    line-height:1.4;
}

body.ofm-app-route .ofm-app-shell__footer-brand{
    color:#e8e3d6;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    font-size:.8rem;
    font-weight:800;
    line-height:1.2;
    text-decoration:none;
}

body.ofm-app-route .ofm-app-shell__footer-brand:hover,
body.ofm-app-route .ofm-app-shell__footer-brand:focus-visible{
    color:var(--ofm-app-shell-accent);
    outline:0;
}

/* Private and account workspaces keep their native form markup, nonces, and
   actions, but receive a small child-owned control baseline instead of
   inheriting broad parent form floats or transforms. Component CSS still
   owns all visuals. */
body:is(.ofm-app-route--private,.ofm-app-route--access,.ofm-app-route--password-reset,.ofm-app-route--email-change) :is(
    .ofm-account,
    .ofm-member-profile,
    .ofm-library,
    .ofm-following-feed,
    .ofm-artist-studio,
    .ofm-editor-review-portal,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-insights
){
    min-inline-size:0;
}

body:is(.ofm-app-route--private,.ofm-app-route--access,.ofm-app-route--password-reset,.ofm-app-route--email-change) :is(
    .ofm-account,
    .ofm-member-profile,
    .ofm-library,
    .ofm-following-feed,
    .ofm-artist-studio,
    .ofm-editor-review-portal,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-insights
) :is(form,fieldset,legend,label){
    box-sizing:border-box;
    min-inline-size:0;
}

body:is(.ofm-app-route--private,.ofm-app-route--access,.ofm-app-route--password-reset,.ofm-app-route--email-change) :is(
    .ofm-account,
    .ofm-member-profile,
    .ofm-library,
    .ofm-following-feed,
    .ofm-artist-studio,
    .ofm-editor-review-portal,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-insights
) :is(form,fieldset){
    float:none;
    transform:none;
}

body:is(.ofm-app-route--private,.ofm-app-route--access,.ofm-app-route--password-reset,.ofm-app-route--email-change) :is(
    .ofm-account,
    .ofm-member-profile,
    .ofm-library,
    .ofm-following-feed,
    .ofm-artist-studio,
    .ofm-editor-review-portal,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-insights
) :is(input,select,textarea,button){
    box-sizing:border-box;
    min-inline-size:0;
    max-inline-size:100%;
    font:inherit;
}

body:is(.ofm-app-route--private,.ofm-app-route--access,.ofm-app-route--password-reset,.ofm-app-route--email-change) :is(
    .ofm-account,
    .ofm-member-profile,
    .ofm-library,
    .ofm-following-feed,
    .ofm-artist-studio,
    .ofm-editor-review-portal,
    .ofm-controller-dashboard,
    .ofm-notifications,
    .ofm-insights
) :is(input,select,textarea){
    color:inherit;
}

@media (max-width:760px){
    body.ofm-app-route{
        --ofm-app-shell-header-height:64px;
    }

    body.ofm-app-route .ofm-app-shell__header-inner{
        min-block-size:var(--ofm-app-shell-header-block-size);
        padding-inline:16px;
        gap:12px;
    }

    body.ofm-app-route .ofm-app-shell__brand-mark{
        inline-size:31px;
        block-size:31px;
        flex-basis:31px;
        font-size:.58rem;
    }

    body.ofm-app-route .ofm-app-shell__brand-name{
        max-inline-size:30vw;
    }

    body.ofm-app-route .ofm-app-shell__footer-inner{
        min-block-size:unset;
        padding-inline:16px;
    }
}

@media (max-width:782px){
    body.ofm-app-route.admin-bar{
        --ofm-app-shell-sticky-top:var(--wp-admin--admin-bar--height,46px);
    }
}

/* WordPress changes its mobile admin bar to document-positioned chrome at
   this width. Let the header use the real viewport top once that bar scrolls
   away, rather than leaving a permanent empty strip above navigation. */
@media (max-width:600px){
    body.ofm-app-route.admin-bar{
        --ofm-app-shell-sticky-top:0px;
    }
}

@media (max-width:580px){
    body.ofm-app-route{
        padding-block-end:calc(var(--player-height,142px) + env(safe-area-inset-bottom));
    }
}

@media (prefers-reduced-motion:reduce){
    body.ofm-app-route .ofm-app-shell__skip-link{
        transition:none;
    }
}

/* Source: assets/css/access-modal.css */
.ofm-access-modal[hidden] { display: none !important; }
.ofm-access-modal,
.ofm-access-modal *,
.ofm-access-modal *::before,
.ofm-access-modal *::after { box-sizing: border-box; }
.ofm-access-modal { position: fixed; z-index: var(--ofm-layer-access-modal, 100010); inset: 0; display: grid; min-block-size: 100dvh; place-items: center; isolation: isolate; padding: 20px; padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); }
.ofm-access-modal__backdrop { position: absolute; z-index: 0; inset: 0; background: rgb(0 0 0 / .76); backdrop-filter: blur(8px); touch-action: none; }
.ofm-access-modal__dialog { position: relative; z-index: 1; width: min(520px, 100%); max-height: min(760px, calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom))); overflow: auto; overscroll-behavior: contain; padding: clamp(28px, 5vw, 48px); color: #fff; background: #171717; border: 1px solid #343434; border-radius: 28px; box-shadow: 0 30px 90px rgb(0 0 0 / .55); outline: 0; -webkit-overflow-scrolling: touch; touch-action: pan-y; }
.ofm-access-modal__close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; padding: 0; color: #fff; background: transparent; border: 0; border-radius: 50%; font-size: 30px; line-height: 1; cursor: pointer; }
.ofm-access-modal__close:hover, .ofm-access-modal__close:focus-visible { background: #292929; }
.ofm-access-modal__eyebrow { margin: 0 48px 12px 0; color: #ffc72c; font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.ofm-access-modal h2 { margin: 0; color: #fff; font-size: clamp(36px, 7vw, 58px); line-height: .98; }
.ofm-access-modal__intro { margin: 14px 0 28px; color: #c7c7c7; font-size: 17px; line-height: 1.55; }
.ofm-access-modal__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 26px; padding: 5px; background: #0e0e0e; border: 1px solid #292929; border-radius: 16px; }
.ofm-access-modal__tabs button { min-height: 48px; color: #bbb; background: transparent; border: 0; border-radius: 12px; font-weight: 800; cursor: pointer; }
.ofm-access-modal__tabs button.is-active { color: #080808; background: #ffc72c; }
.ofm-access-modal .ofm-listener-form { display: grid; gap: 17px; }
.ofm-access-modal .ofm-listener-form[hidden] { display: none; }
.ofm-access-modal label { display: grid; gap: 8px; color: #fff; font-weight: 700; }
.ofm-access-modal label span { color: #aaa; font-weight: 400; }
.ofm-access-modal input { width: 100%; min-height: 50px; padding: 0 15px; color: #fff; background: #111; border: 1px solid #3b3b3b; border-radius: 13px; }
.ofm-access-modal input:focus { border-color: #ffc72c; outline: 2px solid rgb(255 199 44 / .2); }
.ofm-access-modal__submit { min-height: 56px; color: #080808; background: #ffc72c; border: 0; border-radius: 999px; font-weight: 900; cursor: pointer; }
.ofm-access-modal .ofm-form-message { min-height: 0; margin: -5px 0 0; color: #ffcc4d; }
.ofm-access-modal :is(button, a, input):focus-visible { outline: 2px solid #ffc72c; outline-offset: 3px; }
html.ofm-access-modal-open,
html.ofm-access-modal-open body { overflow: hidden; overscroll-behavior: none; }
html.ofm-access-modal-open :is(#ofm-player, #ofm-queue-drawer, #ofm-now-playing-drawer) { visibility: hidden; pointer-events: none; }
html.ofm-access-modal-open #player-workspace-show { display: none !important; }
html.ofm-access-modal-open :is(#header, #mobile-menu, #content, #footer, #aside, .ofm-app-shell__skip-link) { pointer-events: none; }
html.ofm-access-modal-open .ofm-app-shell__skip-link { visibility: hidden; }
@media (max-width: 600px) { .ofm-access-modal { align-items: end; padding: max(10px, env(safe-area-inset-top)) 0 0; } .ofm-access-modal__dialog { width: 100%; max-height: min(92dvh, calc(100dvh - 10px - env(safe-area-inset-top))); padding: 30px 22px calc(24px + env(safe-area-inset-bottom)); padding-inline: max(22px, env(safe-area-inset-left)) max(22px, env(safe-area-inset-right)); border-radius: 24px 24px 0 0; } }
@media (prefers-reduced-motion: reduce) { .ofm-access-modal { scroll-behavior: auto; } }

/* Source: assets/css/share-playlist-dialogs.css */
/*
 * Child-owned share and track-playlist picker dialogs.
 *
 * They are dynamically mounted at document level by library-management.js, so
 * they cannot inherit an arbitrary parent-template layout. The shared dialog
 * layer sits above the player and navigation, but below the access modal.
 */
html.ofm-overlay-open,
html.ofm-overlay-open body {
    overflow: hidden !important;
    overscroll-behavior: none;
}

/* Playlist feedback belongs above the persistent player, but never above a
   blocking dialog or the sign-in layer. */
.ofm-playlist-notice {
    z-index: var(--ofm-layer-toast, 99990) !important;
}

/* Retain the historical class names as a compatibility seam, while routing
   every child share/playlist surface through the same dialog layer. */
.ofm-share-modal,
.ofm-playlist-modal {
    z-index: var(--ofm-layer-dialog, 100000) !important;
}

.ofm-child-dialog,
.ofm-child-dialog *,
.ofm-child-dialog *::before,
.ofm-child-dialog *::after {
    box-sizing: border-box;
}

.ofm-child-dialog {
    position: fixed !important;
    z-index: var(--ofm-layer-dialog, 100000) !important;
    inset: 0 !important;
    display: grid !important;
    min-block-size: 100dvh;
    place-items: center !important;
    isolation: isolate;
    overflow: hidden;
    padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    background: rgb(3 4 6 / .78) !important;
    color: #f7f4eb;
    overscroll-behavior: contain;
    -webkit-tap-highlight-color: transparent;
}

.ofm-child-dialog[aria-hidden="true"] {
    display: none !important;
}

.ofm-child-dialog__surface {
    position: relative !important;
    display: block;
    width: min(100%, 488px) !important;
    max-block-size: min(720px, calc(100dvh - 36px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
    margin: 0 !important;
    padding: clamp(22px, 4vw, 32px) !important;
    overflow: auto;
    overscroll-behavior: contain;
    border: 1px solid rgb(244 196 48 / .36) !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgb(31 28 23 / .99), rgb(15 16 18 / .99) 58%, rgb(10 11 14 / .99)) !important;
    box-shadow: 0 30px 90px rgb(0 0 0 / .62), 0 0 0 1px rgb(255 255 255 / .025) inset;
    color: #f7f4eb !important;
    outline: 0;
    scrollbar-color: rgb(244 196 48 / .55) rgb(255 255 255 / .05);
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

.ofm-child-dialog__surface:focus-visible {
    outline: 2px solid #f4c430;
    outline-offset: 3px;
}

.ofm-child-dialog .ofm-eyebrow {
    margin: 0 44px 8px 0 !important;
    color: #f6c93d !important;
    font-family: var(--ofm-font-ui, ui-sans-serif, system-ui, sans-serif) !important;
    font-size: .67rem !important;
    font-weight: 900 !important;
    letter-spacing: .14em !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
}

.ofm-child-dialog h2 {
    max-inline-size: calc(100% - 42px);
    margin: 0 !important;
    overflow-wrap: anywhere;
    color: #fff !important;
    font-family: var(--ofm-font-display, var(--ofm-font-ui, ui-sans-serif, system-ui, sans-serif)) !important;
    font-size: clamp(1.42rem, 4.5vw, 2rem) !important;
    font-weight: 850 !important;
    letter-spacing: -.045em !important;
    line-height: 1.06 !important;
}

.ofm-child-dialog__close,
.ofm-child-dialog .ofm-share-modal__close,
.ofm-child-dialog .ofm-playlist-modal__close {
    position: absolute !important;
    inset: 15px 15px auto auto !important;
    display: grid !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgb(255 255 255 / .2) !important;
    border-radius: 50% !important;
    background: rgb(255 255 255 / .035) !important;
    box-shadow: none !important;
    color: #f5f3ec !important;
    font-family: Arial, sans-serif !important;
    font-size: 1.65rem !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: center !important;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.ofm-child-dialog .ofm-share-modal__close:hover,
.ofm-child-dialog .ofm-share-modal__close:focus-visible,
.ofm-child-dialog .ofm-playlist-modal__close:hover,
.ofm-child-dialog .ofm-playlist-modal__close:focus-visible {
    border-color: #f4c430 !important;
    background: rgb(244 196 48 / .14) !important;
    color: #ffe493 !important;
    outline: 0 !important;
    transform: rotate(90deg);
}

.ofm-child-dialog .ofm-share-modal__copy {
    margin: 11px 0 0 !important;
    color: #bdbbb3 !important;
    font-size: .91rem !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
}

.ofm-child-dialog .ofm-share-modal__networks {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px !important;
    margin: 23px 0 0 !important;
}

.ofm-child-dialog .ofm-share-modal__networks button {
    display: grid !important;
    min-width: 0;
    min-height: 88px !important;
    place-items: center !important;
    align-content: center;
    gap: 7px !important;
    margin: 0 !important;
    padding: 11px 6px !important;
    border: 1px solid rgb(255 255 255 / .12) !important;
    border-radius: 14px !important;
    background: rgb(255 255 255 / .027) !important;
    box-shadow: none !important;
    color: #e9e6dc !important;
    font: inherit !important;
    font-size: .73rem !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-align: center !important;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.ofm-child-dialog .ofm-share-modal__networks b {
    display: grid !important;
    width: 32px !important;
    height: 32px !important;
    place-items: center !important;
    border: 1px solid rgb(255 255 255 / .14);
    border-radius: 10px !important;
    background: rgb(255 255 255 / .09) !important;
    color: #fff !important;
    font-family: var(--ofm-font-ui, ui-sans-serif, system-ui, sans-serif) !important;
    font-size: .91rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.ofm-child-dialog .ofm-share-modal__networks button:nth-child(1) b { background: #25d366 !important; color: #0d2415 !important; }
.ofm-child-dialog .ofm-share-modal__networks button:nth-child(2) b { background: #1877f2 !important; }
.ofm-child-dialog .ofm-share-modal__networks button:nth-child(3) b { background: #101114 !important; border-color: #54565b !important; }
.ofm-child-dialog .ofm-share-modal__networks button:nth-child(4) b { background: #229ed9 !important; }
.ofm-child-dialog .ofm-share-modal__networks button:nth-child(5) b { background: #0a66c2 !important; }
.ofm-child-dialog .ofm-share-modal__networks button:nth-child(6) b { background: #f4c430 !important; color: #1a160a !important; }

.ofm-child-dialog .ofm-share-modal__networks button:hover,
.ofm-child-dialog .ofm-share-modal__networks button:focus-visible {
    border-color: rgb(244 196 48 / .72) !important;
    background: rgb(244 196 48 / .1) !important;
    color: #fff !important;
    outline: 0 !important;
    transform: translateY(-2px);
}

.ofm-child-dialog.ofm-track-playlist-modal .ofm-child-dialog__surface {
    width: min(100%, 540px) !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__list {
    display: grid !important;
    max-block-size: min(42dvh, 360px);
    gap: 8px !important;
    margin: 19px 0 0 !important;
    padding: 0 2px 0 0 !important;
    overflow: auto;
    overscroll-behavior: contain;
}

.ofm-child-dialog .ofm-playlist-modal__empty {
    margin: 0 !important;
    padding: 15px !important;
    border: 1px dashed rgb(244 196 48 / .26) !important;
    border-radius: 12px !important;
    background: rgb(244 196 48 / .035) !important;
    color: #c8c5bc !important;
    font-size: .88rem !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__item {
    display: flex !important;
    min-width: 0;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 11px 12px !important;
    border: 1px solid rgb(255 255 255 / .12) !important;
    border-radius: 13px !important;
    background: rgb(255 255 255 / .028) !important;
    color: #f5f2e9 !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__item strong {
    min-width: 0;
    overflow: hidden;
    color: inherit !important;
    font-size: .91rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ofm-child-dialog .ofm-track-playlist-modal__item .ofm-playlist-icon-button,
.ofm-child-dialog .ofm-track-playlist-modal__new .ofm-playlist-icon-button {
    display: inline-grid !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgb(244 196 48 / .72) !important;
    border-radius: 50% !important;
    background: rgb(244 196 48 / .1) !important;
    box-shadow: none !important;
    color: #f8d04d !important;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.ofm-child-dialog .ofm-track-playlist-modal__item .ofm-playlist-icon-button svg,
.ofm-child-dialog .ofm-track-playlist-modal__new .ofm-playlist-icon-button svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    stroke-width: 2 !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__item .ofm-playlist-icon-button:hover,
.ofm-child-dialog .ofm-track-playlist-modal__item .ofm-playlist-icon-button:focus-visible,
.ofm-child-dialog .ofm-track-playlist-modal__new .ofm-playlist-icon-button:hover,
.ofm-child-dialog .ofm-track-playlist-modal__new .ofm-playlist-icon-button:focus-visible {
    border-color: #f4c430 !important;
    background: #f4c430 !important;
    color: #1b1608 !important;
    outline: 0 !important;
    transform: scale(1.04);
}

.ofm-child-dialog .ofm-track-playlist-modal__item .ofm-playlist-icon-button:disabled,
.ofm-child-dialog .ofm-track-playlist-modal__new .ofm-playlist-icon-button:disabled {
    cursor: wait;
    opacity: .55;
    transform: none;
}

.ofm-child-dialog .ofm-track-playlist-modal__new {
    display: grid !important;
    gap: 8px !important;
    margin: 17px 0 0 !important;
    padding: 17px 0 0 !important;
    border-top: 1px solid rgb(255 255 255 / .11) !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__new label {
    margin: 0 !important;
    color: #c8c5bc !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__new > div {
    display: flex !important;
    align-items: center;
    gap: 8px !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__new input {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border: 1px solid rgb(255 255 255 / .18) !important;
    border-radius: 11px !important;
    background: rgb(0 0 0 / .25) !important;
    box-shadow: none !important;
    color: #fff !important;
    font: inherit !important;
    font-size: .9rem !important;
    line-height: 1.2 !important;
}

.ofm-child-dialog .ofm-track-playlist-modal__new input::placeholder {
    color: #85827b !important;
    opacity: 1;
}

.ofm-child-dialog .ofm-track-playlist-modal__new input:focus {
    border-color: rgb(244 196 48 / .8) !important;
    box-shadow: 0 0 0 3px rgb(244 196 48 / .12) !important;
    outline: 0 !important;
}

.ofm-child-dialog .ofm-playlist-modal__field {
    display: grid !important;
    gap: 8px !important;
    margin: 19px 0 0 !important;
    color: #c8c5bc !important;
    font-size: .8rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

.ofm-child-dialog .ofm-playlist-modal__field input {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border: 1px solid rgb(255 255 255 / .18) !important;
    border-radius: 11px !important;
    background: rgb(0 0 0 / .25) !important;
    box-shadow: none !important;
    color: #fff !important;
    font: inherit !important;
    font-size: .92rem !important;
    line-height: 1.2 !important;
}

.ofm-child-dialog .ofm-playlist-modal__field input:focus {
    border-color: rgb(244 196 48 / .8) !important;
    box-shadow: 0 0 0 3px rgb(244 196 48 / .12) !important;
    outline: 0 !important;
}

.ofm-child-dialog .ofm-playlist-modal__footer {
    display: flex !important;
    justify-content: flex-end;
    margin: 18px 0 0 !important;
}

.ofm-child-dialog .ofm-playlist-modal__footer .ofm-button {
    min-height: 40px !important;
    margin: 0 !important;
    padding: 9px 14px !important;
    border: 1px solid #f4c430 !important;
    border-radius: 999px !important;
    background: #f4c430 !important;
    box-shadow: none !important;
    color: #1b1608 !important;
    font: inherit !important;
    font-size: .82rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.ofm-child-dialog .ofm-playlist-modal__footer .ofm-button:hover,
.ofm-child-dialog .ofm-playlist-modal__footer .ofm-button:focus-visible {
    border-color: #ffe08a !important;
    background: #ffe08a !important;
    color: #17130a !important;
    outline: 0 !important;
    transform: translateY(-1px);
}

.ofm-child-dialog .ofm-playlist-modal__footer .ofm-button:disabled {
    cursor: wait;
    opacity: .6;
    transform: none;
}

/* The access controller owns its own focus trap. Hide a child dialog
   immediately when it opens; the JS observer then removes the stale node. */
html.ofm-access-modal-open .ofm-child-dialog {
    visibility: hidden !important;
    pointer-events: none !important;
}

@media (max-width: 560px) {
    .ofm-child-dialog {
        align-items: end !important;
        padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }

    .ofm-child-dialog__surface {
        width: 100% !important;
        max-block-size: min(80dvh, calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
        padding: 22px 18px !important;
        border-radius: 20px !important;
    }

    .ofm-child-dialog .ofm-share-modal__networks {
        gap: 8px !important;
        margin-top: 20px !important;
    }

    .ofm-child-dialog .ofm-share-modal__networks button {
        min-height: 78px !important;
        font-size: .68rem !important;
    }

    .ofm-child-dialog .ofm-track-playlist-modal__list {
        max-block-size: min(38dvh, 290px);
    }
}

@media (max-width: 360px) {
    .ofm-child-dialog .ofm-share-modal__networks {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .ofm-child-dialog *,
    .ofm-child-dialog *::before,
    .ofm-child-dialog *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Source: assets/css/site-nav.css */
/* Child-owned primary navigation. It makes no assumptions about parent menu
   classes or header containers; #header remains only a compatibility hook. */
body.ofm-app-route .ofm-site-nav{
    position:relative;
    min-inline-size:0;
    font-family:var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
}

body.ofm-app-route .ofm-site-nav__toggle{
    display:none;
}

body.ofm-app-route .ofm-site-nav__list{
    display:flex;
    min-inline-size:0;
    margin:0;
    padding:0;
    align-items:center;
    justify-content:flex-end;
    gap:4px;
    list-style:none;
}

body.ofm-app-route .ofm-site-nav__list>li{
    display:flex;
    min-inline-size:0;
    align-items:center;
    list-style:none;
}

body.ofm-app-route .ofm-site-nav__list>li>a{
    display:inline-flex;
    min-block-size:34px;
    min-inline-size:0;
    padding:7px 10px;
    align-items:center;
    justify-content:center;
    gap:7px;
    border:1px solid transparent;
    border-radius:999px;
    background:transparent;
    color:#b7b7b7;
    font:inherit;
    font-size:.77rem;
    font-weight:760;
    letter-spacing:-.012em;
    line-height:1.1;
    text-align:center;
    text-decoration:none;
    transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}

/* Older compact-control styles left logout fixed to the viewport. Reset that
   legacy fallback only inside the child-owned list. */
body.ofm-app-route .ofm-site-nav .ofm-logout-control{
    position:static;
    z-index:auto;
    inset:auto;
    opacity:1;
}

body.ofm-app-route .ofm-site-nav__list>li>a:hover,
body.ofm-app-route .ofm-site-nav__list>li>a:focus-visible{
    border-color:rgb(255 255 255 / .14);
    background:rgb(255 255 255 / .06);
    color:#fff;
    outline:0;
    transform:translateY(-1px);
}

body.ofm-app-route .ofm-site-nav :is(
    .ofm-member-profile-control,
    .ofm-logout-control,
    .ofm-explore-control,
    .ofm-billboard-control,
    .ofm-insights-control,
    .ofm-controller-dashboard-control,
    .ofm-notifications-control,
    .ofm-following-control
){
    inline-size:34px;
    padding-inline:0;
    color:#aaa;
}

body.ofm-app-route .ofm-site-nav :is(
    .ofm-member-profile-control,
    .ofm-logout-control,
    .ofm-explore-control,
    .ofm-billboard-control,
    .ofm-insights-control,
    .ofm-controller-dashboard-control,
    .ofm-notifications-control,
    .ofm-following-control
):hover,
body.ofm-app-route .ofm-site-nav :is(
    .ofm-member-profile-control,
    .ofm-logout-control,
    .ofm-explore-control,
    .ofm-billboard-control,
    .ofm-insights-control,
    .ofm-controller-dashboard-control,
    .ofm-notifications-control,
    .ofm-following-control
):focus-visible{
    border-color:rgb(244 196 48 / .3);
    background:rgb(244 196 48 / .08);
    color:var(--ofm-app-shell-accent,#f4c430);
}

body.ofm-app-route .ofm-site-nav :is(
    .ofm-member-profile-control__label,
    .ofm-logout-control__label,
    .ofm-explore-control__label,
    .ofm-billboard-control__label,
    .ofm-insights-control__label,
    .ofm-controller-dashboard-control__label,
    .ofm-notifications-control__label,
    .ofm-following-control__label
){
    display:none;
}

body.ofm-app-route .ofm-site-nav svg{
    inline-size:17px;
    block-size:17px;
    flex:0 0 17px;
    fill:none;
    stroke:currentColor;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-width:1.8;
}

body.ofm-app-route .ofm-site-nav .ofm-following-control__mark{
    display:grid;
    inline-size:24px;
    block-size:24px;
    place-items:center;
    border:1px solid rgb(244 196 48 / .72);
    border-radius:50%;
    background:rgb(244 196 48 / .12);
    box-shadow:none;
    color:var(--ofm-app-shell-accent,#f4c430);
}

body.ofm-app-route .ofm-site-nav .ofm-following-control__mark svg{
    inline-size:12px;
    block-size:12px;
    fill:currentColor;
    stroke:none;
}

body.ofm-app-route .ofm-site-nav .ofm-notifications-control{
    position:relative;
}

body.ofm-app-route .ofm-site-nav .ofm-notifications-control__badge{
    display:block;
    position:absolute;
    inset:5px 5px auto auto;
    inline-size:6px;
    block-size:6px;
    min-inline-size:0;
    min-width:0;
    height:6px;
    padding:0;
    border:1px solid #111216;
    border-radius:50%;
    background:var(--ofm-app-shell-accent,#f4c430);
    color:transparent;
    font-size:0;
}

body.ofm-app-route .ofm-site-nav .ofm-notifications-control__badge[hidden]{
    display:none;
}

body.ofm-app-route .ofm-site-nav .ofm-listener-menu-item.no-ajax>a{
    padding-inline:13px;
    border-color:rgb(244 196 48 / .55);
    background:rgb(244 196 48 / .1);
    color:#ffe28a;
}

body.ofm-app-route .ofm-site-nav .ofm-listener-menu-item.no-ajax>a:hover,
body.ofm-app-route .ofm-site-nav .ofm-listener-menu-item.no-ajax>a:focus-visible{
    border-color:var(--ofm-app-shell-accent,#f4c430);
    background:rgb(244 196 48 / .18);
    color:#fff5cf;
}

@media (max-width:760px){
    body.ofm-app-route .ofm-app-shell__header-inner{
        flex-wrap:wrap;
    }

    body.ofm-app-route .ofm-site-nav{
        width:100%;
    }

    body.ofm-app-route .ofm-site-nav.is-ready{
        width:auto;
    }

    body.ofm-app-route .ofm-site-nav.is-ready .ofm-site-nav__toggle{
        display:inline-flex;
        min-block-size:36px;
        padding:7px 10px;
        align-items:center;
        justify-content:center;
        gap:8px;
        border:1px solid rgb(255 255 255 / .16);
        border-radius:999px;
        background:rgb(255 255 255 / .035);
        color:#f3f0e7;
        font:inherit;
        font-size:.72rem;
        font-weight:800;
        line-height:1;
        cursor:pointer;
    }

    body.ofm-app-route .ofm-site-nav.is-ready .ofm-site-nav__toggle:hover,
    body.ofm-app-route .ofm-site-nav.is-ready .ofm-site-nav__toggle:focus-visible{
        border-color:rgb(244 196 48 / .65);
        background:rgb(244 196 48 / .1);
        color:#fff;
        outline:0;
    }

    body.ofm-app-route .ofm-site-nav__toggle-icon{
        display:grid;
        inline-size:14px;
        gap:3px;
    }

    body.ofm-app-route .ofm-site-nav__toggle-icon i{
        display:block;
        inline-size:14px;
        block-size:1px;
        border-radius:999px;
        background:currentColor;
        transition:transform .16s ease,opacity .16s ease;
    }

    body.ofm-app-route .ofm-site-nav.is-open .ofm-site-nav__toggle-icon i:first-child{
        transform:translateY(4px) rotate(45deg);
    }

    body.ofm-app-route .ofm-site-nav.is-open .ofm-site-nav__toggle-icon i:nth-child(2){
        opacity:0;
    }

    body.ofm-app-route .ofm-site-nav.is-open .ofm-site-nav__toggle-icon i:last-child{
        transform:translateY(-4px) rotate(-45deg);
    }

    /* No JavaScript: the list remains in normal flow and fully usable. */
    body.ofm-app-route .ofm-site-nav__list{
        display:grid;
        width:100%;
        margin:0;
        padding:4px 0 12px;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:4px;
    }

    body.ofm-app-route .ofm-site-nav__list>li>a{
        width:100%;
        min-block-size:42px;
        padding:10px 12px;
        justify-content:flex-start;
        border-color:rgb(255 255 255 / .09);
        border-radius:10px;
        background:rgb(255 255 255 / .025);
        text-align:start;
    }

    body.ofm-app-route .ofm-site-nav.is-ready .ofm-site-nav__list{
        position:absolute;
        z-index:1;
        inset:calc(100% + 10px) 0 auto auto;
        width:min(330px,calc(100vw - 32px));
        /* Keep the open menu below sticky header/admin-bar/safe-area chrome. */
        max-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance) - 24px);
        padding:8px;
        border:1px solid rgb(255 255 255 / .12);
        border-radius:16px;
        background:rgb(17 18 22 / .98);
        box-shadow:0 22px 44px rgb(0 0 0 / .36);
        opacity:0;
        overflow-y:auto;
        overscroll-behavior:contain;
        pointer-events:none;
        transform:translateY(-5px);
        visibility:hidden;
        transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
    }

    body.ofm-app-route .ofm-site-nav.is-ready.is-open .ofm-site-nav__list{
        opacity:1;
        pointer-events:auto;
        transform:translateY(0);
        visibility:visible;
    }

    body.ofm-app-route .ofm-site-nav :is(
        .ofm-member-profile-control,
        .ofm-logout-control,
        .ofm-explore-control,
        .ofm-billboard-control,
        .ofm-insights-control,
        .ofm-controller-dashboard-control,
        .ofm-notifications-control,
        .ofm-following-control
    ){
        inline-size:auto;
        padding-inline:12px;
    }

    body.ofm-app-route .ofm-site-nav :is(
        .ofm-member-profile-control__label,
        .ofm-logout-control__label,
        .ofm-explore-control__label,
        .ofm-billboard-control__label,
        .ofm-insights-control__label,
        .ofm-controller-dashboard-control__label,
        .ofm-notifications-control__label,
        .ofm-following-control__label
    ){
        display:inline;
    }

    body.ofm-app-route .ofm-site-nav .ofm-notifications-control__badge{
        position:static;
        inline-size:7px;
        block-size:7px;
        margin-inline-start:auto;
        border-color:#111216;
    }

    body.ofm-app-route .ofm-site-nav .ofm-listener-menu-item.no-ajax{
        grid-column:span 2;
    }

    body.ofm-app-route .ofm-site-nav .ofm-listener-menu-item.no-ajax>a{
        justify-content:center;
    }
}

@media (prefers-reduced-motion:reduce){
    body.ofm-app-route .ofm-site-nav :is(.ofm-site-nav__list,.ofm-site-nav__toggle-icon i,.ofm-site-nav__list>li>a){
        transition:none;
    }
}

/* Source: assets/css/public-content-shell.css */
/*
 * Child-owned public discovery and chart shells.
 *
 * Explore and Billboard used to lean on the broad `ofm-home`, `ofm-section`,
 * `ofm-container`, and disclosure helpers. Those helpers are shared with
 * older pages, so keeping public-route geometry here prevents a parent or
 * legacy layout change from moving the search, charts, or their PJAX targets.
 */
main.ofm-public-page{
    position:relative;
    display:block;
    box-sizing:border-box;
    inline-size:100%;
    min-inline-size:0;
    min-block-size:100dvh;
    margin:0;
    padding:0;
    border:0;
    color:var(--ofm-app-shell-text,#f7f4eb);
    float:none;
    transform:none;
}

.ofm-public-page{
    --ofm-public-page-edge:clamp(18px,3vw,42px);
    position:relative;
    isolation:isolate;
    overflow:clip;
    background:transparent;
    color:var(--ofm-app-shell-text,#f7f4eb);
    font-family:var(--ofm-font-body,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
}

.ofm-public-page *,
.ofm-public-page *::before,
.ofm-public-page *::after{
    box-sizing:border-box;
}

.ofm-public-page > section{
    position:relative;
    inline-size:auto;
    max-inline-size:none;
    min-inline-size:0;
    margin:0;
    border:0;
    float:none;
    transform:none;
}

.ofm-public-page__container{
    inline-size:min(1200px,calc(100% - var(--ofm-public-page-edge) - var(--ofm-public-page-edge)));
    min-inline-size:0;
    margin-inline:auto;
}

/* Billboard has no route-local background of its own once it stops inheriting
 * the legacy home wrapper, so the page shell deliberately owns its atmosphere
 * and the space above the persistent player. */
main.ofm-public-page.ofm-public-page--billboard{
    padding-block-end:clamp(76px,12vw,152px);
    background:
        radial-gradient(840px 460px at 94% -10%,rgb(244 196 48 / .12),transparent 70%),
        radial-gradient(620px 410px at 3% 36%,rgb(108 81 214 / .09),transparent 72%),
        #090a0d;
}

.ofm-public-page--billboard .ofm-public-page__section{
    position:relative;
    display:block;
    min-inline-size:0;
    margin:0;
    padding-block:clamp(42px,7vw,88px);
    background:transparent;
    color:inherit;
}

.ofm-public-page--billboard .ofm-billboard__hero{
    padding-block:clamp(64px,10vw,132px) 34px;
}

.ofm-public-page--billboard .ofm-billboard__hero .ofm-public-page__container{
    max-inline-size:940px;
}

.ofm-public-page--billboard .ofm-billboard__section{
    padding-block:clamp(34px,5vw,72px) clamp(28px,5vw,66px);
    scroll-margin-top:calc(var(--ofm-app-shell-header-clearance,var(--ofm-app-shell-header-height,72px)) + 22px);
}

/* Native <details> remains intentionally semantic and works without script.
 * The named component makes its compact chart treatment self-contained rather
 * than inheriting a generic disclosure from playlist/account routes. */
.ofm-public-page--billboard .ofm-public-disclosure{
    display:block;
    overflow:hidden;
    margin:0;
    border:1px solid rgb(255 255 255 / .12);
    border-radius:20px;
    background:linear-gradient(135deg,rgb(30 30 30 / .76),rgb(15 15 15 / .9));
    box-shadow:0 18px 46px rgb(0 0 0 / .16),inset 0 1px rgb(255 255 255 / .035);
}

.ofm-public-page--billboard .ofm-public-disclosure__summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    min-block-size:68px;
    margin:0;
    padding:16px 20px;
    color:#f7f4eb;
    cursor:pointer;
    list-style:none;
}

.ofm-public-page--billboard .ofm-public-disclosure__summary::-webkit-details-marker{
    display:none;
}

.ofm-public-page--billboard .ofm-public-disclosure__summary::marker{
    content:"";
}

.ofm-public-page--billboard .ofm-public-disclosure__summary::after{
    display:grid;
    flex:0 0 auto;
    inline-size:28px;
    block-size:28px;
    margin-inline-start:4px;
    place-items:center;
    border:1px solid rgb(255 255 255 / .16);
    border-radius:50%;
    color:#c7c7c7;
    content:"+";
    font-size:1.1rem;
    font-weight:400;
    line-height:1;
}

.ofm-public-page--billboard .ofm-public-disclosure[open] > .ofm-public-disclosure__summary{
    border-block-end:1px solid rgb(255 255 255 / .1);
}

.ofm-public-page--billboard .ofm-public-disclosure[open] > .ofm-public-disclosure__summary::after{
    border-color:rgb(244 196 48 / .58);
    color:#f4c430;
    content:"\2212";
}

.ofm-public-page--billboard .ofm-public-disclosure__summary:focus-visible{
    outline:2px solid #f4c430;
    outline-offset:-4px;
}

.ofm-public-page--billboard .ofm-public-disclosure__summary > span:first-child{
    display:grid;
    gap:3px;
    min-inline-size:0;
}

.ofm-public-page--billboard .ofm-public-disclosure__summary .ofm-eyebrow{
    margin:0;
}

.ofm-public-page--billboard .ofm-public-disclosure__summary strong{
    min-inline-size:0;
    overflow-wrap:anywhere;
    color:#fff;
    font-size:clamp(1.35rem,3vw,2.1rem);
    letter-spacing:var(--ofm-font-display-letter-spacing,-.035em);
    line-height:var(--ofm-font-display-line-height,1.08);
}

.ofm-public-page--billboard .ofm-public-disclosure__body{
    min-inline-size:0;
    padding:20px;
}

/* Explore has a deliberately richer local visual system. Its route-specific
 * stylesheet still owns the cards and rails; this shell owns only document
 * geometry now that no generic container/home helper is present. */
main.ofm-public-page.ofm-public-page--explore{
    min-block-size:100dvh;
    padding-block-end:clamp(76px,12vw,152px);
}

.ofm-public-page--explore .ofm-explore__hero-copy h1,
.ofm-public-page--billboard .ofm-billboard__hero h1{
    min-inline-size:0;
    overflow-wrap:anywhere;
}

@media(max-width:720px){
    .ofm-public-page{
        --ofm-public-page-edge:16px;
    }

    .ofm-public-page--billboard .ofm-public-page__section{
        padding-block:40px;
    }

    .ofm-public-page--billboard .ofm-billboard__hero{
        padding-block:58px 28px;
    }

    .ofm-public-page--billboard .ofm-billboard__section{
        padding-block:28px 46px;
    }

    .ofm-public-page--billboard .ofm-public-disclosure__summary,
    .ofm-public-page--billboard .ofm-public-disclosure__body{
        padding-inline:16px;
    }
}

@media(max-width:520px){
    .ofm-public-page--billboard .ofm-public-disclosure{
        border-radius:17px;
    }

    .ofm-public-page--billboard .ofm-public-disclosure__summary{
        min-block-size:62px;
        padding-block:14px;
    }

    .ofm-public-page--billboard .ofm-public-disclosure__body{
        padding-block:16px 18px;
    }
}

@media(prefers-reduced-motion:reduce){
    .ofm-public-page *{
        scroll-behavior:auto;
    }
}

/* Source: assets/css/releases-archive.css */
/*
 * Public release archive.
 *
 * This surface deliberately owns its document spacing, container, grid, and
 * pagination instead of borrowing the parent archive or generic section
 * classes. Release cards retain their shared data contract and player hooks.
 */
[data-ofm-public-catalogue]{
    display:block;
    inline-size:100%;
    max-inline-size:none;
    min-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance,var(--ofm-app-shell-header-height,72px)));
    margin:0;
    padding:clamp(36px,6vw,84px) clamp(16px,3vw,42px) calc(150px + env(safe-area-inset-bottom));
    background:
        radial-gradient(54% 42% at 2% 0%,rgb(244 196 48 / .1),transparent 74%),
        radial-gradient(48% 40% at 100% 7%,rgb(104 70 132 / .09),transparent 74%),
        #090a0d;
    color:#f7f4eb;
    float:none;
    isolation:isolate;
    transform:none;
}

[data-ofm-public-catalogue],
[data-ofm-public-catalogue] *{
    box-sizing:border-box;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__surface{
    display:block;
    width:min(1320px,100%);
    margin:0 auto;
    padding:0;
    background:transparent;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__inner{
    min-inline-size:0;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__heading{
    max-inline-size:690px;
    margin:0;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__heading .ofm-eyebrow{
    margin:0;
    color:#f4c430;
    font-size:.74rem;
    font-weight:900;
    letter-spacing:.16em;
    line-height:1.25;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__heading h1{
    margin:9px 0 14px;
    color:#fff;
    font-size:clamp(2.65rem,6vw,5.1rem);
    font-weight:850;
    letter-spacing:-.065em;
    line-height:.94;
    overflow-wrap:anywhere;
}

[data-ofm-public-catalogue] .ofm-releases-archive__intro,
[data-ofm-public-catalogue] .ofm-releases-archive__empty{
    max-inline-size:560px;
    margin:0;
    color:#b6b5b1;
    font-size:1.02rem;
    line-height:1.6;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__release-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(100%,236px),1fr));
    gap:clamp(15px,2vw,28px);
    margin-top:clamp(30px,4vw,50px);
}

[data-ofm-public-catalogue] .ofm-public-catalogue__release{
    min-inline-size:0;
}

[data-ofm-public-catalogue] .ofm-public-catalogue__release>[data-ofm-release-card]{
    block-size:100%;
    --ofm-release-card-surface:linear-gradient(150deg,#191a1d,#101114);
    --ofm-release-card-line:rgb(255 255 255 / .12);
    --ofm-release-card-radius:20px;
    --ofm-release-card-shadow:0 13px 30px rgb(0 0 0 / .26);
    --ofm-release-card-hover-shadow:0 21px 42px rgb(0 0 0 / .38),0 0 0 3px rgb(244 196 48 / .055);
    --ofm-release-card-body-padding:16px 17px 18px;
    --ofm-release-card-title-size:1.08rem;
    --ofm-release-card-artist-size:.84rem;
    --ofm-release-card-genre-size:.68rem;
}

[data-ofm-public-catalogue] .navigation.pagination{
    display:flex;
    justify-content:center;
    margin-top:clamp(34px,5vw,56px);
}

[data-ofm-public-catalogue] .nav-links{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
    align-items:center;
}

[data-ofm-public-catalogue] .page-numbers{
    display:inline-grid;
    min-inline-size:42px;
    min-block-size:42px;
    padding:8px 13px;
    place-items:center;
    border:1px solid rgb(255 255 255 / .17);
    border-radius:999px;
    background:rgb(255 255 255 / .025);
    color:#efede7;
    font-size:.86rem;
    font-weight:780;
    line-height:1;
    text-align:center;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}

[data-ofm-public-catalogue] .page-numbers.current,
[data-ofm-public-catalogue] .page-numbers:hover,
[data-ofm-public-catalogue] .page-numbers:focus-visible{
    border-color:#f4c430;
    background:#f4c430;
    color:#17130a;
    outline:0;
    transform:translateY(-1px);
}

@media (max-width:640px){
    [data-ofm-public-catalogue]{
        padding:42px 16px calc(126px + env(safe-area-inset-bottom));
    }

    [data-ofm-public-catalogue] .ofm-public-catalogue__release-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:13px;
        margin-top:30px;
    }

    [data-ofm-public-catalogue] .ofm-public-catalogue__release>[data-ofm-release-card]{
        --ofm-release-card-body-padding:13px;
        --ofm-release-card-title-size:.98rem;
        --ofm-release-card-artist-size:.78rem;
    }
}

@media (max-width:370px){
    [data-ofm-public-catalogue] .ofm-public-catalogue__release-grid{
        grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion:reduce){
    [data-ofm-public-catalogue] .page-numbers{
        transition:none;
    }
}

/* Public playlist browse archive. Keep this named shell separate from the
 * Station catalogue: its cards are landscape playlist contracts, but its
 * document geometry, disclosure, and pagination are equally child-owned. */
[data-ofm-public-playlist-archive]{
    display:block;
    inline-size:100%;
    max-inline-size:none;
    min-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance,var(--ofm-app-shell-header-height,72px)));
    margin:0;
    padding:clamp(36px,6vw,84px) clamp(16px,3vw,42px) calc(150px + env(safe-area-inset-bottom));
    background:
        radial-gradient(56% 44% at 2% 0%,rgb(244 196 48 / .1),transparent 74%),
        radial-gradient(48% 42% at 100% 8%,rgb(83 93 156 / .1),transparent 75%),
        #090a0d;
    color:#f7f4eb;
    float:none;
    isolation:isolate;
    transform:none;
}

[data-ofm-public-playlist-archive],
[data-ofm-public-playlist-archive] *{
    box-sizing:border-box;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__surface{
    display:block;
    margin:0;
    padding:0;
    background:transparent;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__container{
    inline-size:min(1320px,100%);
    margin-inline:auto;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__heading{
    max-inline-size:700px;
    margin:0;
}

[data-ofm-public-playlist-archive] .ofm-eyebrow{
    margin:0;
    color:#f4c430;
    font-size:.74rem;
    font-weight:900;
    letter-spacing:.16em;
    line-height:1.25;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__heading h1{
    margin:9px 0 14px;
    color:#fff;
    font-size:clamp(2.65rem,6vw,5.1rem);
    font-weight:850;
    letter-spacing:-.065em;
    line-height:.94;
    overflow-wrap:anywhere;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__intro,
[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__empty{
    max-inline-size:560px;
    margin:0;
    color:#b6b5b1;
    font-size:1.02rem;
    line-height:1.6;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__billboard-link{
    display:inline-flex;
    min-block-size:38px;
    margin-top:17px;
    padding:0 14px;
    align-items:center;
    justify-content:center;
    border:1px solid rgb(244 196 48 / .58);
    border-radius:999px;
    background:rgb(244 196 48 / .07);
    color:#f4c430;
    font-size:.78rem;
    font-weight:820;
    line-height:1;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__billboard-link:hover,
[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__billboard-link:focus-visible{
    border-color:#f4c430;
    background:#f4c430;
    color:#17130a;
    outline:0;
    transform:translateY(-1px);
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__disclosure{
    display:block;
    overflow:hidden;
    margin-top:clamp(28px,4vw,44px);
    border:1px solid rgb(255 255 255 / .12);
    border-radius:22px;
    background:linear-gradient(135deg,rgb(30 30 30 / .76),rgb(15 15 15 / .9));
    box-shadow:0 18px 46px rgb(0 0 0 / .16),inset 0 1px rgb(255 255 255 / .035);
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary{
    display:flex;
    min-block-size:70px;
    padding:16px 20px;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    color:#f7f4eb;
    cursor:pointer;
    font-size:clamp(1rem,2vw,1.22rem);
    font-weight:820;
    line-height:1.2;
    list-style:none;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary::-webkit-details-marker{
    display:none;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary::marker{
    content:"";
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary::after{
    display:grid;
    flex:0 0 auto;
    inline-size:28px;
    block-size:28px;
    margin-inline-start:4px;
    place-items:center;
    border:1px solid rgb(255 255 255 / .16);
    border-radius:50%;
    color:#c7c7c7;
    content:"+";
    font-size:1.1rem;
    font-weight:400;
    line-height:1;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__disclosure[open] > .ofm-public-playlist-archive__summary{
    border-block-end:1px solid rgb(255 255 255 / .1);
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__disclosure[open] > .ofm-public-playlist-archive__summary::after{
    border-color:rgb(244 196 48 / .58);
    color:#f4c430;
    content:"\2212";
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary:focus-visible{
    outline:2px solid #f4c430;
    outline-offset:-4px;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__count{
    flex:0 0 auto;
    color:#bdbdbd;
    font-size:.78rem;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__body{
    min-inline-size:0;
    padding:clamp(16px,2.5vw,24px);
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));
    gap:clamp(14px,2vw,22px);
    margin:0;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__item{
    min-inline-size:0;
}

[data-ofm-public-playlist-archive] .ofm-public-playlist-archive__item>.ofm-playlist-card{
    block-size:100%;
}

[data-ofm-public-playlist-archive] .navigation.pagination{
    display:flex;
    justify-content:center;
    margin:clamp(32px,5vw,48px) 0 0;
}

[data-ofm-public-playlist-archive] .nav-links{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
    align-items:center;
}

[data-ofm-public-playlist-archive] .page-numbers{
    display:inline-grid;
    min-inline-size:42px;
    min-block-size:42px;
    padding:8px 13px;
    place-items:center;
    border:1px solid rgb(255 255 255 / .17);
    border-radius:999px;
    background:rgb(255 255 255 / .025);
    color:#efede7;
    font-size:.86rem;
    font-weight:780;
    line-height:1;
    text-align:center;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}

[data-ofm-public-playlist-archive] .page-numbers.current,
[data-ofm-public-playlist-archive] .page-numbers:hover,
[data-ofm-public-playlist-archive] .page-numbers:focus-visible{
    border-color:#f4c430;
    background:#f4c430;
    color:#17130a;
    outline:0;
    transform:translateY(-1px);
}

@media (max-width:640px){
    [data-ofm-public-playlist-archive]{
        padding:42px 16px calc(126px + env(safe-area-inset-bottom));
    }

    [data-ofm-public-playlist-archive] .ofm-public-playlist-archive__summary,
    [data-ofm-public-playlist-archive] .ofm-public-playlist-archive__body{
        padding-inline:16px;
    }

    [data-ofm-public-playlist-archive] .ofm-public-playlist-archive__grid{
        grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion:reduce){
    [data-ofm-public-playlist-archive] :is(a,.page-numbers){
        transition:none;
    }
}

/* Source: assets/css/public-search.css */
/*
 * Child-owned WordPress search results.
 *
 * Search deliberately keeps its own surface and control layout instead of
 * inheriting the Explore route or parent search/archive markup. The shared
 * release, profile, and playlist components remain data-first contracts.
 */
[data-ofm-public-search]{
    display:block;
    inline-size:100%;
    max-inline-size:none;
    min-block-size:calc(100dvh - var(--ofm-app-shell-header-clearance,var(--ofm-app-shell-header-height,72px)));
    margin:0;
    padding:clamp(36px,6vw,84px) clamp(16px,3vw,42px) calc(152px + env(safe-area-inset-bottom));
    background:
        radial-gradient(58% 42% at 4% 0%,rgb(244 196 48 / .095),transparent 73%),
        radial-gradient(48% 44% at 96% 3%,rgb(89 99 158 / .1),transparent 74%),
        #090a0d;
    color:#f7f4eb;
    float:none;
    isolation:isolate;
    transform:none;
}

[data-ofm-public-search],
[data-ofm-public-search] *{
    box-sizing:border-box;
}

[data-ofm-public-search] .ofm-public-search__surface{
    display:block;
    width:min(1320px,100%);
    margin:0 auto;
    padding:0;
    background:transparent;
}

[data-ofm-public-search] .ofm-public-search__inner{
    min-inline-size:0;
}

[data-ofm-public-search] .ofm-public-search__hero{
    display:grid;
    max-inline-size:780px;
    gap:0;
}

[data-ofm-public-search] .ofm-eyebrow{
    margin:0;
    color:#f4c430;
    font-size:.74rem;
    font-weight:900;
    letter-spacing:.16em;
    line-height:1.25;
}

[data-ofm-public-search] .ofm-public-search__hero h1{
    margin:9px 0 14px;
    color:#fff;
    font-size:clamp(2.65rem,6vw,5.1rem);
    font-weight:850;
    letter-spacing:-.065em;
    line-height:.94;
    overflow-wrap:anywhere;
}

[data-ofm-public-search] .ofm-public-search__hero>p:not(.ofm-eyebrow){
    max-inline-size:590px;
    margin:0;
    color:#b6b5b1;
    font-size:1.03rem;
    line-height:1.6;
}

[data-ofm-public-search] .ofm-public-search__form{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    inline-size:min(100%,720px);
    min-block-size:60px;
    margin-top:clamp(24px,3vw,32px);
    padding:7px 7px 7px 17px;
    border:1px solid rgb(255 255 255 / .16);
    border-radius:19px;
    background:rgb(18 19 23 / .82);
    box-shadow:0 16px 32px rgb(0 0 0 / .17),inset 0 1px 0 rgb(255 255 255 / .035);
    float:none;
    transform:none;
}

[data-ofm-public-search] .screen-reader-text{
    position:absolute;
    inline-size:1px;
    block-size:1px;
    padding:0;
    overflow:hidden;
    clip:rect(0,0,0,0);
    clip-path:inset(50%);
    border:0;
    white-space:nowrap;
}

[data-ofm-public-search] .ofm-public-search__form-icon{
    inline-size:20px;
    block-size:20px;
    color:#c6c4bd;
    fill:none;
    stroke:currentColor;
    stroke-linecap:round;
    stroke-width:1.8;
}

[data-ofm-public-search] .ofm-public-search__form input:not([type="hidden"]){
    min-inline-size:0;
    min-block-size:42px;
    margin:0;
    padding:0;
    border:0;
    outline:0;
    background:transparent;
    color:#fff;
    font:700 .98rem/1.25 var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
}

[data-ofm-public-search] .ofm-public-search__form input:not([type="hidden"])::placeholder{
    color:#8f8e8b;
    opacity:1;
}

[data-ofm-public-search] .ofm-public-search__form button{
    display:inline-flex;
    min-block-size:44px;
    padding:0 17px;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid #f4c430;
    border-radius:13px;
    background:#f4c430;
    color:#1a150a;
    cursor:pointer;
    font:850 .82rem/1 var(--ofm-font-ui,ui-sans-serif,system-ui,sans-serif);
    transition:background .18s ease,border-color .18s ease,transform .18s ease;
}

[data-ofm-public-search] .ofm-public-search__form button svg{
    inline-size:17px;
    block-size:17px;
    fill:none;
    stroke:currentColor;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-width:2;
}

[data-ofm-public-search] .ofm-public-search__form:focus-within{
    border-color:rgb(244 196 48 / .78);
    box-shadow:0 16px 32px rgb(0 0 0 / .18),0 0 0 3px rgb(244 196 48 / .09);
}

[data-ofm-public-search] .ofm-public-search__form button:hover,
[data-ofm-public-search] .ofm-public-search__form button:focus-visible{
    border-color:#ffe17a;
    background:#ffe17a;
    outline:0;
    transform:translateY(-1px);
}

[data-ofm-public-search] .ofm-public-search__tabs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:clamp(30px,4vw,46px);
}

[data-ofm-public-search] .ofm-public-search__tabs a{
    display:inline-flex;
    min-block-size:36px;
    padding:0 14px;
    align-items:center;
    justify-content:center;
    border:1px solid rgb(255 255 255 / .15);
    border-radius:999px;
    background:rgb(255 255 255 / .02);
    color:#bebdb8;
    font-size:.78rem;
    font-weight:800;
    line-height:1;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}

[data-ofm-public-search] .ofm-public-search__tabs a:hover,
[data-ofm-public-search] .ofm-public-search__tabs a:focus-visible,
[data-ofm-public-search] .ofm-public-search__tabs a.is-active{
    border-color:rgb(244 196 48 / .77);
    background:rgb(244 196 48 / .12);
    color:#f7da6f;
    outline:0;
}

[data-ofm-public-search] .ofm-public-search__tabs a:hover,
[data-ofm-public-search] .ofm-public-search__tabs a:focus-visible{
    transform:translateY(-1px);
}

[data-ofm-public-search] .ofm-public-search__summary{
    margin:16px 0 0;
    color:#c5c3bc;
    font-size:.93rem;
    line-height:1.5;
}

[data-ofm-public-search] .ofm-public-search__section{
    margin-top:clamp(42px,6vw,72px);
}

[data-ofm-public-search] .ofm-public-search__section-heading{
    display:grid;
    gap:6px;
    margin-bottom:18px;
}

[data-ofm-public-search] .ofm-public-search__section-heading h2{
    margin:0;
    color:#fff;
    font-size:clamp(1.65rem,3vw,2.45rem);
    font-weight:830;
    letter-spacing:-.05em;
    line-height:1;
    overflow-wrap:anywhere;
}

[data-ofm-public-search] .ofm-public-search__release-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(100%,236px),1fr));
    gap:clamp(15px,2vw,28px);
}

[data-ofm-public-search] .ofm-public-search__release,
[data-ofm-public-search] .ofm-public-search__profile,
[data-ofm-public-search] .ofm-public-search__mix{
    min-inline-size:0;
}

[data-ofm-public-search] .ofm-public-search__release>[data-ofm-release-card]{
    block-size:100%;
    --ofm-release-card-surface:linear-gradient(150deg,#191a1d,#101114);
    --ofm-release-card-line:rgb(255 255 255 / .12);
    --ofm-release-card-radius:20px;
    --ofm-release-card-shadow:0 13px 30px rgb(0 0 0 / .26);
    --ofm-release-card-hover-shadow:0 21px 42px rgb(0 0 0 / .38),0 0 0 3px rgb(244 196 48 / .055);
    --ofm-release-card-body-padding:16px 17px 18px;
    --ofm-release-card-title-size:1.08rem;
    --ofm-release-card-artist-size:.84rem;
    --ofm-release-card-genre-size:.68rem;
}

[data-ofm-public-search] .ofm-public-search__profile-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));
    gap:clamp(12px,1.7vw,20px);
}

[data-ofm-public-search] .ofm-public-profile-card{
    display:grid;
    block-size:100%;
    gap:10px;
    min-inline-size:0;
    padding:10px;
    border:1px solid rgb(255 255 255 / .1);
    border-radius:18px;
    background:linear-gradient(150deg,rgb(29 30 34 / .84),rgb(14 15 18 / .92));
    color:#fff;
    text-decoration:none;
    transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}

[data-ofm-public-search] .ofm-public-profile-card:hover,
[data-ofm-public-search] .ofm-public-profile-card:focus-visible{
    border-color:rgb(244 196 48 / .66);
    box-shadow:0 13px 27px rgb(0 0 0 / .3),0 0 0 3px rgb(244 196 48 / .055);
    outline:0;
    transform:translateY(-3px);
}

[data-ofm-public-search] .ofm-public-profile-card__avatar{
    display:grid;
    aspect-ratio:1;
    place-items:center;
    overflow:hidden;
    border:1px solid rgb(157 205 255 / .45);
    border-radius:50%;
    background:linear-gradient(135deg,#25303c,#14161a);
}

[data-ofm-public-search] .ofm-public-profile-card--artist .ofm-public-profile-card__avatar{
    border-color:rgb(244 196 48 / .55);
    border-radius:20%;
    background:linear-gradient(135deg,#332b16,#171511);
}

[data-ofm-public-search] .ofm-public-profile-card__avatar img{
    display:block;
    inline-size:100%;
    block-size:100%;
    object-fit:cover;
}

[data-ofm-public-search] .ofm-public-profile-card__avatar .ofm-public-owner__initials{
    display:grid;
    place-items:center;
    inline-size:100%;
    block-size:100%;
    color:#f4c430;
    font-size:clamp(1.2rem,3vw,2rem);
    font-weight:850;
}

[data-ofm-public-search] .ofm-public-profile-card__copy{
    display:grid;
    gap:4px;
    min-inline-size:0;
}

[data-ofm-public-search] .ofm-public-profile-card__name{
    display:flex;
    gap:5px;
    align-items:center;
    min-inline-size:0;
}

[data-ofm-public-search] .ofm-public-profile-card__name strong,
[data-ofm-public-search] .ofm-public-profile-card__copy small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

[data-ofm-public-search] .ofm-public-profile-card__name strong{
    color:#fff;
    font-size:.93rem;
    font-weight:800;
}

[data-ofm-public-search] .ofm-public-profile-card__verification{
    flex:0 0 auto;
    inline-size:17px;
    block-size:17px;
}

[data-ofm-public-search] .ofm-public-profile-card__copy small{
    color:#b7b8bc;
    font-size:.76rem;
}

[data-ofm-public-search] .ofm-public-profile-card__kind{
    display:inline-flex;
    align-items:center;
    inline-size:fit-content;
    min-block-size:20px;
    padding-inline:7px;
    border:1px solid rgb(157 205 255 / .42);
    border-radius:999px;
    background:rgb(157 205 255 / .08);
    color:#c3e1ff;
    font-size:.62rem;
    font-style:normal;
    font-weight:850;
    letter-spacing:.08em;
    line-height:1;
    text-transform:uppercase;
}

[data-ofm-public-search] .ofm-public-profile-card--artist .ofm-public-profile-card__kind{
    border-color:rgb(244 196 48 / .5);
    background:rgb(244 196 48 / .08);
    color:#f4c430;
}

[data-ofm-public-search] .ofm-public-profile-card__bio{
    display:-webkit-box;
    overflow:hidden;
    margin:1px 0 0;
    color:#fff;
    font-size:.75rem;
    font-style:normal;
    line-height:1.36;
    opacity:.9;
    text-overflow:ellipsis;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}

[data-ofm-public-search] .ofm-public-search__mix-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));
    gap:clamp(14px,2vw,22px);
}

[data-ofm-public-search] .ofm-public-search__mix>.ofm-playlist-card{
    block-size:100%;
}

[data-ofm-public-search] .ofm-public-search__empty{
    margin:0;
    padding:22px;
    border:1px dashed rgb(255 255 255 / .19);
    border-radius:16px;
    background:rgb(255 255 255 / .025);
    color:#aaa8a4;
    font-size:.92rem;
    line-height:1.5;
}

@media (max-width:720px){
    [data-ofm-public-search]{
        padding:42px 16px calc(126px + env(safe-area-inset-bottom));
    }

    [data-ofm-public-search] .ofm-public-search__release-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:13px;
    }

    [data-ofm-public-search] .ofm-public-search__release>[data-ofm-release-card]{
        --ofm-release-card-body-padding:13px;
        --ofm-release-card-title-size:.98rem;
        --ofm-release-card-artist-size:.78rem;
    }

    [data-ofm-public-search] .ofm-public-search__profile-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:13px;
    }
}

@media (max-width:500px){
    [data-ofm-public-search] .ofm-public-search__form{
        gap:8px;
        min-block-size:56px;
        padding-inline:13px 6px;
        border-radius:16px;
    }

    [data-ofm-public-search] .ofm-public-search__form button{
        min-inline-size:42px;
        padding:0;
    }

    [data-ofm-public-search] .ofm-public-search__form button span{
        display:none;
    }

    [data-ofm-public-search] .ofm-public-search__tabs{
        gap:7px;
    }

    [data-ofm-public-search] .ofm-public-search__tabs a{
        min-block-size:34px;
        padding-inline:12px;
    }

    [data-ofm-public-search] .ofm-public-search__profile-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    [data-ofm-public-search] .ofm-public-search__mix-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width:370px){
    [data-ofm-public-search] .ofm-public-search__release-grid{
        grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion:reduce){
    [data-ofm-public-search] :is(a,button,.ofm-public-profile-card){
        transition:none;
    }
}
