@font-face { font-family: "Plex Sans"; font-weight: 400; font-display: swap; src: url("fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Plex Sans"; font-weight: 500; font-display: swap; src: url("fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Plex Sans"; font-weight: 600; font-display: swap; src: url("fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Plex Sans"; font-weight: 400; font-display: swap; src: url("fonts/ibm-plex-sans-devanagari-devanagari-400-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Plex Sans"; font-weight: 600; font-display: swap; src: url("fonts/ibm-plex-sans-devanagari-devanagari-600-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Plex Mono"; font-weight: 400; font-display: swap; src: url("fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Plex Mono"; font-weight: 500; font-display: swap; src: url("fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/source-serif-4-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif"; font-weight: 400; font-style: italic; font-display: swap; src: url("fonts/source-serif-4-latin-400-italic.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif"; font-weight: 600; font-style: normal; font-display: swap; src: url("fonts/source-serif-4-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif"; font-weight: 400; font-display: swap; src: url("fonts/noto-serif-devanagari-devanagari-400-normal.woff2") format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }

:root {
  --page: #f6f5f2;
  --sheet: #ffffff;
  --ink: #15171a;
  --muted: #5b6066;
  --faint: #8a8f95;
  --line: #dcdad4;
  --line-strong: #bdbab2;
  --green: #14703a;
  --amber: #9c5700;
  --red: #b11f2f;
  --grey: #5b6066;
  --green-tint: rgba(20, 112, 58, .10);
  --amber-tint: rgba(156, 87, 0, .12);
  --red-tint: rgba(177, 31, 47, .12);
  --grey-tint: rgba(91, 96, 102, .10);
  --focus: #1b4fd1;
  --sans: "Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --serif: "Source Serif", "Source Serif 4", Georgia, "Times New Roman", serif;
  --radius: 6px;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --page: #0f1113;
  --sheet: #171a1d;
  --ink: #ecebe7;
  --muted: #a4a8ad;
  --faint: #7c8187;
  --line: #2a2e32;
  --line-strong: #41464b;
  --green: #5ccf8a;
  --amber: #f0b34a;
  --red: #ff7b8b;
  --grey: #a4a8ad;
  --green-tint: rgba(92, 207, 138, .14);
  --amber-tint: rgba(240, 179, 74, .14);
  --red-tint: rgba(255, 123, 139, .15);
  --grey-tint: rgba(164, 168, 173, .12);
  --focus: #8fb0ff;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --page: #0f1113; --sheet: #171a1d; --ink: #ecebe7; --muted: #a4a8ad; --faint: #7c8187; --line: #2a2e32; --line-strong: #41464b;
    --green: #5ccf8a; --amber: #f0b34a; --red: #ff7b8b; --grey: #a4a8ad;
    --green-tint: rgba(92, 207, 138, .14); --amber-tint: rgba(240, 179, 74, .14); --red-tint: rgba(255, 123, 139, .15); --grey-tint: rgba(164, 168, 173, .12);
    --focus: #8fb0ff; color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--page); color: var(--ink); font: 400 16px/1.55 var(--sans); }
h1, h2, h3 { font-weight: 600; letter-spacing: -.01em; line-height: 1.2; margin: 0; }
p { margin: 0; }
a { color: inherit; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 3px; }
button, input, select, textarea { font: inherit; color: inherit; }
.mono { font-family: var(--mono); font-size: .92em; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--ink); background: var(--ink); color: var(--page); border-radius: var(--radius); font-weight: 500; cursor: pointer; text-decoration: none; }
.btn:hover { opacity: .9; }
.btn:disabled { opacity: .5; cursor: default; }
.btn.quiet { background: transparent; color: var(--ink); border-color: var(--line-strong); }
.btn.quiet:hover { border-color: var(--ink); opacity: 1; }

.field { display: grid; gap: 6px; font-size: .88rem; color: var(--muted); min-width: 0; }
.field input, .field select, .field textarea { width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--line-strong); background: var(--sheet); border-radius: var(--radius); color: var(--ink); font-size: 1rem; }
.field textarea { resize: vertical; min-height: 84px; }

.v-green { --v: var(--green); --vt: var(--green-tint); }
.v-amber { --v: var(--amber); --vt: var(--amber-tint); }
.v-red { --v: var(--red); --vt: var(--red-tint); }
.v-grey { --v: var(--grey); --vt: var(--grey-tint); }
.word { font-weight: 600; color: var(--v); white-space: nowrap; }
.glyph { display: inline-block; width: 1.1em; text-align: center; font-family: var(--sans); }
mark.m { background: var(--vt); color: inherit; padding: 0 1px; border-radius: 2px; text-decoration-line: underline; text-decoration-color: var(--v); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; }
mark.m.v-green { text-decoration-style: solid; }
mark.m.v-amber { text-decoration-style: dashed; }
mark.m.v-red { text-decoration-style: wavy; }
mark.m.v-grey { text-decoration-style: dotted; }
mark.m.on, mark.m:focus-visible { outline: 2px solid var(--v); outline-offset: 1px; }
input[type="file"]::file-selector-button { margin-right: 12px; padding: 6px 12px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--page); color: var(--ink); cursor: pointer; font: inherit; font-size: .9rem; }
input[type="file"]::file-selector-button:hover { border-color: var(--ink); }
input[type="date"] { min-height: 44px; }