:root {
	--dark0_x: 33, 31, 28; /* deeper warm charcoal */
	--dark0: rgb(var(--dark0_x));
	--dark1_x: 46, 43, 39;
	--dark1: rgb(var(--dark1_x));
	--dark2_x: 61, 56, 50;
	--dark2: rgb(var(--dark2_x));
	--dark3_x: 79, 72, 64;
	--dark3: rgb(var(--dark3_x));

	--light0_x: 236, 227, 212; 
	--light0: rgb(var(--light0_x));
	--light1_x: 243, 237, 227;
	--light1: rgb(var(--light1_x));
	--light2_x: 248, 244, 235;
	--light2: rgb(var(--light2_x));
	--light3_x: 255, 255, 255; 
	--light3: rgb(var(--light3_x));

	--frost0_x: 125, 170, 187; 
	--frost0: rgb(var(--frost0_x));
	--frost1_x: 117, 154, 204;
	--frost1: rgb(var(--frost1_x));
	--frost2_x: 98, 129, 180;
	--frost2: rgb(var(--frost2_x));
	--frost3_x: 78, 104, 150;
	--frost3: rgb(var(--frost3_x));

	--red_x: 196, 92, 69; 
	--red: rgb(var(--red_x));
	--orange_x: 217, 142, 78;
	--orange: rgb(var(--orange_x));
	--yellow_x: 227, 176, 78;
	--yellow: rgb(var(--yellow_x));
	--green_x: 135, 162, 113;
	--green: rgb(var(--green_x));
	--purple_x: 174, 124, 112;
	--purple: rgb(var(--purple_x));
}

body {
	--accent-h: 16; 
	--accent-s: 42%;
	--accent-l: 56%;
	--font-heading-theme:
		"Fraunces", "Iowan Old Style", "Palatino Linotype", "Book Antiqua",
		serif;

	--font-interface-theme:
		"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-text-theme:
		"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-monospace-theme:
		ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
		"Liberation Mono", "Courier New", monospace;

	--radius-s: 0;
	--radius-m: 0;
	--radius-l: 0;

	--link-decoration: none;
	--link-decoration-hover: none;
	--link-external-decoration: none;
	--link-external-decoration-hover: none;

	--tag-decoration: none;
	--tag-decoration-hover: underline;
	--tag-padding-x: 0.5em;
	--tag-padding-y: 0.2em;
	--tag-radius: 0.5em;

	--tab-font-weight: 600;
	--bold-weight: 600;

	--checkbox-radius: 0;

	

	--embed-border-left: 6px double var(--interactive-accent);
}

.theme-dark {
	--red_x: 220, 118, 95;
	--orange_x: 235, 160, 95;
	--yellow_x: 240, 196, 100;
	--green_x: 160, 188, 132;
	--purple_x: 196, 146, 134;
	--frost0_x: 145, 193, 205;
	--frost1_x: 136, 178, 221;
	--frost2_x: 118, 151, 204;
	--frost3_x: 110, 140, 190;

	--color-red-rgb: var(--red_x);
	--color-red: var(--red);
	--color-purple-rgb: var(--purple_x);
	--color-purple: var(--purple);
	--color-green-rgb: var(--green_x);
	--color-green: var(--green);
	--color-cyan-rgb: var(--frost1_x);
	--color-cyan: var(--frost1);
	--color-blue-rgb: var(--frost3_x);
	--color-blue: var(--frost3);
	--color-yellow-rgb: var(--yellow_x);
	--color-yellow: var(--yellow);
	--color-orange-rgb: var(--orange_x);
	--color-orange: var(--orange);
	

	--background-primary: var(--dark0);
	--background-primary-alt: var(--dark1);
	--background-secondary: var(--dark2);
	--background-secondary-alt: var(--dark2);
	--background-modifier-border: var(--dark3);

	--cursor-line-background: rgba(var(--red_x), 0.2);

	--text-normal: var(--light2);
	--text-faint: var(--light1);
	--text-muted: var(--light0);

	--link-url: var(--frost1);
	--link-url-hover: var(--frost0);

	--h1-color: var(--red);
	--h2-color: var(--orange);
	--h3-color: var(--green);
	--h4-color: var(--frost1);
	--h5-color: var(--frost0);
	--h6-color: var(--frost2);

	--text-highlight-bg: rgba(var(--yellow_x), 0.8);
	--text-highlight-fg: var(--dark0);

	--text-accent: var(--red);
	--text-accent-hover: var(--frost2);

	--tag-color: var(--light2);
	--tag-background: rgba(var(--red_x), 0.2);
	--tag-background-hover: rgba(var(--red_x), 0.32);

	--titlebar-text-color-focused: var(--red);

	--inline-title-color: var(--orange);

	--bold-color: var(--orange);
	--italic-color: var(--orange);

	--checkbox-color: var(--frost0);
	--checkbox-color-hover: var(--frost0);
	--checkbox-border-color: var(--frost0);
	--checkbox-border-color-hover: var(--frost0);
	--checklist-done-color: rgba(var(--light2_x), 0.5);

	--table-header-background: var(--dark2);
	--table-header-background-hover: var(--dark3);
	--table-row-even-background: rgba(var(--dark3_x), 0.45);
	--table-row-odd-background: rgba(var(--dark3_x), 0.25);
	--table-row-background-hover: var(--dark3);

	--text-selection: rgba(var(--red_x), 0.6);
	--flashing-background: rgba(var(--red_x), 0.3);

	--code-normal: var(--yellow);
	--code-background: var(--dark1);
	--inline-code-background: rgba(var(--light2_x), 0.09);
	--inline-code-border: rgba(var(--yellow_x), 0.34);

	--mermaid-note: var(--frost3);
	--mermaid-loopline: var(--frost1);
	--mermaid-exclude: var(--dark3);
	--mermaid-seqnum: var(--dark0);

	--icon-color-hover: var(--orange);
	--icon-color-focused: var(--frost2);

	--nav-item-color-hover: var(--orange);
	--nav-item-color-active: var(--frost2);
	--nav-file-tag: rgba(var(--orange_x), 0.95);

	--graph-line: var(--dark3);
	--graph-node: var(--light3);
	--graph-node-tag: var(--red);
	--graph-node-attachment: var(--green);

	--calendar-hover: var(--orange);
	--calendar-background-hover: var(--dark3);
	--calendar-week: var(--orange);
	--calendar-today: var(--yellow);

	--dataview-key: var(--text-faint);
	--dataview-key-background: rgba(var(--frost2_x), 0.3);
	--dataview-value: var(--text-faint);
	--dataview-value-background: rgba(var(--red_x), 0.3);

	--tab-text-color-focused-active: var(--frost2);
	--tab-text-color-focused-active-current: var(--orange);
}

.theme-light {
	--red_x: 146, 68, 54;
	--orange_x: 145, 90, 45;
	--yellow_x: 125, 100, 35;
	--green_x: 86, 120, 80;
	--purple_x: 142, 101, 92;
	--frost0_x: 64, 108, 128;
	--frost1_x: 64, 110, 165;
	--frost2_x: 56, 90, 138;
	--frost3_x: 48, 78, 122;

	--color-red-rgb: var(--red_x);
	--color-red: var(--red);
	--color-purple-rgb: var(--purple_x);
	--color-purple: var(--purple);
	--color-green-rgb: var(--green_x);
	--color-green: var(--green);
	--color-cyan-rgb: var(--frost1_x);
	--color-cyan: var(--frost1);
	--color-blue-rgb: var(--frost3_x);
	--color-blue: var(--frost3);
	--color-yellow-rgb: var(--yellow_x);
	--color-yellow: var(--yellow);
	--color-orange-rgb: var(--orange_x);
	--color-orange: var(--orange);
	

	--background-primary: var(--light2);
	--background-primary-alt: var(--light3);
	--background-secondary: var(--light1);
	--background-secondary-alt: var(--light0);
	--background-modifier-border: rgba(var(--dark3_x), 0.2);

	--cursor-line-background: rgba(var(--red_x), 0.1);

	--text-normal: var(--dark2);
	--text-faint: var(--dark1);
	--text-muted: var(--dark3);

	--link-url: var(--frost3);
	--link-url-hover: var(--red);

	--h1-color: var(--red);
	--h2-color: var(--orange);
	--h3-color: var(--green);
	--h4-color: var(--frost2);
	--h5-color: var(--frost0);
	--h6-color: var(--frost3);

	--text-highlight-bg: rgba(var(--yellow_x), 0.75);
	--text-highlight-fg: var(--dark0);

	--text-accent: var(--red);
	--text-accent-hover: var(--frost2);

	--tag-color: var(--dark2);
	--tag-background: rgba(var(--red_x), 0.13);
	--tag-background-hover: rgba(var(--red_x), 0.22);

	--titlebar-text-color-focused: var(--red);

	--inline-title-color: var(--orange);

	--bold-color: var(--green);
	--italic-color: var(--green);

	--checkbox-color: var(--frost2);
	--checkbox-color-hover: var(--frost2);
	--checkbox-border-color: var(--frost2);
	--checkbox-border-color-hover: var(--frost2);
	--checklist-done-color: rgba(var(--dark2_x), 0.4);

	--table-header-background: rgba(var(--yellow_x), 0.2);
	--table-header-background-hover: var(--frost2);
	--table-row-even-background: rgba(var(--light1_x), 0.72);
	--table-row-odd-background: rgba(var(--light3_x), 1);
	--table-row-background-hover: var(--frost2);

	--text-selection: rgba(var(--red_x), 0.6);
	--flashing-background: rgba(var(--red_x), 0.3);

	--code-normal: var(--frost3);
	--code-background: var(--light2);
	--inline-code-background: rgba(var(--yellow_x), 0.14);
	--inline-code-border: rgba(var(--orange_x), 0.36);

	--mermaid-note: var(--frost0);
	--mermaid-loopline: var(--frost1);
	--mermaid-exclude: var(--light0);
	--mermaid-seqnum: var(--light0);

	--icon-color-hover: var(--orange);
	--icon-color-focused: var(--frost3);

	--nav-item-color-hover: var(--orange);
	--nav-item-color-active: var(--frost2);
	--nav-file-tag: rgba(var(--orange_x), 0.9);

	--graph-line: var(--light0);
	--graph-node: var(--dark3);
	--graph-node-tag: var(--red);
	--graph-node-attachment: var(--green);

	--calendar-hover: var(--orange);
	--calendar-background-hover: var(--light0);
	--calendar-week: var(--orange);
	--calendar-today: var(--orange);

	--dataview-key: var(--text-faint);
	--dataview-key-background: rgba(var(--frost2_x), 0.3);
	--dataview-value: var(--text-faint);
	--dataview-value-background: rgba(var(--red_x), 0.3);

	--tab-text-color-focused-active: var(--frost2);
	--tab-text-color-focused-active-current: var(--orange);
}

table {
	border: 1px solid var(--background-secondary);
	border-collapse: collapse;
}

thead {
	border-bottom: 2px solid var(--background-modifier-border);
}

th {
	font-weight: 600;
	border: 1px solid var(--background-secondary);
}

td {
	border-left: 1px solid var(--background-secondary);
	border-right: 1px solid var(--background-secondary);
	border-bottom: 1px solid var(--background-secondary);
}

.markdown-rendered tbody tr:nth-child(even) {
	background-color: var(--table-row-even-background);
}

.markdown-rendered tbody tr:nth-child(odd) {
	background-color: var(--table-row-odd-background);
}

.markdown-rendered tbody tr:nth-child(even):hover,
.markdown-rendered tbody tr:nth-child(odd):hover {
	background-color: var(--table-row-background-hover);
}

.markdown-rendered mark {
	background-color: var(--text-highlight-bg);
	color: var(--text-highlight-fg);
}

.markdown-rendered mark a {
	color: var(--red);
	font-weight: 600;
}

.search-result-file-matched-text {
	color: var(--text-highlight-fg);
}

.cm-hashtag-begin:hover,
.cm-hashtag-end:hover {
	color: var(--text-accent);
	
	text-decoration: underline;
}

input[type="checkbox"] {
	border: 1px solid var(--checkbox-color);
}

input[type="checkbox"]:checked {
	background-color: var(--checkbox-color);
	box-shadow: inset 0 0 0 2px var(--background-primary);
}

input[type="checkbox"]:checked:after {
	display: none;
}

code[class*="language-"],
pre[class*="language-"] {
	line-height: var(--line-height-tight);
}

.cm-url {
	color: var(--link-url);
}

.cm-url:hover {
	color: var(--link-url-hover, var(--text-accent-hover));
}

.markdown-rendered a,
.cm-link .cm-underline,
.external-link {
	text-decoration: none;
	box-shadow: inset 0 -1px 0 currentColor;
}

.markdown-rendered a:hover,
.external-link:hover {
	color: var(--link-url-hover, var(--text-accent-hover));
}


.cm-highlight {
	color: var(--text-highlight-fg);
}

.markdown-rendered :is(h1, h2, h3, h4, h5, h6),
.HyperMD-header {
	font-family: var(--font-heading-theme);
	letter-spacing: -0.01em;
}

.markdown-rendered h1,
.HyperMD-header-1 {
	font-size: clamp(1.82rem, 1.6rem + 0.78vw, 2.28rem);
	line-height: 1.15;
	font-weight: 700;
}

.markdown-rendered h2,
.HyperMD-header-2 {
	font-size: clamp(1.5rem, 1.35rem + 0.52vw, 1.82rem);
	line-height: 1.2;
	font-weight: 680;
}

.markdown-rendered h3,
.HyperMD-header-3 {
	font-size: clamp(1.28rem, 1.2rem + 0.35vw, 1.5rem);
	line-height: 1.25;
	font-weight: 650;
}

.markdown-rendered h4,
.HyperMD-header-4 {
	font-size: clamp(1.13rem, 1.08rem + 0.22vw, 1.24rem);
	line-height: 1.3;
	font-weight: 620;
}

.markdown-rendered h5,
.HyperMD-header-5 {
	font-size: 1.02rem;
	line-height: 1.34;
	font-weight: 600;
}

.markdown-rendered h6,
.HyperMD-header-6 {
	font-size: 0.94rem;
	line-height: 1.38;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}


.cm-inline-code {
	color: var(--code-normal);
	background-color: var(--inline-code-background);
	border-top: 1px solid var(--inline-code-border);
	border-bottom: 1px solid var(--inline-code-border);
	border-radius: var(--radius-s);
	font-size: var(--code-size);
	padding: 0.1em 0.25em;
}

.markdown-rendered :not(pre) > code {
	color: var(--code-normal);
	background-color: var(--inline-code-background);
	border: 1px solid var(--inline-code-border);
	border-radius: var(--radius-s);
	padding: 0.1em 0.3em;
}

.cm-formatting-code + .cm-inline-code {
	border-radius: 0;
	padding: 0.1em 0;
}

.cm-formatting-code {
	background-color: var(--inline-code-background);
	border-top: 1px solid var(--inline-code-border);
	border-bottom: 1px solid var(--inline-code-border);
	border-left: 1px solid var(--inline-code-border);
	border-radius: var(--radius-s) 0 0 var(--radius-s);
	padding: 0.1em 0 0.1em 0.25em;
}

.cm-inline-code + .cm-formatting-code {
	border-right: 1px solid var(--inline-code-border);
	border-radius: 0 var(--radius-s) var(--radius-s) 0;
	padding: 0.1em 0.25em 0.1em 0;
}

.cm-line .cm-strong {
	color: var(--bold-color);
}







.mermaid .note {
	fill: var(--mermaid-note);
}

.mermaid .loopLine {
	stroke: var(--mermaid-loopline);
}

.mermaid .loopText > tspan,
.mermaid .entityLabel {
	fill: var(--red);
}

.mermaid .exclude-range {
	fill: var(--mermaid-exclude);
}

.mermaid .sequenceNumber {
	fill: var(--mermaid-seqnum);
}

.calendar .week-num {
	color: var(--calendar-week);
}

.calendar .today {
	color: var(--calendar-today);
}

.calendar .week-num:hover,
.calendar .day:hover {
	color: var(--calendar-hover);
	background-color: var(--calendar-background-hover);
}

.markdown-embed-title {
	color: var(--yellow);
	font-weight: 600;
}

.cm-active {
	background-color: var(--cursor-line-background);
}

.nav-file-tag {
	color: var(--nav-file-tag);
}

.is-flashing {
	background-color: var(--flashing-background);
}

.dataview.inline-field-key {
	border-top-left-radius: var(--radius-s);
	border-bottom-left-radius: var(--radius-s);
	padding-left: 4px;
	font-family: var(--font-monospace);
	font-size: var(--font-smaller);
	color: var(--dataview-key);
	background-color: var(--dataview-key-background);
}

.dataview.inline-field-value {
	border-top-right-radius: var(--radius-s);
	border-bottom-right-radius: var(--radius-s);
	padding-right: 4px;
	font-family: var(--font-monospace);
	font-size: var(--font-smaller);
	color: var(--dataview-value);
	background-color: var(--dataview-value-background);
}

.suggestion-highlight {
	color: var(--red);
}