:root {
	--ink:        #0a0906;
	--ink-2:      #121008;
	--ink-3:      #1a170f;
	--ink-4:      #23201a;
	--rule:       #2a2720;
	--rule-soft:  #1a1813;
	--paper:      #f5f1e8;
	--paper-dim:  #a8a295;
	--paper-mute: #6b675e;
	--oxide:      #ff3d00;
	--oxide-dim:  #c2301f;
	--acid:       #d4ff00;

	--serif: "Fraunces", "Times New Roman", Georgia, serif;
	--mono:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

	--gutter: clamp(1.25rem, 4vw, 3rem);
	--measure: 68ch;

	--rule-thin: 1px solid var(--rule);
	--rule-thin-soft: 1px solid var(--rule-soft);

	color-scheme: dark;
}

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

html, body {
	margin: 0;
	padding: 0;
	min-height: 100%;
}

body {
	background: var(--ink);
	color: var(--paper);
	font-family: var(--mono);
	font-size: 14px;
	line-height: 1.55;
	font-feature-settings: "ss01", "ss02", "cv11";
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;

	background-image:
		radial-gradient(ellipse 90% 60% at 20% 0%, rgba(255, 61, 0, 0.07), transparent 70%),
		radial-gradient(ellipse 70% 50% at 110% 10%, rgba(212, 255, 0, 0.03), transparent 60%),
		url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.96 0 0 0 0 0.94 0 0 0 0 0.91 0 0 0 0.035 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
	background-attachment: fixed;
}

::selection { background: var(--oxide); color: var(--ink); }

a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color .25s ease, color .25s ease;
}
a:hover { border-bottom-color: var(--oxide); color: var(--oxide); }

button {
	font: inherit;
	color: inherit;
	background: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
}

input {
	font: inherit;
	color: inherit;
	background: transparent;
	border: none;
	outline: none;
}

img { max-width: 100%; display: block; }
hr { border: none; border-top: var(--rule-thin-soft); margin: 0; }
h1, h2, h3, h4, h5, h6, p { margin: 0; }

.mono { font-family: var(--mono); }
.serif { font-family: var(--serif); }
.caps {
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-size: 11px;
	font-weight: 500;
}
.dim { color: var(--paper-dim); }
.mute { color: var(--paper-mute); }
.accent { color: var(--oxide); }

/* Native audio player fallback styling — hidden when custom player is used */
audio { display: none; }
