@charset "UTF-8";

:root {
 color-scheme: light;
 --ivory: #f3efe5;
 --paper: #fffdf8;
 --paper-2: #ebe4d7;
 --ink: #181512;
 --ink-soft: #2c2823;
 --muted: #6b645b;
 --muted-2: #8c8479;
 --rule: #d6ccbc;
 --rule-strong: #b9ac98;
 --oxblood: #792231;
 --oxblood-deep: #581723;
 --oxblood-soft: #ead9da;
 --gold: #a77a3d;
 --gold-soft: #d7bc8e;
 --success: #22674d;
 --danger: #a12b36;
 --info: #315c7a;
 --on-dark: #f7f2e8;
 --shadow-sm: 0 1px 2px rgba(28, 20, 14, .07), 0 8px 24px rgba(28, 20, 14, .05);
 --shadow-md: 0 18px 54px rgba(28, 20, 14, .13);
 --shadow-lg: 0 28px 80px rgba(20, 14, 10, .2);
 --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", "Noto Serif", Georgia, "Times New Roman", serif;
 --font-body: Inter, "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
 --font-reading: Charter, "Bitstream Charter", "Iowan Old Style", Georgia, "Noto Serif", serif;
 --content: 1480px;
 --reading: 720px;
 --header-h: 82px;
 --radius-xs: 4px;
 --radius-sm: 8px;
 --radius-md: 14px;
 --radius-lg: 22px;
 --ease: cubic-bezier(.2, .7, .2, 1);
}

html[data-theme="dark"] {
 color-scheme: dark;
 --ivory: #11100e;
 --paper: #191714;
 --paper-2: #22201c;
 --ink: #f2ece1;
 --ink-soft: #dcd3c5;
 --muted: #aaa196;
 --muted-2: #81796f;
 --rule: #38332d;
 --rule-strong: #51483d;
 --oxblood: #c45869;
 --oxblood-deep: #8f3343;
 --oxblood-soft: #351d22;
 --gold: #c69a58;
 --gold-soft: #8e6c3c;
 --success: #69bd94;
 --danger: #ef7c84;
 --info: #79acd0;
 --on-dark: #f7f2e8;
 --shadow-sm: 0 1px 2px rgba(0, 0, 0, .2), 0 8px 24px rgba(0, 0, 0, .14);
 --shadow-md: 0 18px 54px rgba(0, 0, 0, .28);
 --shadow-lg: 0 28px 80px rgba(0, 0, 0, .38);
}

*,
*::before,
*::after {
 box-sizing: border-box;
}

html {
 min-width: 320px;
 scroll-behavior: smooth;
 scroll-padding-top: calc(var(--header-h) + 24px);
 background: var(--ivory);
}

body {
 min-width: 320px;
 min-height: 100vh;
 margin: 0;
 overflow-x: hidden;
 color: var(--ink);
 background: linear-gradient(180deg, var(--paper) 0, var(--ivory) 34rem);
 font-family: var(--font-body);
 font-size: 16px;
 line-height: 1.65;
 text-rendering: optimizeLegibility;
 -webkit-font-smoothing: antialiased;
}

::selection {
 color: var(--on-dark);
 background: var(--oxblood);
}

a {
 color: inherit;
 text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
 text-underline-offset: .2em;
}

a:hover {
 text-decoration-color: currentColor;
}

img,
video,
canvas,
iframe {
 display: block;
 max-width: 100%;
}

img {
 height: auto;
}

button,
input,
textarea,
select {
 color: inherit;
 font: inherit;
}

button,
select,
label,
a {
 -webkit-tap-highlight-color: transparent;
}

button,
[type="button"],
[type="submit"] {
 cursor: pointer;
}

button:disabled,
input:disabled,
select:disabled {
 cursor: not-allowed;
 opacity: .55;
}

:focus-visible {
 outline: 3px solid color-mix(in srgb, var(--oxblood) 72%, white);
 outline-offset: 3px;
}

[hidden] {
 display: none;
}

.sr-only {
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0, 0, 0, 0);
 white-space: nowrap;
 border: 0;
}

.skip-link {
 position: fixed;
 inset-block-start: 10px;
 inset-inline-start: 12px;
 z-index: 1000;
 padding: .7rem 1rem;
 color: var(--on-dark);
 background: var(--oxblood-deep);
 border-radius: var(--radius-xs);
 font-weight: 700;
 transform: translateY(-160%);
 transition: transform .2s var(--ease);
}

.skip-link:focus {
 transform: translateY(0);
}

.site-shell {
 display: grid;
 grid-template-rows: auto 1fr auto;
 min-height: 100vh;
}

.main {
 width: min(100% - 48px, var(--content));
 margin-inline: auto;
 padding-block: clamp(2.4rem, 5vw, 5.5rem) clamp(5rem, 9vw, 9rem);
}

.main.home-main {
 width: min(100% - 36px, 1640px);
 padding-block-start: clamp(1.4rem, 3vw, 3rem);
}

.section {
 margin-block: clamp(2.6rem, 6vw, 7rem);
}

.section:first-child {
 margin-block-start: 0;
}

.section-head {
 max-width: 820px;
 margin-block-end: clamp(1.6rem, 3vw, 2.8rem);
}

.section-head.inline-head,
.inline-head {
 display: flex;
 align-items: end;
 justify-content: space-between;
 gap: 2rem;
 max-width: none;
}

h1,
h2,
h3,
h4,
p {
 margin-block-start: 0;
}

h1,
h2,
h3,
h4,
.page-title,
.section-title {
 font-family: var(--font-display);
 font-weight: 600;
 letter-spacing: -.028em;
 line-height: 1.05;
 text-wrap: balance;
}

.page-title {
 max-width: 15ch;
 margin-block-end: .8rem;
 font-size: clamp(3rem, 7vw, 6.8rem);
}

.section-title {
 margin-block-end: .35rem;
 font-size: clamp(2.1rem, 4vw, 4.2rem);
}

.lead,
.page-lead {
 max-width: 64ch;
 margin-block-end: 0;
 color: var(--ink-soft);
 font-family: var(--font-reading);
 font-size: clamp(1.08rem, 1.5vw, 1.35rem);
 line-height: 1.7;
}

.copy {
 color: var(--muted);
}

.eyebrow,
.section-kicker,
.article-kicker,
.video-kicker {
 display: block;
 margin-block-end: .7rem;
 color: var(--oxblood);
 font-family: var(--font-body);
 font-size: .7rem;
 font-weight: 800;
 letter-spacing: .16em;
 line-height: 1.3;
 text-transform: uppercase;
}

.text-link {
 display: inline-flex;
 align-items: center;
 gap: .5rem;
 color: var(--oxblood);
 font-size: .78rem;
 font-weight: 800;
 letter-spacing: .09em;
 text-decoration: none;
 text-transform: uppercase;
}

.text-link::after {
 content: "→";
 transition: transform .2s var(--ease);
}

[dir="rtl"] .text-link::after {
 content: "←";
}

.text-link:hover::after {
 transform: translateX(4px);
}

[dir="rtl"] .text-link:hover::after {
 transform: translateX(-4px);
}

.breadcrumbs {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: .45rem;
 margin-block-end: 1.5rem;
 color: var(--muted);
 font-size: .76rem;
 font-weight: 700;
 letter-spacing: .04em;
}

.breadcrumbs a {
 color: var(--oxblood);
 text-decoration: none;
}

.breadcrumbs > * + *::before {
 margin-inline-end: .45rem;
 color: var(--rule-strong);
 content: "/";
}

.site-header {
 position: sticky;
 inset-block-start: 0;
 z-index: 100;
 display: grid;
 grid-template-columns: auto minmax(0, 1fr) auto;
 align-items: center;
 gap: clamp(1rem, 2vw, 2.4rem);
 min-height: var(--header-h);
 padding-inline: max(22px, calc((100vw - var(--content)) / 2));
 border-block-start: 4px solid var(--oxblood);
 border-block-end: 1px solid color-mix(in srgb, var(--rule) 82%, transparent);
 background: color-mix(in srgb, var(--paper) 94%, transparent);
 box-shadow: 0 8px 30px rgba(24, 18, 12, .04);
 backdrop-filter: blur(16px) saturate(120%);
 transition: min-height .25s var(--ease), transform .28s var(--ease), box-shadow .25s var(--ease);
}

.site-header.is-compact {
 min-height: 64px;
 box-shadow: var(--shadow-sm);
}

.site-header.is-hidden {
 transform: translateY(-110%);
}

.brand,
.footer-brand {
 display: inline-flex;
 align-items: center;
 gap: .7rem;
 min-width: max-content;
 color: var(--ink);
 font-family: var(--font-display);
 font-size: 1.2rem;
 font-weight: 700;
 letter-spacing: -.01em;
 text-decoration: none;
}

.brand img,
.footer-brand img {
 width: 44px;
 height: 44px;
 object-fit: contain;
 border-radius: 50%;
 filter: saturate(.82) contrast(1.05);
}

.site-header.is-compact .brand img {
 width: 37px;
 height: 37px;
}

.nav,
[data-primary-nav] {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: clamp(.2rem, .7vw, .75rem);
 min-width: 0;
}

.nav > a,
[data-primary-nav] > a {
 position: relative;
 padding: .48rem .38rem;
 color: var(--ink-soft);
 font-size: .72rem;
 font-weight: 750;
 letter-spacing: .08em;
 line-height: 1;
 text-decoration: none;
 text-transform: uppercase;
 white-space: nowrap;
}

.nav > a::after,
[data-primary-nav] > a::after {
 position: absolute;
 inset-inline: .38rem;
 inset-block-end: .18rem;
 height: 2px;
 content: "";
 background: var(--oxblood);
 transform: scaleX(0);
 transform-origin: center;
 transition: transform .2s var(--ease);
}

.nav > a:hover::after,
.nav > a[aria-current="page"]::after,
[data-primary-nav] > a:hover::after,
[data-primary-nav] > a[aria-current="page"]::after {
 transform: scaleX(1);
}

.nav > a[aria-current="page"],
[data-primary-nav] > a[aria-current="page"] {
 color: var(--oxblood);
}

.header-actions {
 display: flex;
 align-items: center;
 gap: .5rem;
}

.language-select,
.theme-toggle,
.nav-toggle,
.mobile-menu-toggle,
[data-menu-toggle],
[data-theme-toggle] {
 min-height: 38px;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--paper);
 border-radius: 999px;
}

.language-select {
 max-width: 104px;
 padding: .4rem 1.8rem .4rem .7rem;
 font-size: .72rem;
 font-weight: 700;
}

.theme-toggle,
[data-theme-toggle] {
 display: inline-grid;
 flex: 0 0 38px;
 width: 38px;
 padding: 0;
 place-items: center;
}

.theme-icon {
 position: relative;
 display: block;
 width: 15px;
 height: 15px;
 border: 2px solid currentColor;
 border-radius: 50%;
}

.theme-icon.moon::after {
 position: absolute;
 inset: -4px -2px 3px 4px;
 content: "";
 background: var(--paper);
 border-radius: 50%;
}

.theme-icon.sun::before,
.theme-icon.sun::after {
 position: absolute;
 inset: -5px 5px;
 width: 1px;
 content: "";
 background: currentColor;
 box-shadow: 0 20px 0 currentColor;
}

.theme-icon.sun::after {
 transform: rotate(90deg);
}

.auth-control {
 display: inline-flex;
 align-items: center;
 gap: .35rem;
}

.auth-link,
.auth-user {
 display: inline-flex;
 min-height: 36px;
 align-items: center;
 justify-content: center;
 padding-inline: .7rem;
 border: 1px solid var(--rule);
 border-radius: 999px;
 color: var(--ink-soft);
 background: var(--paper);
 font-size: .68rem;
 font-weight: 800;
 letter-spacing: .04em;
 text-decoration: none;
 text-transform: uppercase;
}

.auth-user.icon-only {
 width: 36px;
 padding: 0;
 overflow: hidden;
}

.auth-user img,
.auth-avatar-fallback {
 width: 100%;
 height: 100%;
 object-fit: cover;
 border-radius: inherit;
}

.auth-avatar-fallback {
 display: block;
 background: radial-gradient(circle at 50% 35%, var(--gold-soft) 0 22%, transparent 23%), linear-gradient(var(--oxblood-soft), var(--paper-2));
}

.nav-toggle,
.mobile-menu-toggle,
[data-menu-toggle] {
 display: none;
 width: 42px;
 padding: 0;
 place-items: center;
}

.nav-toggle::before,
.mobile-menu-toggle::before,
[data-menu-toggle]::before {
 width: 18px;
 height: 12px;
 content: "";
 border-block: 2px solid currentColor;
 background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat;
}

body.nav-open .nav-toggle::before,
.nav-toggle[aria-expanded="true"]::before,
[data-menu-toggle][aria-expanded="true"]::before {
 height: 18px;
 border: 0;
 background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat;
 transform: rotate(45deg);
 box-shadow: none;
}

body.nav-open .nav-toggle::after,
.nav-toggle[aria-expanded="true"]::after,
[data-menu-toggle][aria-expanded="true"]::after {
 position: absolute;
 width: 18px;
 height: 2px;
 content: "";
 background: currentColor;
 transform: rotate(-45deg);
}

.header-search {
 position: relative;
 display: grid;
 grid-template-columns: minmax(0, 1fr) 36px;
 width: 42px;
 min-width: 42px;
 height: 38px;
 margin-inline: .15rem;
 overflow: visible;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: 999px;
 transition: width .28s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
}

.header-search-form {
 display: grid;
 grid-column: 1 / -1;
 grid-template-columns: minmax(0, 1fr) 36px;
 width: 100%;
 min-width: 0;
}

.header-search:hover,
.header-search:focus-within,
.header-search.is-open {
 width: min(27vw, 300px);
 border-color: var(--rule-strong);
 box-shadow: var(--shadow-sm);
}

.header-search input {
 width: 100%;
 min-width: 0;
 height: 36px;
 padding: 0 0 0 .9rem;
 overflow: hidden;
 border: 0;
 outline: 0;
 opacity: 0;
 color: var(--ink);
 background: transparent;
 font-size: .78rem;
 transition: opacity .15s ease;
}

.header-search:hover input,
.header-search:focus-within input,
.header-search.is-open input {
 opacity: 1;
}

.header-search button {
 display: grid;
 width: 36px;
 height: 36px;
 padding: 0;
 border: 0;
 color: var(--ink);
 background: transparent;
 border-radius: 50%;
 place-items: center;
}

.header-search button span {
 position: relative;
 width: 13px;
 height: 13px;
 border: 2px solid currentColor;
 border-radius: 50%;
}

.header-search button span::after {
 position: absolute;
 width: 6px;
 height: 2px;
 inset-inline-end: -5px;
 inset-block-end: -3px;
 content: "";
 background: currentColor;
 transform: rotate(45deg);
}

.header-search-results,
.header-search-suggestions {
 position: absolute;
 inset-block-start: calc(100% + 10px);
 inset-inline-end: 0;
 z-index: 20;
 width: min(390px, 88vw);
 max-height: 60vh;
 padding: .4rem;
 overflow: auto;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
 box-shadow: var(--shadow-lg);
}

.search-result,
.header-search-suggestion {
 display: grid;
 grid-template-columns: 68px minmax(0, 1fr);
 align-items: center;
 gap: .8rem;
 min-height: 58px;
 padding: .5rem;
 border-radius: var(--radius-sm);
 text-decoration: none;
}

.search-result:hover,
.header-search-suggestion:hover {
 background: var(--paper-2);
}

.search-result img,
.header-search-suggestion img,
.suggestion-thumb-placeholder {
 width: 68px;
 height: 44px;
 object-fit: cover;
 background: var(--ink-soft);
 border-radius: var(--radius-xs);
}

.search-result strong,
.header-search-suggestion strong {
 display: block;
 overflow: hidden;
 font-family: var(--font-display);
 font-size: .95rem;
 line-height: 1.15;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.search-result small,
.header-search-suggestion small {
 color: var(--muted);
 font-size: .68rem;
}

.header-search-loading {
 display: block;
 padding: .9rem;
 color: var(--muted);
}

.actions,
.hero-actions {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: .7rem;
}

.actions.center {
 justify-content: center;
}

.actions.left {
 justify-content: flex-start;
}

.button {
 display: inline-flex;
 min-height: 44px;
 align-items: center;
 justify-content: center;
 gap: .45rem;
 padding: .72rem 1.1rem;
 border: 1px solid var(--rule-strong);
 color: var(--ink);
 background: transparent;
 border-radius: 999px;
 font-size: .72rem;
 font-weight: 800;
 letter-spacing: .07em;
 line-height: 1;
 text-align: center;
 text-decoration: none;
 text-transform: uppercase;
 transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s var(--ease), box-shadow .2s ease;
}

.button:hover {
 border-color: var(--ink);
 transform: translateY(-1px);
}

.button.primary,
.button.primary-action,
.primary-action,
.subscribe-button {
 border-color: var(--oxblood);
 color: var(--on-dark);
 background: var(--oxblood);
 box-shadow: 0 8px 20px color-mix(in srgb, var(--oxblood) 24%, transparent);
}

.button.primary:hover,
.button.primary-action:hover,
.primary-action:hover {
 border-color: var(--oxblood-deep);
 background: var(--oxblood-deep);
}

.button.ghost {
 background: var(--paper);
}

.button.danger,
.danger {
 border-color: color-mix(in srgb, var(--danger) 60%, var(--rule));
 color: var(--danger);
}

.panel {
 padding: clamp(1.3rem, 3vw, 2.4rem);
 border: 1px solid var(--rule);
 background: color-mix(in srgb, var(--paper) 94%, transparent);
 border-radius: var(--radius-md);
 box-shadow: var(--shadow-sm);
}

form.panel {
 max-width: 780px;
}

.field {
 display: grid;
 gap: .42rem;
 color: var(--ink-soft);
 font-size: .76rem;
 font-weight: 750;
 letter-spacing: .035em;
}

.field input,
.field textarea,
.field select,
.music-library-tools input,
.music-library-tools select,
.rich-editor-toolbar select,
.rich-editor-toolbar input:not([type="file"]) {
 width: 100%;
 min-height: 46px;
 padding: .72rem .85rem;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--paper);
 border-radius: var(--radius-sm);
 outline: 0;
 font-size: .9rem;
 font-weight: 500;
 letter-spacing: normal;
}

.field textarea {
 min-height: 150px;
 resize: vertical;
}

.field select[multiple] {
 min-height: 150px;
}

.field input:focus,
.field textarea:focus,
.field select:focus,
.music-library-tools input:focus,
.music-library-tools select:focus {
 border-color: var(--oxblood);
 box-shadow: 0 0 0 3px color-mix(in srgb, var(--oxblood) 15%, transparent);
}

.field-help {
 color: var(--muted);
 font-size: .72rem;
 font-weight: 500;
 letter-spacing: 0;
}

.honeypot {
 position: absolute;
 inset-inline-start: -10000px;
}

.turnstile-box {
 margin-block: 1.1rem;
 min-height: 65px;
}

.file-button {
 position: relative;
 overflow: hidden;
}

.file-button input,
.rich-image-button input {
 position: absolute;
 inset: 0;
 opacity: 0;
 cursor: pointer;
}

.status {
 width: 100%;
 margin: 1rem 0 0;
 padding: .9rem 1rem;
 border-inline-start: 3px solid var(--rule-strong);
 color: var(--muted);
 background: color-mix(in srgb, var(--paper-2) 72%, transparent);
 border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
 font-size: .86rem;
}

.status.compact {
 padding: .55rem .7rem;
 margin: .4rem 0;
 font-size: .76rem;
}

.status.is-error,
.status.error,
.is-error.status {
 border-color: var(--danger);
 color: var(--danger);
}

.status.is-success,
.is-success.status {
 border-color: var(--success);
 color: var(--success);
}

.status.is-info,
.is-info.status {
 border-color: var(--info);
 color: var(--info);
}

.not-found,
.admin-empty,
.music-empty-state,
.video-empty-state {
 padding: clamp(1.5rem, 4vw, 3rem);
 border: 1px solid var(--rule);
 color: var(--muted);
 background: var(--paper);
 text-align: center;
}

.youtube-comments-source,
.youtube-comment-link {
 color: var(--muted);
 font-size: .7rem;
}

.home-editorial-hero {
 display: grid;
 grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
 gap: clamp(2rem, 7vw, 7rem);
 align-items: end;
 padding-block: clamp(2rem, 5vw, 5rem) clamp(3rem, 7vw, 7rem);
}

.home-editorial-copy h1 {
 max-width: 12ch;
 margin-block-end: 1.2rem;
 font-size: clamp(3.7rem, 8.4vw, 8.8rem);
}

.home-editorial-copy .lead {
 max-width: 58ch;
}

.home-editorial-copy .hero-actions {
 margin-block-start: 2rem;
}

.home-proof {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 1px;
 margin: 0;
 border-block: 1px solid var(--rule-strong);
 background: var(--rule);
}

.home-proof > div {
 display: grid;
 gap: .2rem;
 padding: 1.2rem .8rem;
 background: var(--ivory);
}

.home-proof dt {
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: clamp(1.8rem, 3.4vw, 3rem);
 font-weight: 600;
 line-height: 1;
}

.home-proof dd {
 margin: 0;
 color: var(--muted);
 font-size: .64rem;
 font-weight: 800;
 letter-spacing: .07em;
 text-transform: uppercase;
}

.home-soundtrack-stage,
.hero-grid {
 display: grid;
 grid-template-columns: minmax(260px, .72fr) minmax(440px, 1.55fr) minmax(260px, .73fr);
 grid-template-areas: "music feature journal";
 gap: clamp(.8rem, 1.5vw, 1.4rem);
 align-items: stretch;
}

.home-soundtrack-player {
 grid-area: music;
}

.home-featured-video,
.lead-story {
 grid-area: feature;
}

.home-articles-panel {
 grid-area: journal;
}

.home-soundtrack-player,
.premiere-screen,
.home-articles-panel,
.lead-story {
 min-height: clamp(500px, 58vw, 690px);
 overflow: hidden;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
 box-shadow: var(--shadow-sm);
}

.home-soundtrack-player,
.home-articles-panel {
 padding: clamp(1rem, 1.7vw, 1.6rem);
}

.home-player-empty,
.premiere-empty {
 display: grid;
 min-height: 100%;
 align-content: center;
 padding: 2rem;
 text-align: center;
}

.home-player-content {
 display: grid;
 min-height: 100%;
 align-content: center;
 gap: .8rem;
 padding: clamp(.4rem, 2vw, 1rem);
}

.home-player-content h2 {
 margin: 0;
 font-size: clamp(2rem, 3.3vw, 3.2rem);
}

.home-player-content > p:not(.eyebrow) {
 color: var(--muted);
 font-family: var(--font-reading);
}

.home-player-content audio {
 width: 100%;
 margin-block: .4rem .8rem;
 accent-color: var(--oxblood);
}

.premiere-empty {
 color: var(--on-dark);
 background: linear-gradient(145deg, #201b17, #090807);
}

.home-player-head {
 display: flex;
 align-items: baseline;
 justify-content: space-between;
 gap: 1rem;
 padding-block-end: .9rem;
 border-block-end: 1px solid var(--rule);
}

.home-player-head h2,
.home-articles-panel > h2 {
 margin: 0;
 font-size: clamp(1.35rem, 2vw, 2rem);
}

.home-articles-panel > p:not(.eyebrow) {
 color: var(--muted);
 font-family: var(--font-reading);
 font-size: .9rem;
}

.home-playlist-list,
.home-article-list {
 margin-block-start: 1rem;
 max-height: 525px;
 padding-inline-end: .25rem;
 overflow: auto;
 scrollbar-color: var(--rule-strong) transparent;
 scrollbar-width: thin;
}

.spotlight {
 position: relative;
 min-height: 100%;
 color: var(--on-dark);
 background: #111;
}

.premiere-link {
 position: relative;
 display: block;
 width: 100%;
 height: 100%;
 min-height: inherit;
 overflow: hidden;
 color: var(--on-dark);
 background: #111;
 text-decoration: none;
}

.premiere-link > img {
 width: 100%;
 height: 100%;
 min-height: inherit;
 object-fit: cover;
 transition: transform .7s var(--ease);
}

.premiere-link:hover > img {
 transform: scale(1.025);
}

.premiere-link::after {
 position: absolute;
 inset: 0;
 content: "";
 background: linear-gradient(180deg, transparent 30%, rgba(7, 6, 5, .9) 96%);
}

.premiere-overlay {
 position: absolute;
 inset-inline: clamp(1.4rem, 3.2vw, 3.4rem);
 inset-block-end: clamp(1.6rem, 3vw, 3rem);
 z-index: 2;
 display: grid;
 gap: .7rem;
 max-width: 80%;
}

.premiere-overlay .eyebrow {
 color: var(--gold-soft);
}

.premiere-overlay > strong {
 max-width: 17ch;
 font-family: var(--font-display);
 font-size: clamp(2.4rem, 5vw, 5.2rem);
 font-weight: 600;
 letter-spacing: -.03em;
 line-height: 1.04;
}

.premiere-overlay .play-badge {
 inset-inline-start: auto;
 inset-inline-end: 0;
 inset-block-start: auto;
 inset-block-end: 0;
 transform: none;
}

.premiere-link:hover .play-badge {
 transform: scale(1.07);
}

.spotlight-media {
 position: absolute;
 inset: 0;
 display: block;
 overflow: hidden;
}

.spotlight-media::after {
 position: absolute;
 inset: 0;
 content: "";
 background: linear-gradient(180deg, rgba(7, 6, 5, .04) 28%, rgba(7, 6, 5, .88) 92%), linear-gradient(90deg, rgba(7, 6, 5, .38), transparent 65%);
}

.spotlight-media img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform .7s var(--ease);
}

.spotlight:hover .spotlight-media img {
 transform: scale(1.025);
}

.spotlight-copy {
 position: absolute;
 inset-inline: clamp(1.4rem, 3.2vw, 3.4rem);
 inset-block-end: clamp(1.6rem, 3vw, 3rem);
 z-index: 2;
 max-width: 720px;
}

.spotlight-copy .eyebrow {
 color: var(--gold-soft);
}

.spotlight-copy h2 {
 max-width: 17ch;
 margin-block-end: .7rem;
 font-size: clamp(2.5rem, 5vw, 5.6rem);
}

.spotlight-copy .button.ghost {
 border-color: rgba(255, 255, 255, .45);
 color: var(--on-dark);
 background: rgba(0, 0, 0, .28);
}

.home-article-card {
 border-block-end: 1px solid var(--rule);
}

.home-article-row {
 display: grid;
 grid-template-columns: 46px minmax(0, 1fr);
 gap: .7rem;
 padding-block: .85rem;
 border-block-end: 1px solid var(--rule);
}

.home-article-row time {
 color: var(--oxblood);
 font-size: .65rem;
 font-weight: 800;
 letter-spacing: .04em;
 text-transform: uppercase;
}

.home-article-row h3 {
 margin: 0;
 font-size: 1.04rem;
 line-height: 1.18;
}

.home-article-row a {
 text-decoration: none;
}

.home-article-card > a {
 display: grid;
 grid-template-columns: 76px minmax(0, 1fr);
 gap: .8rem;
 padding-block: .85rem;
 text-decoration: none;
}

.home-article-card:first-child > a {
 padding-block-start: 0;
}

.home-article-card .article-card-cover {
 aspect-ratio: 1;
 overflow: hidden;
 background: var(--paper-2);
 border-radius: var(--radius-xs);
}

.home-article-card img {
 width: 100%;
 height: 100%;
 object-fit: cover;
}

.home-article-card h2 {
 margin: .15rem 0 .35rem;
 font-size: 1.03rem;
 line-height: 1.15;
}

.home-article-card small {
 color: var(--muted);
 font-size: .66rem;
}

.home-articles-more,
.home-music-more {
 display: block;
 padding: 1rem .25rem .35rem;
 color: var(--oxblood);
 font-size: .72rem;
 font-weight: 800;
 letter-spacing: .1em;
 text-align: center;
 text-decoration: none;
 text-transform: uppercase;
}

.release-board {
 padding-block-start: clamp(2rem, 4vw, 4.5rem);
 border-block-start: 1px solid var(--rule);
}

.home-mission {
 display: grid;
 grid-template-columns: minmax(170px, .35fr) minmax(0, 1fr) auto;
 gap: clamp(1.3rem, 4vw, 4rem);
 align-items: center;
 padding: clamp(1.8rem, 4vw, 3.5rem);
 border-block: 1px solid var(--rule-strong);
}

.home-mission h2 {
 margin: 0;
 font-size: clamp(2rem, 4vw, 4rem);
}

.home-mission > p:not(.eyebrow) {
 max-width: 50ch;
 margin: 0;
 color: var(--muted);
 font-family: var(--font-reading);
}

.home-more-actions {
 margin-block-start: 2rem;
}

.videos-layout,
.story-grid,
.release-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: clamp(1.1rem, 2.2vw, 2rem);
}

.video-card {
 min-width: 0;
 overflow: hidden;
 border-block-end: 1px solid var(--rule-strong);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
 transition: transform .28s var(--ease), box-shadow .28s ease;
}

.video-card:hover {
 z-index: 1;
 box-shadow: var(--shadow-md);
 transform: translateY(-5px);
}

.video-link,
.thumb-link {
 display: block;
 text-decoration: none;
}

.video-thumb,
.thumb-link {
 position: relative;
 aspect-ratio: 16 / 9;
 overflow: hidden;
 background: linear-gradient(145deg, #342c25, #0e0d0b);
}

.video-thumb img,
.thumb-link > img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform .55s var(--ease), filter .35s ease;
}

.video-card:hover .video-thumb img,
.video-card:hover .thumb-link > img {
 filter: saturate(1.05) contrast(1.04);
 transform: scale(1.035);
}

.play-badge {
 position: absolute;
 inset-inline-start: 50%;
 inset-block-start: 50%;
 display: grid;
 width: 56px;
 height: 56px;
 border: 1px solid rgba(255, 255, 255, .55);
 color: #fff;
 background: rgba(88, 23, 35, .88);
 border-radius: 50%;
 box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
 place-items: center;
 transform: translate(-50%, -50%);
 transition: transform .22s var(--ease), background .22s ease;
}

.play-badge::after {
 width: 0;
 height: 0;
 margin-inline-start: 4px;
 content: "";
 border-block: 7px solid transparent;
 border-inline-start: 11px solid currentColor;
}

.play-badge.small {
 width: 36px;
 height: 36px;
}

.play-badge.small::after {
 border-block-width: 5px;
 border-inline-start-width: 8px;
}

.video-card:hover .play-badge,
.spotlight:hover .play-badge {
 background: var(--oxblood);
 transform: translate(-50%, -50%) scale(1.07);
}

.video-body,
.video-card-body {
 padding: 1.1rem 1.15rem 1.25rem;
}

.video-card-body h2,
.video-title {
 margin: .3rem 0 .65rem;
 font-family: var(--font-display);
 font-size: clamp(1.3rem, 1.7vw, 1.75rem);
 font-weight: 600;
 letter-spacing: -.02em;
 line-height: 1.13;
}

.video-card-body h2 a {
 text-decoration: none;
}

.video-card-body > p:last-child {
 display: -webkit-box;
 margin-block: .7rem 0;
 overflow: hidden;
 color: var(--muted);
 font-family: var(--font-reading);
 font-size: .9rem;
 line-height: 1.55;
 -webkit-box-orient: vertical;
 -webkit-line-clamp: 3;
}

.video-date,
.video-card time {
 color: var(--muted);
 font-size: .69rem;
 font-weight: 700;
 letter-spacing: .05em;
 text-transform: uppercase;
}

.tag-link,
.hashtag-link,
.text-hashtag {
 color: var(--oxblood);
 font-size: .72rem;
 font-weight: 750;
 text-decoration: none;
}

.archive-hero {
 display: flex;
 align-items: end;
 justify-content: space-between;
 gap: 2rem;
 padding-block-end: clamp(2rem, 4vw, 4rem);
 border-block-end: 1px solid var(--rule-strong);
}

.archive-note {
 display: grid;
 gap: .35rem;
 min-width: 220px;
 padding: 1.1rem 1.2rem;
 border-inline-start: 3px solid var(--oxblood);
 color: var(--muted);
 background: var(--paper);
 font-size: .72rem;
 box-shadow: var(--shadow-sm);
}

.archive-note span {
 color: var(--oxblood);
 font-weight: 800;
 letter-spacing: .12em;
 text-transform: uppercase;
}

.archive-note strong {
 color: var(--ink);
}

.archive-board {
 display: grid;
 grid-template-columns: 240px minmax(0, 1fr);
 gap: clamp(1.5rem, 4vw, 4.2rem);
 padding-block-start: clamp(2.3rem, 5vw, 4.8rem);
}

.archive-tools {
 position: sticky;
 inset-block-start: calc(var(--header-h) + 24px);
 display: grid;
 align-self: start;
 gap: 1.1rem;
 padding: 1.25rem;
 border-block-start: 3px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.archive-results {
 min-width: 0;
}

.pagination {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: .45rem;
 margin-block-start: 2.5rem;
}

.pagination button,
.page-button,
.pagination a {
 display: grid;
 min-width: 42px;
 height: 42px;
 padding: 0 .65rem;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--paper);
 border-radius: 999px;
 font-size: .74rem;
 font-weight: 800;
 text-decoration: none;
 place-items: center;
}

.pagination [aria-current="page"],
.pagination .is-current,
.page-button[aria-current="page"] {
 border-color: var(--oxblood);
 color: var(--on-dark);
 background: var(--oxblood);
}

.article-archive-hero {
 max-width: 920px;
 padding-block-end: clamp(2rem, 5vw, 4.5rem);
 border-block-end: 1px solid var(--rule-strong);
}

.article-filters {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: .8rem;
 margin-block: 1.5rem;
 padding: .75rem;
 border-block: 1px solid var(--rule);
}

.article-filters label {
 flex: 1 1 320px;
 max-width: 520px;
}

.article-filters input,
.article-filters select {
 width: 100%;
 min-height: 44px;
 padding: .65rem .85rem;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--paper);
 border-radius: 999px;
 outline: 0;
}

.article-filters input:focus,
.article-filters select:focus {
 border-color: var(--oxblood);
 box-shadow: 0 0 0 3px color-mix(in srgb, var(--oxblood) 14%, transparent);
}

.article-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: clamp(1.2rem, 2.5vw, 2.4rem);
}

.article-card {
 min-width: 0;
 background: var(--paper);
 border-block-end: 1px solid var(--rule-strong);
 box-shadow: var(--shadow-sm);
 transition: transform .25s var(--ease), box-shadow .25s ease;
}

.article-card:hover {
 box-shadow: var(--shadow-md);
 transform: translateY(-4px);
}

.article-card > a {
 display: block;
 height: 100%;
 text-decoration: none;
}

.article-card-cover,
.article-card-media {
 position: relative;
 aspect-ratio: 4 / 3;
 overflow: hidden;
 color: var(--on-dark);
 background: linear-gradient(145deg, #3b3027, #14110e);
}

.article-card-cover img,
.article-card-media img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform .55s var(--ease);
}

.article-card:hover img {
 transform: scale(1.03);
}

.article-cover-placeholder {
 display: grid;
 width: 100%;
 height: 100%;
 color: var(--gold-soft);
 font-family: var(--font-display);
 font-size: 5rem;
 place-items: center;
}

.article-card-copy,
.article-card-body {
 padding: clamp(1.2rem, 2vw, 1.7rem);
}

.article-card h2,
.article-card h3 {
 margin: .25rem 0 .8rem;
 font-size: clamp(1.45rem, 2vw, 2.05rem);
 line-height: 1.1;
}

.article-card p {
 display: -webkit-box;
 overflow: hidden;
 color: var(--muted);
 font-family: var(--font-reading);
 font-size: .94rem;
 line-height: 1.6;
 -webkit-box-orient: vertical;
 -webkit-line-clamp: 3;
}

.article-card small {
 color: var(--muted);
 font-size: .7rem;
 font-weight: 700;
 letter-spacing: .04em;
}

.article-tags {
 display: flex;
 flex-wrap: wrap;
 gap: .4rem;
 margin-block: 1rem;
}

.article-tags .tag,
.tag {
 padding: .3rem .55rem;
 border: 1px solid var(--rule);
 color: var(--oxblood);
 background: var(--paper);
 border-radius: 999px;
 font-size: .66rem;
 font-weight: 750;
}

.article-main {
 width: min(100% - 48px, 1380px);
}

.article-reading-layout {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 320px;
 gap: clamp(2.2rem, 6vw, 6rem);
 align-items: start;
}

.article-reading {
 min-width: 0;
}

.article-reading-head {
 margin-block-end: clamp(2rem, 5vw, 4rem);
}

.article-reading-head h1 {
 max-width: 16ch;
 margin-block-end: 1.2rem;
 font-size: clamp(3rem, 6.8vw, 6.4rem);
}

.article-byline {
 display: flex;
 flex-wrap: wrap;
 gap: .5rem 1.2rem;
 padding-block: .8rem;
 border-block: 1px solid var(--rule);
 color: var(--muted);
 font-size: .74rem;
 font-weight: 700;
 letter-spacing: .04em;
}

.article-hero-image {
 width: 100%;
 max-height: 720px;
 margin-block: clamp(1.5rem, 4vw, 3.4rem);
 object-fit: cover;
 background: var(--paper-2);
 box-shadow: var(--shadow-md);
}

.article-hero-figure {
 margin: 0;
}

.article-standfirst {
 max-width: 58ch;
 margin-block: 1.4rem 0;
 color: var(--ink-soft);
 font-family: var(--font-reading);
 font-size: clamp(1.25rem, 2vw, 1.65rem);
 font-weight: 500;
 line-height: 1.55;
}

.article-reading-tools {
 display: flex;
 align-items: center;
 gap: .8rem;
 margin-block: 1.2rem 2.2rem;
}

.article-translate-status {
 color: var(--muted);
 font-size: .76rem;
}

.article-body {
 max-width: var(--reading);
 color: var(--ink-soft);
 font-family: var(--font-reading);
 font-size: clamp(1.08rem, 1.35vw, 1.22rem);
 line-height: 1.86;
}

.article-body > p:first-child::first-letter {
 float: inline-start;
 margin: .05em .12em 0 0;
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: 4.3em;
 font-weight: 600;
 line-height: .8;
}

[dir="rtl"] .article-body > p:first-child::first-letter {
 margin: .05em 0 0 .12em;
}

.article-body h2 {
 margin-block: 2.8em .65em;
 color: var(--ink);
 font-size: clamp(2rem, 3.5vw, 3.1rem);
}

.article-body h3 {
 margin-block: 2.2em .6em;
 color: var(--ink);
 font-size: clamp(1.5rem, 2.5vw, 2.15rem);
}

.article-body p,
.article-body ul,
.article-body ol,
.article-body blockquote {
 margin-block-end: 1.45em;
}

.article-body img,
.article-body figure {
 max-width: min(100%, 960px);
 margin-block: 2.2rem;
}

.article-body figure img {
 width: 100%;
 margin: 0;
}

.article-body figcaption {
 margin-block-start: .55rem;
 color: var(--muted);
 font-family: var(--font-body);
 font-size: .72rem;
 line-height: 1.5;
}

.article-body blockquote {
 margin-inline: 0;
 padding: 1.3rem 0 1.3rem 1.6rem;
 border-inline-start: 4px solid var(--oxblood);
 color: var(--ink);
 font-size: 1.35em;
 font-style: italic;
 line-height: 1.55;
}

.article-body a {
 color: var(--oxblood);
}

.article-related-video-frame {
 max-width: var(--reading);
 margin-block: 2rem;
 padding: 1rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
}

.article-related-video-head {
 display: flex;
 justify-content: space-between;
 gap: 1rem;
 margin-block-end: .8rem;
 color: var(--muted);
 font-size: .7rem;
 letter-spacing: .06em;
 text-transform: uppercase;
}

.article-video-link-card {
 display: grid;
 grid-template-columns: minmax(150px, 250px) minmax(0, 1fr);
 gap: 1rem;
 align-items: center;
 text-decoration: none;
}

.article-video-thumb {
 position: relative;
 aspect-ratio: 16 / 9;
 overflow: hidden;
 background: var(--ink-soft);
 border-radius: var(--radius-sm);
}

.article-video-thumb img {
 width: 100%;
 height: 100%;
 object-fit: cover;
}

.article-video-copy {
 display: grid;
 gap: .35rem;
}

.article-video-copy small,
.article-video-copy em {
 color: var(--muted);
 font-size: .72rem;
}

.article-video-copy strong {
 font-family: var(--font-display);
 font-size: 1.3rem;
 line-height: 1.15;
}

.article-sidebar,
.watch-side {
 position: sticky;
 inset-block-start: calc(var(--header-h) + 24px);
 padding-block-start: .9rem;
 border-block-start: 3px solid var(--oxblood);
}

.article-sidebar > h2,
.watch-side > h2 {
 margin-block-end: 1rem;
 font-size: 1.55rem;
}

.article-attachments {
 max-width: var(--reading);
 margin-block-start: 3rem;
 padding-block-start: 1.5rem;
 border-block-start: 1px solid var(--rule);
}

.article-attachment-list {
 display: grid;
 gap: .65rem;
}

.article-attachment-list a {
 padding: .8rem 1rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-sm);
 text-decoration: none;
}

.watch-grid {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 340px;
 gap: clamp(2rem, 5vw, 5rem);
 align-items: start;
}

.watch-player {
 position: relative;
 aspect-ratio: 16 / 9;
 overflow: hidden;
 background: #090807;
 box-shadow: var(--shadow-lg);
}

.watch-player iframe,
.watch-player video {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 border: 0;
}

.watch-title {
 max-width: 21ch;
 margin: clamp(1.5rem, 4vw, 3rem) 0 .8rem;
 font-size: clamp(2.5rem, 5.2vw, 5rem);
}

.watch-heading {
 margin-block: clamp(1.5rem, 4vw, 3rem) 1rem;
}

.watch-heading .watch-title {
 margin-block: 0 .8rem;
}

.watch-description-copy {
 color: var(--ink-soft);
 font-family: var(--font-reading);
 line-height: 1.78;
}

.watch-meta {
 display: flex;
 flex-wrap: wrap;
 gap: .55rem 1rem;
 margin-block-end: 1rem;
 color: var(--muted);
 font-size: .72rem;
 font-weight: 700;
 letter-spacing: .04em;
}

.watch-description.is-collapsed p {
 display: -webkit-box;
 overflow: hidden;
 -webkit-box-orient: vertical;
 -webkit-line-clamp: 5;
}

.description-toggle {
 padding: .35rem 0;
 border: 0;
 color: var(--oxblood);
 background: transparent;
 font-size: .72rem;
 font-weight: 800;
 letter-spacing: .06em;
 text-transform: uppercase;
}

.owner-watch-tools {
 display: grid;
 gap: .7rem;
 margin-block: .8rem;
 padding: .8rem;
 border: 1px dashed var(--rule-strong);
 background: var(--ivory);
 border-radius: var(--radius-sm);
}

.watch-more-section.flush {
 margin-block-end: 0;
}

.watch-soundtrack-list .music-track {
 grid-template-columns: 42px 30px minmax(0, 1fr);
}

.watch-soundtrack-list .track-inline-player {
 grid-column: 1 / -1;
}

.watch-article-card {
 display: grid;
 gap: .35rem;
 margin-block: 1.5rem;
 padding: 1.1rem 1.2rem;
 border: 1px solid var(--rule);
 border-inline-start: 4px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
 text-decoration: none;
}

.watch-article-card > span,
.watch-article-card small {
 color: var(--muted);
 font-size: .76rem;
}

.watch-article-card strong {
 font-family: var(--font-display);
 font-size: 1.25rem;
}

.description-box,
.soundtrack-box,
.comments-box,
.youtube-comments-box {
 margin-block-start: 1.6rem;
 padding: clamp(1.2rem, 2.5vw, 2rem);
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
}

.description-box h2,
.soundtrack-box h2,
.comments-box h2 {
 font-size: 1.6rem;
}

.description-box p,
.watch-description {
 color: var(--ink-soft);
 font-family: var(--font-reading);
 line-height: 1.78;
}

.side-list,
.article-sidebar-list {
 display: grid;
 gap: .85rem;
}

.side-card {
 display: grid;
 grid-template-columns: 112px minmax(0, 1fr);
 gap: .8rem;
 align-items: center;
 padding-block-end: .85rem;
 border-block-end: 1px solid var(--rule);
 text-decoration: none;
}

.side-card > img,
.side-thumb {
 width: 112px;
 aspect-ratio: 16 / 9;
 overflow: hidden;
 object-fit: cover;
 background: var(--ink-soft);
 border-radius: var(--radius-xs);
}

.side-thumb {
 position: relative;
}

.side-thumb img {
 width: 100%;
 height: 100%;
 object-fit: cover;
}

.side-card strong,
.side-title {
 display: block;
 font-family: var(--font-display);
 font-size: .96rem;
 line-height: 1.2;
}

.side-card small {
 color: var(--muted);
 font-size: .65rem;
}

.music-stage {
 margin-block: 0;
}

.music-grid,
.music-playlist {
 min-width: 0;
}

.music-player {
 overflow: hidden;
 border-block-start: 3px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.music-now {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 1rem;
 padding: 1rem 1.1rem;
 border-block-end: 1px solid var(--rule);
}

.music-now strong {
 font-family: var(--font-display);
 font-size: 1.15rem;
}

.music-now .eyebrow {
 margin: 0;
}

.music-track-list {
 display: grid;
}

button.music-track {
 grid-template-columns: 46px minmax(0, 1fr) auto;
 width: 100%;
 color: var(--ink);
 text-align: start;
 border: 0;
 border-block-end: 1px solid var(--rule);
}

button.music-track[aria-current="true"],
button.music-track.is-current {
 color: var(--ink);
 background: var(--oxblood-soft);
}

.music-track-action,
.music-play-toggle {
 display: grid;
 width: 40px;
 height: 40px;
 padding: 0;
 border: 1px solid var(--rule-strong);
 color: var(--ink);
 background: transparent;
 border-radius: 50%;
 place-items: center;
}

.music-player > .music-controls,
.music-now + .music-controls {
 grid-template-columns: 40px 40px 40px minmax(120px, 1fr) auto minmax(80px, 140px);
 padding: .8rem 1rem;
 border-block-end: 1px solid var(--rule);
}

.music-progress,
.music-volume {
 width: 100%;
 accent-color: var(--oxblood);
}

.music-track-copy strong,
.music-track-copy small {
 display: block;
}

.music-track-copy strong {
 font-family: var(--font-display);
 font-size: 1.12rem;
}

.music-track-copy small {
 color: var(--muted);
 font-size: .7rem;
}

.music-page-heading {
 display: flex;
 align-items: end;
 justify-content: space-between;
 gap: 2rem;
 padding-block-end: 2rem;
 border-block-end: 1px solid var(--rule-strong);
}

.music-hero {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 gap: 2rem;
 align-items: end;
 padding-block-end: clamp(2.5rem, 6vw, 5.5rem);
 border-block-end: 1px solid var(--rule-strong);
}

.music-library-stat {
 display: grid;
 min-width: 150px;
 padding: 1.2rem;
 border-inline-start: 3px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.music-library-stat strong {
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: 3rem;
 line-height: 1;
}

.music-library-stat span {
 color: var(--muted);
 font-size: .68rem;
 font-weight: 800;
 letter-spacing: .07em;
 text-transform: uppercase;
}

.music-page-heading h1 {
 margin: 0;
 font-size: clamp(3rem, 7vw, 6rem);
}

.music-library-count {
 padding: .55rem .8rem;
 border: 1px solid var(--rule);
 color: var(--oxblood);
 background: var(--paper);
 border-radius: 999px;
 font-size: .72rem;
 font-weight: 800;
 letter-spacing: .06em;
 white-space: nowrap;
}

.music-library-tools {
 display: grid;
 grid-template-columns: minmax(200px, 1fr) 190px 130px auto auto;
 gap: .7rem;
 padding-block: 1.3rem;
 border-block-end: 1px solid var(--rule);
}

.music-search-field {
 display: block;
}

.playlist-list {
 border-block-start: 3px solid var(--oxblood);
}

.music-track {
 position: relative;
 display: grid;
 grid-template-columns: 48px 38px minmax(190px, .8fr) minmax(300px, 1.4fr);
 gap: 1rem;
 align-items: center;
 min-height: 96px;
 padding: .9rem 1rem;
 overflow: visible;
 border-block-end: 1px solid var(--rule);
 background: color-mix(in srgb, var(--paper) 88%, transparent);
 transition: background .2s ease, box-shadow .2s ease;
}

.music-track:hover,
.music-track.is-current {
 background: var(--paper);
}

.music-track.is-current {
 box-shadow: inset 4px 0 0 var(--oxblood);
}

[dir="rtl"] .music-track.is-current {
 box-shadow: inset -4px 0 0 var(--oxblood);
}

.track-play {
 position: relative;
 display: grid;
 width: 42px;
 height: 42px;
 padding: 0;
 border: 1px solid var(--rule-strong);
 color: var(--ink);
 background: transparent;
 border-radius: 50%;
 place-items: center;
}

.track-play:hover,
.music-track.is-playing .track-play {
 border-color: var(--oxblood);
 color: var(--on-dark);
 background: var(--oxblood);
}

.play-triangle {
 width: 0;
 height: 0;
 margin-inline-start: 3px;
 border-block: 5px solid transparent;
 border-inline-start: 8px solid currentColor;
}

.track-equalizer {
 display: none;
 align-items: center;
 gap: 2px;
 height: 15px;
}

.track-equalizer i {
 width: 2px;
 height: 60%;
 background: currentColor;
 animation: equalize .8s ease-in-out infinite alternate;
}

.track-equalizer i:nth-child(2) {
 height: 100%;
 animation-delay: -.3s;
}

.track-equalizer i:nth-child(3) {
 height: 40%;
 animation-delay: -.55s;
}

.is-playing .track-play .play-triangle {
 display: none;
}

.is-playing .track-play .track-equalizer {
 display: flex;
}

@keyframes equalize {
 to { height: 25%; }
}

.track-number {
 color: var(--muted-2);
 font-family: var(--font-display);
 font-size: 1.2rem;
 font-variant-numeric: tabular-nums;
}

.track-copy {
 min-width: 0;
}

.track-copy h2 {
 margin: 0 0 .25rem;
 overflow: hidden;
 font-size: clamp(1.15rem, 1.7vw, 1.5rem);
 line-height: 1.15;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.track-copy > p {
 display: -webkit-box;
 margin: .35rem 0 0;
 overflow: hidden;
 color: var(--muted);
 font-size: .75rem;
 line-height: 1.4;
 -webkit-box-orient: vertical;
 -webkit-line-clamp: 2;
}

.track-meta {
 display: flex;
 flex-wrap: wrap;
 gap: .25rem .8rem;
 color: var(--muted);
 font-size: .65rem;
 font-weight: 700;
 letter-spacing: .04em;
 text-transform: uppercase;
}

.track-inline-player,
.music-controls {
 display: grid;
 grid-template-columns: auto minmax(120px, 1fr) auto;
 gap: .75rem;
 align-items: center;
 min-width: 0;
}

.track-time {
 color: var(--muted);
 font-size: .65rem;
 font-variant-numeric: tabular-nums;
 white-space: nowrap;
}

.track-waveform {
 width: 100%;
 height: 48px;
 cursor: pointer;
}

.track-progress,
.music-progress,
.music-nowbar input[type="range"] {
 accent-color: var(--oxblood);
}

.track-volume {
 position: relative;
}

.track-volume-button {
 display: grid;
 width: 34px;
 height: 34px;
 padding: 0;
 border: 0;
 color: var(--muted);
 background: transparent;
 border-radius: 50%;
 place-items: center;
}

.track-volume-icon {
 width: 20px;
 fill: currentColor;
}

.volume-wave,
.volume-muted-line {
 fill: none;
 stroke: currentColor;
 stroke-linecap: round;
 stroke-width: 1.6;
}

.volume-muted-line {
 display: none;
}

.is-muted .volume-wave {
 display: none;
}

.is-muted .volume-muted-line {
 display: block;
}

.track-volume-panel {
 position: absolute;
 inset-inline-start: 50%;
 inset-block-end: calc(100% + 10px);
 display: none;
 width: 42px;
 height: 136px;
 padding: .65rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: 999px;
 box-shadow: var(--shadow-md);
 transform: translateX(-50%);
}

.track-volume-panel.is-open,
.track-volume.is-open .track-volume-panel {
 display: grid;
 place-items: center;
}

.track-volume-panel input {
 width: 110px;
 accent-color: var(--oxblood);
 transform: rotate(-90deg);
}

.track-volume-floating-panel {
 position: fixed;
 inset-inline-start: var(--volume-left);
 inset-block-end: var(--volume-bottom);
 z-index: 300;
}

.track-wave {
 display: none;
}

.music-track audio {
 width: 100%;
}

.music-track[data-ssr] {
 grid-template-columns: 56px minmax(220px, 1fr) minmax(260px, 520px);
}

.music-track-number {
 color: var(--muted-2);
 font-family: var(--font-display);
 font-size: 1.5rem;
 font-variant-numeric: tabular-nums;
}

.music-track-copy .eyebrow {
 margin-block-end: .3rem;
}

.music-track-copy h3 {
 margin: 0;
 font-size: clamp(1.2rem, 2vw, 1.65rem);
}

.music-track-copy > p:last-child {
 margin: .25rem 0 0;
 color: var(--muted);
 font-size: .72rem;
}

.music-track .track-audio {
 display: block;
 width: 100%;
 height: 42px;
}

.music-note,
.social-safety {
 max-width: 920px;
 padding: clamp(1.8rem, 4vw, 3.4rem);
 border-inline-start: 4px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.music-note h2,
.social-safety h2 {
 margin-block-end: .8rem;
 font-size: clamp(2rem, 4vw, 3.8rem);
}

.music-note > p:not(.eyebrow),
.social-safety > p:not(.eyebrow) {
 max-width: 62ch;
 color: var(--muted);
 font-family: var(--font-reading);
}

.music-nowbar {
 position: sticky;
 inset-block-end: 16px;
 z-index: 40;
 display: grid;
 grid-template-columns: auto minmax(180px, .5fr) auto minmax(200px, 1fr);
 gap: 1rem;
 align-items: center;
 margin: 1rem auto 0;
 padding: .8rem 1rem;
 border: 1px solid var(--rule-strong);
 color: var(--on-dark);
 background: color-mix(in srgb, #171310 94%, transparent);
 border-radius: var(--radius-md);
 box-shadow: var(--shadow-lg);
 backdrop-filter: blur(12px);
}

.music-nowbar .track-play {
 color: var(--on-dark);
 border-color: rgba(255, 255, 255, .35);
}

.music-now-copy {
 display: grid;
 min-width: 0;
}

.music-now-copy span {
 color: var(--gold-soft);
 font-size: .6rem;
 font-weight: 800;
 letter-spacing: .12em;
 text-transform: uppercase;
}

.music-now-copy strong {
 overflow: hidden;
 font-family: var(--font-display);
 text-overflow: ellipsis;
 white-space: nowrap;
}

.home-soundtrack-player .music-track {
 grid-template-columns: 34px 25px minmax(0, 1fr);
 gap: .55rem;
 min-height: 62px;
 padding: .55rem .2rem;
 background: transparent;
}

.home-soundtrack-player .track-play {
 width: 32px;
 height: 32px;
}

.home-soundtrack-player .track-copy h2 {
 font-size: .9rem;
}

.home-soundtrack-player .track-copy > p,
.home-soundtrack-player .track-inline-player,
.home-soundtrack-player .track-wave {
 display: none;
}

.about-editorial-hero {
 max-width: 1120px;
 margin-inline: auto;
}

.about-editorial {
 display: grid;
 grid-template-columns: minmax(220px, .45fr) minmax(0, 1fr);
 gap: clamp(2rem, 7vw, 7rem);
 align-items: start;
}

.about-editorial > .eyebrow,
.about-editorial > .page-title {
 grid-column: 1;
}

.about-copy {
 grid-column: 2;
 grid-row: 1 / span 3;
 max-width: 68ch;
 padding-inline-start: clamp(1.5rem, 4vw, 4rem);
 border-inline-start: 1px solid var(--rule-strong);
}

.about-copy p:first-child {
 color: var(--ink);
 font-size: 1.3em;
}

.about-manifesto {
 display: grid;
 grid-template-columns: 160px minmax(0, 1fr);
 gap: clamp(1rem, 4vw, 4rem);
 margin-block-start: clamp(2rem, 5vw, 5rem);
 padding-block: clamp(1.5rem, 4vw, 3rem);
 border-block: 1px solid var(--rule-strong);
}

.about-manifesto > span {
 color: var(--oxblood);
 font-size: .68rem;
 font-weight: 800;
 letter-spacing: .12em;
 text-transform: uppercase;
}

.about-manifesto blockquote {
 max-width: 28ch;
 margin: 0;
 font-family: var(--font-display);
 font-size: clamp(1.8rem, 4vw, 3.8rem);
 line-height: 1.12;
}

.about-columns {
 columns: 2 320px;
 column-gap: clamp(2rem, 6vw, 6rem);
 column-rule: 1px solid var(--rule);
 color: var(--ink-soft);
 font-family: var(--font-reading);
 font-size: 1.08rem;
 line-height: 1.8;
}

.about-columns p {
 break-inside: avoid;
 margin-block-end: 1.5rem;
}

.about-cta {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 2rem;
 padding: clamp(1.8rem, 4vw, 3.4rem);
 color: var(--on-dark);
 background: linear-gradient(135deg, var(--oxblood-deep), #28171a);
 box-shadow: var(--shadow-md);
}

.about-cta h2 {
 max-width: 18ch;
 margin: 0;
 font-size: clamp(2rem, 4vw, 4rem);
}

.about-cta .eyebrow {
 color: var(--gold-soft);
}

.about-cta .button.ghost {
 border-color: rgba(255, 255, 255, .45);
 color: var(--on-dark);
 background: transparent;
}

.contact-intro,
.contact-workspace {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 340px;
 gap: clamp(2rem, 7vw, 7rem);
 align-items: start;
}

.contact-details {
 padding: 1.4rem;
 border-block-start: 3px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.contact-details a {
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: clamp(1.15rem, 2vw, 1.6rem);
}

.contact-details > p:last-child {
 margin: 1rem 0 0;
 color: var(--muted);
 font-size: .78rem;
}

.contact-form {
 max-width: none;
}

.contact-form-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 1rem;
}

.contact-topics {
 display: grid;
 gap: 1px;
 border: 1px solid var(--rule);
 background: var(--rule);
}

.contact-topics article {
 padding: 1.2rem;
 background: var(--paper);
}

.contact-topics article > span {
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: 1.6rem;
}

.contact-topics h2 {
 margin: .7rem 0 .4rem;
 font-size: 1.3rem;
}

.contact-topics p {
 margin: 0;
 color: var(--muted);
 font-size: .78rem;
}

.process-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 1px;
 overflow: hidden;
 border: 1px solid var(--rule);
 background: var(--rule);
}

.process-grid article {
 min-height: 280px;
 padding: clamp(1.5rem, 3vw, 2.8rem);
 background: var(--paper);
}

.process-grid article > span {
 color: var(--oxblood);
 font-family: var(--font-display);
 font-size: 2.4rem;
}

.process-grid h2 {
 margin-block: 2rem .7rem;
 font-size: 2rem;
}

.process-grid p {
 color: var(--muted);
}

.social-hero {
 display: grid;
 grid-template-columns: minmax(270px, .8fr) minmax(0, 1.2fr);
 gap: clamp(2rem, 6vw, 6rem);
 align-items: center;
}

.social-page-head img {
 width: 86px;
 margin-block-end: 1.4rem;
 border-radius: 50%;
}

.social-card-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 1rem;
}

.social-card {
 display: grid;
 grid-template-columns: 48px minmax(0, 1fr);
 gap: 1rem;
 min-height: 150px;
 padding: 1.3rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
 box-shadow: var(--shadow-sm);
 text-decoration: none;
 transition: transform .2s var(--ease), box-shadow .2s ease;
}

.social-card:hover {
 box-shadow: var(--shadow-md);
 transform: translateY(-3px);
}

.social-icon {
 display: grid;
 width: 46px;
 height: 46px;
 color: var(--on-dark);
 background: var(--oxblood);
 border-radius: 50%;
 place-items: center;
}

.social-card-index {
 display: grid;
 width: 46px;
 height: 46px;
 color: var(--on-dark);
 background: var(--oxblood);
 border-radius: 50%;
 font-family: var(--font-display);
 font-size: 1.35rem;
 place-items: center;
}

.social-icon svg {
 width: 23px;
 fill: currentColor;
}

.social-card-copy {
 display: grid;
 align-content: start;
 min-width: 0;
}

.social-card-copy > span {
 color: var(--oxblood);
 font-size: .67rem;
 font-weight: 800;
 letter-spacing: .1em;
 text-transform: uppercase;
}

.social-card-copy strong {
 overflow: hidden;
 margin-block: .25rem;
 font-family: var(--font-display);
 font-size: 1.2rem;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.social-card-copy em {
 color: var(--muted);
 font-size: .75rem;
 font-style: normal;
}

.comments-head,
.youtube-comments-actions {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: space-between;
 gap: 1rem;
 margin-block-end: 1rem;
}

.comment-form,
.owner-description-form,
.owner-inline-form {
 display: grid;
 gap: .8rem;
 margin-block: 1rem;
}

.comment-form textarea,
.owner-description-form textarea,
.owner-inline-form input {
 width: 100%;
 min-height: 100px;
 padding: .8rem;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--ivory);
 border-radius: var(--radius-sm);
}

.comments-list,
.youtube-comments-list {
 display: grid;
 gap: .85rem;
}

.comment-item,
.youtube-comment-item {
 display: grid;
 grid-template-columns: 42px minmax(0, 1fr);
 gap: .8rem;
 padding: 1rem 0;
 border-block-end: 1px solid var(--rule);
}

.comment-avatar {
 width: 42px;
 height: 42px;
 object-fit: cover;
 background: var(--paper-2);
 border-radius: 50%;
}

.comment-meta {
 display: flex;
 flex-wrap: wrap;
 gap: .35rem .7rem;
 color: var(--muted);
 font-size: .7rem;
}

.comment-owner-actions,
.admin-comment-actions,
.watch-actions,
.watch-more-actions {
 display: flex;
 flex-wrap: wrap;
 gap: .5rem;
}

.owner-mini-button {
 padding: .35rem .55rem;
 border: 1px solid var(--rule);
 color: var(--muted);
 background: transparent;
 border-radius: 999px;
 font-size: .65rem;
}

.admin-main {
 width: min(100% - 32px, 1600px);
}

.admin-login-section {
 display: grid;
 min-height: 62vh;
 place-items: center;
}

.admin-login-card {
 width: min(100%, 520px);
 padding: clamp(1.8rem, 5vw, 3.5rem);
 border-block-start: 4px solid var(--oxblood);
 background: var(--paper);
 box-shadow: var(--shadow-md);
}

.admin-login-card h1,
.admin-hero h1 {
 font-size: clamp(2.6rem, 5vw, 4.5rem);
}

.admin-login-form {
 display: grid;
 gap: .8rem;
 margin-block-start: 1.5rem;
}

.admin-hero {
 display: flex;
 align-items: end;
 justify-content: space-between;
 gap: 2rem;
 padding-block-end: 2rem;
 border-block-end: 1px solid var(--rule-strong);
}

.admin-hero-actions,
.admin-toolbar,
.compact-toolbar {
 display: flex;
 flex-wrap: wrap;
 align-items: end;
 justify-content: space-between;
 gap: 1rem;
}

.admin-dashboard {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 1rem;
 margin-block: 1.5rem;
}

.admin-dashboard article {
 display: grid;
 gap: .4rem;
 padding: 1.2rem;
 border: 1px solid var(--rule);
 background: var(--paper);
}

.admin-dashboard span,
.admin-dashboard strong {
 font-size: .76rem;
}

.admin-dashboard span {
 color: var(--oxblood);
 font-weight: 800;
 letter-spacing: .08em;
 text-transform: uppercase;
}

.admin-tabs {
 display: flex;
 gap: .3rem;
 margin-block: 1.6rem;
 padding: .35rem;
 overflow: auto;
 border: 1px solid var(--rule);
 background: var(--paper-2);
 border-radius: 999px;
 scrollbar-width: thin;
}

.admin-tab {
 flex: 1 0 auto;
 min-height: 40px;
 padding: .55rem .9rem;
 border: 0;
 color: var(--muted);
 background: transparent;
 border-radius: 999px;
 font-size: .72rem;
 font-weight: 800;
 text-transform: uppercase;
}

.admin-tab.active,
.admin-tab[aria-selected="true"] {
 color: var(--on-dark);
 background: var(--oxblood);
}

.admin-tab-panel {
 margin-block: 1.5rem;
}

.admin-toolbar {
 margin-block-end: 1.2rem;
 padding: 1rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 border-radius: var(--radius-md);
}

.admin-search-field {
 flex: 1 1 340px;
}

.admin-workspace {
 display: grid;
 grid-template-columns: minmax(260px, .55fr) minmax(0, 1.45fr);
 gap: 1.2rem;
 align-items: start;
}

.admin-list {
 position: sticky;
 inset-block-start: calc(var(--header-h) + 20px);
 max-height: 72vh;
 overflow: auto;
}

.admin-panel-head {
 margin-block-end: 1rem;
}

.admin-panel-head h2 {
 margin-block-end: .4rem;
 font-size: 2rem;
}

.admin-panel-head > span {
 color: var(--muted);
 font-size: .75rem;
}

.admin-video-list,
.admin-article-list,
.admin-music-list,
.admin-comments-list {
 display: grid;
 gap: .65rem;
}

.admin-current {
 display: grid;
 grid-template-columns: 180px minmax(0, 1fr);
 gap: 1rem;
 margin-block-end: 1.2rem;
 padding: 1rem;
 border: 1px solid var(--rule);
 background: var(--ivory);
 border-radius: var(--radius-sm);
}

.admin-current img {
 width: 180px;
 aspect-ratio: 16 / 9;
 object-fit: cover;
}

.admin-current-title {
 font-size: 1.4rem;
}

.editor-form {
 display: grid;
 gap: 1rem;
}

.admin-form-row {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 1rem;
}

.article-file-tools {
 display: flex;
 flex-wrap: wrap;
 gap: .7rem;
}

.article-cover-preview img {
 width: min(100%, 520px);
 max-height: 280px;
 object-fit: cover;
}

.rich-editor-toolbar {
 position: sticky;
 inset-block-start: calc(var(--header-h) + 8px);
 z-index: 10;
 display: flex;
 flex-wrap: wrap;
 gap: .35rem;
 padding: .6rem;
 border: 1px solid var(--rule);
 background: var(--paper);
 box-shadow: var(--shadow-sm);
}

.rich-editor-toolbar button,
.rich-image-button {
 position: relative;
 display: inline-flex;
 min-height: 36px;
 align-items: center;
 padding: .45rem .65rem;
 border: 1px solid var(--rule);
 color: var(--ink);
 background: var(--ivory);
 border-radius: var(--radius-xs);
 font-size: .72rem;
}

.rich-editor-toolbar select,
.rich-editor-toolbar input:not([type="file"]) {
 width: auto;
 min-height: 36px;
 padding: .4rem .55rem;
}

.rich-editor {
 min-height: 520px;
 padding: clamp(1.2rem, 3vw, 2.5rem);
 overflow: auto;
 border: 1px solid var(--rule);
 color: var(--ink-soft);
 background: var(--paper);
 font-family: var(--font-reading);
 font-size: 1.05rem;
 line-height: 1.75;
 outline: 0;
}

.rich-editor:focus {
 border-color: var(--oxblood);
 box-shadow: 0 0 0 3px color-mix(in srgb, var(--oxblood) 12%, transparent);
}

.article-attachment-editor-row,
.admin-comment-video,
.admin-comment-meta,
.admin-music-summary {
 padding: .9rem;
 border: 1px solid var(--rule);
 background: var(--ivory);
 border-radius: var(--radius-sm);
}

.upload-progress {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 gap: .7rem;
 align-items: center;
}

.upload-progress-track {
 height: 8px;
 overflow: hidden;
 background: var(--paper-2);
 border-radius: 999px;
}

.upload-progress-track span {
 display: block;
 width: 0;
 height: 100%;
 background: var(--oxblood);
}

.json-preview {
 max-height: 520px;
 padding: 1rem;
 overflow: auto;
 color: #d9e2d6;
 background: #151713;
 border-radius: var(--radius-sm);
 font: .78rem/1.55 Consolas, Monaco, monospace;
}

.site-footer {
 border-block-start: 1px solid var(--rule-strong);
 color: var(--ink-soft);
 background: color-mix(in srgb, var(--paper) 82%, var(--ivory));
}

.footer-inner,
.site-footer-grid {
 display: grid;
 grid-template-columns: auto minmax(0, 1fr) auto;
 gap: 2rem;
 align-items: center;
 width: min(100% - 48px, var(--content));
 min-height: 150px;
 margin-inline: auto;
 padding-block: 2rem;
}

.footer-inner > p {
 margin: 0;
 color: var(--muted);
 font-family: var(--font-reading);
 font-size: .78rem;
 text-align: end;
}

.social-links {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: .4rem 1rem;
}

.social-link {
 color: var(--muted);
 font-size: .68rem;
 font-weight: 800;
 letter-spacing: .08em;
 text-decoration: none;
 text-transform: uppercase;
}

.social-link:hover {
 color: var(--oxblood);
}

@media (max-width: 1260px) {
 .site-header {
 gap: 1rem;
 padding-inline: 20px;
 }

 .brand span {
 display: none;
 }

 .home-soundtrack-stage,
 .hero-grid {
 grid-template-columns: minmax(270px, .72fr) minmax(440px, 1.28fr);
 grid-template-areas:
  "feature feature"
  "music journal";
 }

 .home-featured-video,
 .lead-story {
 min-height: 620px;
 }

 .home-soundtrack-player,
 .home-articles-panel {
 min-height: 530px;
 }

 .music-library-tools {
 grid-template-columns: minmax(220px, 1fr) 180px 130px;
 }

 .music-library-tools .button {
 width: 100%;
 }
}

@media (max-width: 1080px) {
 .videos-layout,
 .story-grid,
 .release-grid,
 .article-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .article-reading-layout,
 .watch-grid {
 grid-template-columns: minmax(0, 1fr) 280px;
 gap: 2.5rem;
 }

 .music-track {
 grid-template-columns: 44px 30px minmax(170px, .75fr) minmax(240px, 1.25fr);
 gap: .7rem;
 }

 .social-hero {
 grid-template-columns: 1fr;
 }
}

@media (max-width: 960px) {
 :root {
 --header-h: 70px;
 }

 .site-header {
 grid-template-columns: auto 1fr auto;
 min-height: var(--header-h);
 }

 .brand span {
 display: inline;
 }

 .js .nav-toggle,
 .js .mobile-menu-toggle,
 .js [data-menu-toggle] {
 position: relative;
 display: grid;
 }

 .js .site-header:has([data-menu-toggle]) .nav,
 .js .site-header:has(.nav-toggle) .nav,
 .js .site-header:has(.mobile-menu-toggle) .nav,
 .js .site-header:has([data-menu-toggle]) [data-primary-nav],
 .js .site-header:has(.nav-toggle) [data-primary-nav] {
 position: fixed;
 inset-block: 0;
 inset-inline-end: 0;
 z-index: -1;
 display: flex;
 width: min(86vw, 380px);
 padding: 92px 24px 32px;
 overflow-y: auto;
 flex-direction: column;
 align-items: stretch;
 justify-content: flex-start;
 gap: .2rem;
 border-inline-start: 1px solid var(--rule);
 background: var(--paper);
 box-shadow: var(--shadow-lg);
 opacity: 0;
 pointer-events: none;
 transform: translateX(104%);
 transition: opacity .25s ease, transform .3s var(--ease);
 }

 .js[dir="rtl"] .site-header:has([data-menu-toggle]) .nav,
 .js[dir="rtl"] .site-header:has(.nav-toggle) .nav,
 .js[dir="rtl"] .site-header:has(.mobile-menu-toggle) .nav,
 .js[dir="rtl"] .site-header:has([data-menu-toggle]) [data-primary-nav] {
 transform: translateX(-104%);
 }

 .js body.nav-open .nav,
 .js .nav.is-open,
 .js [data-primary-nav].is-open,
 .js [data-primary-nav][data-open="true"] {
 z-index: 101;
 opacity: 1;
 pointer-events: auto;
 transform: translateX(0);
 }

 html:not(.js) .site-header {
 grid-template-columns: 1fr;
 height: auto;
 padding-block: .8rem;
 }

 html:not(.js) .site-header .nav,
 html:not(.js) .site-header [data-primary-nav] {
 position: static;
 display: flex;
 width: 100%;
 flex-wrap: wrap;
 align-items: center;
 gap: .35rem .8rem;
 opacity: 1;
 pointer-events: auto;
 transform: none;
 }

 body.nav-open::after {
 position: fixed;
 inset: 0;
 z-index: 99;
 content: "";
 background: rgba(10, 8, 6, .56);
 backdrop-filter: blur(2px);
 }

 body.nav-open {
 overflow: hidden;
 }

 .site-header:has([data-menu-toggle]) .nav > a,
 .site-header:has(.nav-toggle) .nav > a,
 [data-primary-nav].is-open > a,
 [data-primary-nav][data-open="true"] > a {
 width: 100%;
 padding: .95rem .25rem;
 border-block-end: 1px solid var(--rule);
 font-family: var(--font-display);
 font-size: 1.25rem;
 letter-spacing: 0;
 text-transform: none;
 }

 .site-header:has([data-menu-toggle]) .nav > a::after,
 .site-header:has(.nav-toggle) .nav > a::after {
 display: none;
 }

 .site-header:not(:has([data-menu-toggle], .nav-toggle, .mobile-menu-toggle)) {
 grid-template-columns: auto 1fr;
 padding-block: .55rem;
 }

 .site-header:not(:has([data-menu-toggle], .nav-toggle, .mobile-menu-toggle)) .nav {
 grid-column: 1 / -1;
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 width: 100%;
 padding-block-start: .5rem;
 }

 .site-header:not(:has([data-menu-toggle], .nav-toggle, .mobile-menu-toggle)) .nav > a {
 padding: .7rem;
 border: 1px solid var(--rule);
 text-align: center;
 }

 .nav .language-select,
 [data-primary-nav] .language-select,
 .nav .header-search,
 [data-primary-nav] .header-search {
 width: 100%;
 max-width: none;
 margin: .55rem 0;
 }

 .nav .header-search input,
 [data-primary-nav] .header-search input {
 opacity: 1;
 }

 .nav .auth-control,
 [data-primary-nav] .auth-control {
 width: 100%;
 margin-block-start: .5rem;
 }

 .article-reading-layout,
 .watch-grid {
 grid-template-columns: 1fr;
 }

 .article-sidebar,
 .watch-side {
 position: static;
 margin-block-start: 2.5rem;
 }

 .side-list,
 .article-sidebar-list {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .archive-board {
 grid-template-columns: 1fr;
 }

 .archive-tools {
 position: static;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 }

 .music-track {
 grid-template-columns: 44px 30px minmax(0, 1fr);
 }

 .track-inline-player,
 .music-controls {
 grid-column: 1 / -1;
 padding-inline-start: 74px;
 }

 .music-nowbar {
 grid-template-columns: auto minmax(0, 1fr) auto;
 }

 .music-nowbar input[type="range"] {
 grid-column: 1 / -1;
 width: 100%;
 }

 .about-editorial {
 grid-template-columns: 1fr;
 }

 .home-editorial-hero {
 grid-template-columns: 1fr;
 }

 .home-proof {
 max-width: 620px;
 }

 .home-mission {
 grid-template-columns: 1fr;
 }

 .contact-intro,
 .contact-workspace {
 grid-template-columns: 1fr;
 }

 .contact-details {
 max-width: 520px;
 }

 .about-editorial > .eyebrow,
 .about-editorial > .page-title,
 .about-copy {
 grid-column: 1;
 grid-row: auto;
 }

 .about-copy {
 padding-inline-start: 0;
 padding-block-start: 1.5rem;
 border-inline-start: 0;
 border-block-start: 1px solid var(--rule-strong);
 }

 .admin-workspace {
 grid-template-columns: 1fr;
 }

 .admin-list {
 position: static;
 max-height: 380px;
 }
}

@media (max-width: 700px) {
 .main,
 .main.home-main,
 .article-main,
 .admin-main {
 width: min(100% - 28px, var(--content));
 padding-block: 1.8rem 5rem;
 }

 .brand span {
 font-size: 1.05rem;
 }

 .brand img {
 width: 38px;
 height: 38px;
 }

 .home-soundtrack-stage,
 .hero-grid {
 grid-template-columns: 1fr;
 grid-template-areas:
  "feature"
  "journal"
  "music";
 }

 .home-editorial-copy h1 {
 font-size: clamp(3.2rem, 16vw, 5.6rem);
 }

 .home-proof {
 grid-template-columns: 1fr;
 }

 .home-featured-video,
 .lead-story {
 min-height: 540px;
 }

 .home-soundtrack-player,
 .home-articles-panel {
 min-height: auto;
 }

 .home-playlist-list,
 .home-article-list {
 max-height: 440px;
 }

 .spotlight-copy h2 {
 font-size: clamp(2.25rem, 11vw, 4rem);
 }

 .section-head.inline-head,
 .inline-head,
 .archive-hero,
 .music-page-heading,
 .admin-hero {
 align-items: flex-start;
 flex-direction: column;
 }

 .videos-layout,
 .story-grid,
 .release-grid,
 .article-grid,
 .process-grid,
 .social-card-grid {
 grid-template-columns: 1fr;
 }

 .archive-note {
 width: 100%;
 }

 .archive-tools {
 grid-template-columns: 1fr;
 }

 .article-reading-head h1,
 .page-title {
 font-size: clamp(2.65rem, 14vw, 4.4rem);
 }

 .article-body {
 font-size: 1.05rem;
 line-height: 1.78;
 }

 .article-video-link-card {
 grid-template-columns: 1fr;
 }

 .article-filters {
 align-items: stretch;
 flex-direction: column;
 }

 .article-filters label {
 flex-basis: auto;
 max-width: none;
 }

 .side-list,
 .article-sidebar-list {
 grid-template-columns: 1fr;
 }

 .watch-title {
 font-size: clamp(2.3rem, 12vw, 4rem);
 }

 .music-library-tools {
 grid-template-columns: 1fr;
 }

 .music-player > .music-controls,
 .music-now + .music-controls {
 grid-template-columns: 40px 40px 40px minmax(0, 1fr) auto;
 }

 .music-controls .music-volume {
 grid-column: 1 / -1;
 }

 .music-hero {
 grid-template-columns: 1fr;
 }

 .music-library-stat {
 width: 100%;
 }

 .music-track[data-ssr] {
 grid-template-columns: 42px minmax(0, 1fr);
 }

 .music-track[data-ssr] .track-audio {
 grid-column: 1 / -1;
 }

 .about-manifesto {
 grid-template-columns: 1fr;
 }

 .about-cta {
 align-items: flex-start;
 flex-direction: column;
 }

 .contact-form-grid {
 grid-template-columns: 1fr;
 }

 .music-track {
 grid-template-columns: 42px minmax(0, 1fr);
 gap: .7rem;
 padding: .8rem .65rem;
 }

 .track-number {
 display: none;
 }

 .track-inline-player,
 .music-controls {
 grid-column: 1 / -1;
 grid-template-columns: 1fr auto;
 padding-inline-start: 0;
 }

 .track-time {
 grid-column: 1 / -1;
 }

 .track-waveform {
 height: 42px;
 }

 .music-nowbar {
 inset-block-end: 8px;
 gap: .6rem;
 padding: .65rem;
 }

 .music-nowbar .track-time {
 display: none;
 }

 .process-grid article {
 min-height: 220px;
 }

 .admin-dashboard,
 .admin-form-row {
 grid-template-columns: 1fr;
 }

 .admin-current {
 grid-template-columns: 1fr;
 }

 .admin-current img {
 width: 100%;
 }

 .footer-inner,
 .site-footer-grid {
 grid-template-columns: 1fr;
 gap: 1.25rem;
 width: min(100% - 28px, var(--content));
 text-align: center;
 }

 .footer-brand {
 justify-content: center;
 }

 .footer-inner > p {
 text-align: center;
 }
}

@media (max-width: 430px) {
 .site-header {
 padding-inline: 13px;
 }

 .brand span {
 display: none;
 }

 .header-actions {
 gap: .3rem;
 }

 .spotlight-copy {
 inset-inline: 1.15rem;
 inset-block-end: 1.2rem;
 }

 .spotlight-copy .actions .button {
 width: 100%;
 }

 .home-article-card > a {
 grid-template-columns: 64px minmax(0, 1fr);
 }

 .article-byline {
 display: grid;
 }

 .button {
 min-height: 42px;
 padding-inline: .85rem;
 }

 .social-card {
 grid-template-columns: 40px minmax(0, 1fr);
 padding: 1rem;
 }

 .social-icon {
 width: 40px;
 height: 40px;
 }

 .comment-item,
 .youtube-comment-item {
 grid-template-columns: 34px minmax(0, 1fr);
 }

 .comment-avatar {
 width: 34px;
 height: 34px;
 }
}

[dir="rtl"] body,
html[lang="ar"] body,
html[lang="fa"] body,
html[lang="he"] body {
 text-align: start;
}

[dir="rtl"] .play-badge,
[dir="rtl"] .play-triangle {
 transform-origin: center;
}

[dir="rtl"] .play-badge {
 transform: translate(50%, -50%);
}

[dir="rtl"] .video-card:hover .play-badge,
[dir="rtl"] .spotlight:hover .play-badge {
 transform: translate(50%, -50%) scale(1.07);
}

@media (prefers-reduced-motion: reduce) {
 html {
 scroll-behavior: auto;
 }

 *,
 *::before,
 *::after {
 scroll-behavior: auto;
 transition-duration: .01ms;
 animation-duration: .01ms;
 animation-iteration-count: 1;
 }
}
