:root {
    --warm-yellow: color(display-p3 1 0.83 0.2);
}

html[data-theme='tim']{
	--rem: 15px;
	--navpos: absolute;
	--width: 800px;
    --font-p: 1.4em/1.7 Inter, "Helvetica Neue", system-ui, sans-serif;
    --font-h: 1.4em/1.5 "Inter Display", "Inter Tight", Inter, system-ui, sans-serif;
    --font-c: .9em/1.4 ui-monospace, "SF Mono", "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;
	--ornament: "∞∞∞";
	--border: 1px solid var(--cmed);
	/* foreground   | background color */
	--cfg:   #111;    --cbg:    #fffff8;
	--cdark: #111;    --clight: #fffff8;
	--cmed: #f2c94c;
	--clink: #111;
	--cemph: #111;
	--muted: #6b7280;
}

/* Fix: mobile navbar overflow */
@media (max-width: 40rem) {
	:root, html[data-theme='tim'] { --navpos: relative; }
}

/* ---- Shared quiet-link style ----
   One voice for backlinks, tags, and the filter nav:
   muted text, darken + underline on hover, yellow # markers. */

.section-title,
.backlinks-title {
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 2rem 0 0.75rem;
	padding-top: 1rem;
}

.quiet-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin: 0 0 1.5rem;
	padding: 0;
	font-size: 0.9rem;
}

.quiet-list a {
	color: var(--muted);
	text-decoration: none;
	transition: color 0.15s ease;
}

.quiet-list a:hover {
	color: var(--cfg);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.marker::before {
	content: "# ";
	color: var(--cmed);
}

/* ---- Backlinks ---- */
.backlinks {
	margin-top: 2.5rem;
}

.backlink-link {
	font-weight: 500;
}

.backlink-preview {
	color: var(--muted);
}

.backlinks-empty {
	font-size: 0.9rem;
	color: var(--muted);
	font-style: italic;
}

/* ---- Tag filter nav ---- */
.tag-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem 1rem;
	margin: 1.5rem 0;
	padding: 0;
	font-size: 0.85rem;
	color: var(--muted);
}

.tag-btn {
	appearance: none;
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	cursor: pointer;
	font: inherit;
	color: var(--muted);
}

.tag-btn:hover {
	color: var(--cfg);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.tag-btn.is-active {
	color: var(--cfg);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: var(--cmed);
	text-decoration-thickness: 0.15em;
	text-underline-offset: 0.25em;
}

/* ---- Tags in note previews ---- */
.tag-list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.1rem 0.75rem;
	margin: 0.5rem 0 0;
	padding: 0;
	font-size: 0.8rem;
}

.tag-list li::before {
	content: "#";
	color: var(--cmed);
}

.tag-list a {
	color: var(--muted);
	text-decoration: none;
}

.tag-list a:hover {
	color: var(--cfg);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

article[hidden] {
	display: none;
}

section.footnotes { 
	color: var(--muted);
	font-size: 0.8rem; 
}

section.footnotes:after {
	display: none;
}