/* UEBERCAPP · Grootboek — the book of record.
   Provenance typography over warm paper: authored (serif), verified (mono),
   inferred (tinted sans) + quiet sans chrome. Emphasis via outlines and soft
   tints, never saturated fills. No pure black. Dither is strictly budgeted to
   machine-voice surfaces. See the design system readme for the full brief. */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Serif:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* ---- Warm paper neutrals ---- */
  --paper-50: #FBFAF6;
  --paper-100: #F7F6F0;
  --paper-200: #F1F0E8;
  --paper-300: #E8E6DD;
  --paper-400: #D8D5CA;
  --paper-500: #B4B1A5;
  --paper-600: #8C897F;
  --paper-700: #55524A;
  --paper-800: #3A3830;
  --paper-900: #26241D; /* ink — darkest fill permitted; never #000 */

  --canvas: #F3F2EA;
  --surface-1: #FCFBF7; /* primary card */
  --surface-0: #F1F0E8; /* inset / metric card */
  --surface-2: #F7F6F0; /* receipt block (machine voice) */

  --text-primary: #26241D;
  --text-secondary: #55524A;
  --text-muted: #8C897F;
  --text-inverse: #FBFAF6;

  --border: #E5E3DA;
  --border-strong: #D8D5CA;
  --border-stronger: #B4B1A5;

  /* Federation — one fixed hue per app, outline-only, never a fill */
  --fed-agile-air-line: #378ADD;   --fed-agile-air-ink: #185FA5;
  --fed-quizmass-line:  #7F77DD;   --fed-quizmass-ink:  #534AB7;
  --fed-drammstein-line:#D2185C;   --fed-drammstein-ink:#9C0E42;
  --fed-capp-qr-line:   #1F9E92;   --fed-capp-qr-ink:   #116055;
  --fed-vibelearning-line:#4F46E5; --fed-vibelearning-ink:#3730B0;

  /* Lifecycle chips — tint bg + same-family dark ink */
  --status-draft-bg:      #F7E9C8; --status-draft-ink:      #8A5A0E;
  --status-review-bg:     #DCE9F7; --status-review-ink:     #1F5D9E;
  --status-published-bg:  #D6EEDF; --status-published-ink:  #157A56;
  --status-deprecated-bg: #E8E6DD; --status-deprecated-ink: #6B685F;

  /* Result semantics — receipt outcomes + catalog health only */
  --success-ink: #157A56; --success-bg: #D6EEDF; --success-line: #8FCBAF;
  --warning-ink: #92610F; --warning-bg: #FBEFD3; --warning-line: #E4BE72;
  --danger-ink:  #9E3320; --danger-bg:  #F6DED8; --danger-line:  #DFA093;

  --focus-ring: #8C897F;

  /* Type — one superfamily, three voices + chrome */
  --font-authored: 'IBM Plex Serif', Georgia, 'Times New Roman', serif;
  --font-verified: 'IBM Plex Mono', 'SF Mono', Menlo, monospace;
  --font-chrome:   'IBM Plex Sans', system-ui, -apple-system, sans-serif;

  /* Radius — by voice */
  --radius-machine: 3px;
  --radius-machine-tight: 2px;
  --radius-authored: 10px;
  --radius-chrome: 12px;
  --radius-full: 999px;

  --shadow-card: 0 1px 2px rgba(38, 36, 29, 0.04);
  --shadow-raised: 0 2px 8px rgba(38, 36, 29, 0.06);

  /* Dither — 2x2 checker, 4px period, 50% coverage */
  --dither-period: 4px;
  --dither-cell: 2px;
  --dither-ink: #888780;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--canvas);
  color: var(--text-primary);
  font-family: var(--font-chrome);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, input { font: inherit; }

.page-shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }

/* ---- The 1-bit dither accent (machine-voice surfaces only) ---- */
.gb-dither {
  background-image:
    linear-gradient(45deg, var(--dither-ink) 25%, transparent 25%, transparent 75%, var(--dither-ink) 75%),
    linear-gradient(45deg, var(--dither-ink) 25%, transparent 25%, transparent 75%, var(--dither-ink) 75%);
  background-size: var(--dither-period) var(--dither-period);
  background-position: 0 0, var(--dither-cell) var(--dither-cell);
}

/* ---- Top chrome ---- */
.topnav {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
  background: var(--surface-1);
}
.topnav .page-shell { display: flex; align-items: center; gap: 16px; width: min(1120px, calc(100% - 40px)); }
.wordmark { display: inline-flex; align-items: center; gap: 10px; }
.wordmark-text { font-family: var(--font-authored); font-weight: 500; font-size: 18px; letter-spacing: -0.01em; color: var(--text-primary); }
.wordmark-strip { width: 42px; height: 14px; border-radius: var(--radius-machine); --dither-ink: #B4B1A5; }
.topnav nav { display: flex; gap: 16px; }
.topnav nav a {
  font-weight: 500; font-size: 13px; color: var(--text-secondary);
  padding-bottom: 2px; border-bottom: 2px solid transparent;
}
.topnav nav a:hover { color: var(--text-primary); }
.topnav nav a.active { color: var(--text-primary); border-bottom-color: var(--border-stronger); }
.topnav .session { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.topnav .session-email { font-family: var(--font-verified); font-size: 12px; color: var(--text-muted); }
.topnav .session form { margin: 0; }
.session-link { padding: 0; border: 0; background: transparent; cursor: pointer; color: var(--text-secondary); font-weight: 500; font-size: 13px; }
.session-link:hover { color: var(--text-primary); }

/* ---- Flash ---- */
.flash-stack { position: fixed; z-index: 10; top: 18px; right: 18px; display: grid; width: min(420px, calc(100% - 36px)); gap: 8px; }
.flash {
  padding: 12px 14px; border-radius: var(--radius-machine);
  font-size: 13px; box-shadow: var(--shadow-raised);
  border: 1px solid var(--success-line); background: var(--success-bg); color: var(--success-ink);
}
.flash-alert { border-color: var(--danger-line); background: var(--danger-bg); color: var(--danger-ink); }

/* ---- Page header (flat paper, chrome heading) ---- */
.page-head { padding: 40px 0 28px; }
.page-head .eyebrow { color: var(--text-muted); }
.page-head h1 {
  margin: 6px 0 8px; font-family: var(--font-chrome); font-weight: 600;
  font-size: 30px; letter-spacing: -0.01em; line-height: 1.2; color: var(--text-primary);
}
.page-head .lede { max-width: 680px; margin: 0; color: var(--text-secondary); font-size: 15px; }
.page-head .source-link { display: inline-block; margin-top: 14px; color: var(--accent); font-size: 15px; font-weight: 650; border-bottom: 1px solid currentColor; }
.page-head .fingerprint-line { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; }
.page-head .fingerprint-line code { font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); overflow-wrap: anywhere; }
.page-head .version-label { color: var(--text-muted); font-size: 12px; }
.page-head .fingerprint-link { color: var(--text-secondary); font-family: var(--font-verified); font-size: 12px; border-bottom: 1px solid var(--border-stronger); }
.page-head .fingerprint-link:hover { color: var(--text-primary); }

.eyebrow {
  font-family: var(--font-chrome); font-weight: 500;
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted);
}

.back-link { display: inline-block; margin-bottom: 20px; color: var(--text-secondary); font-size: 13px; }
.back-link:hover { color: var(--text-primary); }

/* ---- Metric cards (surface-0, machine voice) ---- */
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 28px; }
.metric-card {
  position: relative; overflow: hidden;
  padding: 16px 18px; border: 1px solid var(--border);
  border-radius: var(--radius-machine); background: var(--surface-0);
}
.metric-card .metric-value { font-family: var(--font-verified); font-weight: 500; font-size: 24px; line-height: 1.2; color: var(--text-primary); }
.metric-card .metric-label { margin-top: 4px; font-size: 12px; color: var(--text-muted); }
.metric-card .metric-wash { position: absolute; inset: 0 0 auto auto; width: 40px; height: 40px; opacity: 0.22; --dither-ink: #B4B1A5; border-bottom-left-radius: var(--radius-machine); pointer-events: none; }

/* ---- Section heading ---- */
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.section-heading.compact { align-items: center; }
.section-heading h2 { margin: 4px 0 0; font-family: var(--font-chrome); font-weight: 600; font-size: 17px; }
.section-actions { display: flex; align-items: center; gap: 14px; }
.section-actions form { margin: 0; }

.text-link { color: var(--text-secondary); font-weight: 500; font-size: 13px; border-bottom: 1px solid transparent; }
.text-link:hover { color: var(--text-primary); border-bottom-color: var(--border-stronger); }

/* Buttons — outline / soft tint, never a saturated fill */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 34px; padding: 8px 14px;
  border: 1px solid var(--border-stronger); border-radius: var(--radius-machine);
  background: var(--surface-1); color: var(--text-primary);
  font-family: var(--font-chrome); font-weight: 500; font-size: 13px; cursor: pointer;
  transition: border-color 140ms ease, background 140ms ease;
}
.button:hover { border-color: var(--paper-600); background: var(--surface-0); }
.button:disabled { cursor: wait; opacity: 0.55; }
.button-quiet { border-color: var(--border); background: transparent; color: var(--text-secondary); }

.seed-send-panel h2 { margin: 4px 0 4px; font-size: 18px; }
.seed-send-copy { margin: 0; color: var(--text-secondary); font-size: 13px; }
.seed-send-trigger { justify-content: space-between; width: 100%; margin-top: 16px; }
.seed-send-trigger [aria-hidden] { font-size: 17px; line-height: 1; }
.seed-send-dialog { width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow-y: auto; border: 1px solid var(--border-strong); border-radius: var(--radius-chrome); background: var(--surface-1); color: var(--text-primary); box-shadow: 0 16px 50px rgba(38, 36, 29, .18); }
.seed-send-dialog::backdrop { background: rgba(38, 36, 29, .48); }
.seed-send-dialog-content { padding: 24px; }
.seed-send-dialog-head { display: flex; justify-content: space-between; align-items: start; gap: 20px; }
.seed-send-dialog-head h2 { margin: 4px 0 0; font-size: 22px; }
.seed-send-dialog-close { width: 30px; height: 30px; padding: 0; border: 1px solid transparent; border-radius: var(--radius-machine); background: transparent; color: var(--text-muted); font-size: 24px; line-height: 1; cursor: pointer; }
.seed-send-dialog-close:hover { border-color: var(--border); color: var(--text-primary); }
.seed-send-dialog-content > p { margin: 14px 0 20px; color: var(--text-secondary); font-size: 13px; overflow-wrap: anywhere; }
.seed-send-dialog-content > p code { font-family: var(--font-verified); font-size: 12px; }
.seed-send-choices { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; }
.seed-send-choices legend { margin-bottom: 9px; color: var(--text-primary); font-size: 13px; font-weight: 600; }
.seed-send-choice { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--radius-machine); cursor: pointer; }
.seed-send-choice:hover, .seed-send-choice:focus-within { border-color: var(--border-stronger); background: var(--surface-0); }
.seed-send-choice:has(input:checked) { border-color: var(--paper-700); background: var(--surface-0); }
.seed-send-choice input { flex: none; width: 16px; height: 16px; margin: 0; accent-color: var(--paper-800); }
.seed-send-choice span { display: grid; gap: 2px; min-width: 0; }
.seed-send-choice strong { font-size: 13px; font-weight: 500; }
.seed-send-choice small { color: var(--text-muted); font: 11px var(--font-verified); overflow-wrap: anywhere; }
.seed-send-form .seed-send-caution { margin: 16px 0; color: var(--text-secondary); font-size: 12px; }
.seed-send-dialog-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding-top: 16px; border-top: 1px solid var(--border); }
.seed-send-confirm:not(:disabled) { border-color: var(--paper-700); background: var(--surface-0); }
.seed-send-history { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.seed-send-history > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; color: var(--text-secondary); font-size: 12px; font-weight: 500; cursor: pointer; }
.seed-send-history > summary::-webkit-details-marker { display: none; }
.seed-send-history > summary > span { color: var(--text-muted); font-family: var(--font-verified); font-size: 11px; }
.seed-send-history[open] > summary [aria-hidden] { display: inline-block; transform: rotate(180deg); }
.seed-send-event-list { margin-top: 10px; }
.seed-send-event-list a { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--border); }
.seed-send-history a:hover strong { text-decoration: underline; }
.seed-send-event { display: grid; min-width: 0; }
.seed-send-event strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 500; }
.seed-send-event time { color: var(--text-muted); font: 11px var(--font-verified); }
.seed-send-links { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 14px; }
.seed-delivery-panel { max-width: none; }
.seed-delivery-panel code { font-family: var(--font-verified); }
.seed-delivery-panel h2 { font-size: 23px; }
.seed-delivery-status-copy { margin: -6px 0 18px; color: var(--text-secondary); font-size: 13px; }
.seed-delivery-error { color: var(--danger-ink); }
.seed-delivery-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 18px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.seed-delivery-facts dt { margin-bottom: 4px; color: var(--text-muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.seed-delivery-facts dd { margin: 0; overflow-wrap: anywhere; font-size: 13px; }
.seed-delivery-facts time { font-family: var(--font-verified); font-size: 12px; }
.seed-delivery-links { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 20px; }
.seed-delivery-links [hidden] { display: none; }
.delivery-events { margin: 32px 0 72px; }
.delivery-events .artifact-table { margin-bottom: 0; }
.delivery-log tbody tr { cursor: default; }
.delivery-log tbody tr:hover { background: transparent; }
.delivery-log .cell-title, .delivery-log .cell-path { white-space: normal; overflow: visible; text-overflow: clip; }
.delivery-log .cell-path { display: block; }
.delivery-log-value { display: block; min-width: 0; }
.delivery-log-action { display: block; color: var(--text-secondary); font-size: 12px; }
.delivery-log-message { display: block; margin-top: 5px; color: var(--danger-ink); font-size: 11px; overflow-wrap: anywhere; }
.delivery-overview-head, .delivery-overview-row { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.2fr) minmax(0, 1fr) auto; align-items: center; gap: 18px; }
.delivery-overview-head { padding: 8px 14px; border-bottom: 1px solid var(--border-strong); color: var(--text-muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.delivery-overview-head span:last-child { text-align: right; }
.delivery-overview-list { margin: 0 0 72px; padding: 0; list-style: none; }
.delivery-overview-list li { border-bottom: 1px solid var(--border); }
.delivery-overview-row { padding: 15px 14px; border-radius: var(--radius-machine); }
.delivery-overview-row:hover, .delivery-overview-row:focus-visible { background: var(--surface-1); }
.delivery-overview-row:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
.delivery-overview-seed, .delivery-overview-target, .delivery-overview-meta { display: grid; gap: 3px; min-width: 0; }
.delivery-overview-seed strong, .delivery-overview-target strong { font-size: 14px; font-weight: 500; line-height: 1.35; overflow-wrap: anywhere; }
.delivery-overview-seed small { display: inline-flex; align-items: center; gap: 7px; color: var(--text-muted); font: 11px var(--font-verified); }
.delivery-overview-target small, .delivery-overview-meta small { color: var(--text-muted); font-size: 11px; overflow-wrap: anywhere; }
.delivery-overview-meta time { color: var(--text-secondary); font: 12px var(--font-verified); }
.delivery-overview-status { display: flex; align-items: center; justify-content: flex-end; gap: 12px; white-space: nowrap; }
.delivery-overview-status > [aria-hidden] { color: var(--text-muted); font-size: 17px; }
.targets-page { padding-bottom: 72px; }
.targets-head { padding-bottom: 30px; }
.targets-head-row { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.targets-head-row .button { flex: none; }
.target-list { display: grid; gap: 12px; }
.target-card { padding: 20px 22px; border: 1px solid var(--border); border-radius: var(--radius-chrome); background: var(--surface-1); }
.target-card-disabled { background: var(--surface-2); }
.target-card-head { display: flex; justify-content: space-between; align-items: start; gap: 16px; }
.target-card h3 { margin: 0; font-size: 18px; line-height: 1.3; }
.target-key { display: block; margin-top: 3px; font: 12px var(--font-verified); color: var(--text-muted); }
.target-card-head .chip { height: 24px; padding-inline: 10px; font-family: var(--font-chrome); }
.target-facts { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(0, 2fr); gap: 20px; margin: 20px 0; }
.target-facts div { min-width: 0; }
.target-facts dt { margin-bottom: 3px; font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; }
.target-facts dd { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.target-facts dd a { font-family: var(--font-verified); font-size: 12px; border-bottom: 1px solid var(--border-stronger); }
.target-facts dd a:hover { color: var(--text-primary); border-bottom-color: var(--paper-700); }
.target-card-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.target-byline { color: var(--text-muted); font-size: 12px; overflow-wrap: anywhere; }
.target-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.target-actions form { margin: 0; }
.target-edit { position: relative; }
.target-edit > summary { list-style: none; }
.target-edit > summary::-webkit-details-marker { display: none; }
.target-edit-panel { position: absolute; z-index: 2; top: calc(100% + 6px); right: 0; width: min(320px, calc(100vw - 40px)); padding: 16px; border: 1px solid var(--border-strong); border-radius: var(--radius-chrome); background: var(--surface-1); box-shadow: var(--shadow-raised); }
.target-rename label, .target-field label { display: block; margin-bottom: 6px; color: var(--text-secondary); font-size: 12px; font-weight: 500; }
.target-rename-controls { display: flex; gap: 8px; }
.target-rename-controls input[type=text] { min-width: 0; flex: 1; }
.target-rename input, .target-form input, .target-form select { min-height: 36px; padding: 7px 10px; border: 1px solid var(--border-stronger); border-radius: var(--radius-machine); background: var(--surface-1); color: var(--text-primary); }
.target-rename input[type=text], .target-form input:not([type=submit]), .target-form select { font-family: var(--font-verified); }
.target-form { margin-top: 28px; scroll-margin-top: 24px; }
.target-form h2 { margin: 4px 0 4px; font-size: 19px; }
.target-form > p { margin: 0 0 22px; color: var(--text-secondary); }
.target-form > p.seed-delivery-error { color: var(--danger-ink); }
.target-form-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 20px; }
.target-field { min-width: 0; }
.target-field input, .target-field select { width: 100%; }
.target-field small { display: block; margin-top: 5px; color: var(--text-muted); font-size: 11px; }
.target-form-actions { display: flex; justify-content: flex-end; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.target-history { margin-top: 28px; border-top: 1px solid var(--border); }
.target-history > summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 0; list-style: none; cursor: pointer; }
.target-history > summary::-webkit-details-marker { display: none; }
.target-history > summary .eyebrow { display: block; }
.target-history > summary strong { display: block; margin-top: 2px; font-size: 15px; }
.target-history-count { color: var(--text-muted); font-size: 12px; }
.target-history-count::after { content: "⌄"; display: inline-block; margin-left: 12px; font-size: 17px; }
.target-history[open] .target-history-count::after { transform: rotate(180deg); }
.target-history-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--border); }
.target-history-list li { padding: 14px 0; border-bottom: 1px solid var(--border); }
.target-history-main, .target-history-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.target-history-main strong { font-size: 13px; }
.target-history-main span { color: var(--text-secondary); font-size: 13px; }
.target-history-meta { margin-top: 3px; color: var(--text-muted); font: 11px var(--font-verified); }
.target-history-list p { margin: 6px 0 0; color: var(--text-secondary); font-size: 12px; }
.chip-enabled { background: var(--status-published-bg); color: var(--status-published-ink); }
.chip-disabled { background: var(--status-deprecated-bg); color: var(--status-deprecated-ink); }
.target-card-head .chip-enabled { background: var(--status-published-bg); color: var(--status-published-ink); }

/* ---- Fingerprint glyph ---- */
.fingerprint-glyph { display: inline-block; vertical-align: middle; border-radius: var(--radius-machine-tight); shape-rendering: crispEdges; }

/* ---- Federation pill (outline only) ---- */
.fed-pill {
  display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
  border: 1px solid var(--border-stronger); border-radius: var(--radius-machine);
  font-family: var(--font-chrome); font-weight: 500; font-size: 11px;
  color: var(--text-secondary); white-space: nowrap;
}
.fed-agile-air    { border-color: var(--fed-agile-air-line);    color: var(--fed-agile-air-ink); }
.fed-quizmass     { border-color: var(--fed-quizmass-line);     color: var(--fed-quizmass-ink); }
.fed-drammstein   { border-color: var(--fed-drammstein-line);   color: var(--fed-drammstein-ink); }
.fed-capp-qr      { border-color: var(--fed-capp-qr-line);      color: var(--fed-capp-qr-ink); }
.fed-vibelearning { border-color: var(--fed-vibelearning-line); color: var(--fed-vibelearning-ink); }

/* ---- Status chips (verified voice: mono, square, tint + ink) ---- */
.chip {
  display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
  border-radius: var(--radius-machine);
  font-family: var(--font-verified); font-weight: 500; font-size: 11px; white-space: nowrap;
  background: var(--status-deprecated-bg); color: var(--status-deprecated-ink);
}
.chip-published, .chip-cataloged, .chip-completed, .chip-created, .chip-success { background: var(--status-published-bg); color: var(--status-published-ink); }
.chip-review, .chip-running, .chip-updated, .chip-sending, .chip-downloading, .chip-processing, .chip-awaiting_confirmation { background: var(--status-review-bg); color: var(--status-review-ink); }
.chip-draft, .chip-submitted, .chip-queued, .chip-partial, .chip-uncertain { background: var(--warning-bg); color: var(--warning-ink); }
.chip-failed, .chip-rejected { background: var(--danger-bg); color: var(--danger-ink); }
.chip-deprecated, .chip-observed, .chip-superseded, .chip-archived, .chip-skipped { background: var(--status-deprecated-bg); color: var(--status-deprecated-ink); }

.count-badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 20px; padding: 0 7px;
  border: 1px solid var(--border-strong); border-radius: var(--radius-machine);
  font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); background: var(--surface-0);
}

/* ---- Catalog scan status ---- */
.scan-status {
  display: grid; gap: 6px; margin: 0 0 24px; padding: 14px 16px;
  border: 1px solid var(--border); border-radius: var(--radius-machine); background: var(--surface-2);
}
.scan-status .scan-line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.scan-status strong { font-weight: 600; font-size: 13px; }
.scan-status p, .scan-status small { margin: 0; color: var(--text-muted); font-size: 12px; }
.scan-status code { font-family: var(--font-verified); color: var(--text-secondary); }
.scan-status .scan-error { color: var(--danger-ink); }

/* ---- Artifact table (dense, bordered — a machine room, not a card grid) ---- */
.artifact-table { width: 100%; border-collapse: collapse; table-layout: fixed; margin-bottom: 64px; }
.artifact-table thead th {
  padding: 6px 8px; text-align: left; font-family: var(--font-chrome); font-weight: 500;
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted);
  border-bottom: 1px solid var(--border-strong);
}
.artifact-table thead th:first-child { padding-left: 0; }
.artifact-table thead th:last-child { padding-right: 0; text-align: right; }
.artifact-table tbody tr { position: relative; border-bottom: 1px solid var(--border); cursor: pointer; }
.artifact-table tbody tr:hover { background: var(--surface-0); }
.artifact-table tbody tr:focus-within { background: var(--surface-0); outline: 2px solid var(--focus-ring); outline-offset: -2px; }
.artifact-table tbody td { padding: 10px 8px; vertical-align: middle; }
.artifact-table tbody td:first-child { padding-left: 0; }
.artifact-table tbody td:last-child { padding-right: 0; text-align: right; }
/* Stretched-link row navigation: a real <a> in the title cell whose ::after
   overlays the whole row — keyboard-focusable, new-tab capable, no inline JS. */
.artifact-table .row-link { color: inherit; text-decoration: none; outline: none; }
.artifact-table .row-link::after { content: ""; position: absolute; inset: 0; }
.artifact-table .cell-title { display: block; font-family: var(--font-chrome); font-weight: 500; font-size: 14px; color: var(--text-primary); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.artifact-table .cell-path { font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.artifact-table .cell-fingerprint { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); }
.artifact-table .cell-count { font-family: var(--font-verified); font-size: 13px; color: var(--text-secondary); }
.artifact-table .cell-count.empty { color: var(--text-muted); }

.table-empty { padding: 24px 0 64px; color: var(--text-muted); font-size: 14px; }

/* ---- Index pages: search, facets, sort, pagination ---- */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.index-toolbar { display: grid; gap: 12px; margin: 0 0 14px; }
.index-search { position: relative; }
.index-search input[type=search] {
  width: 100%; padding: 11px 40px 11px 12px;
  border: 1px solid var(--border-stronger); border-radius: var(--radius-machine);
  background: var(--surface-1); color: var(--text-primary); font-size: 14px;
}
.index-search input[type=search]:focus { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.index-search input[type=search]::placeholder { color: var(--text-muted); }
.index-search-hint {
  position: absolute; top: 50%; right: 10px; transform: translateY(-50%);
  min-width: 20px; height: 20px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--border-strong); border-radius: var(--radius-machine-tight);
  font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); background: var(--surface-0);
  pointer-events: none;
}
.index-search input:focus + .index-search-hint, .index-search input:not(:placeholder-shown) + .index-search-hint { display: none; }
.index-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 14px; }
.index-filters label { display: grid; gap: 4px; }
.index-filters label span { font-family: var(--font-chrome); font-weight: 500; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
.index-filters select {
  height: 34px; padding: 0 28px 0 10px; font: inherit; font-size: 13px; color: var(--text-primary);
  border: 1px solid var(--border-stronger); border-radius: var(--radius-machine); background-color: var(--surface-1);
  appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M1 1l3 3 3-3' fill='none' stroke='%238C897F' stroke-width='1.2'/%3E%3C/svg%3E");
  background-position: right 10px center; background-repeat: no-repeat;
}
.index-filters select:focus { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.index-filters [hidden] { display: none; }
.index-clear { align-self: center; margin-top: 18px; }
.index-result-count { margin: 0 0 8px; font-family: var(--font-verified); font-size: 12px; color: var(--text-muted); }
.index-result-count strong { color: var(--text-primary); font-weight: 500; }
.seed-table { margin-bottom: 16px; }
.seed-table .sort-link { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-transform: inherit; }
.seed-table .sort-link:hover { color: var(--text-primary); }
.seed-table .sort-indicator { width: 8px; font-size: 9px; }
.seed-table th[aria-sort] .sort-link { color: var(--text-primary); }
.seed-table th[aria-sort=ascending] .sort-indicator::after { content: "▲"; }
.seed-table th[aria-sort=descending] .sort-indicator::after { content: "▼"; }
.seed-table .cell-date { font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); white-space: nowrap; }
.seed-table .cell-date .empty { color: var(--text-muted); }
.seed-table mark { background: var(--status-draft-bg); color: inherit; border-radius: var(--radius-machine-tight); padding: 0 1px; }
.index-empty { display: flex; gap: 12px; align-items: baseline; padding: 24px 0; }
.index-empty[hidden] { display: none; }
.index-empty p { margin: 0; }
.receipt-results { transition: opacity 120ms ease 150ms; }
.receipt-results[aria-busy=true] { opacity: 0.55; }
.receipt-results .receipt-list { padding-bottom: 16px; }
.pagination { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0 0 64px; }
.pagination .page-link {
  display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 10px;
  border: 1px solid var(--border-strong); border-radius: var(--radius-machine);
  font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); background: var(--surface-1);
}
.pagination a.page-link:hover { border-color: var(--border-stronger); color: var(--text-primary); }
.pagination .page-link.current { border-color: var(--paper-700); color: var(--text-primary); font-weight: 600; }
.pagination .page-link.disabled { color: var(--text-muted); background: transparent; border-color: var(--border); }
.pagination .page-gap { color: var(--text-muted); padding: 0 2px; }

/* ---- Detail layout ---- */
.detail-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.75fr); gap: 24px; padding-bottom: 80px; }
.detail-grid.receipt-detail { grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.8fr); }
.detail-grid aside { display: grid; align-content: start; gap: 16px; }
.receipt-main { display: grid; gap: 16px; }

.panel { padding: 20px 22px; border: 1px solid var(--border); border-radius: var(--radius-chrome); background: var(--surface-1); }

/* Entity / item list (machine facts) */
.entity-list { display: grid; gap: 10px; }
.entity-list article {
  display: grid; gap: 8px; padding: 14px 16px;
  border: 1px solid var(--border); border-radius: var(--radius-machine); background: var(--surface-0);
}
.entity-list .entity-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.entity-list strong { font-weight: 600; font-size: 13px; }
.entity-list .entity-app { font-family: var(--font-verified); font-size: 12px; color: var(--text-muted); }
.entity-list code { font-family: var(--font-verified); font-size: 12px; color: var(--text-secondary); overflow-wrap: anywhere; }
.entity-list small { font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); }
.item-reason { font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); }
.destination-host { font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); }
.destination-link { font-size: 12px; color: var(--text-secondary); border-bottom: 1px solid var(--border-stronger); }
.destination-link:hover { color: var(--text-primary); }

/* Facts panels (definition lists — verified values in mono) */
.facts dl { margin: 12px 0 0; display: grid; gap: 2px; }
.facts dl + dl { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.facts dl div { display: grid; grid-template-columns: 92px 1fr; gap: 12px; padding: 5px 0; align-items: baseline; }
.facts dt { color: var(--text-muted); font-size: 12px; }
.facts dd { margin: 0; font-family: var(--font-verified); font-size: 13px; text-align: right; color: var(--text-primary); overflow-wrap: anywhere; }
.facts dd.wrap { overflow-wrap: anywhere; }
.facts code { font-family: var(--font-verified); }
/* Compact receipt links on the artifact detail aside */
.mini-receipts { display: grid; gap: 8px; margin-top: 12px; }
.mini-receipt {
  display: grid; gap: 6px; padding: 10px 12px;
  border: 1px solid var(--border); border-radius: var(--radius-machine); background: var(--surface-0);
  color: inherit; text-decoration: none;
}
.mini-receipt:hover { background: var(--surface-2); }
.mini-receipt .mr-main { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mini-receipt .mr-bottom { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.mini-receipt .mr-details { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.mini-receipt .mr-env { font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); }
.mini-receipt .mr-file { font-size: 12px; color: var(--text-secondary); overflow-wrap: anywhere; }
.mini-receipt time { flex: none; font-family: var(--font-verified); font-size: 11px; color: var(--text-muted); text-align: right; }

/* Immutable versions within an author-facing Seed. */
.version-list { display: grid; gap: 8px; }
.version-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-machine); background: var(--surface-0); }
.version-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.version-link { color: var(--text-secondary); border-bottom: 1px solid var(--border-stronger); }
.version-link:hover { color: var(--text-primary); }
.version-meta { display: flex; align-items: center; justify-content: flex-end; gap: 14px; color: var(--text-muted); font-family: var(--font-verified); font-size: 11px; text-align: right; }

.panel-link { display: inline-block; margin-top: 14px; font-size: 13px; color: var(--text-secondary); border-bottom: 1px solid var(--border-stronger); }
.panel-link:hover { color: var(--text-primary); }

.panel-heading-actions { gap: 12px; }
.panel-heading-actions .eyebrow { margin: 0; }

.kebab-menu { position: relative; flex: none; }
.kebab-menu > summary { list-style: none; }
.kebab-menu > summary::-webkit-details-marker { display: none; }
.kebab-trigger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; margin: 0; padding: 0;
  border: 1px solid transparent; border-radius: var(--radius-machine);
  background: transparent; color: var(--text-muted); cursor: pointer;
}
.kebab-trigger:hover,
.kebab-menu[open] > .kebab-trigger {
  color: var(--text-primary); border-color: var(--border); background: var(--surface-0);
}
.kebab-panel {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 20;
  min-width: 168px; padding: 4px;
  border: 1px solid var(--border); border-radius: var(--radius-chrome);
  background: var(--surface-1); box-shadow: var(--shadow-raised);
}
.kebab-item {
  display: block; padding: 8px 10px; border-radius: var(--radius-machine);
  color: var(--text-primary); font-size: 13px; text-decoration: none; white-space: nowrap;
}
.kebab-item:hover { background: var(--surface-0); }

.parse-error, .empty-state {
  padding: 14px 16px; border-radius: var(--radius-machine);
  border: 1px solid var(--danger-line); background: var(--danger-bg); color: var(--danger-ink); font-size: 13px;
}
.empty-state.neutral { border-color: var(--border); background: var(--surface-0); color: var(--text-muted); }

/* ---- Receipts list ---- */
.receipt-list { display: grid; gap: 10px; padding-bottom: 64px; }
.receipt-row {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 16px 18px; border: 1px solid var(--border); border-radius: var(--radius-machine); background: var(--surface-1);
}
.receipt-row:hover { background: var(--surface-0); }
.receipt-row .receipt-row-main { display: grid; gap: 6px; }
.receipt-row h3 { margin: 0; font-family: var(--font-chrome); font-weight: 500; font-size: 15px; }
.receipt-row .receipt-context { margin: 0; color: var(--text-secondary); font-size: 12px; }
.receipt-row .receipt-tenant { margin: 0; color: var(--text-muted); font-size: 12px; }
.receipt-row-meta { display: grid; justify-items: end; gap: 6px; text-align: right; }
.receipt-row-meta .receipt-count { font-family: var(--font-verified); font-size: 13px; color: var(--text-secondary); }
.receipt-row-meta time { font-family: var(--font-verified); font-size: 12px; color: var(--text-muted); }

/* Receipt payload (fully machine voice) */
.payload-panel { padding: 0; overflow: hidden; }
.payload-panel summary { padding: 16px 18px; cursor: pointer; color: var(--text-secondary); font-weight: 500; font-size: 13px; list-style: none; }
.payload-panel summary::-webkit-details-marker { display: none; }
.payload-panel summary:hover { color: var(--text-primary); }
.payload-panel[open] summary { border-bottom: 1px solid var(--border); }
.payload-panel pre {
  max-height: 520px; margin: 0; overflow: auto; padding: 18px;
  background: var(--surface-2); color: var(--text-secondary);
  font-family: var(--font-verified); font-size: 12px; line-height: 1.5;
}

/* ---- Login ---- */
.login-page { min-height: calc(100vh - 60px); display: grid; place-items: center; padding: 48px 20px; background: var(--canvas); }
.login-panel { width: min(560px, 100%); padding: clamp(28px, 5vw, 44px); border: 1px solid var(--border); border-radius: var(--radius-chrome); background: var(--surface-1); box-shadow: var(--shadow-card); }
.login-panel .login-mark { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.login-panel .login-mark .wordmark-strip { --dither-ink: #B4B1A5; }
.login-panel h1 { margin: 8px 0 12px; font-family: var(--font-chrome); font-weight: 600; font-size: 26px; letter-spacing: -0.01em; color: var(--text-primary); }
.login-panel p { max-width: 460px; margin: 0 0 24px; color: var(--text-secondary); font-size: 14px; }
.login-panel .button { width: 100%; min-height: 44px; }
.login-panel .button + .button { margin-top: 10px; }
.login-panel small { display: block; margin-top: 22px; color: var(--text-muted); font-size: 12px; }

/* ---- Footer ---- */
footer { margin-top: auto; padding: 22px 0; border-top: 1px solid var(--border); color: var(--text-muted); font-size: 12px; background: var(--surface-1); }
footer .wordmark-text { font-size: 13px; }

@media (max-width: 720px) {
  .delivery-index-page .section-heading.compact, .seed-delivery-panel .section-heading.compact, .delivery-events .section-heading.compact { align-items: flex-start; }
  .seed-delivery-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .delivery-overview-head { display: none; }
  .delivery-overview-row { grid-template-columns: minmax(0, 1fr) auto; gap: 14px 10px; }
  .delivery-overview-target { grid-column: 1; }
  .delivery-overview-meta { grid-column: 2; text-align: right; }
  .delivery-overview-status { grid-column: 2; grid-row: 1; }
  .seed-send-dialog-content { padding: 20px; }
  .seed-send-dialog-actions { display: grid; grid-template-columns: 1fr; }
  .seed-send-dialog-actions .button { width: 100%; }
  .targets-head-row { align-items: flex-start; flex-direction: column; gap: 18px; }
  .target-facts, .target-form-fields { grid-template-columns: 1fr; }
  .target-card-footer { align-items: flex-start; flex-direction: column; }
  .target-actions { width: 100%; }
  .target-edit-panel { right: auto; left: 0; }
  .metric-row, .detail-grid, .detail-grid.receipt-detail { grid-template-columns: 1fr; }
  .section-heading { align-items: flex-start; flex-direction: column; }
  .receipt-row { align-items: flex-start; flex-direction: column; }
  .receipt-row-meta { justify-items: start; text-align: left; }
  .version-row, .version-meta { align-items: flex-start; flex-direction: column; text-align: left; }
  .topnav .page-shell { flex-wrap: wrap; }
  .artifact-table thead { display: none; }
  .artifact-table, .artifact-table tbody, .artifact-table tr, .artifact-table td { display: block; width: 100%; }
  .artifact-table tbody tr { padding: 12px 0; }
  .artifact-table tbody td, .artifact-table tbody td:last-child { text-align: left; padding: 2px 0; }
  .artifact-table.delivery-log tbody td { display: grid; grid-template-columns: 88px minmax(0, 1fr); align-items: start; gap: 10px; padding: 4px 0; }
  .artifact-table.delivery-log tbody td::before { content: attr(data-label); color: var(--text-muted); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
  .delivery-log .delivery-log-value { min-width: 0; overflow-wrap: anywhere; }
  .delivery-log .chip { justify-self: start; }
}

/* Building blocks — shared app typography alongside contract notation. */
.legendarium { padding-bottom: 48px; }
.legendarium-layout { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 32px; align-items: start; }
.legendarium-sidebar { position: sticky; top: 24px; }
.legendarium-sidebar .eyebrow { margin-bottom: 12px; }
.legendarium-app-link { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 12px; margin: 3px 0; border: 1px solid transparent; border-radius: var(--radius-machine); font-size: 13px; }
.legendarium-app-link.selected, .legendarium-app-link:hover { background: var(--surface-1); border-color: var(--border-strong); }
.legendarium-count { color: var(--text-secondary); font-family: var(--font-verified); font-size: 11px; }
.legendarium-surface-link { display: block; padding: 5px 12px 5px 25px; font-size: 13px; color: var(--text-secondary); border-left: 1px solid var(--border-strong); margin-left: 12px; }
.legendarium-surface-link.selected { font-weight: 600; color: var(--text-primary); border-left: 3px solid var(--fed-capp-qr-line); padding-left: 23px; }
.legendarium-sidebar-note { border-top: 1px solid var(--border-strong); margin-top: 24px; padding-top: 20px; color: var(--text-secondary); font-size: 13px; }
.legendarium-sidebar-note p { margin: 8px 0 12px; }
.legendarium-main { min-width: 0; }
.legendarium-search { margin: 0 0 24px; }
.legendarium-search label { display: block; font-size: 12px; font-weight: 500; margin-bottom: 8px; }
.legendarium-search-controls { display: flex; gap: 8px; }
.legendarium-search input[type=search] { min-width: 0; flex: 1; width: 100%; padding: 11px 12px; border: 1px solid var(--border-stronger); border-radius: var(--radius-machine); background: var(--surface-1); color: var(--text-primary); }
.legendarium-search .index-search { flex: 1; min-width: 0; }
.legendarium-search .index-search input[type=search] { padding-right: 40px; }
.legendarium [hidden] { display: none; }
.legendarium-entry mark { background: var(--status-draft-bg); color: inherit; border-radius: var(--radius-machine-tight); padding: 0 1px; }
.legendarium-apps { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-bottom: 28px; }
.legendarium-app-summary { padding: 22px; border: 1px solid var(--border-strong); border-radius: var(--radius-authored); background: var(--surface-1); }
.legendarium-app-summary h2 { font: 600 17px/1.3 var(--font-chrome); margin: 8px 0 10px; }
.legendarium-app-summary p { color: var(--text-secondary); margin: 0 0 20px; }
.legendarium-trail { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 11px; margin-top: 10px; }
.legendarium-trail a { border-bottom: 1px solid var(--border-stronger); }
.legendarium-trail span { color: var(--text-secondary); }
.legendarium-results-heading { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border-strong); padding-bottom: 12px; margin-bottom: 28px; color: var(--text-secondary); font-size: 12px; }
.legendarium-results-heading strong { color: var(--text-primary); }
.legendarium-toggles { display: flex; gap: 4px; align-items: center; }
.legendarium-toggle { padding: 2px 8px; border: 1px solid transparent; border-radius: var(--radius-machine); color: var(--text-muted); transition: color 120ms, border-color 120ms; }
.legendarium-toggle::before { content: "+ "; }
.legendarium-toggle:hover { color: var(--text-primary); }
.legendarium-toggle[aria-pressed=true] { color: var(--text-primary); border-color: var(--border-strong); background: var(--surface-1); }
.legendarium-toggle[aria-pressed=true]::before { content: "✓ "; }
.legendarium-group { margin-bottom: 32px; }
.legendarium-entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.legendarium-entry { display: flex; flex-direction: column; padding: 18px 20px; border: 1px solid var(--border); border-radius: var(--radius-authored); background: var(--surface-1); transition: border-color 120ms, box-shadow 120ms; }
.legendarium-entry:hover { border-color: var(--border-stronger); box-shadow: var(--shadow-raised); }
.legendarium-entry-title { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.legendarium-entry-title h3 { margin: 0; font: 600 15px/1.3 var(--font-chrome); }
.legendarium-entry-title > span { color: var(--text-muted); }
.legendarium-entry-title > .legendarium-preview-badge { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; width: 18px; height: 18px; border: 1px solid #b8ded3; border-radius: 50%; background: linear-gradient(160deg, #f6fffb, #def3ea); box-shadow: inset 0 1px 0 #fff, 0 1px 3px #245e4310; color: #23634c; align-self: center; }
.legendarium-preview-badge svg { width: 12px; height: 12px; }
.legendarium-entry p { margin: 9px 0 16px; color: var(--text-secondary); font-size: 13px; flex: 1; }
.legendarium-status { display: inline-block; align-self: start; font-size: 10px; letter-spacing: 0.015em; color: var(--text-secondary); border: 1px solid var(--border-strong); padding: 3px 7px; border-radius: var(--radius-machine); white-space: normal; }
.legendarium-status.deferred, .legendarium-status.unknown, .legendarium-status.partial { color: var(--warning-ink); border-color: var(--warning-line); background: var(--warning-bg); }
.legendarium-empty h2 { font: 600 17px var(--font-chrome); }
.legendarium-breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; font-size: 12px; color: var(--text-secondary); }
.legendarium-breadcrumbs a { border-bottom: 1px solid var(--border-strong); }
.legendarium-page-nav a { display: block; padding: 7px 0; color: var(--text-secondary); font-size: 13px; }
.legendarium-page-nav a:hover { color: var(--text-primary); text-decoration: underline; text-underline-offset: 4px; }
.legendarium-article section { scroll-margin-top: 24px; }
.legendarium-purpose { margin-bottom: 28px; }
.legendarium-purpose p { font: 400 15px/1.5 var(--font-chrome); color: var(--text-secondary); margin: 8px 0 0; max-width: 650px; }
.legendarium-section { margin-bottom: 22px; }
.legendarium-section h2, .legendarium-example h2 { font: 600 17px/1.3 var(--font-chrome); margin: 0 0 16px; }
.legendarium-section .section-heading h2 { margin-bottom: 0; }
.legendarium-relationship { margin: 16px 0; }
.legendarium-relationship h3, .legendarium-notes h3 { font-size: 12px; font-weight: 500; color: var(--text-secondary); margin: 0 0 10px; }
.legendarium-related-links { display: flex; flex-wrap: wrap; gap: 8px; }
.legendarium-related-link { display: inline-flex; flex-direction: column; align-items: start; padding: 8px 12px; border: 1px solid var(--border-strong); border-radius: var(--radius-machine); font-size: 13px; }
.legendarium-related-link small { font-size: 10px; color: var(--text-secondary); margin-top: 3px; }
.legendarium-related-link:hover { border-color: var(--text-muted); background: var(--surface-0); }
.legendarium-caption { font-size: 12px; color: var(--text-secondary); margin: 12px 0; line-height: 1.6; }
.legendarium-inline-link { text-decoration: underline; text-underline-offset: 3px; }
.legendarium-variants { margin: 0; }
.legendarium-variants > div { display: grid; grid-template-columns: minmax(100px, 1fr) 2fr; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.legendarium-variants > div:last-child { border: 0; }
.legendarium-variants dt { font-family: var(--font-verified); font-size: 12px; overflow-wrap: anywhere; }
.legendarium-variants dd { margin: 0; color: var(--text-secondary); font-size: 13px; }
.legendarium-placement { display: block; padding: 12px; background: var(--surface-0); font-family: var(--font-verified); font-size: 11px; overflow-wrap: anywhere; border-radius: var(--radius-machine); margin-bottom: 20px; }
.legendarium-table-wrap { overflow-x: auto; }
.legendarium-fields { width: 100%; border-collapse: collapse; text-align: left; font-size: 12px; }
.legendarium-fields thead th { color: var(--text-secondary); font-weight: 500; font-size: 11px; }
.legendarium-fields th, .legendarium-fields td { padding: 12px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
.legendarium-fields th:first-child { padding-left: 0; }
.legendarium-fields tbody th { width: 31%; font-weight: 400; }
.legendarium-fields td:nth-child(2) { width: 19%; color: var(--text-secondary); }
.legendarium-fields code { font-family: var(--font-verified); font-size: 11px; overflow-wrap: anywhere; }
.legendarium-fields small { display: block; color: var(--text-secondary); margin-top: 5px; }
.legendarium-notes { margin-top: 24px; }
.legendarium-notes ul { padding-left: 20px; margin: 0; color: var(--text-secondary); font-size: 13px; }
.legendarium-notes li + li { margin-top: 8px; }
.legendarium-contract-note { padding: 14px; background: var(--surface-0); font-size: 13px; }
.legendarium-example { margin: 26px 0; min-width: 0; }
.legendarium-example-heading { padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; gap: 14px; background: var(--surface-0); border: 1px solid var(--border-strong); border-bottom: 0; border-radius: var(--radius-machine) var(--radius-machine) 0 0; }
.legendarium-example-heading h2 { margin: 6px 0 0; }
.legendarium-example-heading code { font-size: 11px; overflow-wrap: anywhere; }
.legendarium-filetype { font: 11px var(--font-verified); color: var(--text-secondary); }
.legendarium-example pre { margin: 0; padding: 20px; overflow-x: auto; background: var(--surface-1); border: 1px solid var(--border-strong); border-radius: 0 0 var(--radius-machine) var(--radius-machine); line-height: 1.8; font: 12px/1.8 var(--font-verified); tab-size: 2; }
.legendarium-source { border-top: 1px solid var(--border); padding: 16px 0 0; margin-top: 16px; font-size: 13px; }
.legendarium-source p { color: var(--text-secondary); font-size: 12px; margin: 8px 0; }
.legendarium-source code { color: var(--text-secondary); font: 11px var(--font-verified); }
.legendarium-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.legendarium :focus-visible, .topnav a:focus-visible { outline: 2px solid var(--paper-700); outline-offset: 4px; }
@media (max-width: 800px) {
  .legendarium-layout { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .legendarium-sidebar { position: static; }
  .legendarium-sidebar nav { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
  .legendarium-sidebar nav > .eyebrow { width: 100%; margin-bottom: 0; }
  .legendarium-sidebar-note { display: none; }
  .legendarium-page-nav a { padding: 6px; }
  .legendarium-surface-link { margin-left: 0; padding: 8px; }
  .legendarium-surface-link.selected { padding-left: 6px; }
}
@media (max-width: 540px) {
  .legendarium-entry-grid { grid-template-columns: minmax(0, 1fr); }
  .legendarium-results-heading { flex-wrap: wrap; align-items: center; }
  .legendarium-fields { min-width: 540px; }
  .legendarium-example-heading { align-items: start; }
  .legendarium-search-controls { flex-wrap: wrap; }
  .legendarium-search input[type=search] { flex-basis: 100%; }
  .topnav .page-shell { flex-wrap: wrap; }
  .topnav nav { gap: 12px; }
  .legendarium-section .section-heading { flex-wrap: wrap; }
}
