/*
 * interior.css
 * Styles for every non-homepage template (single/page/archive/search/404).
 * Loaded ONLY when !is_front_page().
 *
 * Scoping strategy:
 *   Most selectors start with `#primary .dsrt-panel` (specificity 1,1,1) to beat
 *   the parent Graceful theme's inline `#primary h1-h6 { color: #030303 }` and
 *   `#primary a { color: #f9f9f9 }` (specificity 1,0,1 each).
 *
 * All tunable values come through CSS custom properties set by
 * ad_output_interior_css_vars() on wp_head. The fallbacks below match those
 * defaults so the CSS still renders sanely if the PHP never fires.
 */

/* ---------------------------------------------------------------------------
 * 1. Page-level reset — make WebGL visible + drop parent's sidebar columns
 * --------------------------------------------------------------------------- */

body.dsrt-interior-panel {
	background: transparent;
}

/* style.css has two `#webgl-background { opacity: 0.55 !important }` rules
   for the old layout. Beat them with !important here. */
body.dsrt-interior-panel #webgl-background {
	opacity: var(--dsrt-interior-webgl-opacity, 0.25) !important;
}

/* Parent theme wraps content in #primary.site-main + .main-content.clear-fix.
   On interior pages we bypass the column system entirely — no sidebar
   template part is invoked. The .main-content div still wraps our .dsrt-interior,
   but we override its width to 100%. */
body.dsrt-interior-panel .main-content,
body.dsrt-interior-panel .content-wrap {
	width: 100% !important;
	max-width: none !important;
	float: none !important;
	background: transparent !important;
}
body.dsrt-interior-panel .sidebar-left,
body.dsrt-interior-panel .sidebar-right {
	display: none !important;
}

/* Parent theme's entry-header banner (brick-texture + white-on-light wordmark)
   doesn't fit the analog aesthetic. Hide entirely; site identity comes through
   the WebGL background + the panel's own typography. */
body.dsrt-interior-panel .entry-header {
	display: none !important;
}

/* Restyle main-navigation to match homepage's dark treatment.
   Blur is intentionally NOT applied — user wants a sharp WebGL background
   visible behind everything on interior pages. */
body.dsrt-interior-panel #main-navigation {
	background: rgba(14, 8, 23, 0.55) !important;
	border-bottom: 1px solid rgba(232, 168, 124, 0.22);
}

/* Kill ALL backdrop-filter blur on interior pages — style.css has multiple
   sitewide rules at lines 188-191, 343-346, 2570-2573, 2649-2652, 3281-3284
   that apply blur to #main-navigation, #top-navigation, .page .main-content,
   .single article, etc. User wants WebGL sharp behind everything. */
body.dsrt-interior-panel,
body.dsrt-interior-panel #main-navigation,
body.dsrt-interior-panel #top-navigation,
body.dsrt-interior-panel .main-content,
body.dsrt-interior-panel .content-wrap,
body.dsrt-interior-panel article,
body.dsrt-interior-panel .dsrt-panel,
body.dsrt-interior-panel .dsrt-interior,
body.dsrt-interior-panel #site-header,
body.dsrt-interior-panel #site-footer {
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}
body.dsrt-interior-panel #main-navigation a,
body.dsrt-interior-panel #main-navigation .site-menu a,
body.dsrt-interior-panel #main-navigation i,
body.dsrt-interior-panel #main-navigation #s {
	color: #ffe8cc !important;
}
body.dsrt-interior-panel #main-navigation a:hover,
body.dsrt-interior-panel #main-navigation li.current-menu-item > a {
	color: var(--dsrt-interior-link-color, #ffb86c) !important;
}

/* Hide the secondary top-navigation strip — usually empty + just adds white space */
body.dsrt-interior-panel #top-navigation {
	display: none !important;
}

/* Hide the parent theme's search icon in the top-right of every interior page.
   Homepage has its own zen-toggle there; interior pages don't need site search. */
body.dsrt-interior-panel .main-navigation-search,
body.dsrt-interior-panel .navigation-search-overlay,
body.dsrt-interior-panel .navigation-search-button,
body.dsrt-interior-panel .graceful-search,
body.dsrt-interior-panel .graceful-search-overlay {
	display: none !important;
}

/* Footer: parent renders an empty wrap. Make sure it's transparent + slim */
body.dsrt-interior-panel #site-footer {
	background: transparent !important;
}
body.dsrt-interior-panel #site-footer .site-footer-wrap {
	padding: 0 !important;
}

/* The cookie-consent mu-plugin emits its own .dsrt-footer-legal block on
   every page. On interior pages our new rack-footer covers the same legal
   links, so hide the mu-plugin version to avoid duplication. */
body.dsrt-interior-panel .dsrt-footer-legal { display: none !important; }

/* ---------------------------------------------------------------------------
 * 2. Interior wrapper + panel
 * --------------------------------------------------------------------------- */

.dsrt-interior {
	/* Clamp panel inside the film rails so it never overlaps them.
	   Margin gives 32px breathing room on each side. */
	max-width: min(
		var(--dsrt-interior-max-width, 820px),
		calc(100vw - 2 * var(--dsrt-rail-width, 64px) - 32px)
	);
	margin: clamp(32px, 6vw, 64px) auto;
	padding: 0 clamp(12px, 3vw, 24px);
	color: var(--dsrt-interior-body-color, #e8dccc);
	font-family: var(--ad-font-body);
	font-size: clamp(1rem, 2.6vw, 1.125rem);
	line-height: 1.7;
}

/* style.css line 2582-2585 has `.single article, .page article {
   background: transparent !important; }` for the OLD layout. Override
   with !important so .dsrt-panel renders its dark backing.
   Use `background-color` (not the `background` shorthand) to avoid a
   Firefox parsing quirk where shorthand + var() + backdrop-filter renders
   as transparent. backdrop-filter is dropped — 92% opacity is enough to
   read content over the WebGL without it. */
.dsrt-interior .dsrt-panel,
body.dsrt-interior-panel article.dsrt-panel {
	position: relative;
	background-color: var(--dsrt-interior-panel-bg, rgba(12, 7, 20, 0.7)) !important;
	background-image: none !important;
	border: 1px solid var(--dsrt-interior-panel-border, rgba(255, 232, 204, 0.35));
	border-radius: 2px;
	/* style.css:2128-2138 has `article { padding-bottom: 0 !important }` matching every <article>.
	   Use !important on the bottom override to win, declared as a separate property. */
	padding: clamp(24px, 4vw, 48px);
	padding-bottom: clamp(40px, 6vw, 72px) !important;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55);
}

/* Same generous bottom padding for the related-products rack panel */
.dsrt-interior .dsrt-related {
	padding-bottom: clamp(32px, 5vw, 56px) !important;
}

/* Back link (optional, rendered by panel-open if back_href provided) */
.dsrt-interior .dsrt-panel__back {
	display: inline-block;
	margin-bottom: 1.2em;
	font-family: var(--ad-font-readout);
	font-size: 0.95rem;
	letter-spacing: 0.08em;
	color: var(--dsrt-interior-link-color, #ffb86c);
	text-decoration: none;
	text-transform: uppercase;
}
.dsrt-interior .dsrt-panel__back:hover {
	color: var(--dsrt-interior-link-hover-color, #ffd6a0);
}

/* ---------------------------------------------------------------------------
 * 3. Panel header: kicker + title
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__header {
	margin-bottom: clamp(20px, 3vw, 32px);
	border-bottom: 1px solid rgba(255, 232, 204, 0.12);
	padding-bottom: clamp(16px, 2vw, 24px);
}

.dsrt-interior .dsrt-panel__kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--ad-font-readout);
	font-size: 0.95rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--dsrt-interior-kicker-color, #ffb86c);
	margin-bottom: 0.5em;
}

.dsrt-interior .dsrt-panel__kicker-led {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--dsrt-interior-kicker-color, #ffb86c);
	box-shadow:
		0 0 6px var(--dsrt-interior-kicker-color, #ffb86c),
		inset 0 0 2px rgba(0, 0, 0, 0.4);
}

#primary .dsrt-interior .dsrt-panel__title {
	font-family: var(--ad-font-display);
	font-size: clamp(1.9rem, 4.8vw, 3.4rem);
	line-height: 1.05;
	margin: 0;
	color: var(--dsrt-interior-heading-color, #ffe8cc);
}

.dsrt-interior .dsrt-panel__breadcrumbs {
	margin-top: 1em;
	font-family: var(--ad-font-readout);
	font-size: 0.9rem;
	color: rgba(255, 232, 204, 0.88);
}
.dsrt-interior .dsrt-panel__breadcrumbs a {
	color: var(--dsrt-interior-link-color, #ffb86c);
	text-decoration: none;
}

/* ---------------------------------------------------------------------------
 * 4. Panel body — long-form content styling
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__body,
.dsrt-interior .dsrt-panel__content {
	font-family: var(--ad-font-body);
	max-width: 65ch;
}

.dsrt-interior .dsrt-panel__content > * + * {
	margin-top: 1.2em;
}

#primary .dsrt-panel__content h1,
#primary .dsrt-panel__content h2,
#primary .dsrt-panel__content h3,
#primary .dsrt-panel__content h4,
#primary .dsrt-panel__content h5,
#primary .dsrt-panel__content h6 {
	font-family: var(--ad-font-display);
	color: var(--dsrt-interior-heading-color, #ffe8cc);
	line-height: 1.15;
	margin: 1.6em 0 0.6em;
}
#primary .dsrt-panel__content h2 { font-size: clamp(1.6rem, 3.2vw, 2.2rem); }
#primary .dsrt-panel__content h3 { font-size: clamp(1.35rem, 2.4vw, 1.7rem); }
#primary .dsrt-panel__content h4 { font-size: clamp(1.15rem, 1.8vw, 1.35rem); }

#primary .dsrt-panel__content a,
#primary .dsrt-panel__content ul a,
#primary .dsrt-panel__content ol a,
#primary .dsrt-panel__content p a {
	color: var(--dsrt-interior-link-color, #ffb86c);
	text-decoration: underline;
	text-underline-offset: 0.15em;
	text-decoration-thickness: 1px;
}
#primary .dsrt-panel__content a:hover {
	color: var(--dsrt-interior-link-hover-color, #ffd6a0);
}

.dsrt-interior .dsrt-panel__content p { margin: 1em 0; }
.dsrt-interior .dsrt-panel__content ul,
.dsrt-interior .dsrt-panel__content ol { margin: 1em 0; padding-left: 1.5em; }
.dsrt-interior .dsrt-panel__content li { margin: 0.35em 0; }
.dsrt-interior .dsrt-panel__content strong { color: var(--dsrt-interior-heading-color, #ffe8cc); font-weight: 700; }
.dsrt-interior .dsrt-panel__content em { font-style: italic; }

.dsrt-interior .dsrt-panel__content blockquote {
	border-left: 3px solid var(--dsrt-interior-link-color, #ffb86c);
	padding: 0.4em 0 0.4em 1.2em;
	margin: 1.4em 0;
	font-style: italic;
	color: rgba(255, 232, 204, 0.8);
}

.dsrt-interior .dsrt-panel__content pre,
.dsrt-interior .dsrt-panel__content code,
.dsrt-interior .dsrt-panel__content kbd {
	font-family: var(--ad-font-mono);
	font-size: 0.95em;
}
.dsrt-interior .dsrt-panel__content pre {
	background: rgba(0, 0, 0, 0.5);
	border: 1px solid rgba(255, 232, 204, 0.15);
	padding: 0.9em 1em;
	overflow-x: auto;
	line-height: 1.5;
}
.dsrt-interior .dsrt-panel__content code {
	background: rgba(0, 0, 0, 0.35);
	padding: 0.1em 0.35em;
	border-radius: 2px;
	color: #ffd6a0;
}

.dsrt-interior .dsrt-panel__content img,
.dsrt-interior .dsrt-panel__content figure img,
.dsrt-interior .dsrt-panel__hero img {
	max-width: 100%;
	height: auto;
	border: 1px solid rgba(255, 232, 204, 0.2);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
	display: block;
}
.dsrt-interior .dsrt-panel__hero {
	margin: 0 0 1.5em;
}
.dsrt-interior .dsrt-panel__content figure {
	margin: 1.4em 0;
}
.dsrt-interior .dsrt-panel__content figcaption {
	font-family: var(--ad-font-readout);
	font-size: 0.85em;
	color: rgba(255, 232, 204, 0.85);
	margin-top: 0.4em;
	text-align: center;
}

.dsrt-interior .dsrt-panel__content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.4em 0;
}
.dsrt-interior .dsrt-panel__content th,
.dsrt-interior .dsrt-panel__content td {
	padding: 0.5em 0.8em;
	border: 1px solid rgba(255, 232, 204, 0.15);
	text-align: left;
}
.dsrt-interior .dsrt-panel__content th {
	background: rgba(0, 0, 0, 0.3);
	font-family: var(--ad-font-readout);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--dsrt-interior-heading-color, #ffe8cc);
}

/* ---------------------------------------------------------------------------
 * 5. Post meta (single.php) + post navigation
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__meta {
	font-family: var(--ad-font-readout);
	font-size: 0.95rem;
	letter-spacing: 0.1em;
	color: rgba(255, 232, 204, 0.88);
	margin: 0 0 1.5em;
	text-transform: uppercase;
}
.dsrt-interior .dsrt-panel__meta-sep { margin: 0 0.5em; color: rgba(255, 232, 204, 0.35); }

.dsrt-interior .dsrt-panel__post-nav {
	margin-top: 2.5em;
	padding-top: 1.5em;
	border-top: 1px solid rgba(255, 232, 204, 0.15);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1em;
}
.dsrt-interior .dsrt-panel__post-nav-prev { text-align: left; }
.dsrt-interior .dsrt-panel__post-nav-next { text-align: right; }
.dsrt-interior .dsrt-panel__post-nav a {
	display: block;
	color: var(--dsrt-interior-link-color, #ffb86c);
	text-decoration: none;
	padding: 0.8em 1em;
	border: 1px solid rgba(255, 232, 204, 0.2);
	transition: border-color 200ms, background 200ms;
}
.dsrt-interior .dsrt-panel__post-nav a:hover {
	border-color: var(--dsrt-interior-link-color, #ffb86c);
	background: rgba(0, 0, 0, 0.25);
}
.dsrt-interior .dsrt-panel__post-nav-label {
	display: block;
	font-family: var(--ad-font-readout);
	font-size: 0.85rem;
	letter-spacing: 0.1em;
	opacity: 0.7;
	text-transform: uppercase;
}
.dsrt-interior .dsrt-panel__post-nav-title {
	display: block;
	font-family: var(--ad-font-body);
	font-size: 1rem;
	margin-top: 0.2em;
	color: var(--dsrt-interior-heading-color, #ffe8cc);
}

.dsrt-interior .dsrt-panel__tagnav {
	margin-top: 1.5em;
	font-family: var(--ad-font-readout);
	font-size: 0.9rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.dsrt-interior .dsrt-panel__tags {
	display: inline;
	padding: 0;
	margin: 0;
}
.dsrt-interior .dsrt-panel__tags li {
	display: inline;
	margin-right: 0.6em;
}
.dsrt-interior .dsrt-panel__tags a {
	color: rgba(255, 232, 204, 0.85);
	text-decoration: none;
	border-bottom: 1px dotted currentColor;
}
.dsrt-interior .dsrt-panel__tags a:hover { color: var(--dsrt-interior-link-color, #ffb86c); }

/* ---------------------------------------------------------------------------
 * 6. EDD product page (.dsrt-product)
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-product {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(20px, 3vw, 32px);
	margin-bottom: 2em;
	padding-bottom: 1.5em;
	border-bottom: 1px solid rgba(255, 232, 204, 0.15);
}
@media (min-width: 640px) {
	.dsrt-interior .dsrt-product {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		align-items: center;
	}
}

.dsrt-interior .dsrt-product__image {
	margin: 0;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border: 1px solid rgba(255, 232, 204, 0.25);
	background:
		radial-gradient(120% 80% at 80% -10%, var(--tile-glow, rgba(232, 168, 124, 0.25)) 0%, transparent 60%),
		linear-gradient(160deg, var(--tile-from, #2a1b3a) 0%, var(--tile-to, #120820) 100%);
}
.dsrt-interior .dsrt-product__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.dsrt-interior .dsrt-product__image--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsrt-interior .dsrt-product__monogram {
	font-family: var(--ad-font-display);
	font-size: clamp(3rem, 8vw, 5rem);
	color: var(--tile-ink, #ffe8cc);
	font-style: italic;
}

.dsrt-interior .dsrt-product__meta {
	display: flex;
	flex-direction: column;
	gap: 1em;
	align-items: flex-start;
}
.dsrt-interior .dsrt-product__price {
	display: inline-block;
	font-family: var(--ad-font-readout);
	font-size: 1.8rem;
	letter-spacing: 0.08em;
	padding: 0.15em 0.7em;
	background: var(--dsrt-interior-kicker-color, #ffb86c);
	color: #1a0e04;
	border-radius: 2px;
}
.dsrt-interior .dsrt-product__price--free {
	background: rgba(140, 230, 190, 0.92);
	color: #082017;
}

.dsrt-interior .dsrt-product__purchase { width: 100%; }

/* EDD purchase button — reuse homepage button color vars */
#primary .dsrt-interior .edd_download_purchase_form .edd-submit,
#primary .dsrt-interior .button.edd-add-to-cart,
#primary .dsrt-interior .edd-submit.button {
	display: inline-block;
	padding: 0.8em 1.6em;
	font-family: var(--ad-font-readout);
	font-size: 1.1rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background: var(--ad-btn-primary-bg, #2a1d0e);
	color: var(--ad-btn-primary-text, #ffe8cc);
	border: 1px solid rgba(255, 232, 204, 0.3);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.08),
		inset 0 -1px 0 rgba(0, 0, 0, 0.4);
	cursor: pointer;
	text-decoration: none;
	transition: background 200ms, color 200ms;
}
#primary .dsrt-interior .edd_download_purchase_form .edd-submit:hover,
#primary .dsrt-interior .button.edd-add-to-cart:hover,
#primary .dsrt-interior .edd-submit.button:hover {
	background: var(--ad-btn-primary-bg-hover, #4a3218);
	color: var(--ad-btn-primary-text-hover, #ffe8cc);
}

/* ---------------------------------------------------------------------------
 * 7. Related products rack (below product panel)
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-related {
	margin-top: 2em;
	background: var(--dsrt-interior-panel-bg, rgba(12, 7, 20, 0.82));
	border: 1px solid var(--dsrt-interior-panel-border, rgba(255, 232, 204, 0.35));
	padding: clamp(20px, 3vw, 32px);
}
.dsrt-interior .dsrt-related__header {
	margin-bottom: 1em;
	padding-bottom: 0.6em;
	border-bottom: 1px solid rgba(255, 232, 204, 0.12);
}
.dsrt-interior .dsrt-related__kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--ad-font-readout);
	font-size: 0.95rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--dsrt-interior-kicker-color, #ffb86c);
}
.dsrt-interior .dsrt-related__rack {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(12px, 2vw, 20px);
}
.dsrt-interior .dsrt-related__card {
	margin: 0;
}
.dsrt-interior .dsrt-related__link {
	display: block;
	text-decoration: none;
	color: inherit;
}
.dsrt-interior .dsrt-related__image {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border: 1px solid rgba(255, 232, 204, 0.25);
	margin-bottom: 0.5em;
	background:
		radial-gradient(120% 80% at 80% -10%, var(--tile-glow, rgba(232, 168, 124, 0.25)) 0%, transparent 60%),
		linear-gradient(160deg, var(--tile-from, #2a1b3a) 0%, var(--tile-to, #120820) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsrt-interior .dsrt-related__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.dsrt-interior .dsrt-related__monogram {
	font-family: var(--ad-font-display);
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	color: var(--tile-ink, #ffe8cc);
	font-style: italic;
}
#primary .dsrt-interior .dsrt-related__title {
	display: block;
	font-family: var(--ad-font-body);
	font-size: 0.95rem;
	color: var(--dsrt-interior-heading-color, #ffe8cc);
	line-height: 1.3;
}
.dsrt-interior .dsrt-related__link:hover .dsrt-related__title {
	color: var(--dsrt-interior-link-color, #ffb86c);
}

@media (max-width: 600px) {
	.dsrt-interior .dsrt-related__rack {
		grid-template-columns: 1fr;
		gap: 1em;
	}
}

/* ---------------------------------------------------------------------------
 * 8. Archive / search — post grid + post-card
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__lede {
	margin: 0 0 1.5em;
	color: rgba(255, 232, 204, 0.75);
	font-style: italic;
}

.dsrt-interior .dsrt-post-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: clamp(14px, 2.4vw, 24px);
}

.dsrt-interior .dsrt-post-card { margin: 0; }
.dsrt-interior .dsrt-post-card__link {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	height: 100%;
}
.dsrt-interior .dsrt-post-card__frame {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	border: 1px solid rgba(255, 232, 204, 0.2);
	background:
		radial-gradient(120% 80% at 80% -10%, var(--tile-glow, rgba(232, 168, 124, 0.25)) 0%, transparent 60%),
		linear-gradient(160deg, var(--tile-from, #2a1b3a) 0%, var(--tile-to, #120820) 100%);
}
.dsrt-interior .dsrt-post-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 400ms cubic-bezier(0.2, 0.8, 0.3, 1);
}
.dsrt-interior .dsrt-post-card__image--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
}
.dsrt-interior .dsrt-post-card__monogram {
	font-family: var(--ad-font-display);
	font-size: clamp(1.8rem, 4vw, 2.6rem);
	color: var(--tile-ink, #ffe8cc);
	font-style: italic;
}
.dsrt-interior .dsrt-post-card:hover .dsrt-post-card__image { transform: scale(1.05); }

.dsrt-interior .dsrt-post-card__body {
	padding: 0.8em 0.2em 0;
	display: flex;
	flex-direction: column;
	gap: 0.25em;
}
.dsrt-interior .dsrt-post-card__kicker {
	font-family: var(--ad-font-readout);
	font-size: 0.75rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--dsrt-interior-kicker-color, #ffb86c);
}
#primary .dsrt-interior .dsrt-post-card__title {
	font-family: var(--ad-font-body);
	font-size: 1.1rem;
	line-height: 1.25;
	color: var(--dsrt-interior-heading-color, #ffe8cc);
}
.dsrt-interior .dsrt-post-card__excerpt {
	font-size: 0.9rem;
	line-height: 1.5;
	color: rgba(255, 232, 204, 0.75);
}
.dsrt-interior .dsrt-post-card__date {
	font-family: var(--ad-font-readout);
	font-size: 0.8rem;
	color: rgba(255, 232, 204, 0.5);
	letter-spacing: 0.1em;
	margin-top: 0.2em;
}

/* ---------------------------------------------------------------------------
 * 9. Form inputs (comments, redownload shortcode, EDD checkout, search)
 * --------------------------------------------------------------------------- */

#primary .dsrt-interior input[type="text"],
#primary .dsrt-interior input[type="email"],
#primary .dsrt-interior input[type="password"],
#primary .dsrt-interior input[type="search"],
#primary .dsrt-interior input[type="tel"],
#primary .dsrt-interior input[type="number"],
#primary .dsrt-interior input[type="url"],
#primary .dsrt-interior textarea,
#primary .dsrt-interior select {
	display: block;
	width: 100%;
	font-family: var(--ad-font-body);
	font-size: 1rem;
	padding: 0.6em 0.8em;
	background: rgba(0, 0, 0, 0.4);
	border: 1px solid rgba(255, 232, 204, 0.25);
	color: var(--dsrt-interior-body-color, #e8dccc);
	border-radius: 2px;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4);
	transition: border-color 200ms, background 200ms;
}
#primary .dsrt-interior input:focus,
#primary .dsrt-interior textarea:focus,
#primary .dsrt-interior select:focus {
	outline: none;
	border-color: var(--dsrt-interior-link-color, #ffb86c);
	background: rgba(0, 0, 0, 0.55);
}
#primary .dsrt-interior label {
	display: block;
	font-family: var(--ad-font-readout);
	font-size: 0.95rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255, 232, 204, 0.8);
	margin-bottom: 0.4em;
	margin-top: 0.8em;
}
#primary .dsrt-interior button,
#primary .dsrt-interior input[type="submit"],
#primary .dsrt-interior input[type="button"],
#primary .dsrt-interior .button {
	display: inline-block;
	font-family: var(--ad-font-readout);
	font-size: 1rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.7em 1.4em;
	background: var(--ad-btn-primary-bg, #2a1d0e);
	color: var(--ad-btn-primary-text, #ffe8cc);
	border: 1px solid rgba(255, 232, 204, 0.3);
	cursor: pointer;
	transition: background 200ms;
}
#primary .dsrt-interior button:hover,
#primary .dsrt-interior input[type="submit"]:hover,
#primary .dsrt-interior .button:hover {
	background: var(--ad-btn-primary-bg-hover, #4a3218);
}

/* ---------------------------------------------------------------------------
 * 10. Pagination (archives + search)
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__pagination,
.dsrt-interior .navigation.pagination {
	margin-top: 2em;
	padding-top: 1em;
	border-top: 1px solid rgba(255, 232, 204, 0.15);
	display: flex;
	justify-content: center;
	gap: 0.5em;
	font-family: var(--ad-font-readout);
}
#primary .dsrt-interior .nav-links .page-numbers {
	display: inline-block;
	padding: 0.5em 0.9em;
	border: 1px solid rgba(255, 232, 204, 0.2);
	color: var(--dsrt-interior-body-color, #e8dccc);
	text-decoration: none;
	letter-spacing: 0.08em;
}
#primary .dsrt-interior .nav-links .page-numbers.current {
	background: var(--dsrt-interior-kicker-color, #ffb86c);
	color: #1a0e04;
	border-color: var(--dsrt-interior-kicker-color, #ffb86c);
}
#primary .dsrt-interior .nav-links a.page-numbers:hover {
	border-color: var(--dsrt-interior-link-color, #ffb86c);
}

/* ---------------------------------------------------------------------------
 * 11. Parent-theme cascade overrides for link + heading colors
 * --------------------------------------------------------------------------- */

#primary .dsrt-panel a,
#primary .dsrt-panel__content a {
	color: var(--dsrt-interior-link-color, #ffb86c);
}

#primary .dsrt-panel h1,
#primary .dsrt-panel h2,
#primary .dsrt-panel h3,
#primary .dsrt-panel h4,
#primary .dsrt-panel h5,
#primary .dsrt-panel h6 {
	color: var(--dsrt-interior-heading-color, #ffe8cc);
}

/* ---------------------------------------------------------------------------
 * 12. Empty / error states
 * --------------------------------------------------------------------------- */

.dsrt-interior .dsrt-panel__empty {
	padding: 2em;
	text-align: center;
	color: rgba(255, 232, 204, 0.9);
	font-style: italic;
}

/* ---------------------------------------------------------------------------
 * 13. Mobile breakpoints
 * --------------------------------------------------------------------------- */

@media (max-width: 600px) {
	.dsrt-interior {
		margin: clamp(16px, 4vw, 32px) auto;
		padding: 0 clamp(8px, 3vw, 16px);
	}
	.dsrt-interior .dsrt-panel { padding: clamp(16px, 4vw, 24px); }
	.dsrt-interior .dsrt-panel__post-nav {
		grid-template-columns: 1fr;
	}
	.dsrt-interior .dsrt-panel__post-nav-next { text-align: left; }
}

/* ---------------------------------------------------------------------------
 * 14. Prefers-reduced-motion
 * --------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.dsrt-interior .dsrt-post-card__image { transition: none; }
	.dsrt-interior .dsrt-post-card:hover .dsrt-post-card__image { transform: none; }
	.dsrt-interior .dsrt-panel__back,
	.dsrt-interior .dsrt-panel__post-nav a,
	.dsrt-interior #primary input,
	.dsrt-interior button { transition: none; }
}

/* ---------------------------------------------------------------------------
 * 15. Print
 * --------------------------------------------------------------------------- */

@media print {
	body.dsrt-interior-panel #webgl-background,
	body.dsrt-interior-panel .dsrt-panel__back,
	body.dsrt-interior-panel .dsrt-panel__post-nav,
	body.dsrt-interior-panel .dsrt-related,
	body.dsrt-interior-panel .dsrt-product__purchase,
	body.dsrt-interior-panel #dsrt-zen-toggle,
	body.dsrt-interior-panel .site-navigation,
	body.dsrt-interior-panel .main-navigation,
	body.dsrt-interior-panel .mobile-nav-bar,
	body.dsrt-interior-panel .site-footer-wrap { display: none !important; }

	body.dsrt-interior-panel,
	body.dsrt-interior-panel .dsrt-interior,
	body.dsrt-interior-panel .dsrt-panel {
		background: white !important;
		color: black !important;
		border: none !important;
		box-shadow: none !important;
	}
	body.dsrt-interior-panel .dsrt-panel__title,
	body.dsrt-interior-panel .dsrt-panel__content h1,
	body.dsrt-interior-panel .dsrt-panel__content h2,
	body.dsrt-interior-panel .dsrt-panel__content h3 { color: black !important; }
	body.dsrt-interior-panel .dsrt-panel__content a { color: #222 !important; text-decoration: underline; }
	body.dsrt-interior-panel .dsrt-panel__content { font-size: 11pt; line-height: 1.5; }
}

/* ===========================================================================
 * 16. Filmstrip rails — vertical 35mm-tape edges
 * =========================================================================== */

.dsrt-film-rail {
	position: fixed;
	top: 0;
	bottom: 0;
	width: var(--dsrt-rail-width, 64px);
	background-color: #0a0a0a;
	background-image: repeating-linear-gradient(
		0deg,
		rgba(255, 255, 255, 0.015) 0 1px,
		transparent 1px 2px
	);
	z-index: 1;
	pointer-events: none;
}
.dsrt-film-rail--left  { left: 0; border-right: 1px solid rgba(232, 168, 124, 0.18); }
.dsrt-film-rail--right { right: 0; border-left:  1px solid rgba(232, 168, 124, 0.18); }

/* Sprocket-hole layer: solid black rail with mask cutting transparent
   rectangles at regular intervals. WebGL shows through the cuts. */
.dsrt-film-rail__perfs {
	position: absolute;
	top: 0;
	bottom: 0;
	width: calc(var(--dsrt-rail-width, 64px) - 14px);
	background-color: #0a0a0a;
	-webkit-mask-image: repeating-linear-gradient(
		180deg,
		black 0 var(--dsrt-perf-h, 16px),
		transparent var(--dsrt-perf-h, 16px) calc(var(--dsrt-perf-h, 16px) + var(--dsrt-perf-gap, 20px))
	);
	mask-image: repeating-linear-gradient(
		180deg,
		black 0 var(--dsrt-perf-h, 16px),
		transparent var(--dsrt-perf-h, 16px) calc(var(--dsrt-perf-h, 16px) + var(--dsrt-perf-gap, 20px))
	);
	transform: translateY(calc(var(--scroll-progress, 0) * -0.3px));
	will-change: transform;
}
.dsrt-film-rail--left  .dsrt-film-rail__perfs { left:  14px; }
.dsrt-film-rail--right .dsrt-film-rail__perfs { right: 14px; }

/* Edge-code text running vertically along inner edge (uses writing-mode,
   not transform: rotate, for cleaner cross-browser line behaviour). */
.dsrt-film-rail__edge-code {
	position: absolute;
	top: 24px;
	bottom: 24px;
	font-family: var(--ad-font-readout);
	font-size: 0.65rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgba(232, 168, 124, var(--dsrt-edge-code-opacity, 0.35));
	white-space: nowrap;
	overflow: hidden;
	writing-mode: vertical-rl;
	pointer-events: none;
}
.dsrt-film-rail--left  .dsrt-film-rail__edge-code { right: 2px; }
.dsrt-film-rail--right .dsrt-film-rail__edge-code { left: 2px; transform: rotate(180deg); }

/* Mobile: shrink rails, hide edge-code, use a constant CSS animation
   instead of scroll-driven transform to save battery. */
@media (max-width: 600px) {
	.dsrt-film-rail { width: 32px; }
	.dsrt-film-rail__perfs {
		width: calc(32px - 8px);
		animation: dsrt-perf-scroll 6s linear infinite;
		transform: none;
	}
	.dsrt-film-rail--left  .dsrt-film-rail__perfs { left:  8px; }
	.dsrt-film-rail--right .dsrt-film-rail__perfs { right: 8px; }
	.dsrt-film-rail__edge-code { display: none; }
}
@keyframes dsrt-perf-scroll {
	from { transform: translateY(0); }
	to   { transform: translateY(calc(-1 * (var(--dsrt-perf-h, 16px) + var(--dsrt-perf-gap, 20px)))); }
}

/* Tiny screens: hide rails entirely. */
@media (max-width: 380px) {
	.dsrt-film-rail { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.dsrt-film-rail__perfs { transform: none !important; animation: none !important; }
}

/* High-contrast / forced-colors fallback */
@media (forced-colors: active) {
	.dsrt-film-rail__perfs {
		-webkit-mask-image: none;
		mask-image: none;
	}
}

/* ===========================================================================
 * 17. Rack-unit header — fixed top strip on interior pages
 * =========================================================================== */

body.dsrt-interior-panel {
	padding-top: var(--dsrt-rack-h-height, 64px);
}

.dsrt-rack-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: var(--dsrt-rack-h-height, 64px);
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: clamp(8px, 1.5vw, 16px);
	padding: 0 calc(var(--dsrt-rail-width, 64px) + clamp(12px, 2vw, 24px));
	background:
		repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 3px),
		linear-gradient(180deg, #16171c 0%, #0a0a0a 100%);
	border-bottom: 1px solid rgba(0, 0, 0, 0.6);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.08),
		0 8px 24px rgba(0, 0, 0, 0.35);
	z-index: 50;
}

/* Brand chrome plate */
.dsrt-rack-header__brand {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
}
.dsrt-rack-header__plate {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	background: linear-gradient(180deg, #c2c4c8 0%, #b8b9bd 100%);
	border-radius: 2px;
	color: #2a1b0b;
	min-height: 32px;
}
.dsrt-rack-header__wordmark {
	font-family: var(--ad-font-display, Georgia, serif);
	font-size: clamp(0.95rem, 1.6vw, 1.2rem);
	letter-spacing: 0.02em;
	color: #2a1b0b;
}
.dsrt-rack-header__wordmark em {
	font-style: italic;
	margin-left: 0.3em;
	color: #5c2d24;
}

/* Nav menu */
.dsrt-rack-header__nav { min-width: 0; }
.dsrt-rack-header__menu {
	list-style: none;
	display: flex;
	gap: clamp(12px, 2vw, 28px);
	margin: 0;
	padding: 0;
	justify-content: center;
}
.dsrt-rack-header__menu li {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}
.dsrt-rack-header__menu li .dsrt-led {
	width: 6px !important;
	height: 6px !important;
	background: rgba(232, 168, 124, 0.25);
	box-shadow: none;
	transition: background 200ms, box-shadow 200ms;
}
.dsrt-rack-header__menu li.current-menu-item .dsrt-led,
.dsrt-rack-header__menu li:hover .dsrt-led {
	background: var(--ad-led-amber, #ffb86c);
	box-shadow: 0 0 6px var(--ad-led-amber, #ffb86c);
}
.dsrt-rack-header__menu a {
	font-family: var(--ad-font-readout, monospace);
	font-size: 0.95rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #f0ead8;
	text-decoration: none;
}
.dsrt-rack-header__menu a:hover { color: #ffe8cc; }

/* Hardware (knob + LED bar) — only ≥768px */
.dsrt-rack-header__hardware { display: none; align-items: center; gap: 12px; }
@media (min-width: 768px) {
	.dsrt-rack-header__hardware { display: inline-flex; }
}

/* Mobile hamburger (CSS-only via :checked sibling selector) */
.dsrt-rack-header__hamburger {
	display: none;
	width: 40px;
	height: 40px;
	cursor: pointer;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	padding: 8px 10px;
	box-sizing: border-box;
}
.dsrt-rack-header__hamburger span {
	display: block;
	height: 2px;
	background: #f0ead8;
	border-radius: 1px;
	transition: transform 200ms, opacity 200ms;
}
@media (max-width: 600px) {
	.dsrt-rack-header { height: 48px; --dsrt-rack-h-height: 48px; padding: 0 8px; }
	body.dsrt-interior-panel { padding-top: 48px; }
	.dsrt-rack-header__nav { display: none; }
	.dsrt-rack-header__hamburger { display: flex; }
	.dsrt-rack-header__hardware { display: none; }
	.dsrt-rack-toggle:checked ~ .dsrt-rack-header__nav,
	#dsrt-rack-toggle:checked ~ .dsrt-rack-header__nav {
		display: flex;
		position: fixed;
		top: 48px;
		left: 0;
		right: 0;
		flex-direction: column;
		background: rgba(10, 10, 10, 0.96);
		padding: 16px;
		z-index: 49;
	}
	#dsrt-rack-toggle:checked ~ .dsrt-rack-header__nav .dsrt-rack-header__menu {
		flex-direction: column;
		gap: 14px;
	}
}
@media (max-width: 380px) {
	.dsrt-rack-header { height: 44px; padding: 0 6px; }
	body.dsrt-interior-panel { padding-top: 44px; }
}

/* ===========================================================================
 * 18. Rack-unit footer — bottom of body, mirrors header aesthetic
 * =========================================================================== */

.dsrt-rack-footer {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: clamp(12px, 2vw, 24px);
	padding: 0 calc(var(--dsrt-rail-width, 64px) + clamp(12px, 2vw, 24px));
	min-height: var(--dsrt-rack-f-height, 56px);
	background:
		repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 3px),
		linear-gradient(180deg, #16171c 0%, #0a0a0a 100%);
	border-top: 1px solid rgba(0, 0, 0, 0.6);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.08),
		0 -8px 24px rgba(0, 0, 0, 0.35);
	margin-top: clamp(40px, 6vw, 80px);
}

.dsrt-rack-footer__signal { display: inline-flex; align-items: center; }

.dsrt-rack-footer__legal {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	font-family: var(--ad-font-readout, monospace);
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(232, 168, 124, 0.6);
	text-align: center;
}
.dsrt-rack-footer__copyright { color: rgba(232, 168, 124, 0.7); }
.dsrt-rack-footer__links {
	display: inline-flex;
	gap: 0.6em;
	flex-wrap: wrap;
	justify-content: center;
}
.dsrt-rack-footer__links a {
	color: var(--dsrt-interior-link-color, #ffb86c);
	text-decoration: none;
}
.dsrt-rack-footer__links a:hover { color: var(--dsrt-interior-link-hover-color, #ffd6a0); }

.dsrt-rack-footer__reels { display: inline-flex; align-items: center; gap: 12px; }

@media (max-width: 600px) {
	.dsrt-rack-footer { padding: 8px 12px; gap: 8px; min-height: 64px; }
	.dsrt-rack-footer__reels { display: none; }
	.dsrt-rack-footer__signal .dsrt-led-bar { padding: 2px 3px; }
	.dsrt-rack-footer__signal .dsrt-led-bar__seg { width: 4px; height: 12px; }
	.dsrt-rack-footer__legal { font-size: 0.7rem; }
}
@media (max-width: 380px) {
	.dsrt-rack-footer__signal { display: none; }
	.dsrt-rack-footer { grid-template-columns: 1fr; }
}

