/* git.daemon-sec.xyz — minimal retro, DM Mono.
 *
 * Six palettes, chosen by theme.js and stored per visitor:
 *   rose-pine  dark = Rosé Pine (main)   light = Rosé Pine Dawn
 *   gruvbox    dark = Gruvbox dark       light = Gruvbox light
 *   gruvepine  Gruvbox backgrounds and text, Rosé Pine accents
 * Every colour below is a role, so a palette is nine lines.
 *
 * DM Mono: Colophon Foundry, SIL Open Font License 1.1 (self-hosted, no
 * third-party font request). */

@font-face { font-family: "DM Mono"; font-weight: 400; font-style: normal; font-display: swap; src: url(fonts/dm-mono-400.woff2) format("woff2"); }
@font-face { font-family: "DM Mono"; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/dm-mono-500.woff2) format("woff2"); }
@font-face { font-family: "DM Mono"; font-weight: 400; font-style: italic; font-display: swap; src: url(fonts/dm-mono-400i.woff2) format("woff2"); }

/* ── palettes ─────────────────────────────────────────────────────────── */
:root, [data-theme="rose-pine-dark"] {
  --bg: #191724; --panel: #1f1d2e; --line: #26233a; --muted: #6e6a86; --subtle: #908caa;
  --fg: #e0def4; --link: #9ccfd8; --title: #c4a7e7; --accent: #ebbcba;
  --add: #9ccfd8; --del: #eb6f92; --warn: #f6c177; --mark: #eb6f92;
  color-scheme: dark;
}
[data-theme="rose-pine-light"] {
  --bg: #faf4ed; --panel: #fffaf3; --line: #f2e9e1; --muted: #9893a5; --subtle: #797593;
  --fg: #575279; --link: #286983; --title: #907aa9; --accent: #d7827e;
  --add: #56949f; --del: #b4637a; --warn: #ea9d34; --mark: #b4637a;
  color-scheme: light;
}
[data-theme="gruvbox-dark"] {
  --bg: #282828; --panel: #32302f; --line: #3c3836; --muted: #7c6f64; --subtle: #a89984;
  --fg: #ebdbb2; --link: #83a598; --title: #fabd2f; --accent: #fe8019;
  --add: #b8bb26; --del: #fb4934; --warn: #fabd2f; --mark: #fe8019;
  color-scheme: dark;
}
[data-theme="gruvbox-light"] {
  --bg: #fbf1c7; --panel: #f2e5bc; --line: #ebdbb2; --muted: #928374; --subtle: #7c6f64;
  --fg: #3c3836; --link: #076678; --title: #b57614; --accent: #af3a03;
  --add: #79740e; --del: #9d0006; --warn: #b57614; --mark: #af3a03;
  color-scheme: light;
}

/* Gruvepine: Gruvbox's warm ground and ink, Rosé Pine's accents on top. */
[data-theme="gruvepine-dark"] {
  --bg: #1d2021; --panel: #282828; --line: #3c3836; --muted: #7c6f64; --subtle: #a89984;
  --fg: #ebdbb2; --link: #9ccfd8; --title: #c4a7e7; --accent: #ebbcba;
  --add: #b8bb26; --del: #eb6f92; --warn: #fabd2f; --mark: #eb6f92;
  color-scheme: dark;
}
[data-theme="gruvepine-light"] {
  --bg: #fbf1c7; --panel: #f2e5bc; --line: #ebdbb2; --muted: #928374; --subtle: #7c6f64;
  --fg: #3c3836; --link: #286983; --title: #907aa9; --accent: #d7827e;
  --add: #79740e; --del: #b4637a; --warn: #b57614; --mark: #b4637a;
  color-scheme: light;
}

/* ── base ─────────────────────────────────────────────────────────────── */
html { background: var(--bg); }
body {
  margin: 0 auto; max-width: 1180px; padding: 28px 24px 40px;
  background: var(--bg); color: var(--fg);
  font: 14.5px/1.6 "DM Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--line); color: var(--accent); }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
hr { border: 0; border-top: 1px dashed var(--line); margin: 18px 0 22px; }
b, strong { font-weight: 500; }

/* ── header ───────────────────────────────────────────────────────────── */
body > table:first-of-type { border-collapse: collapse; width: 100%; }
body > table:first-of-type td { padding: 2px 14px 2px 0; vertical-align: middle; }
body > table:first-of-type td:first-child { width: 1%; }
.mark {
  display: inline-grid; place-items: center; width: 38px; height: 38px;
  border: 1px solid var(--line); color: var(--mark); font-weight: 500; font-size: 22px;
  background: var(--panel);
}
a:hover .mark { border-color: var(--mark); text-decoration: none; }
h1 { display: inline; margin: 0; font-size: 20px; font-weight: 500; color: var(--title); letter-spacing: .5px; }
h1::before { content: "~/"; color: var(--muted); }
h1::after { content: "█"; margin-left: 4px; color: var(--accent); animation: blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { h1::after { animation: none; } }
.desc { display: block; color: var(--subtle); }
tr.url td { color: var(--muted); padding-top: 6px !important; }
tr.url td:last-child::before { content: "$ "; color: var(--accent); }
tr.url a { color: var(--fg); }

/* ── tables (index, log, files, refs) ─────────────────────────────────── */
#content { overflow-x: auto; }
#content table { border-collapse: collapse; width: 100%; }
#content td, #content th { padding: 4px 18px 4px 0; text-align: left; vertical-align: top; }
#content thead td, #content thead b {
  color: var(--muted); font-weight: 500; font-size: 11.5px; text-transform: uppercase; letter-spacing: 1.6px;
}
#content thead tr { border-bottom: 1px dashed var(--line); }
#content tbody tr:hover td { background: var(--panel); }
#content td.num { color: var(--subtle); }
#index tbody td:nth-child(2) { color: var(--subtle); }
#index tbody td:nth-child(3) { white-space: nowrap; color: var(--subtle); }
#index tbody td:last-child, #log tbody td:first-child { color: var(--warn); white-space: nowrap; }
#files tbody td:first-child, #branches td:last-child, #tags td:last-child { color: var(--muted); }
#index tbody tr td:first-child a::before { content: "▸ "; color: var(--muted); }
h2 { font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: 1.6px; color: var(--muted); margin: 26px 0 8px; }

/* ── file view and commits ────────────────────────────────────────────── */
pre {
  margin: 0 0 18px; padding: 14px 16px; overflow-x: auto;
  background: var(--panel); border: 1px solid var(--line);
  font: 13.5px/1.55 "DM Mono", ui-monospace, monospace; tab-size: 4;
}
a.line { display: inline-block; width: 3.6em; margin-right: 1.2em; text-align: right; color: var(--muted); }
a.line:hover { color: var(--accent); text-decoration: none; }
#content > p { color: var(--subtle); }
a.h { color: var(--title); }
.A, span.i, a.i { color: var(--add); }
.D, span.d, a.d { color: var(--del); }
#content .h, #content .i, #content .d { text-decoration: none; }

/* ── README (landing page) ────────────────────────────────────────────── */
.readme { max-width: 900px; }
.readme h1, .readme h2, .readme h3 { display: block; text-transform: none; letter-spacing: 0; color: var(--title); }
.readme h1 { font-size: 22px; margin: 26px 0 10px; }
.readme h1::before, .readme h1::after { content: none; }
.readme h2 { font-size: 17px; margin: 28px 0 10px; padding-bottom: 4px; border-bottom: 1px dashed var(--line); }
.readme h3 { font-size: 15px; margin: 22px 0 8px; }
.readme h2::before { content: "## "; color: var(--muted); }
.readme h3::before { content: "### "; color: var(--muted); }
.readme p, .readme li { color: var(--fg); }
.readme img { max-width: 100%; height: auto; }
.readme code { background: var(--panel); border: 1px solid var(--line); padding: 0 4px; font-size: 13px; }
.readme pre code { border: 0; padding: 0; background: none; }
.readme blockquote { margin: 14px 0; padding: 2px 14px; border-left: 2px solid var(--accent); color: var(--subtle); }
.readme table { border-collapse: collapse; margin: 14px 0; display: block; overflow-x: auto; }
.readme th, .readme td { border: 1px solid var(--line); padding: 5px 10px; text-align: left; }
.readme th { color: var(--muted); font-weight: 500; }
.readme details { margin: 12px 0; }
.readme summary { cursor: pointer; color: var(--link); }

/* ── theme switcher (built by theme.js) ───────────────────────────────── */
#theme {
  position: absolute; top: 18px; right: 24px;
  font-size: 12px; color: var(--muted); letter-spacing: .5px; user-select: none;
}
#theme span { margin-left: 14px; }
#theme button {
  font: inherit; color: var(--subtle); background: none; border: 0; padding: 2px 6px; margin-left: 2px; cursor: pointer;
}
#theme button[aria-pressed="true"] { color: var(--bg); background: var(--accent); }
#theme button:hover { color: var(--accent); }
#theme button[aria-pressed="true"]:hover { color: var(--bg); }
#theme button:focus-visible { outline: 1px dashed var(--accent); outline-offset: 2px; }

footer.site {
  margin-top: 36px; padding-top: 12px; border-top: 1px dashed var(--line);
  font-size: 12px; color: var(--muted);
}

@media (max-width: 720px) {
  body { padding: 64px 14px 32px; font-size: 13.5px; }
  #theme { left: 14px; right: auto; top: 14px; }
  #theme span:first-child { margin-left: 0; }
  #content td, #content th { padding-right: 10px; }
}