/* Preferences share the site's compact, text-first controls. */
.theme-toggle {
 display:grid;
 place-items:center;
 width:44px;
 height:44px;
 padding:0;
 color:inherit;
}
.theme-toggle svg { width:19px;height:19px }
.theme-toggle:hover { color:#b5d6ff }
.theme-toggle .theme-moon,
[data-theme="light"] .theme-toggle .theme-sun { display:none }
[data-theme="light"] .theme-toggle .theme-moon { display:block }

.release-toolbar {
 display:flex;
 align-items:center;
 justify-content:space-between;
 flex-wrap:wrap;
 gap:8px 24px;
 margin:12px 0 14px;
}
.release-toolbar .filter-bar { margin-top:0 }
.release-views { display:flex;gap:8px;align-items:center }
.release-views button {
 display:inline-flex;
 align-items:center;
 gap:8px;
 padding:10px;
 min-height:42px;
 font-size:12px;
 color:#aab6c8;
 border-bottom:1px solid transparent;
}
.release-views button:hover,
.release-views button[aria-pressed="true"] { color:var(--fg);border-bottom-color:currentColor }
.view-icon {
 width:12px;
 height:12px;
 display:inline-block;
 background:repeating-linear-gradient(to bottom,currentColor 0 1px,transparent 1px 4px);
}
.view-icon--grid {
 background:
  linear-gradient(currentColor,currentColor) 0 0 / 4px 4px no-repeat,
  linear-gradient(currentColor,currentColor) 100% 0 / 4px 4px no-repeat,
  linear-gradient(currentColor,currentColor) 0 100% / 4px 4px no-repeat,
  linear-gradient(currentColor,currentColor) 100% 100% / 4px 4px no-repeat;
}
#release-grid[data-view="grid"] {
 --release-columns:5;
 display:grid;
 grid-template-columns:repeat(var(--release-columns),minmax(0,1fr));
 gap:32px clamp(14px,2vw,32px);
 padding-top:12px;
}
#release-grid[data-view="grid"] .release {
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 gap:7px;
 min-width:0;
 padding:0;
}
#release-grid[data-view="grid"] .release-cover { width:100%;height:auto;aspect-ratio:1;margin-bottom:6px }
#release-grid[data-view="grid"] .release-meta { width:100%;min-width:0 }
#release-grid[data-view="grid"] .release-meta h3 { font-size:clamp(14px,1.3vw,20px);line-height:1.35;overflow-wrap:anywhere }
#release-grid[data-view="grid"] .release-meta h3 button { text-align:left }
#release-grid[data-view="grid"] .release-meta p { margin-top:4px;font-size:11px }
#release-grid[data-view="grid"] .release-type { display:block;min-width:0;font-size:10px }
#release-grid[data-view="grid"] .release-date { font-size:10px;min-width:0 }
#release-grid[data-view="grid"] :is(.release-number,.row-open) { display:none }
@media(max-width:900px) {
 #release-grid[data-view="grid"] { --release-columns:3 }
}
@media(max-width:600px) {
 .header-controls { gap:clamp(9px,3vw,18px) }
 .theme-toggle { width:38px }
 .release-toolbar { gap:2px 12px }
 .release-views button { padding-inline:8px;font-size:11px }
 #release-grid[data-view="grid"] { --release-columns:2;gap:26px 16px }
}

@media(min-width:601px) {
 #release-grid[data-view="list"] .release-cover { width:72px;height:72px }
}
.release-cover .frame-corners {
 inset:-4px;
 transition:inset .18s ease-out,color .18s ease-out;
}
.release-cover:hover .frame-corners,
.release-cover:focus-visible .frame-corners {
 inset:-7px;
 color:var(--cover-focus,#c5ddff);
}
.release-meta h3 button:hover {
 text-decoration:underline;
 text-underline-offset:.22em;
}
.command-results>a:is(:hover,:focus-visible)>span:nth-child(2) {
 background:var(--blue);
 color:#fff;
 box-shadow:-7px 0 var(--blue),7px 0 var(--blue);
}
.command-results>a:focus-visible {
 outline:2px solid var(--blue);
 outline-offset:4px;
}
@media(prefers-reduced-motion:reduce) {
 .release-cover .frame-corners { transition:none }
}

/* Light surfaces and red signal colors use the same artwork and spacing. */
:root[data-theme="light"] {
 color-scheme:light;
 --bg:#fffdfc;
 --fg:#272024;
 --muted:#6f555c;
 --line:#e3c4c8;
 --blue:#aa1730;
 --light-muted:#514148;
 --cover-focus:#a41533;
 --light-ink:#8e1c30;
 --header-blur-tint:#fffdfce0;
}
[data-theme="light"] body::after {
 --crt-line:#63233214;
 --crt-glow:#ffffff20;
 --crt-edge:#63233212;
}
[data-theme="light"] #wave-background { opacity:.76 }
[data-theme="light"] body:not(.is-home) #wave-background { opacity:.18 }
[data-theme="light"] .wave-fallback {
 background:radial-gradient(ellipse at 72% 28%,#ff6682,transparent 47%),
 radial-gradient(ellipse at 30% 70%,#ffb4b7,transparent 58%),#fff9f8;
 background-size:145% 145%;
}
[data-theme="light"] #code-field { color:#b12b46;opacity:.29 }
[data-theme="light"] .is-home .wave-fallback {
 background:radial-gradient(ellipse at 78% 25%,#e71943,transparent 54%),
 radial-gradient(ellipse at 22% 72%,#ff5371,transparent 64%),#fff9f8;
 background-size:145% 145%;
}
[data-theme="light"] .is-home .logo-home::before {
 background:linear-gradient(to top,#fffdfcd9,transparent 16%),
 radial-gradient(ellipse 58% 28% at 50% 50%,#fff9 10%,#fff5 58%,transparent 100%);
}
[data-theme="light"] .is-video .videos-section { color:var(--fg);--muted:var(--light-muted) }
[data-theme="light"] :is(.brand,.language-toggle,.index-button,.theme-toggle,.home-booking,.home-origin,.home-socials>a,.logo-interaction) { color:var(--light-ink) }
[data-theme="light"] :is(.theme-toggle,.language-toggle,.index-button,.home-booking,.home-socials>a):hover,
[data-theme="light"] :is(.index-button,.home-booking,.home-socials>a):focus-visible { color:#6d1021 }
[data-theme="light"] .is-home .site-header :is(.brand,.language-toggle,.index-button,.theme-toggle) {
 color:#3f0b18;
 filter:drop-shadow(0 0 2px #fff8);
}
[data-theme="light"] .home-socials svg { filter:none }
[data-theme="light"] #ascii-art { color:#5b1227;text-shadow:none }
[data-theme="light"] #ascii-blue { color:#ef375c;opacity:.65;text-shadow:none }
[data-theme="light"] .language-menu { background:#fffaf9;border-color:var(--line);color:var(--fg) }
[data-theme="light"] .language-menu button>span:last-child { color:inherit }
[data-theme="light"] .language-menu button:hover,
[data-theme="light"] .language-menu button[aria-checked="true"] { background:#a41930;color:white }
[data-theme="light"] :is(dialog,.quick-nav-dialog,.dialog-close) { background:var(--bg);color:var(--fg);border-color:var(--line) }
[data-theme="light"] dialog::backdrop { background:#46212a55 }
[data-theme="light"] .quick-nav-dialog::backdrop { background:var(--bg) }
[data-theme="light"] :is(.command-top,.command-close,.command-results>a) { color:var(--fg) }
[data-theme="light"] :is(.command-results>a,.command-close,.index-contact a,.footer-bottom a):hover { color:var(--blue) }
[data-theme="light"] :is(.dialog-close,.skip-link,.toast) { background:var(--bg);color:var(--fg);border-color:var(--line) }
[data-theme="light"] .dialog-close:hover,
[data-theme="light"] :is(.button-lime,.button-lime:hover,form .button) { background:var(--blue);color:white }
[data-theme="light"] :is(input,select,textarea) { color-scheme:light;color:var(--fg);background:#fff9;border-color:var(--line) }
[data-theme="light"] :is(input,select,textarea):focus-visible { outline-color:var(--blue) }
[data-theme="light"] :is(form label,.form-help,.contact-details>p:not(.eyebrow),.booking-result p,.dialog-artist,.dialog-note,.dialog-release-date) { color:var(--light-muted) }
[data-theme="light"] .booking-result { border-color:var(--line) }
[data-theme="light"] .release-dialog-layout>img { background:#f6e8e9 }
[data-theme="light"] :is(.page-intro>p:last-child,.is-video .page-intro>p:not(.route-code),.release-meta p,.video-meta p,.release-date,.release-type,.filter,.filter-note,.section-heading>.text-link,.release-views button,.directory-number,.index-contact,.footer-top>p,.footer-bottom,#background-motion,.downloads-heading>span,.mix-number,.mix-artist,.mix-version,.mix-format,.download-service-note,.profile-identity p,.is-about .about-copy>p.profile-bio) { color:var(--light-muted) }
[data-theme="light"] :is(.filter.active,.release-views button[aria-pressed="true"],.release-views button:hover,#background-motion:hover,.mix-download:hover) { color:var(--blue) }
[data-theme="light"] :is(.page-intro>.route-code,.route-code>span,.frame-corners,.frame-caption,.profile-tag,.is-about .artist-facts span) { color:var(--light-ink) }
[data-theme="light"] .is-about .artist-facts span::before,
[data-theme="light"] .is-about .about-social .text-link::before,
[data-theme="light"] .is-about .about-social .text-link::after { color:var(--light-ink) }
[data-theme="light"] .mix-row { border-color:var(--line) }
[data-theme="light"] .mix-row:first-child { border-color:var(--line) }
@media(max-width:700px) {
 [data-theme="light"] #code-field { opacity:.23 }
}
