mr-md 1.0.4 → 2.0.0-beta

package/dist/styles/theme-neo.css

@@ -0,0 +1,1369 @@
+
+:root {
+	color-scheme: light;
+	--font-sans:
+		"Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+	--font-display: "Syne", Georgia, serif;
+	--font-mono:
+		"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+		monospace;
+
+	--bg: #f4f4f0;
+	--paper: #ffffff;
+	--panel: #ffffff;
+	--panel-strong: #e4e4e0;
+	--ink: #000000;
+	--muted: #4a4a4a;
+	--faint: #8a8a8a;
+	--line: #000000;
+	--line-strong: #000000;
+	--code-bg: #111111;
+	--text-code: #f4f4f0;
+	--blue: #0055ff;
+	--teal: #00e5ff;
+	--amber: #ffaa00;
+	--rose: #ff2200;
+	--violet: #aa00ff;
+	--accent: var(--blue);
+	--accent-soft: rgba(0, 85, 255, 0.15);
+	--correct-bg: #ccffcc;
+	--correct-line: #00aa00;
+	--wrong-bg: #ffcccc;
+	--wrong-line: #ff2200;
+	--shadow: 4px 4px 0px 0px var(--ink);
+}
+
+html[data-palette="field"] {
+	--bg: #f2fcf5;
+	--paper: #ffffff;
+	--line: #e2f5e9;
+	--line-strong: #bbf7d0;
+	--accent: var(--teal);
+	--accent-soft: rgba(13, 148, 136, 0.1);
+}
+
+html[data-palette="ember"] {
+	--bg: #fffcf8;
+	--paper: #ffffff;
+	--line: #fce8d5;
+	--line-strong: #fed7aa;
+	--accent: #ea580c;
+	--accent-soft: rgba(234, 88, 12, 0.1);
+}
+
+html[data-palette="elixir"] {
+	--bg: #f8f5fc;
+	--paper: #ffffff;
+	--line: #ede5f6;
+	--line-strong: #d8b4fe;
+	--accent: #a855f7;
+	--accent-soft: rgba(168, 85, 247, 0.1);
+}
+
+html[data-palette="trunk"] {
+	--bg: #fdfaf8;
+	--paper: #ffffff;
+	--line: #f4ece4;
+	--line-strong: #d6bfa8;
+	--accent: #78350f;
+	--accent-soft: rgba(120, 53, 15, 0.1);
+}
+
+html[data-palette="lava"] {
+	--bg: #fff5f5;
+	--paper: #ffffff;
+	--line: #fce8e8;
+	--line-strong: #fca5a5;
+	--accent: #ef4444;
+	--accent-soft: rgba(239, 68, 68, 0.1);
+}
+
+:root[data-theme="dark"] {
+	color-scheme: dark;
+	--bg: #000000;
+	--paper: #000000;
+	--panel: #0a0a0a;
+	--panel-strong: #1a1a1a;
+	--ink: #ffffff;
+	--muted: #a1a1aa;
+	--faint: #71717a;
+	--line: #ffffff;
+	--line-strong: #ffffff;
+	--code-bg: #111111;
+	--text-code: #e4e4e7;
+	--blue: #0088ff;
+	--teal: #00e5ff;
+	--amber: #ffcc00;
+	--rose: #ff4444;
+	--violet: #cc44ff;
+	--accent: var(--blue);
+	--accent-soft: rgba(0, 136, 255, 0.2);
+	--correct-bg: rgba(0, 170, 0, 0.2);
+	--correct-line: #00cc00;
+	--wrong-bg: rgba(255, 68, 68, 0.2);
+	--wrong-line: #ff4444;
+	--shadow: 4px 4px 0px 0px var(--accent);
+}
+
+html[data-palette="field"][data-theme="dark"] {
+	--bg: #090c0a;
+	--paper: #121212;
+	--line: #1a221c;
+	--line-strong: #27362c;
+	--accent: var(--teal);
+	--accent-soft: rgba(45, 212, 191, 0.1);
+}
+
+html[data-palette="ember"][data-theme="dark"] {
+	--bg: #0d0a08;
+	--paper: #121212;
+	--line: #221a16;
+	--line-strong: #362822;
+	--accent: #fb923c;
+	--accent-soft: rgba(251, 146, 60, 0.1);
+}
+
+html[data-palette="elixir"][data-theme="dark"] {
+	--bg: #0b0a0e;
+	--paper: #121212;
+	--line: #1c1a24;
+	--line-strong: #2d263b;
+	--accent: #c084fc;
+	--accent-soft: rgba(192, 132, 252, 0.1);
+}
+
+html[data-palette="trunk"][data-theme="dark"] {
+	--bg: #0c0a09;
+	--paper: #121212;
+	--line: #201a17;
+	--line-strong: #332822;
+	--accent: #d4a373;
+	--accent-soft: rgba(212, 163, 115, 0.1);
+}
+
+html[data-palette="lava"][data-theme="dark"] {
+	--bg: #0f0808;
+	--paper: #121212;
+	--line: #241414;
+	--line-strong: #3c1e1e;
+	--accent: #f87171;
+	--accent-soft: rgba(248, 113, 113, 0.1);
+}
+
+@media (prefers-color-scheme: dark) {
+	:root:not([data-theme="light"]) {
+		color-scheme: dark;
+		--bg: #000000;
+		--paper: #000000;
+		--panel: #0a0a0a;
+		--panel-strong: #1a1a1a;
+		--ink: #ffffff;
+		--muted: #a1a1aa;
+		--faint: #71717a;
+		--line: #ffffff;
+		--line-strong: #ffffff;
+		--code-bg: #111111;
+		--text-code: #e4e4e7;
+		--blue: #0088ff;
+		--teal: #00e5ff;
+		--amber: #ffcc00;
+		--rose: #ff4444;
+		--violet: #cc44ff;
+		--accent: var(--blue);
+		--accent-soft: rgba(0, 136, 255, 0.2);
+		--correct-bg: rgba(0, 170, 0, 0.2);
+		--correct-line: #00cc00;
+		--wrong-bg: rgba(255, 68, 68, 0.2);
+		--wrong-line: #ff4444;
+		--shadow: 4px 4px 0px 0px var(--accent);
+	}
+
+	html[data-palette="field"]:not([data-theme="light"]) {
+		--bg: #090c0a;
+		--paper: #121212;
+		--line: #1a221c;
+		--line-strong: #27362c;
+		--accent: var(--teal);
+		--accent-soft: rgba(45, 212, 191, 0.1);
+	}
+
+	html[data-palette="ember"]:not([data-theme="light"]) {
+		--bg: #0d0a08;
+		--paper: #121212;
+		--line: #221a16;
+		--line-strong: #362822;
+		--accent: #fb923c;
+		--accent-soft: rgba(251, 146, 60, 0.1);
+	}
+
+	html[data-palette="elixir"]:not([data-theme="light"]) {
+		--bg: #0b0a0e;
+		--paper: #121212;
+		--line: #1c1a24;
+		--line-strong: #2d263b;
+		--accent: #c084fc;
+		--accent-soft: rgba(192, 132, 252, 0.1);
+	}
+
+	html[data-palette="trunk"]:not([data-theme="light"]) {
+		--bg: #0c0a09;
+		--paper: #121212;
+		--line: #201a17;
+		--line-strong: #332822;
+		--accent: #d4a373;
+		--accent-soft: rgba(212, 163, 115, 0.1);
+	}
+
+	html[data-palette="lava"]:not([data-theme="light"]) {
+		--bg: #0f0808;
+		--paper: #121212;
+		--line: #241414;
+		--line-strong: #3c1e1e;
+		--accent: #f87171;
+		--accent-soft: rgba(248, 113, 113, 0.1);
+	}
+}
+
+* {
+	box-sizing: border-box;
+	margin: 0;
+	padding: 0;
+}
+html {
+}
+body {
+	background: var(--bg);
+	color: var(--ink);
+	font-family: var(--font-sans);
+	line-height: 1.85;
+	-webkit-font-smoothing: antialiased;
+	text-rendering: optimizeLegibility;
+}
+
+.bk-shell {
+	display: flex;
+	min-height: 100vh;
+	overflow: hidden;
+	position: relative;
+}
+
+.bk-sidebar-collapse-floating {
+	position: absolute;
+	top: 50%;
+	transform: translateY(-50%);
+	left: 274px;
+	width: 28px;
+	height: 28px;
+	border-radius: 0;
+	border: 2px solid var(--line);
+	background: var(--paper);
+	color: var(--muted);
+	display: grid;
+	place-items: center;
+	cursor: pointer;
+	z-index: 40;
+	transition:
+		opacity 0.3s ease,
+		left 0.3s ease,
+		background 0.2s,
+		color 0.2s,
+		border-color 0.2s;
+	box-shadow: 4px 4px 0px 0px var(--ink);
+}
+.bk-shell[data-collapsed="true"] .bk-sidebar-collapse-floating {
+	left: -28px;
+	opacity: 0;
+	pointer-events: none;
+}
+.bk-sidebar-collapse-floating:hover {
+	background: var(--paper-hover, #f5f5f5);
+	color: var(--ink);
+	border-color: var(--ink);
+}
+
+.bk-sidebar {
+	width: 288px;
+	flex-shrink: 0;
+	position: relative;
+	height: 100vh;
+	overflow-y: auto;
+	border-right: 2px solid var(--line);
+	background: color-mix(in srgb, var(--paper) 88%, transparent);
+	backdrop-filter: blur(18px);
+	-webkit-backdrop-filter: blur(18px);
+	transition:
+		margin-left 0.3s ease,
+		opacity 0.3s ease;
+}
+.bk-shell[data-collapsed="true"] .bk-sidebar {
+	margin-left: -288px;
+	opacity: 0;
+}
+.bk-main {
+	flex-grow: 1;
+	position: relative;
+	height: 100vh;
+	overflow-y: auto;
+	min-width: 0;
+}
+.bk-sidebar-inner {
+	padding: 28px 0;
+	display: flex;
+	flex-direction: column;
+	min-height: 100%;
+	box-sizing: border-box;
+}
+.bk-sidebar-header {
+	position: relative;
+	padding: 0 22px 24px;
+	border-bottom: 2px solid var(--line);
+	margin-bottom: 18px;
+}
+.bk-brand-mark {
+	width: 36px;
+	height: 36px;
+	display: grid;
+	place-items: center;
+	border: 2px solid var(--line-strong);
+	border-radius: 0;
+	color: var(--accent);
+	font-weight: 700;
+	font-size: 12px;
+	margin-bottom: 18px;
+}
+.bk-sidebar-header-top {
+	display: flex;
+	align-items: center;
+	gap: 8px;
+	margin-bottom: 18px;
+}
+.bk-icon-btn {
+	width: 36px;
+	height: 36px;
+	display: grid;
+	place-items: center;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--paper);
+	color: var(--muted);
+	cursor: pointer;
+	text-decoration: none;
+	transition:
+		transform 0.18s ease,
+		border-color 0.18s ease,
+		background 0.18s ease,
+		color 0.18s ease;
+}
+.bk-icon-btn:hover,
+.bk-icon-btn[aria-expanded="true"] {
+	transform: translateY(-1px);
+	border-color: var(--accent);
+	color: var(--accent);
+	background: var(--accent-soft);
+}
+.bk-sidebar-expand {
+	position: fixed;
+	top: 24px;
+	left: 24px;
+	width: 40px;
+	height: 40px;
+	display: none;
+	place-items: center;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--paper);
+	color: var(--muted);
+	cursor: pointer;
+	z-index: 100;
+	box-shadow: var(--shadow);
+	transition: all 0.2s ease;
+}
+.bk-shell[data-collapsed="true"] .bk-sidebar-expand {
+	display: grid;
+}
+.bk-sidebar-expand:hover {
+	border-color: var(--accent);
+	color: var(--accent);
+	transform: translateY(-1px);
+}
+
+.bk-back-link {
+	display: inline-flex;
+	align-items: center;
+	gap: 6px;
+	font-size: 13px;
+	font-weight: 500;
+	color: var(--muted);
+	text-decoration: none;
+	margin-bottom: 12px;
+	transition: color 0.18s ease;
+}
+.bk-back-link:hover {
+	color: var(--ink);
+}
+.bk-sidebar-footer {
+	margin-top: auto;
+	padding: 24px 22px 0;
+	border-top: 2px solid var(--line);
+	position: relative;
+}
+
+.bk-sr-only {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0, 0, 0, 0);
+	white-space: nowrap;
+	border: 0;
+}
+.bk-sidebar-title {
+	font-weight: 700;
+	font-size: 15px;
+	line-height: 1.35;
+	color: var(--ink);
+}
+.bk-sidebar-author {
+	font-size: 12px;
+	color: var(--muted);
+	margin-top: 6px;
+}
+.bk-tag-row {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 6px;
+	margin-top: 16px;
+}
+.bk-tag-row span {
+	font-size: 11px;
+	color: var(--muted);
+	border: 2px solid var(--line);
+	border-radius: 0;
+	padding: 3px 8px;
+	background: var(--panel);
+}
+.bk-theme-panel {
+	position: absolute;
+	z-index: 20;
+	left: 22px;
+	bottom: 64px;
+	width: min(240px, calc(100vw - 36px));
+	display: grid;
+	gap: 8px;
+	padding: 14px;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--paper);
+	box-shadow: var(--shadow);
+}
+.bk-theme-panel[hidden] {
+	display: none;
+}
+.bk-theme-row {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 8px;
+}
+.bk-segmented-control {
+	display: flex;
+	gap: 4px;
+	padding: 4px;
+	background: color-mix(in srgb, var(--panel) 50%, var(--paper));
+	border: 2px solid var(--line);
+	border-radius: 0;
+}
+.bk-segment-btn {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 28px;
+	height: 28px;
+	border: none;
+	background: transparent;
+	color: var(--muted);
+	border-radius: 0;
+	cursor: pointer;
+	transition: background 0.2s, color 0.2s, box-shadow 0.2s;
+}
+.bk-segment-btn:hover {
+	color: var(--ink);
+	background: color-mix(in srgb, var(--panel) 80%, transparent);
+}
+.bk-segment-btn.active {
+	background: var(--paper);
+	color: var(--accent);
+	box-shadow: 4px 4px 0px 0px var(--ink);
+	border: 2px solid var(--line);
+}
+.bk-theme-panel span {
+	color: var(--muted);
+	font-size: 11px;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.06em;
+}
+
+.bk-nav {
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+	padding: 0 16px;
+	position: relative;
+}
+.bk-nav-active-pill {
+	position: absolute;
+	left: 16px;
+	right: 16px;
+	background: var(--accent-soft);
+	border-radius: 0;
+	transition: top 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), height 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.2s ease;
+	z-index: 0;
+	pointer-events: none;
+	opacity: 0;
+}
+.bk-nav-item {
+	display: block;
+	padding: 7px 12px;
+	font-size: 13px;
+	line-height: 1.4;
+	color: var(--muted);
+	text-decoration: none;
+	border-bottom: none;
+	border-radius: 0;
+	position: relative;
+	z-index: 1;
+	transition: color 0.15s ease;
+}
+.bk-nav-item:hover {
+	color: var(--ink);
+}
+.bk-nav-item.active {
+	color: var(--accent);
+}
+.bk-nav-heading {
+	font-weight: 600;
+	color: var(--ink);
+	margin-top: 8px;
+}
+.bk-nav-heading:first-child {
+	margin-top: 0;
+}
+.bk-nav-sub,
+.bk-nav-sim {
+	padding-left: 32px;
+	font-size: 13px;
+	position: relative;
+}
+.bk-nav-quiz {
+	padding-left: 32px;
+	font-style: italic;
+	opacity: 0.85;
+	position: relative;
+}
+
+.bk-main {
+	min-width: 0;
+}
+.bk-content {
+	max-width: 1024px;
+	margin: 0 auto;
+	padding: 56px 34px 128px;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	gap: 30px;
+}
+.bk-content > * {
+	width: 100%;
+	max-width: 720px;
+}
+.bk-content > .bk-object,
+.bk-content > .bk-end-nav {
+	max-width: 100%;
+}
+.bk-density-compact .bk-content {
+	gap: 22px;
+}
+
+.bk-hero {
+	border-bottom: 2px solid var(--line);
+	padding: 18px 0 44px;
+	margin-bottom: 4px;
+}
+.bk-eyebrow {
+	color: var(--accent);
+	font-size: 12px;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.08em;
+	margin-bottom: 18px;
+}
+.bk-hero h1 {
+	font-family: var(--font-display);
+	font-size: clamp(38px, 6vw, 66px);
+	line-height: 1.02;
+	letter-spacing: 0;
+	max-width: 780px;
+	width: fit-content;
+	margin: 0;
+}
+.bk-deck {
+	max-width: 660px;
+	color: var(--muted);
+	font-size: 18px;
+	line-height: 1.65;
+	margin-top: 22px;
+}
+
+.bk-markdown h1,
+.bk-section h1 {
+	font-family: var(--font-display);
+	font-size: 34px;
+	font-weight: 700;
+	letter-spacing: 0;
+	margin: 16px 0 24px;
+	line-height: 1.2;
+}
+.bk-section.bk-heading {
+	margin-top: 24px;
+}
+.bk-section.bk-subsection {
+	margin-top: 16px;
+}
+.bk-markdown h2,
+.bk-section h2 {
+	font-size: 23px;
+	font-weight: 650;
+	margin: 32px 0 16px;
+	letter-spacing: 0;
+}
+.bk-markdown h3,
+.bk-section h3 {
+	font-size: 18px;
+	font-weight: 600;
+	margin: 24px 0 12px;
+}
+
+p {
+	margin-bottom: 16px;
+	color: var(--ink);
+	font-size: 18px;
+}
+ul,
+ol {
+	padding-left: 24px;
+	margin-bottom: 16px;
+	color: var(--ink);
+}
+li {
+	margin-bottom: 8px;
+}
+li > p {
+	margin-bottom: 8px;
+}
+strong {
+	font-weight: 600;
+}
+a {
+	color: var(--accent);
+	text-decoration: none;
+	border-bottom: 2px solid transparent;
+	transition: border-color 0.2s;
+}
+a:hover {
+	border-color: var(--accent);
+}
+
+code {
+	font-family: var(--font-mono);
+	font-size: 0.85em;
+	padding: 0.2em 0.4em;
+	background: var(--panel);
+	border: 2px solid var(--line);
+	border-radius: 0;
+	color: var(--ink);
+}
+
+blockquote {
+	border-left: 6px solid var(--line-strong);
+	padding: 4px 0 4px 20px;
+	margin: 24px 0;
+	color: var(--muted);
+	font-style: italic;
+}
+
+.bk-math-block {
+	margin: 24px 0;
+	overflow-x: auto;
+	overflow-y: hidden;
+	display: flex;
+	justify-content: center;
+}
+hr.bk-divider {
+	border: none;
+	border-top: 2px solid var(--line);
+	margin: 48px auto;
+	width: 50%;
+}
+
+.bk-callout {
+	display: flex;
+	gap: 16px;
+	padding: 20px;
+	border-radius: 0;
+	border: 2px solid;
+	margin: 24px 0;
+	background: var(--panel);
+	border-color: var(--line);
+}
+.bk-callout-icon {
+	flex-shrink: 0;
+	width: 24px;
+	height: 24px;
+	border-radius: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-weight: bold;
+	font-size: 14px;
+	color: #fff;
+}
+.bk-callout-content {
+	flex-grow: 1;
+}
+.bk-callout-label {
+	font-weight: 600;
+	font-size: 14px;
+	margin-bottom: 8px;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+}
+.bk-callout-body > *:last-child {
+	margin-bottom: 0;
+}
+
+.bk-callout--note .bk-callout-icon {
+	background: var(--muted);
+}
+.bk-callout--note .bk-callout-icon::after {
+	content: "i";
+}
+.bk-callout--note .bk-callout-label {
+	color: var(--muted);
+}
+
+.bk-callout--tip {
+	background: color-mix(in srgb, var(--teal) 12%, var(--paper));
+	border-color: color-mix(in srgb, var(--teal) 32%, var(--line));
+}
+.bk-callout--tip .bk-callout-icon {
+	background: var(--teal);
+}
+.bk-callout--tip .bk-callout-icon::after {
+	content: "OK";
+	font-size: 9px;
+}
+.bk-callout--tip .bk-callout-label {
+	color: var(--teal);
+}
+
+.bk-callout--important {
+	background: color-mix(in srgb, var(--blue) 12%, var(--paper));
+	border-color: color-mix(in srgb, var(--blue) 32%, var(--line));
+}
+.bk-callout--important .bk-callout-icon {
+	background: var(--blue);
+}
+.bk-callout--important .bk-callout-icon::after {
+	content: "!";
+}
+.bk-callout--important .bk-callout-label {
+	color: var(--blue);
+}
+
+.bk-callout--warning {
+	background: color-mix(in srgb, var(--amber) 14%, var(--paper));
+	border-color: color-mix(in srgb, var(--amber) 36%, var(--line));
+}
+.bk-callout--warning .bk-callout-icon {
+	background: var(--amber);
+}
+.bk-callout--warning .bk-callout-icon::after {
+	content: "!";
+}
+.bk-callout--warning .bk-callout-label {
+	color: var(--amber);
+}
+
+.bk-code-block {
+	margin: 24px 0;
+	border-radius: 0;
+	background: var(--code-bg);
+	border: 2px solid var(--line);
+	overflow: hidden;
+	box-shadow: var(--shadow);
+}
+.bk-code-header {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 10px 44px 10px 16px;
+	background: rgba(255, 255, 255, 0.05);
+	border-bottom: 2px solid rgba(255, 255, 255, 0.1);
+	font-family: var(--font-mono);
+	font-size: 12px;
+	color: #a1a1aa;
+}
+.bk-code-lang {
+	text-transform: uppercase;
+}
+.bk-code-scroll {
+	padding: 20px;
+	overflow-x: auto;
+}
+.bk-code-block pre {
+	margin: 0;
+	background: transparent;
+	border: none;
+	padding: 0;
+}
+.bk-code-block code {
+	border: none;
+	padding: 0;
+	font-size: 14px;
+}
+.bk-code-block code:not(.hljs) {
+	background: transparent;
+	color: var(--text-code);
+}
+.hljs {
+	background: transparent !important;
+}
+
+.bk-copy-btn {
+	position: absolute;
+	top: 8px;
+	right: 8px;
+	width: 28px;
+	height: 28px;
+	display: grid;
+	place-items: center;
+	border: 2px solid rgba(255, 255, 255, 0.1);
+	background: rgba(255, 255, 255, 0.05);
+	color: #a1a1aa;
+	border-radius: 0;
+	cursor: pointer;
+	transition: all 0.2s ease;
+	z-index: 10;
+}
+.bk-code-block:has(.bk-code-header) .bk-copy-btn {
+	top: 4px;
+}
+.bk-copy-btn:hover {
+	background: rgba(255, 255, 255, 0.1);
+	color: #fff;
+}
+.bk-copy-btn.copied {
+	color: #61b58d;
+	border-color: rgba(97, 181, 141, 0.3);
+	background: rgba(97, 181, 141, 0.1);
+}
+
+.bk-object {
+	margin: 34px 0;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--paper);
+	overflow: hidden;
+	box-shadow: var(--shadow);
+}
+.bk-object:focus-within {
+	border-color: var(--object-accent, var(--accent));
+}
+.bk-object-header {
+	display: flex;
+	align-items: center;
+	gap: 12px;
+	padding: 13px 16px;
+	border-bottom: 2px solid var(--line);
+	background: color-mix(in srgb, var(--object-accent, var(--accent)) 3%, var(--paper));
+}
+.bk-object-kicker {
+	font-size: 11px;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.08em;
+	color: var(--object-accent, var(--accent));
+}
+.bk-object-title {
+	font-size: 13px;
+	color: var(--muted);
+	font-weight: 600;
+}
+.bk-object-maximize {
+	margin-left: auto;
+	width: 28px;
+	height: 28px;
+	display: grid;
+	place-items: center;
+	border: none;
+	background: transparent;
+	color: var(--muted);
+	cursor: pointer;
+	border-radius: 0;
+}
+.bk-object-maximize:hover {
+	background: rgba(0, 0, 0, 0.05);
+	color: var(--ink);
+}
+
+:root[data-theme="dark"] .bk-object-maximize:hover {
+	background: rgba(255, 255, 255, 0.1);
+}
+.bk-object--maximized {
+	position: fixed;
+	inset: 0;
+	width: 100vw;
+	height: 100vh;
+	z-index: 1000;
+	margin: 0;
+	border: none;
+	border-radius: 0;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+}
+.bk-object--maximized .bk-code-block {
+	flex-grow: 1;
+	min-height: 0;
+	height: auto !important;
+	max-height: none !important;
+}
+.bk-object--maximized .bk-embed-frame,
+.bk-object--maximized .bk-media {
+	flex: 0 1 auto;
+	min-height: 0;
+	min-width: 0;
+	margin: auto;
+	height: 100% !important;
+	width: auto !important;
+	max-width: 100% !important;
+	max-height: 100% !important;
+}
+.bk-object--maximized .bk-caption {
+	margin-top: auto;
+}
+.bk-object--maximized .bk-embed-interactive iframe {
+	pointer-events: auto !important;
+}
+.bk-object--maximized .bk-embed-overlay {
+	display: none !important;
+}
+.bk-object--blue {
+	--object-accent: var(--blue);
+}
+.bk-object--teal {
+	--object-accent: var(--teal);
+}
+.bk-object--amber {
+	--object-accent: var(--amber);
+}
+.bk-object--rose {
+	--object-accent: var(--rose);
+}
+.bk-object--violet {
+	--object-accent: var(--violet);
+}
+.bk-embed-frame {
+	position: relative;
+	width: 100%;
+	border-radius: 0;
+	overflow: hidden;
+	background: #000;
+	content-visibility: auto;
+	contain-intrinsic-size: auto 480px;
+	isolation: isolate;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	aspect-ratio: 16 / 9;
+}
+.bk-embed-interactive iframe {
+	pointer-events: none;
+	transition: opacity 0.2s;
+}
+.bk-embed-interactive.is-interactive iframe {
+	pointer-events: auto;
+}
+.bk-embed-overlay {
+	position: absolute;
+	inset: 0;
+	z-index: 10;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background: rgba(0, 0, 0, 0.2);
+	backdrop-filter: blur(2px);
+	-webkit-backdrop-filter: blur(2px);
+	cursor: pointer;
+	transition:
+		opacity 0.2s,
+		visibility 0.2s;
+}
+.bk-embed-overlay:hover,
+.bk-embed-overlay:focus {
+	background: rgba(0, 0, 0, 0.3);
+	outline: none;
+}
+.bk-embed-overlay-text {
+	padding: 8px 16px;
+	background: rgba(0, 0, 0, 0.6);
+	color: #fff;
+	border-radius: 0;
+	font-size: 13px;
+	font-weight: 600;
+	box-shadow: 4px 4px 0px 0px var(--ink);
+	backdrop-filter: blur(4px);
+	-webkit-backdrop-filter: blur(4px);
+	transition: transform 0.2s;
+}
+.bk-embed-overlay:hover .bk-embed-overlay-text,
+.bk-embed-overlay:focus .bk-embed-overlay-text {
+	transform: scale(1.05);
+}
+.bk-embed-interactive.is-interactive .bk-embed-overlay {
+	opacity: 0;
+	visibility: hidden;
+	pointer-events: none;
+}
+.bk-sim-controls {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+	gap: 10px 14px;
+	padding: 14px 16px;
+	border-bottom: 2px solid var(--line);
+	background: var(--panel);
+}
+.bk-sim-toggle,
+.bk-sim-range {
+	display: grid;
+	gap: 6px;
+	color: var(--muted);
+	font-size: 12px;
+	font-weight: 650;
+}
+.bk-sim-toggle {
+	grid-template-columns: auto 1fr;
+	align-items: center;
+}
+.bk-sim-range {
+	grid-template-columns: 1fr auto;
+	align-items: center;
+}
+.bk-sim-range input {
+	grid-column: 1 / -1;
+	width: 100%;
+	accent-color: var(--accent);
+}
+.bk-sim-toggle input {
+	accent-color: var(--accent);
+}
+.bk-sim-toggle input,
+.bk-sim-range input {
+	cursor: pointer;
+}
+.bk-sim-range output {
+	color: var(--ink);
+	font-variant-numeric: tabular-nums;
+}
+.bk-media {
+	width: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	border-radius: 0;
+	overflow: hidden;
+	background: var(--panel);
+	aspect-ratio: 16 / 9;
+}
+.bk-media img,
+.bk-media video {
+	width: 100%;
+	height: 100%;
+	object-fit: cover;
+	display: block;
+}
+.bk-media--audio {
+	padding: 24px;
+}
+.bk-media audio {
+	width: 100%;
+}
+.bk-aspect-auto {
+	min-height: 0;
+}
+.bk-caption {
+	padding: 12px 16px 14px;
+	border-top: 2px solid var(--line);
+	color: var(--muted);
+	font-size: 13px;
+	line-height: 1.55;
+	background: var(--panel);
+}
+.bk-caption * {
+	font-size: inherit;
+	margin: 0;
+}
+.bk-latex-block {
+	display: flex;
+	justify-content: center;
+	overflow-x: auto;
+	padding: 28px 18px;
+	background: var(--paper);
+}
+.bk-latex-inline {
+	padding: 16px;
+	background: var(--paper);
+}
+.bk-columns {
+	display: grid;
+	gap: 18px;
+	padding: 18px;
+	background: var(--paper);
+}
+.bk-column {
+	min-width: 0;
+	padding: 16px;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--panel);
+}
+.bk-column > *:last-child {
+	margin-bottom: 0;
+}
+
+.bk-quiz {
+	margin: 32px 0;
+	border-radius: 0;
+	border: 2px solid var(--line);
+	background: var(--paper);
+	overflow: hidden;
+	box-shadow: var(--shadow);
+}
+.bk-quiz-head {
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+	padding: 16px 22px;
+	font-size: 13px;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.06em;
+	color: var(--accent);
+	border-bottom: 2px solid var(--line);
+	background: var(--accent-soft);
+}
+.bk-quiz-head small {
+	color: var(--muted);
+	text-transform: none;
+	letter-spacing: 0;
+	font-weight: 500;
+}
+.bk-question {
+	padding: 24px;
+	border-bottom: 2px solid var(--line);
+}
+.bk-question:last-child {
+	border-bottom: none;
+}
+.bk-q-text {
+	font-size: 16px;
+	font-weight: 500;
+	margin-bottom: 20px;
+}
+.bk-q-text > *:last-child {
+	margin-bottom: 0;
+}
+.bk-opts {
+	display: flex;
+	flex-direction: column;
+	gap: 12px;
+}
+.bk-opt {
+	display: flex;
+	align-items: center;
+	gap: 16px;
+	width: 100%;
+	text-align: left;
+	padding: 14px 16px;
+	border-radius: 0;
+	border: 2px solid var(--line);
+	background: var(--paper);
+	color: var(--ink);
+	font-size: 15px;
+	cursor: pointer;
+	transition: all 0.2s;
+}
+.bk-opt:hover {
+	border-color: var(--line-strong);
+	background: var(--panel);
+}
+.bk-opt-dot {
+	width: 18px;
+	height: 18px;
+	border-radius: 0;
+	border: 2px solid var(--muted);
+	flex-shrink: 0;
+	transition: all 0.2s;
+}
+
+.bk-opt.correct {
+	background: var(--correct-bg);
+	border-color: var(--correct-line);
+	pointer-events: none;
+}
+.bk-opt.correct .bk-opt-dot {
+	border-color: var(--correct-line);
+	background: var(--correct-line);
+}
+
+.bk-opt.wrong {
+	background: var(--wrong-bg);
+	border-color: var(--wrong-line);
+	pointer-events: none;
+	opacity: 0.8;
+}
+.bk-opt.wrong .bk-opt-dot {
+	border-color: var(--wrong-line);
+	background: var(--wrong-line);
+}
+
+.bk-opt.disabled {
+	opacity: 0.5;
+	pointer-events: none;
+}
+
+.bk-explanation {
+	margin-top: 20px;
+	padding: 16px;
+	background: var(--panel);
+	border: 2px solid var(--line);
+	border-radius: 0;
+	font-size: 14px;
+	color: var(--muted);
+}
+.bk-explanation > *:last-child {
+	margin-bottom: 0;
+}
+
+.bk-end-nav {
+	display: grid;
+	grid-template-columns: repeat(3, minmax(0, 1fr));
+	gap: 12px;
+	margin-top: 48px;
+	padding-top: 28px;
+	border-top: 2px solid var(--line);
+}
+.bk-end-link {
+	min-height: 100px;
+	display: grid;
+	align-content: center;
+	gap: 8px;
+	padding: 16px;
+	border: 2px solid var(--line);
+	border-radius: 0;
+	background: var(--paper);
+	color: var(--ink);
+	text-decoration: none;
+}
+.bk-end-link:hover {
+	border-color: var(--accent);
+	background: var(--accent-soft);
+}
+.bk-end-link span {
+	color: var(--muted);
+	font-size: 12px;
+	font-weight: 700;
+	text-transform: uppercase;
+}
+.bk-end-link strong {
+	line-height: 1.25;
+}
+.bk-end-link--next {
+	background: var(--accent-soft);
+	border-color: color-mix(in srgb, var(--accent) 36%, var(--line));
+}
+
+@media (max-width: 800px) {
+	.bk-shell {
+		display: block;
+	}
+	.bk-sidebar-collapse-floating {
+		display: none;
+	}
+	.bk-sidebar {
+		width: 100%;
+		height: auto;
+		position: static;
+		border-right: none;
+		border-bottom: 2px solid var(--line);
+	}
+	.bk-sidebar-inner {
+		padding: 20px;
+	}
+	.bk-sidebar-header {
+		padding-left: 0;
+		padding-right: 0;
+	}
+	.bk-settings-button {
+		right: 0;
+	}
+	.bk-theme-panel {
+		right: 0;
+	}
+	.bk-nav {
+		padding: 0;
+		max-height: 190px;
+		overflow-y: auto;
+	}
+	.bk-content {
+		padding: 32px 20px 80px;
+	}
+	.bk-hero h1 {
+		font-size: 38px;
+	}
+	.bk-home {
+		grid-template-columns: 1fr;
+	}
+	.bk-home-grid {
+		grid-template-columns: 1fr;
+	}
+	.bk-end-nav {
+		grid-template-columns: 1fr;
+	}
+	.bk-object {
+		margin-left: -20px;
+		margin-right: -20px;
+		max-width: none;
+		border-left: none;
+		border-right: none;
+		border-radius: 0;
+	}
+	.bk-object-header,
+	.bk-quiz-head {
+		padding-left: 20px;
+		padding-right: 20px;
+	}
+	.bk-columns {
+		grid-template-columns: 1fr !important;
+	}
+}
+
+@media (prefers-reduced-motion: no-preference) {
+	@view-transition {
+		navigation: auto;
+	}
+}