/* DJ KiKO theme. Off-black ground, warm white type, one restrained accent
   (set in DJ KiKO > Settings and injected as --accent). */

@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-latin-wght-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-latin-ext-wght-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/instrument-serif-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/instrument-serif-latin-ext-400-normal.woff2) format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: swap; src: url(../fonts/instrument-serif-latin-400-italic.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD; }

:root {
	/* "ink" is the ground and "paper" the type; the light scheme swaps them. */
	--ink-rgb: 10 10 9;
	--paper-rgb: 243 239 232;
	--ink: rgb(var(--ink-rgb));
	--ink-2: #11110f;
	--ink-3: #1a1917;
	--ink-4: #24231f;
	--paper: rgb(var(--paper-rgb));
	--paper-dim: #d9d4ca;
	--muted: #9d978c;
	--subtle: #6f6a62;
	--line: rgb(var(--paper-rgb) / 0.12);
	--line-strong: rgb(var(--paper-rgb) / 0.24);
	--accent-c: var(--accent, #e9e4da);
	--danger: #e0745a;
	--success: #9fbf8f;
	--font-display: "Instrument Serif", "Times New Roman", serif;
	--font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--ease: cubic-bezier(0.2, 0.7, 0.1, 1);
	--gutter: 20px;
	--player-h: 0px;
	color-scheme: dark;
}
/* Light scheme: warm off-white ground, near-black type. */
html[data-scheme="light"] {
	--ink-rgb: 246 243 237;
	--paper-rgb: 20 19 17;
	--ink-2: #eeeae2;
	--ink-3: #e6e1d7;
	--ink-4: #dbd5c9;
	--paper-dim: #45413b;
	--muted: #6f6a62;
	--subtle: #9a948a;
	--accent-c: rgb(var(--paper-rgb));
	color-scheme: light;
}
/* Areas that sit on photos or artwork keep light-on-dark type in both schemes. */
html[data-scheme="light"] .dk-on-dark,
html[data-scheme="light"] .dk-over-hero .dk-header:not(.is-scrolled):not(.is-menu-open),
html[data-scheme="light"] .dk-card__play {
	--ink-rgb: 10 10 9;
	--paper-rgb: 243 239 232;
	--ink-2: #11110f;
	--ink-3: #1a1917;
	--ink-4: #24231f;
	--paper-dim: #d9d4ca;
	--muted: #b3ada2;
	--subtle: #8a847a;
	--accent-c: var(--accent, #e9e4da);
	--ink: rgb(var(--ink-rgb));
	--paper: rgb(var(--paper-rgb));
	--line: rgb(var(--paper-rgb) / 0.12);
	--line-strong: rgb(var(--paper-rgb) / 0.24);
	color-scheme: dark;
	color: var(--paper);
}
html[data-scheme="light"] .dk-search input::-webkit-search-cancel-button { filter: opacity(0.5); }
html[data-scheme="light"] .dk-field input[type="date"]::-webkit-calendar-picker-indicator { filter: none; opacity: 0.6; }
html[data-scheme="light"] .dk-btn:hover { background: rgb(var(--paper-rgb) / 0.82); }
html[data-scheme="light"] .dk-on-dark .dk-btn:hover { background: var(--accent-c); }
html[data-fonts="grotesk"] { --font-display: var(--font-sans); }
html[data-fonts="grotesk"] .font-display { font-weight: 500; letter-spacing: -0.045em; }
@media (min-width: 640px) { :root { --gutter: 32px; } }

/* ------------------------------------------------------------------ Base */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--ink); -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	min-height: 100dvh;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.5;
	font-feature-settings: "ss01", "cv11";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	padding-bottom: var(--player-h);
}
img, video, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
::selection { background: var(--accent-c); color: var(--ink); }
:focus-visible { outline: 1px solid var(--accent-c); outline-offset: 3px; }
[hidden] { display: none !important; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.dk-skip { position: absolute; left: -9999px; top: 16px; z-index: 100; background: var(--paper); color: var(--ink); padding: 8px 16px; }
.dk-skip:focus { left: 16px; }
#main:focus { outline: none; }

/* ------------------------------------------------------------ Utilities */
.dk-container { width: 100%; max-width: 1600px; margin-inline: auto; padding-inline: var(--gutter); }
.font-display { font-family: var(--font-display); font-weight: 400; }
.dk-display { font-size: clamp(3.25rem, 11vw, 10.5rem); line-height: 0.92; letter-spacing: -0.02em; text-wrap: balance; }
.dk-headline { font-size: clamp(2.25rem, 6vw, 4.75rem); line-height: 0.98; text-wrap: balance; }
.eyebrow { font-size: 0.6875rem; line-height: 1rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted); }
.link-draw {
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0% 1px; background-position: 0 100%; background-repeat: no-repeat;
	transition: background-size 0.5s var(--ease), color 0.3s;
}
.link-draw:hover, .link-draw:focus-visible, .link-draw.is-current { background-size: 100% 1px; }
.dk-muted { color: var(--muted); }
.dk-subtle { color: var(--subtle); }
.dk-dim { color: var(--paper-dim); }
.dk-paper { color: var(--paper); }
.dk-min0 { min-width: 0; }
.dk-mt-3 { margin-top: 0.75rem; } .dk-mt-4 { margin-top: 1rem; } .dk-mt-6 { margin-top: 1.5rem; } .dk-mt-8 { margin-top: 2rem; }
.dk-mt-10 { margin-top: 2.5rem; } .dk-mt-12 { margin-top: 3rem; } .dk-mt-16 { margin-top: 4rem; }
.dk-stack > * + * { margin-top: 0.5rem; }
.dk-inline-icon { display: inline-flex; align-items: center; gap: 0.5rem; }
.dk-inline-icon .dk-icon { width: 14px; height: 14px; }
.dk-icon { width: 16px; height: 16px; flex-shrink: 0; }
.dk-lede { max-width: 28rem; color: var(--paper-dim); line-height: 1.65; }
.dk-lede--lg { max-width: 36rem; font-size: 1.125rem; }
.dk-band { border-top: 1px solid var(--line); }
.dk-section { padding-block: 6rem; }
@media (min-width: 768px) { .dk-section { padding-block: 8rem; } }
.dk-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 3.5rem; }
.dk-span2 { grid-column: 1 / -1; }
.dk-vrule { width: 1px; height: 1rem; background: var(--line-strong); }

/* Film grain. */
.grain { position: relative; }
.grain::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.07; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Entrance animation. */
@keyframes dk-fade-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes dk-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dk-zoom { from { transform: scale(1.08); } to { transform: scale(1); } }
@keyframes dk-spin { to { transform: rotate(360deg); } }
.dk-fade { animation: dk-fade-up 1.1s var(--ease) both; animation-delay: var(--d, 0ms); }

/* --------------------------------------------------------------- Buttons */
.dk-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; white-space: nowrap;
	height: 2.75rem; padding: 0 1.5rem; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.18em;
	background: var(--paper); color: var(--ink); border: 1px solid transparent;
	transition: background-color 0.3s, color 0.3s, border-color 0.3s, opacity 0.3s;
}
.dk-btn:hover { background: var(--accent-c); }
.dk-btn--lg { height: 3.5rem; padding: 0 2rem; }
.dk-btn--outline { background: transparent; color: var(--paper); border-color: var(--line-strong); }
.dk-btn--outline:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.dk-btn[disabled] { opacity: 0.4; pointer-events: none; }
.dk-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 2rem; }
.dk-ibtn { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; color: var(--muted); transition: color 0.3s; }
.dk-ibtn:hover, .dk-ibtn.is-current { color: var(--paper); }

/* Play button: a disc with play/pause, optional label. */
.dk-play { display: inline-flex; align-items: center; gap: 1rem; text-align: left; position: relative; z-index: 2; }
.dk-play__disc {
	position: relative; display: grid; place-items: center; flex-shrink: 0; border-radius: 9999px;
	border: 1px solid rgb(var(--paper-rgb) / 0.7); color: var(--paper);
	-webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
	transition: all 0.5s var(--ease);
}
.dk-play:hover .dk-play__disc, .dk-play.is-playing .dk-play__disc { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.dk-play--sm .dk-play__disc { width: 2.5rem; height: 2.5rem; }
.dk-play--md .dk-play__disc { width: 3.5rem; height: 3.5rem; }
.dk-play--lg .dk-play__disc { width: 5rem; height: 5rem; }
.dk-play--sm .dk-icon { width: 16px; height: 16px; }
.dk-play--md .dk-icon { width: 20px; height: 20px; }
.dk-play--lg .dk-icon { width: 28px; height: 28px; }
.dk-play__play { margin-left: 3px; }
.dk-play__pause, .dk-play.is-playing .dk-play__play { display: none; }
.dk-play.is-playing .dk-play__pause { display: block; }
.dk-play__label { color: var(--paper); }
.dk-play__spin { display: none; position: absolute; inset: -3px; border-radius: 9999px; border: 1px solid transparent; border-top-color: var(--paper); animation: dk-spin 0.9s linear infinite; }
.is-loading > .dk-play__disc > .dk-play__spin, .dk-player__toggle.is-loading > .dk-play__spin { display: block; }
.dk-noaudio { color: var(--subtle); }

/* ---------------------------------------------------------------- Header */
.dk-header {
	position: fixed; inset: 0 0 auto 0; z-index: 30;
	border-bottom: 1px solid var(--line);
	background: rgb(var(--ink-rgb) / 0.8);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
	transition: background-color 0.5s, border-color 0.5s, backdrop-filter 0.5s;
}
.dk-over-hero .dk-header:not(.is-scrolled) { background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
body.admin-bar .dk-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .dk-header { top: 46px; } }
.dk-header__inner { display: flex; align-items: center; justify-content: space-between; height: 4rem; }
@media (min-width: 640px) { .dk-header__inner { height: 5rem; } }
.dk-wordmark { display: inline-flex; align-items: center; font-size: 0.8125rem; font-weight: 500; letter-spacing: 0.32em; }
.dk-wordmark__logo { height: 28px; width: auto; object-fit: contain; }
.dk-nav { display: none; }
.dk-nav ul { display: flex; align-items: center; gap: 2.5rem; }
.dk-nav a { padding-block: 4px; }
.dk-nav a:hover, .dk-nav a.is-current { color: var(--paper); }
.dk-menu-btn { color: var(--paper); padding: 0.5rem; margin-right: -0.5rem; }
@media (min-width: 768px) { .dk-nav { display: block; } .dk-header__inner > .dk-menu-btn { display: none; } }

.dk-menu { position: fixed; inset: 0; z-index: 50; display: flex; flex-direction: column; background: var(--ink); padding-bottom: 2.5rem; animation: dk-fade-in 0.6s var(--ease) both; overflow-y: auto; }
.dk-menu__top { display: flex; align-items: center; justify-content: space-between; height: 4rem; }
.dk-menu__title { font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.42em; }
.dk-menu__nav { flex: 1; margin-top: 2.5rem; }
.dk-menu__nav li { animation: dk-fade-up 0.9s var(--ease) both; animation-delay: calc(80ms + var(--i) * 60ms); }
.dk-menu__nav a { display: block; padding-block: 0.25rem; font-size: 3.75rem; line-height: 1; }
.dk-menu__social { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; border-top: 1px solid var(--line); padding-top: 1.5rem; }
body.admin-bar .dk-menu { top: 46px; }

/* ------------------------------------------------------------------ Hero */
.dk-hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: calc(100svh - var(--player-h)); overflow: hidden; }
.dk-hero__media { position: absolute; inset: 0; }
.dk-hero__img, .dk-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.8; }
.dk-hero__img { animation: dk-zoom 24s linear both; }
.dk-hero__shade { position: absolute; inset: 0; background: linear-gradient(to bottom, rgb(var(--ink-rgb) / 0.6), rgb(var(--ink-rgb) / 0.1) 50%, var(--ink)), linear-gradient(to right, rgb(var(--ink-rgb) / 0.5), transparent); }
.dk-hero__content { position: relative; padding-top: 8rem; padding-bottom: 3rem; }
@media (min-width: 640px) { .dk-hero__content { padding-bottom: 4rem; } }
.dk-hero__title { margin-top: 1.5rem; max-width: 14ch; }
.dk-hero { background: var(--ink); color: var(--paper); }
.dk-hero .eyebrow:first-child { color: rgb(var(--paper-rgb) / 0.8); }
.dk-hero__grid { display: grid; gap: 2.5rem; margin-top: 2.5rem; }
.dk-hero__sub { max-width: 28rem; color: var(--paper-dim); font-size: 1rem; line-height: 1.65; }
@media (min-width: 640px) { .dk-hero__sub { font-size: 1.125rem; } }
.dk-hero__now { display: flex; align-items: center; gap: 1.25rem; border-top: 1px solid var(--line-strong); padding-top: 1.25rem; }
.dk-hero__now-title { display: block; margin-top: 0.25rem; font-size: 1.5rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 1024px) {
	.dk-hero__grid { grid-template-columns: repeat(12, 1fr); align-items: end; }
	.dk-hero__grid > :first-child { grid-column: span 6; }
	.dk-hero__now { grid-column: 8 / span 5; }
}

/* -------------------------------------------------------------- Featured */
.dk-feature { display: grid; gap: 2.5rem; }
.dk-feature__body { display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; }
.dk-feature__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 2rem; margin-top: 2rem; }
@media (min-width: 768px) {
	.dk-feature { grid-template-columns: repeat(12, 1fr); gap: 4rem; }
	.dk-feature__cover { grid-column: span 7; }
	.dk-feature__body { grid-column: span 5; }
}
.dk-empty-hero { border-block: 1px solid var(--line); padding-block: 6rem; text-align: center; }
.dk-empty-hero .dk-muted { max-width: 28rem; margin-inline: auto; }

.dk-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; border-top: 1px solid var(--line); padding-top: 1.5rem; font-size: 0.875rem; }
.dk-dl dd { margin-top: 0.5rem; }

.dk-meta { display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; }
.dk-meta__sep { color: var(--subtle); }

/* ---------------------------------------------------------------- Covers */
.dk-cover { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: var(--ink-3); }
.dk-cover__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dk-cover__fallback { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 1rem; background: linear-gradient(135deg, var(--ink-4), var(--ink-3) 50%, var(--ink-2)); }
.dk-cover__fallback span { font-family: var(--font-display); font-size: 2.25rem; line-height: 1; color: rgb(var(--paper-rgb) / 0.25); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ------------------------------------------------------------------ Cards */
.dk-grid { display: grid; gap: 4rem 2rem; }
@media (min-width: 640px) { .dk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .dk-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dk-card { position: relative; }
.dk-card__cover .dk-cover__img { transition: transform 1.6s var(--ease); }
.dk-card:hover .dk-card__cover .dk-cover__img { transform: scale(1.035); }
.dk-card__shade { position: absolute; inset: 0; background: rgb(10 10 9 / 0); transition: background-color 0.7s; }
.dk-card:hover .dk-card__shade { background: rgb(10 10 9 / 0.3); }
.dk-card__play { position: absolute; left: 1rem; bottom: 1rem; z-index: 3; transition: opacity 0.5s; }
@media (min-width: 640px) and (hover: hover) {
	.dk-card__play { opacity: 0; }
	.dk-card:hover .dk-card__play, .dk-card:focus-within .dk-card__play, .dk-card__play:has(.is-playing) { opacity: 1; }
}
.dk-card__index { position: absolute; top: 1rem; right: 1rem; color: rgb(243 239 232 / 0.8); }
.dk-card__body { margin-top: 1.25rem; }
.dk-card__body > * + * { margin-top: 0.5rem; }
.dk-card__title { font-size: 1.75rem; line-height: 1.05; }
@media (min-width: 640px) { .dk-card__title { font-size: 1.875rem; } }
.dk-stretch::after { content: ""; position: absolute; inset: 0; z-index: 1; }

/* List rows. */
.dk-rows { border-bottom: 1px solid var(--line); }
.dk-row { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; border-top: 1px solid var(--line); padding-block: 1.25rem; }
.dk-row__index, .dk-row__genre, .dk-row__time { display: none; }
.dk-row__cover { width: 4rem; }
.dk-row__main { min-width: 0; }
.dk-row__title { font-size: 1.5rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-row__excerpt { margin-top: 0.25rem; font-size: 0.875rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-row__meta-mobile { margin-top: 0.5rem; }
.dk-row__time { font-variant-numeric: tabular-nums; }
@media (min-width: 640px) {
	.dk-row { grid-template-columns: 3rem 5rem 1fr 10rem 6rem auto; gap: 1.5rem; }
	.dk-row__index, .dk-row__genre, .dk-row__time { display: block; }
	.dk-row__cover { width: 5rem; }
	.dk-row__title { font-size: 1.875rem; }
	.dk-row__meta-mobile { display: none; }
}

/* --------------------------------------------------------------- Archive */
.dk-page { padding-top: 8rem; padding-bottom: 6rem; }
@media (min-width: 640px) { .dk-page { padding-top: 10rem; } }
.dk-page--tight { padding-bottom: 5rem; }
.dk-page-head { display: grid; gap: 2rem; margin-bottom: 4rem; }
.dk-page-head__aside { align-self: end; color: var(--paper-dim); }
@media (min-width: 768px) {
	.dk-page-head { grid-template-columns: repeat(12, 1fr); }
	.dk-page-head > :first-child { grid-column: span 8; }
	.dk-page-head__aside { grid-column: span 4; }
}
.dk-filters > * + * { margin-top: 2rem; }
.dk-search { position: relative; }
.dk-search__icon { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--muted); pointer-events: none; }
.dk-search input {
	width: 100%; height: 4rem; padding: 0 0 0 2.25rem; border: 0; border-bottom: 1px solid var(--line-strong); background: transparent;
	font-size: 1.875rem; color: var(--paper); border-radius: 0; -webkit-appearance: none; appearance: none;
}
@media (min-width: 640px) { .dk-search input { font-size: 2.25rem; } }
.dk-search input::placeholder { color: var(--subtle); }
.dk-search input:focus { outline: none; border-color: var(--paper); }
.dk-search input::-webkit-search-cancel-button { filter: invert(1) opacity(0.5); }
.dk-filters__bar { display: flex; flex-direction: column; gap: 1.5rem; }
@media (min-width: 1024px) { .dk-filters__bar { flex-direction: row; align-items: center; justify-content: space-between; } }
.dk-filters__right { display: flex; align-items: center; gap: 1.5rem; }
.dk-sort { display: flex; align-items: center; gap: 1rem; }
.dk-sort a.is-current { color: var(--paper); }
.dk-view { display: flex; gap: 0.25rem; }
.dk-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.dk-chip {
	display: inline-flex; align-items: center; gap: 0.5rem; height: 2.25rem; padding: 0 1rem; border: 1px solid var(--line-strong);
	font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted); transition: color 0.3s, border-color 0.3s, background-color 0.3s;
}
.dk-chip span { color: var(--subtle); }
.dk-chip:hover { border-color: var(--paper); color: var(--paper); }
.dk-chip.is-active { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.dk-chip.is-active span { color: rgb(var(--ink-rgb) / 0.5); }
.dk-chip--btn { color: var(--paper); }
.dk-chip--btn .dk-icon { width: 14px; height: 14px; }
.dk-results { margin-top: 4rem; transition: opacity 0.3s; }
.dk-results.is-busy { opacity: 0.5; }
.dk-results__count { margin-bottom: 2rem; }
.dk-pager { display: flex; align-items: center; justify-content: space-between; margin-top: 5rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.dk-empty { border: 1px solid var(--line); padding: 4rem 1.5rem; text-align: center; }
.dk-empty__title { font-size: 1.875rem; }
@media (min-width: 640px) { .dk-empty { padding-inline: 3rem; } .dk-empty__title { font-size: 2.25rem; } }
.dk-empty__text { max-width: 28rem; margin: 1rem auto 0; font-size: 0.875rem; line-height: 1.65; color: var(--muted); }
.dk-empty .dk-btn { margin-top: 2rem; }

/* ------------------------------------------------------------ Single set */
.dk-set__head { display: grid; gap: 2.5rem; padding-top: 7rem; padding-bottom: 5rem; }
@media (min-width: 640px) { .dk-set__head { padding-top: 9rem; } }
.dk-set__intro { display: flex; flex-direction: column; justify-content: flex-end; }
.dk-crumbs { margin-bottom: 2rem; }
.dk-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 2rem; }
.dk-tags a { display: inline-block; border: 1px solid var(--line); padding: 0.25rem 0.75rem; font-size: 0.75rem; color: var(--muted); transition: border-color 0.3s, color 0.3s; }
.dk-tags a:hover { border-color: var(--paper); color: var(--paper); }
.dk-set__body { display: grid; gap: 4rem; border-top: 1px solid var(--line); padding-top: 5rem; padding-bottom: 5rem; }
@media (min-width: 768px) {
	.dk-set__head, .dk-set__body { grid-template-columns: repeat(12, 1fr); gap: 4rem; }
	.dk-set__cover, .dk-set__about { grid-column: span 6; }
	.dk-set__intro, .dk-set__tracks { grid-column: span 6; }
}
@media (min-width: 1024px) {
	.dk-set__cover, .dk-set__about { grid-column: span 7; }
	.dk-set__intro, .dk-set__tracks { grid-column: span 5; }
}
.dk-links { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; margin-top: 2.5rem; }
.dk-share { margin-top: 3.5rem; }
.dk-share__row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-top: 1rem; }
.dk-share__row a:hover { color: var(--paper); }
.dk-tracklist { margin-top: 1.5rem; border-bottom: 1px solid var(--line); font-size: 0.875rem; }
.dk-tracklist li { display: grid; grid-template-columns: 2.5rem 4.5rem 1fr; gap: 0.5rem; border-top: 1px solid var(--line); padding-block: 0.75rem; font-variant-numeric: tabular-nums; }

/* Prose from the editor. */
.dk-prose { max-width: 42rem; font-size: 1.125rem; line-height: 1.7; color: var(--paper-dim); }
.dk-prose--sm { font-size: 1rem; }
.dk-prose > * + * { margin-top: 1.1em; }
.dk-prose h2, .dk-prose h3, .dk-prose h4 { font-family: var(--font-display); font-weight: 400; color: var(--paper); line-height: 1.1; margin-top: 2em; }
.dk-prose h2 { font-size: 2.25rem; } .dk-prose h3 { font-size: 1.75rem; }
.dk-prose a { color: var(--paper); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.dk-prose ul { list-style: disc; padding-left: 1.25em; } .dk-prose ol { list-style: decimal; padding-left: 1.25em; }
.dk-prose blockquote { margin: 1.5em 0; padding-left: 1.25em; border-left: 1px solid var(--line-strong); font-family: var(--font-display); font-size: 1.5rem; color: var(--paper); }
.dk-prose img { max-width: 100%; height: auto; }
.dk-prose strong { color: var(--paper); font-weight: 500; }
.dk-narrow { max-width: 48rem; }
.dk-page__content { margin-top: 3rem; }
.dk-wide-img { width: 100%; }

/* ------------------------------------------------------------------ About */
.dk-portrait { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--ink-3); }
.dk-portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.dk-about-preview, .dk-about { display: grid; gap: 3rem; }
.dk-about-preview__body { display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 768px) {
	.dk-about-preview, .dk-about { grid-template-columns: repeat(12, 1fr); gap: 4rem; }
	.dk-about-preview .dk-portrait, .dk-about__media { grid-column: span 5; }
	.dk-about-preview__body, .dk-about__body { grid-column: 7 / span 6; }
	.dk-about__media { position: sticky; top: 7rem; align-self: start; }
}
.dk-about__lead { font-size: 1.875rem; line-height: 1.3; }
@media (min-width: 640px) { .dk-about__lead { font-size: 2.25rem; } }
.dk-about__block { margin-top: 3rem; border-top: 1px solid var(--line); padding-top: 2rem; }
.dk-about__influences { margin-top: 1rem; font-size: 1.125rem; line-height: 1.65; }

/* --------------------------------------------------------------- Booking */
.dk-booking { overflow: hidden; border-top: 1px solid var(--line); background: var(--ink-2); }
.dk-booking__inner { position: relative; padding-block: 7rem; text-align: center; }
@media (min-width: 768px) { .dk-booking__inner { padding-block: 10rem; } }
.dk-booking__title { max-width: 16ch; margin: 2rem auto 0; }
.dk-booking__text { max-width: 28rem; margin: 2rem auto 0; color: var(--paper-dim); }
.dk-booking__actions { display: flex; flex-direction: column; align-items: center; gap: 1.5rem; margin-top: 3rem; }
.dk-booking__email { font-size: 0.875rem; color: var(--paper-dim); }
.dk-booking__social { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem 2rem; margin-top: 4rem; }
.dk-booking__social a:hover { color: var(--paper); }

/* ---------------------------------------------------------------- Contact */
.dk-contact { display: grid; gap: 4rem; margin-top: 5rem; border-top: 1px solid var(--line); padding-top: 4rem; }
.dk-contact__aside > * + * { margin-top: 2.5rem; }
.dk-contact__email { display: inline-block; margin-top: 0.75rem; font-size: 1.875rem; word-break: break-all; }
@media (min-width: 768px) {
	.dk-contact { grid-template-columns: repeat(12, 1fr); }
	.dk-contact__aside { grid-column: span 4; }
	.dk-contact__form { grid-column: 6 / span 7; }
}
.dk-form > * + * { margin-top: 2rem; }
.dk-form__grid { display: grid; gap: 2rem; }
@media (min-width: 640px) { .dk-form__grid { grid-template-columns: 1fr 1fr; } }
.dk-field > * + * { margin-top: 0.375rem; }
.dk-field label { display: block; }
.dk-field input, .dk-field select, .dk-field textarea {
	display: block; width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--line-strong); border-radius: 0;
	padding: 0.625rem 0; font-size: 0.9375rem; color: var(--paper); transition: border-color 0.3s;
}
.dk-field input, .dk-field select { height: 2.75rem; }
.dk-field textarea { min-height: 7rem; resize: vertical; line-height: 1.65; }
.dk-field select { cursor: pointer; -webkit-appearance: none; appearance: none; padding-right: 1.5rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%239d978c'/%3E%3C/svg%3E") no-repeat right 2px center; }
.dk-field select option { background: var(--ink-2); }
.dk-field input:focus, .dk-field select:focus, .dk-field textarea:focus { outline: none; border-color: var(--paper); }
.dk-field [aria-invalid="true"] { border-color: var(--danger); }
.dk-field input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.7); }
.dk-field__error { font-size: 0.75rem; color: var(--danger); }
.dk-field__hint { font-size: 0.75rem; color: var(--muted); }
.dk-notice { border: 1px solid; padding: 0.75rem 1rem; font-size: 0.875rem; }
.dk-notice--error { border-color: rgb(224 116 90 / 0.5); color: var(--danger); }
.dk-success { border: 1px solid var(--line); padding: 2.5rem; }
.dk-success__title { font-size: 2.25rem; }
.dk-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ----------------------------------------------------------------- Posts */
.dk-posts > * + * { margin-top: 3rem; }
.dk-post { border-top: 1px solid var(--line); padding-top: 2rem; }
.dk-post__title { margin-top: 1rem; font-size: 2.25rem; line-height: 1.05; }
.dk-404 { min-height: 70vh; }

/* ----------------------------------------------------------------- Footer */
.dk-footer { border-top: 1px solid var(--line); }
.dk-footer__grid { display: grid; gap: 3rem; padding-block: 4rem; }
@media (min-width: 768px) {
	.dk-footer__grid { grid-template-columns: repeat(12, 1fr); padding-block: 6rem; }
	.dk-footer__brand { grid-column: span 5; }
	.dk-footer__grid > :nth-child(2) { grid-column: span 3; }
	.dk-footer__grid > :nth-child(3), .dk-footer__grid > :nth-child(4) { grid-column: span 2; }
}
.dk-footer__name { font-size: 3rem; line-height: 1; }
@media (min-width: 640px) { .dk-footer__name { font-size: 3.75rem; } }
.dk-footer__tagline { margin-top: 1rem; max-width: 24rem; font-size: 0.875rem; color: var(--muted); }
.dk-footer__head { margin-bottom: 1rem; }
.dk-footer__list { font-size: 0.875rem; }
.dk-footer__list > * + * { margin-top: 0.5rem; }
.dk-footer__base { display: flex; flex-direction: column; gap: 0.75rem; border-top: 1px solid var(--line); padding-block: 1.5rem; font-size: 0.75rem; color: var(--muted); }
@media (min-width: 640px) { .dk-footer__base { flex-direction: row; align-items: center; justify-content: space-between; } }
.dk-footer__admin { color: var(--subtle); transition: color 0.3s; }
.dk-footer__admin:hover { color: var(--muted); }

/* ----------------------------------------------------------------- Player */
.dk-player {
	position: fixed; inset: auto 0 0 0; z-index: 40;
	border-top: 1px solid var(--line);
	background: rgb(var(--ink-rgb) / 0.92);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
	padding-bottom: env(safe-area-inset-bottom);
	animation: dk-fade-up 0.6s var(--ease) both;
}
@supports (backdrop-filter: blur(1px)) { .dk-player { background: rgb(var(--ink-rgb) / 0.8); } }
.dk-player__seek { position: relative; height: 18px; margin-top: -9px; }
.dk-player__buffer { position: absolute; left: 0; top: 8px; height: 2px; width: 0; background: rgb(var(--paper-rgb) / 0.1); pointer-events: none; }
.dk-player__range { position: absolute; inset: 0 0 auto 0; width: 100%; }
.dk-player__inner { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; padding-top: 0.25rem; padding-bottom: 0.75rem; }
@media (min-width: 640px) { .dk-player__inner { flex-wrap: nowrap; padding-bottom: 1rem; } }
.dk-player__info { display: flex; align-items: center; gap: 0.75rem; flex: 1 1 0; min-width: 0; }
@media (min-width: 640px) { .dk-player__info { flex-basis: 33%; } }
.dk-player__art { position: relative; width: 44px; height: 44px; flex-shrink: 0; overflow: hidden; background: var(--ink-3); }
.dk-player__art img { width: 100%; height: 100%; object-fit: cover; }
.dk-player__text { min-width: 0; }
.dk-player__title { display: block; font-size: 0.875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-player__sub { font-size: 0.75rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 1.125rem; }
.dk-player__sub.is-error { color: var(--danger); }
.dk-player__transport { display: flex; align-items: center; gap: 0.25rem; }
@media (min-width: 640px) { .dk-player__transport { gap: 0.5rem; } }
.dk-player__toggle { position: relative; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 9999px; background: var(--paper); color: var(--ink); transition: transform 0.3s; }
.dk-player__toggle:hover { transform: scale(1.04); }
.dk-player__toggle .dk-icon { width: 20px; height: 20px; }
.dk-player__toggle .dk-play__pause, .dk-player__toggle .dk-player__alert { display: none; }
.dk-player__toggle.is-playing .dk-play__play { display: none; }
.dk-player__toggle.is-playing .dk-play__pause { display: block; }
.dk-player__toggle.is-error { background: transparent; border: 1px solid rgb(224 116 90 / 0.6); color: var(--danger); }
.dk-player__toggle.is-error .dk-play__play, .dk-player__toggle.is-error .dk-play__pause { display: none; }
.dk-player__toggle.is-error .dk-player__alert { display: block; }
.dk-player__right { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; }
@media (min-width: 640px) { .dk-player__right { width: auto; flex-basis: 33%; justify-content: flex-end; } }
.dk-player__time { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; letter-spacing: 0.05em; font-variant-numeric: tabular-nums; color: var(--muted); }
.dk-player__slash { margin-inline: 0.375rem; color: var(--subtle); }
.dk-player__vol { display: flex; align-items: center; gap: 0.5rem; }
.dk-player__vol .dk-ibtn { width: 2.25rem; height: 2.25rem; }
.dk-player__vol-off, .dk-player.is-muted .dk-player__vol-on { display: none; }
.dk-player.is-muted .dk-player__vol-off { display: block; }
.dk-player__volume { display: none; width: 6rem; }
@media (min-width: 768px) { .dk-player__volume { display: block; } }

/* Sliders. */
.dk-range { -webkit-appearance: none; appearance: none; background: transparent; cursor: pointer; height: 18px; margin: 0; --fill: 0%; }
.dk-range:disabled { cursor: default; }
.dk-range::-webkit-slider-runnable-track { height: 2px; background: linear-gradient(to right, var(--paper) var(--fill), var(--line-strong) var(--fill)); }
.dk-range::-moz-range-track { height: 2px; background: linear-gradient(to right, var(--paper) var(--fill), var(--line-strong) var(--fill)); }
.dk-range::-webkit-slider-thumb { -webkit-appearance: none; width: 10px; height: 10px; margin-top: -4px; border-radius: 9999px; background: var(--paper); opacity: 0; transition: opacity 0.2s; }
.dk-range::-moz-range-thumb { width: 10px; height: 10px; border: 0; border-radius: 9999px; background: var(--paper); opacity: 0; }
.dk-range:hover::-webkit-slider-thumb, .dk-range:focus-visible::-webkit-slider-thumb { opacity: 1; }
.dk-range:hover::-moz-range-thumb, .dk-range:focus-visible::-moz-range-thumb { opacity: 1; }

/* Page transition. */
#dk-page { transition: opacity 0.25s var(--ease); }
html.dk-navigating #dk-page { opacity: 0.55; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
	.dk-hero__video { display: none; }
}