/* Raster 2: tokens, type and components in one file. Generated from tokens.json and bundle.css. */

@font-face { font-family: "TeX Gyre Heros"; src: url("fonts/texgyreheros-regular.otf") format("opentype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "TeX Gyre Heros"; src: url("fonts/texgyreheros-bold.otf") format("opentype"); font-weight: 700; font-style: normal; font-display: swap; }

/* Colour: light is the default; dark by data-theme="dark" or by the OS when no data-theme is set */
:root, [data-theme="light"] {
  color-scheme: light;
  --paper: #ffffff;
  --paper-2: #f2f2f2;
  --rule: #d9d9d9;
  --rule-strong: #8a8a8a;
  --ink: #0d0d0d;
  --ink-2: #595959;
  --on-ink: var(--paper);
  --signal: #f54a00;
  --on-signal: #0d0d0d;
  --signal-wash: #ffeee5;
  --st-neutral: #475569;
  --st-neutral-bg: #f1f5f9;
  --st-progress: #1d4ed8;
  --st-progress-bg: #eff6ff;
  --st-success: #166534;
  --st-success-bg: #f0fdf4;
  --st-warning: #854d0e;
  --st-warning-bg: #fefce8;
  --st-danger: #991b1b;
  --st-danger-bg: #fef2f2;
  --st-suggest: #6b21a8;
  --st-suggest-bg: #faf5ff;
}
[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0f0f0f;
  --paper-2: #1a1a1a;
  --rule: #2e2e2e;
  --rule-strong: #727272;
  --ink: #ececec;
  --ink-2: #a3a3a3;
  --on-ink: var(--paper);
  --signal: #ff5c1f;
  --on-signal: #0d0d0d;
  --signal-wash: #2e1408;
  --st-neutral: #e2e8f0;
  --st-neutral-bg: #1e293b;
  --st-progress: #bfdbfe;
  --st-progress-bg: #172554;
  --st-success: #bbf7d0;
  --st-success-bg: #142e22;
  --st-warning: #fef08a;
  --st-warning-bg: #352912;
  --st-danger: #fecaca;
  --st-danger-bg: #3b171c;
  --st-suggest: #e9d5ff;
  --st-suggest-bg: #301b45;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
  color-scheme: dark;
  --paper: #0f0f0f;
  --paper-2: #1a1a1a;
  --rule: #2e2e2e;
  --rule-strong: #727272;
  --ink: #ececec;
  --ink-2: #a3a3a3;
  --on-ink: var(--paper);
  --signal: #ff5c1f;
  --on-signal: #0d0d0d;
  --signal-wash: #2e1408;
  --st-neutral: #e2e8f0;
  --st-neutral-bg: #1e293b;
  --st-progress: #bfdbfe;
  --st-progress-bg: #172554;
  --st-success: #bbf7d0;
  --st-success-bg: #142e22;
  --st-warning: #fef08a;
  --st-warning-bg: #352912;
  --st-danger: #fecaca;
  --st-danger-bg: #3b171c;
  --st-suggest: #e9d5ff;
  --st-suggest-bg: #301b45;
  }
}

/* Space, radius, stroke, families */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --space-6: 64px;
  --radius-1: 4px;
  --radius-2: 8px;
  --radius-0: 0;
  --stroke-hair: 1px;
  --stroke-rule: 2px;
  --font-sans: "TeX Gyre Heros", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* Type: apply only through these classes */
.t-id { font-family: var(--font-sans); font-size: 96px; line-height: 88px; font-weight: 700; letter-spacing: -0.045em; }
.t-figure { font-family: var(--font-sans); font-size: 40px; line-height: 40px; font-weight: 400; letter-spacing: -0.03em; }
.t-title { font-family: var(--font-sans); font-size: 24px; line-height: 28px; font-weight: 700; letter-spacing: -0.015em; }
.t-heading { font-family: var(--font-sans); font-size: 18px; line-height: 24px; font-weight: 700; letter-spacing: -0.01em; }
.t-body { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.t-strong { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 700; }
.t-small { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.t-label { font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: 0.08em; }
.t-mono { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 400; }

/* Components */
/* Raster components. Load after tokens.css.
   Type comes only from the t-* classes; these rules set colour, space and lines. */

body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
.t-label { text-transform: uppercase; }
.t-figure, .rs-num, .rs-table td { font-variant-numeric: tabular-nums; }
.rs-muted { color: var(--ink-2); }

/* Mark: the one way to put signal on words: a fill with ink-dark text. Inside a sentence it keeps its spaces; when it opens a line (metric context, field error, attention tag) it overhangs by space-1 so the word stays on the column's alignment. */
.rs-mark { background: var(--signal); color: var(--on-signal); padding: 0 var(--space-1); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.rs-metric__context > .rs-mark:only-child { margin-left: calc(-1 * var(--space-1)); }

/* Focus: one ring for everything interactive */
.rs-btn:focus-visible, .rs-input:focus-visible { outline: var(--stroke-rule) solid var(--ink); outline-offset: 2px; }

/* PageHeader: the identifier, the meta line and the actions share one baseline */
.rs-header { display: flex; align-items: last baseline; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: var(--stroke-rule) solid var(--ink); }
.rs-header__id { margin: 0; white-space: nowrap; }
.rs-header__body { flex: 1; min-width: 0; }
.rs-header__title { margin: 0; }
.rs-header__meta { margin: 0; color: var(--ink-2); }
.rs-header__actions { display: flex; gap: var(--space-2); }

/* Button */
.rs-btn { display: inline-flex; align-items: center; gap: var(--space-2); box-sizing: border-box; height: 32px; padding: 0 var(--space-3); border: var(--stroke-hair) solid var(--ink); border-radius: var(--radius-0); background: var(--paper); color: var(--ink); font-family: var(--font-sans); cursor: pointer; white-space: nowrap; }
.rs-btn:hover { background: var(--ink); color: var(--on-ink); }
.rs-btn--primary { background: var(--ink); color: var(--on-ink); }
.rs-btn--primary:hover { text-decoration: underline; text-underline-offset: 3px; }
.rs-btn--quiet { border-color: transparent; background: transparent; padding: 0 var(--space-2); }
.rs-btn--quiet:hover { background: transparent; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.rs-btn:disabled, .rs-btn:disabled:hover { background: transparent; border-color: var(--rule); color: var(--ink-2); cursor: not-allowed; text-decoration: none; }

/* Field: state lives in aria-invalid, not in a class */
.rs-field { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); min-width: 0; }
.rs-field__label { color: var(--ink); }
.rs-input { box-sizing: border-box; width: 100%; height: 32px; padding: 0 var(--space-2); border: var(--stroke-hair) solid var(--rule-strong); border-radius: var(--radius-0); background: var(--paper); color: var(--ink); font-family: var(--font-sans); }
.rs-input:focus-visible { outline-offset: 0; border-color: var(--ink); }
.rs-input::placeholder { color: var(--ink-2); }
.rs-input:disabled { background: transparent; border-color: var(--rule); color: var(--ink-2); }
.rs-input.rs-num { text-align: right; }
.rs-field__hint { color: var(--ink-2); }
.rs-input[aria-invalid="true"] { border-color: var(--signal); box-shadow: inset 0 0 0 1px var(--signal); }
.rs-input[aria-invalid="true"] + .rs-field__hint { background: var(--signal); color: var(--on-signal); padding: 0 var(--space-1); margin-left: calc(-1 * var(--space-1)); }

/* Tag: a status word. Neutral and done are bare words; only attention gets a fill, overhanging so the words stay aligned in a column. */
.rs-tag { display: inline-block; color: var(--ink); white-space: nowrap; }
.rs-tag--attn { background: var(--signal); color: var(--on-signal); padding: 0 var(--space-1); margin: 0 calc(-1 * var(--space-1)); }
.rs-tag--done { color: var(--ink-2); }

/* Metric */
.rs-metrics { display: flex; border-top: var(--stroke-hair) solid var(--ink); }
.rs-metric { flex: 1; min-width: 0; padding: var(--space-2) var(--space-3) var(--space-3); border-left: var(--stroke-hair) solid var(--rule); }
.rs-metric:first-child { border-left: 0; padding-left: 0; }
.rs-metric__label { color: var(--ink-2); }
.rs-metric__value { margin: var(--space-2) 0 var(--space-1); white-space: nowrap; }
.rs-metric__unit { margin-left: var(--space-1); color: var(--ink-2); letter-spacing: 0; }
.rs-metric__context { color: var(--ink-2); }

/* Table */
.rs-table { width: 100%; border-collapse: collapse; }
.rs-table th { text-align: left; padding: var(--space-2) var(--space-2) var(--space-1); border-bottom: var(--stroke-rule) solid var(--ink); color: var(--ink-2); white-space: nowrap; }
.rs-table td { padding: var(--space-1) var(--space-2); border-bottom: var(--stroke-hair) solid var(--rule); vertical-align: baseline; }
.rs-table th:first-child, .rs-table td:first-child { padding-left: 0; }
.rs-table th:last-child, .rs-table td:last-child { padding-right: 0; }
.rs-table .rs-num { text-align: right; }
.rs-table .rs-idx { color: var(--ink-2); width: 1%; }
.rs-table tbody tr:hover td { background: var(--paper-2); }
.rs-table tbody tr.rs-row--attn td { background: var(--signal-wash); }
.rs-table tfoot td { border-top: var(--stroke-rule) solid var(--ink); border-bottom: 0; }

/* Touch: controls grow to 44px under a finger */
@media (pointer: coarse) {
  .rs-btn, .rs-input { height: 44px; }
}

@media print {
  body { background: #fff; color: #000; }
  .rs-btn, .rs-header__actions { display: none; }
  .rs-table tbody tr td { background: none; }
}