Spaces:
Running
Running
| @import "katex/dist/katex.min.css"; | |
| :root { | |
| --bg: #fbfaf7; | |
| --bg-elev: #ffffff; | |
| --bg-sunk: #f3f1ec; | |
| --text: #1c1b19; | |
| --text-2: #57544e; | |
| --text-3: #8a867e; | |
| --border: #e7e3db; | |
| --border-strong: #d3cec3; | |
| --accent: #2f4ac2; | |
| --accent-hover: #2439a0; | |
| --accent-soft: #eaeefc; | |
| --accent-text: #2238a3; | |
| --mark: #fde9a6; | |
| --ok: #1c6e48; | |
| --ok-soft: #e2f3e9; | |
| --neg: #9b3a22; | |
| --neg-soft: #fbe8e2; | |
| --trace: #7a3f98; | |
| --trace-soft: #f3e8f8; | |
| --shadow: 0 1px 2px rgb(30 25 15 / 0.04), 0 6px 20px rgb(30 25 15 / 0.05); | |
| --shadow-lift: 0 2px 4px rgb(30 25 15 / 0.05), 0 12px 32px rgb(30 25 15 / 0.08); | |
| --chip-l-bg: 94%; | |
| --chip-l-fg: 30%; | |
| --chip-s: 55%; | |
| --font-serif: "Newsreader", "Iowan Old Style", Georgia, serif; | |
| --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif; | |
| --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace; | |
| --radius: 14px; | |
| --radius-sm: 8px; | |
| --page: 1180px; | |
| color-scheme: light; | |
| } | |
| @media (prefers-color-scheme: dark) { | |
| :root:not([data-theme="light"]) { | |
| --bg: #0e0f11; | |
| --bg-elev: #16171a; | |
| --bg-sunk: #121315; | |
| --text: #ecebe7; | |
| --text-2: #aeaba4; | |
| --text-3: #7a7770; | |
| --border: #25262a; | |
| --border-strong: #34363b; | |
| --accent: #8fa2ff; | |
| --accent-hover: #aab8ff; | |
| --accent-soft: #1b2040; | |
| --accent-text: #b4c0ff; | |
| --mark: #5b4a12; | |
| --ok: #7fd3a5; | |
| --ok-soft: #13291e; | |
| --neg: #f0a48f; | |
| --neg-soft: #33190f; | |
| --trace: #d6a8ee; | |
| --trace-soft: #2a1834; | |
| --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 6px 20px rgb(0 0 0 / 0.25); | |
| --shadow-lift: 0 2px 4px rgb(0 0 0 / 0.35), 0 12px 32px rgb(0 0 0 / 0.4); | |
| --chip-l-bg: 18%; | |
| --chip-l-fg: 80%; | |
| --chip-s: 40%; | |
| color-scheme: dark; | |
| } | |
| } | |
| :root[data-theme="dark"] { | |
| --bg: #0e0f11; | |
| --bg-elev: #16171a; | |
| --bg-sunk: #121315; | |
| --text: #ecebe7; | |
| --text-2: #aeaba4; | |
| --text-3: #7a7770; | |
| --border: #25262a; | |
| --border-strong: #34363b; | |
| --accent: #8fa2ff; | |
| --accent-hover: #aab8ff; | |
| --accent-soft: #1b2040; | |
| --accent-text: #b4c0ff; | |
| --mark: #5b4a12; | |
| --ok: #7fd3a5; | |
| --ok-soft: #13291e; | |
| --neg: #f0a48f; | |
| --neg-soft: #33190f; | |
| --trace: #d6a8ee; | |
| --trace-soft: #2a1834; | |
| --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 6px 20px rgb(0 0 0 / 0.25); | |
| --shadow-lift: 0 2px 4px rgb(0 0 0 / 0.35), 0 12px 32px rgb(0 0 0 / 0.4); | |
| --chip-l-bg: 18%; | |
| --chip-l-fg: 80%; | |
| --chip-s: 40%; | |
| color-scheme: dark; | |
| } | |
| *, | |
| *::before, | |
| *::after { | |
| box-sizing: border-box; | |
| } | |
| html { | |
| -webkit-text-size-adjust: 100%; | |
| } | |
| body { | |
| margin: 0; | |
| background: var(--bg); | |
| color: var(--text); | |
| font-family: var(--font-sans); | |
| font-size: 15px; | |
| line-height: 1.55; | |
| -webkit-font-smoothing: antialiased; | |
| text-rendering: optimizeLegibility; | |
| } | |
| a { | |
| color: var(--accent-text); | |
| text-decoration: none; | |
| } | |
| a:hover { | |
| text-decoration: underline; | |
| text-underline-offset: 3px; | |
| } | |
| button, | |
| input, | |
| select { | |
| font: inherit; | |
| color: inherit; | |
| } | |
| :focus-visible { | |
| outline: 2px solid var(--accent); | |
| outline-offset: 2px; | |
| border-radius: 6px; | |
| } | |
| mark { | |
| background: var(--mark); | |
| color: inherit; | |
| border-radius: 3px; | |
| padding: 0 1px; | |
| } | |
| .katex { | |
| font-size: 1.04em; | |
| } | |
| .serif { | |
| font-family: var(--font-serif); | |
| } | |
| .mono { | |
| font-family: var(--font-mono); | |
| font-size: 0.86em; | |
| letter-spacing: -0.01em; | |
| } | |
| .page { | |
| max-width: var(--page); | |
| margin: 0 auto; | |
| padding: 0 24px; | |
| } | |
| @media (max-width: 640px) { | |
| .page { | |
| padding: 0 16px; | |
| } | |
| } | |
| /* Discipline chips: each discipline gets a hue via --h. */ | |
| .chip { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 6px; | |
| padding: 2px 10px; | |
| border-radius: 999px; | |
| font-size: 12.5px; | |
| font-weight: 500; | |
| white-space: nowrap; | |
| background: hsl(var(--h, 230) var(--chip-s) var(--chip-l-bg)); | |
| color: hsl(var(--h, 230) var(--chip-s) var(--chip-l-fg)); | |
| } | |
| .badge { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 5px; | |
| padding: 2px 9px; | |
| border-radius: 999px; | |
| font-size: 12.5px; | |
| font-weight: 500; | |
| white-space: nowrap; | |
| border: 1px solid transparent; | |
| } | |
| .badge.lean { | |
| background: var(--ok-soft); | |
| color: var(--ok); | |
| } | |
| .badge.neg { | |
| background: var(--neg-soft); | |
| color: var(--neg); | |
| } | |
| .badge.trace { | |
| background: var(--trace-soft); | |
| color: var(--trace); | |
| } | |
| .badge.plain { | |
| border-color: var(--border); | |
| color: var(--text-2); | |
| } | |
| .btn { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 8px; | |
| padding: 8px 14px; | |
| border-radius: 10px; | |
| border: 1px solid var(--border-strong); | |
| background: var(--bg-elev); | |
| color: var(--text); | |
| font-weight: 500; | |
| font-size: 14px; | |
| cursor: pointer; | |
| text-decoration: none; | |
| transition: | |
| border-color 0.15s, | |
| background 0.15s; | |
| } | |
| .btn:hover { | |
| border-color: var(--text-3); | |
| text-decoration: none; | |
| } | |
| .btn.primary { | |
| background: var(--accent); | |
| border-color: var(--accent); | |
| color: white; | |
| } | |
| :root[data-theme="dark"] .btn.primary { | |
| color: #0e0f11; | |
| } | |
| @media (prefers-color-scheme: dark) { | |
| :root:not([data-theme="light"]) .btn.primary { | |
| color: #0e0f11; | |
| } | |
| } | |
| .btn.primary:hover { | |
| background: var(--accent-hover); | |
| } | |
| .muted { | |
| color: var(--text-2); | |
| } | |
| .faint { | |
| color: var(--text-3); | |
| } | |
| .sr-only { | |
| position: absolute; | |
| width: 1px; | |
| height: 1px; | |
| overflow: hidden; | |
| clip: rect(0 0 0 0); | |
| white-space: nowrap; | |
| } | |