/* FateSeal verifier SPA — self-contained styles (style-src 'self').
 *
 * UI-WAVE1 WP-U1: the Bearmark Core token contract (--bm-*) as ported by
 * Arena SSR v1 (monorepo/services/tournament/src/arena/ui/tokens-v1.ts), plus
 * the additive FateSeal verdict map (--fs-*, FATESEAL-COVERAGE.md §6). Every
 * component rule below resolves through a token: the only colour literals in
 * this file are the palette definitions in the theme blocks.
 *
 * Offline canon: no webfont declaration, no stylesheet import, no remote
 * url() — the page has no network, so the type stack is the system fallback
 * chain the token contract already names. A downloaded face would break the
 * offline guarantee, not merely the size budget. Enforced by
 * tests/site-presentation.test.ts.
 *
 * Proof Blue rule: --bm-proof appears only on verified-full surfaces and on
 * the Verify CTA. It is a verdict colour, never decoration.
 */
:root {
  color-scheme: light;
  --bm-iron: #1a1611;
  --bm-ivory: #f3eee4;
  --bm-ivory-2: #e7e0d0;
  --bm-paper: #ded7c7;
  --bm-brass: #c79a4e;
  --bm-brass-deep: #8a6428;
  --bm-brass-hi: #dfb877;
  --bm-green: #5b7a4e;
  --bm-green-deep: #46603c;
  --bm-green-hi: #8fcb9b;
  --bm-slate: #586573;
  --bm-slate-deep: #3e4954;
  --bm-slate-hi: #93a0ad;
  --bm-amber: #b07a2e;
  --bm-amber-deep: #7a5214;
  --bm-amber-hi: #e0a94e;
  --bm-brick: #a24b3b;
  --bm-brick-deep: #7a3428;
  --bm-brick-hi: #d98a7e;
  --bm-proof: #3e6f8f;
  --bm-proof-deep: #2a4e63;
  --bm-proof-hi: #6b97b3;
  --bm-bg: var(--bm-ivory);
  --bm-surface: #fbf8f1;
  --bm-raised: #ede6d8;
  --bm-sunken: #eae3d5;
  --bm-border: rgba(26, 22, 17, 0.14);
  --bm-border-strong: rgba(26, 22, 17, 0.28);
  --bm-border-subtle: rgba(26, 22, 17, 0.1);
  --bm-text: var(--bm-iron);
  --bm-text-soft: rgba(26, 22, 17, 0.62);
  --bm-text-faint: rgba(26, 22, 17, 0.42);
  --bm-inverse: var(--bm-iron);
  --bm-on-inverse: var(--bm-ivory);
  --bm-accent: var(--bm-brass);
  --bm-on-accent: #211708;
  --bm-on-proof: var(--bm-ivory);
  --bm-field: #ffffff;
  --bm-track: rgba(26, 22, 17, 0.1);
  --bm-focus: var(--bm-brass-deep);
  --bm-accent-ink: var(--bm-brass-deep);
  --fs-full-ink: var(--bm-proof-deep);
  --fs-full-bg: rgba(62, 111, 143, 0.12);
  --fs-full-border: rgba(62, 111, 143, 0.42);
  --fs-partial-ink: var(--bm-amber-deep);
  --fs-partial-bg: rgba(176, 122, 46, 0.14);
  --fs-partial-border: rgba(176, 122, 46, 0.42);
  --fs-fail-ink: var(--bm-brick-deep);
  --fs-fail-bg: rgba(162, 75, 59, 0.12);
  --fs-fail-border: rgba(162, 75, 59, 0.42);
  --fs-input-ink: var(--bm-slate-deep);
  --fs-input-bg: rgba(88, 101, 115, 0.12);
  --fs-input-border: rgba(88, 101, 115, 0.4);
  --fs-good-ink: var(--bm-green-deep);
  --fs-good-bg: rgba(91, 122, 78, 0.14);
  --fs-good-border: rgba(91, 122, 78, 0.42);
  --c-accent-ink: var(--bm-brass-deep);
  --c-accent-bg: rgba(199, 154, 78, 0.13);
  --c-accent-border: rgba(199, 154, 78, 0.5);
  /* UI-WAVE1 a11y remediation (adversarial review). --bm-text-faint measures
     2.6:1 light / 3.4:1 dark, which is below WCAG AA for body text — and it
     was carrying most of this product's explanatory copy. Quiet text now
     resolves to --bm-text-soft (4.8-7.3:1) and --bm-text-faint is no longer
     used for words. --fs-control-border is the boundary of an interactive
     control, tuned to clear the 3:1 non-text minimum (1.4.11); --bm-border-*
     keep their Arena values for decorative rules. */
  --fs-ink-quiet: var(--bm-text-soft);
  --fs-control-border: rgba(26, 22, 17, 0.48);
  --fs-meter-fill: var(--bm-brass-deep);
  --fs-meter-warn: var(--bm-amber-deep);
  --bm-font-display: "Archivo", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --bm-font-word: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --bm-font-body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --bm-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
  --bm-radius-sm: 5px;
  --bm-radius-md: 8px;
  --bm-radius-lg: 12px;
  --bm-radius-xl: 18px;
  --bm-radius-pill: 999px;
  --bm-shadow-xs: 0 1px 2px rgba(26, 22, 17, 0.06);
  --bm-shadow-sm: 0 2px 8px -2px rgba(26, 22, 17, 0.12);
  --bm-space-1: 0.25rem;
  --bm-space-2: 0.5rem;
  --bm-space-3: 0.75rem;
  --bm-space-4: 1rem;
  --bm-space-5: 1.25rem;
  --bm-space-6: 1.5rem;
  --bm-space-8: 2rem;
  --bm-container: 72rem;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bm-bg: var(--bm-iron);
  --bm-surface: #221d16;
  --bm-raised: #2d2822;
  --bm-sunken: #171310;
  --bm-border: rgba(243, 238, 228, 0.14);
  --bm-border-strong: rgba(243, 238, 228, 0.3);
  --bm-border-subtle: rgba(243, 238, 228, 0.1);
  --bm-text: var(--bm-ivory);
  --bm-text-soft: rgba(243, 238, 228, 0.66);
  --bm-text-faint: rgba(243, 238, 228, 0.4);
  --bm-inverse: var(--bm-ivory);
  --bm-on-inverse: var(--bm-iron);
  --bm-accent: var(--bm-brass-hi);
  --bm-field: #171310;
  --bm-track: rgba(243, 238, 228, 0.12);
  --bm-focus: var(--bm-brass-hi);
  --bm-accent-ink: var(--bm-brass-hi);
  --fs-full-ink: var(--bm-proof-hi);
  --fs-full-bg: rgba(107, 151, 179, 0.1);
  --fs-full-border: rgba(107, 151, 179, 0.42);
  --fs-partial-ink: var(--bm-amber-hi);
  --fs-partial-bg: rgba(224, 169, 78, 0.15);
  --fs-partial-border: rgba(224, 169, 78, 0.4);
  --fs-fail-ink: var(--bm-brick-hi);
  --fs-fail-bg: rgba(217, 138, 126, 0.15);
  --fs-fail-border: rgba(217, 138, 126, 0.4);
  --fs-input-ink: var(--bm-slate-hi);
  --fs-input-bg: rgba(147, 160, 173, 0.15);
  --fs-input-border: rgba(147, 160, 173, 0.38);
  --fs-good-ink: var(--bm-green-hi);
  --fs-good-bg: rgba(143, 203, 155, 0.15);
  --fs-good-border: rgba(143, 203, 155, 0.4);
  --c-accent-ink: var(--bm-brass-hi);
  --c-accent-bg: rgba(223, 184, 119, 0.14);
  --c-accent-border: rgba(223, 184, 119, 0.4);
  --fs-ink-quiet: var(--bm-text-soft);
  --fs-control-border: rgba(243, 238, 228, 0.4);
  --fs-meter-fill: var(--bm-brass-hi);
  --fs-meter-warn: var(--bm-amber-hi);
  --bm-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
  --bm-shadow-sm: 0 2px 8px -2px rgba(0, 0, 0, 0.4);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bm-bg: var(--bm-iron);
    --bm-surface: #221d16;
    --bm-raised: #2d2822;
    --bm-sunken: #171310;
    --bm-border: rgba(243, 238, 228, 0.14);
    --bm-border-strong: rgba(243, 238, 228, 0.3);
    --bm-border-subtle: rgba(243, 238, 228, 0.1);
    --bm-text: var(--bm-ivory);
    --bm-text-soft: rgba(243, 238, 228, 0.66);
    --bm-text-faint: rgba(243, 238, 228, 0.4);
    --bm-inverse: var(--bm-ivory);
    --bm-on-inverse: var(--bm-iron);
    --bm-accent: var(--bm-brass-hi);
    --bm-field: #171310;
    --bm-track: rgba(243, 238, 228, 0.12);
    --bm-focus: var(--bm-brass-hi);
    --bm-accent-ink: var(--bm-brass-hi);
    --fs-full-ink: var(--bm-proof-hi);
    --fs-full-bg: rgba(107, 151, 179, 0.1);
    --fs-full-border: rgba(107, 151, 179, 0.42);
    --fs-partial-ink: var(--bm-amber-hi);
    --fs-partial-bg: rgba(224, 169, 78, 0.15);
    --fs-partial-border: rgba(224, 169, 78, 0.4);
    --fs-fail-ink: var(--bm-brick-hi);
    --fs-fail-bg: rgba(217, 138, 126, 0.15);
    --fs-fail-border: rgba(217, 138, 126, 0.4);
    --fs-input-ink: var(--bm-slate-hi);
    --fs-input-bg: rgba(147, 160, 173, 0.15);
    --fs-input-border: rgba(147, 160, 173, 0.38);
    --fs-good-ink: var(--bm-green-hi);
    --fs-good-bg: rgba(143, 203, 155, 0.15);
    --fs-good-border: rgba(143, 203, 155, 0.4);
    --c-accent-ink: var(--bm-brass-hi);
    --c-accent-bg: rgba(223, 184, 119, 0.14);
    --c-accent-border: rgba(223, 184, 119, 0.4);
        --fs-ink-quiet: var(--bm-text-soft);
      --fs-control-border: rgba(243, 238, 228, 0.4);
      --fs-meter-fill: var(--bm-brass-hi);
      --fs-meter-warn: var(--bm-amber-hi);
  --bm-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
    --bm-shadow-sm: 0 2px 8px -2px rgba(0, 0, 0, 0.4);
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  background: var(--bm-bg);
  color: var(--bm-text);
  font-family: var(--bm-font-body);
  line-height: 1.55;
}
body {
  margin: 0;
  min-inline-size: 20rem;
  background: var(--bm-bg);
}
button,
input,
select,
textarea {
  font: inherit;
}
code {
  font-family: var(--bm-font-mono);
  font-size: 0.85em;
  overflow-wrap: anywhere;
}
:focus-visible {
  outline: 3px solid var(--bm-focus);
  outline-offset: 3px;
}
h1,
h2 {
  margin-block: 0 0.4em;
  font-family: var(--bm-font-display);
  font-weight: 760;
  letter-spacing: -0.025em;
  line-height: 1.08;
}
h1 {
  font-size: clamp(1.9rem, 4vw, 2.9rem);
}
p {
  margin-block: 0 var(--bm-space-4);
}

.fs-shell {
  inline-size: min(100% - 2rem, var(--bm-container));
  margin-inline: auto;
}
.fs-skip {
  position: absolute;
  inset-block-start: 0.5rem;
  inset-inline-start: 0.5rem;
  z-index: 20;
  transform: translateY(-200%);
  border-radius: var(--bm-radius-md);
  padding: var(--bm-space-3) var(--bm-space-4);
  background: var(--bm-inverse);
  color: var(--bm-on-inverse);
  font-family: var(--bm-font-mono);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  text-decoration: none;
}
.fs-skip:focus {
  transform: none;
}

/* ── app bar / brand lockup ───────────────────────────────────────────── */
.fs-appbar {
  border-block-end: 1px solid var(--bm-border);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-xs);
}
.fs-appbar-row {
  display: flex;
  align-items: center;
  gap: var(--bm-space-3);
  flex-wrap: wrap;
  min-block-size: 3.75rem;
  padding-block: var(--bm-space-2);
}
.fs-lockup {
  display: flex;
  align-items: center;
  gap: var(--bm-space-3);
  margin-inline-end: auto;
  min-inline-size: 0;
  color: var(--bm-text);
}
.fs-lockup-text {
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
}
.fs-wordmark {
  font-family: var(--bm-font-word);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.fs-endorse {
  color: var(--fs-ink-quiet);
  font-family: var(--bm-font-mono);
  font-size: 0.56rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.fs-seal {
  display: block;
  overflow: visible;
}
.fs-seal--mark {
  inline-size: 2.125rem;
  block-size: 2.125rem;
  flex: none;
}
.fs-seal--ghost {
  inline-size: 3.875rem;
  block-size: 3.875rem;
  color: var(--fs-ink-quiet);
}
.fs-seal--verdict {
  inline-size: 3.5rem;
  block-size: 3.5rem;
  display: none;
}

.fs-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--bm-space-2);
  border: 1px solid var(--fs-control-border);
  border-radius: var(--bm-radius-pill);
  padding: 0.3rem 0.7rem;
  color: var(--fs-ink-quiet);
  font-family: var(--bm-font-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}
.fs-chip--offline {
  border-color: var(--fs-good-border);
  background: var(--fs-good-bg);
  color: var(--fs-good-ink);
}
/* UI-WAVE2: the language link. A plain <a> to the sibling document — no
   script, no cookie, no server. The 44px min-height keeps it a real hit
   target rather than a decorative word next to the chip. */
.fs-appbar-tools {
  display: flex;
  align-items: center;
  gap: var(--bm-space-3);
  margin-inline-start: auto;
}
.fs-lang-link {
  display: inline-flex;
  align-items: center;
  min-block-size: 44px;
  padding-inline: var(--bm-space-2);
  color: var(--bm-text);
  font-family: var(--bm-font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ── layout ───────────────────────────────────────────────────────────── */
main {
  padding-block: clamp(1.5rem, 4vw, 3rem);
}
.fs-tagline {
  margin-block: 0 var(--bm-space-3);
  color: var(--fs-ink-quiet);
  font-family: var(--bm-font-mono);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.subtitle {
  max-inline-size: 64ch;
  color: var(--bm-text-soft);
}
.fs-split {
  display: grid;
  gap: var(--bm-space-6);
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: start;
  margin-block-start: var(--bm-space-6);
}
.fs-verdict-col {
  display: grid;
  gap: var(--bm-space-4);
  min-inline-size: 0;
}
.fs-panel {
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-lg);
  padding: clamp(1rem, 3vw, 1.25rem);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-xs);
}
.fs-panel-title {
  margin-block: 0 var(--bm-space-4);
  color: var(--fs-ink-quiet);
  font-family: var(--bm-font-mono);
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.fs-field,
.input-section {
  display: grid;
  gap: var(--bm-space-2);
  margin-block-end: var(--bm-space-4);
  min-inline-size: 0;
}
.fs-field > label,
.input-section > label,
.fs-policy legend {
  color: var(--bm-text-soft);
  font-family: var(--bm-font-mono);
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}
.fs-hint,
.fs-muted {
  color: var(--fs-ink-quiet);
  font-size: 0.82rem;
  line-height: 1.5;
}
.fs-sr-only {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
input:not([type="checkbox"]),
textarea,
select {
  inline-size: 100%;
  min-block-size: 2.75rem;
  border: 1px solid var(--fs-control-border);
  border-radius: var(--bm-radius-md);
  padding: 0.6rem 0.7rem;
  background: var(--bm-field);
  color: var(--bm-text);
}
input:not([type="checkbox"]):hover,
textarea:hover,
select:hover {
  border-color: var(--bm-accent);
}
textarea {
  min-block-size: 8rem;
  resize: vertical;
  font-family: var(--bm-font-mono);
  font-size: 0.8rem;
}
.short {
  inline-size: 5.5rem !important;
  min-block-size: 44px;
}

/* ── policy disclosure ────────────────────────────────────────────────── */
.fs-policy {
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-md);
  margin-block-end: var(--bm-space-4);
  background: var(--bm-bg);
}
.fs-policy summary {
  display: flex;
  align-items: center;
  min-block-size: 44px;
  padding-inline: var(--bm-space-3);
  font-weight: 650;
  cursor: pointer;
}
.fs-policy > .fs-hint {
  padding: 0 var(--bm-space-3) var(--bm-space-3);
}
.options {
  display: grid;
  gap: var(--bm-space-3);
  border: 0;
  border-block-start: 1px solid var(--bm-border-subtle);
  margin: 0;
  padding: var(--bm-space-3);
}
.options label {
  display: grid;
  grid-template-columns: 1.1rem minmax(0, 1fr);
  gap: 0 var(--bm-space-2);
  align-items: baseline;
  min-block-size: 44px;
  cursor: pointer;
}
.options label > .fs-hint {
  grid-column: 2;
}
.options label > code,
.options label > select,
.options label > input[type="number"] {
  grid-column: 2;
}
.options label > input[type="checkbox"] {
  grid-column: 1;
  inline-size: 1.1rem;
  block-size: 1.1rem;
  accent-color: var(--bm-accent);
}
.options label:not(:has(input[type="checkbox"])) > code,
.options label:not(:has(input[type="checkbox"])) > select,
.options label:not(:has(input[type="checkbox"])) > input,
.options label:not(:has(input[type="checkbox"])) > .fs-hint {
  grid-column: 1 / -1;
}

/* ── the Verify CTA — the one Proof Blue surface of the form ──────────── */
.fs-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 100%;
  min-block-size: 3rem;
  border: 1px solid var(--bm-proof-deep);
  border-radius: var(--bm-radius-md);
  padding-inline: var(--bm-space-6);
  background: var(--bm-proof);
  color: var(--bm-on-proof);
  font-family: var(--bm-font-mono);
  font-size: 0.85rem;
  font-weight: 750;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  cursor: pointer;
}
.fs-cta:hover:not(:disabled) {
  background: var(--bm-proof-deep);
}
.fs-cta:disabled {
  opacity: 0.5;
  cursor: progress;
}
.fs-nojs {
  display: block;
  margin-block: var(--bm-space-4) 0;
  color: var(--fs-ink-quiet);
  font-size: 0.82rem;
  line-height: 1.5;
}

/* ── page states: empty · verifying · four verdicts ───────────────────── */
.fs-empty {
  display: grid;
  justify-items: center;
  gap: var(--bm-space-3);
  border: 1px dashed var(--fs-control-border);
  border-radius: var(--bm-radius-lg);
  padding: clamp(1.75rem, 5vw, 2.75rem) var(--bm-space-5);
  background: var(--bm-surface);
  text-align: center;
}
.fs-empty-title {
  margin: 0;
  font-family: var(--bm-font-display);
  font-size: 1.05rem;
  font-weight: 760;
  letter-spacing: -0.02em;
}
.fs-empty .fs-hint {
  max-inline-size: 44ch;
}
.fs-verdict-col:has(.verdict-full) .fs-empty,
.fs-verdict-col:has(.verdict-partial) .fs-empty,
.fs-verdict-col:has(.verdict-fail) .fs-empty,
.fs-verdict-col:has(.verdict-input-error) .fs-empty {
  display: none;
}
body:has(#verify:disabled) .fs-empty {
  display: none;
}

.fs-verifying {
  display: none;
  align-items: center;
  gap: var(--bm-space-3);
  border: 1px solid var(--fs-full-border);
  border-radius: var(--bm-radius-lg);
  padding: var(--bm-space-5);
  background: var(--fs-full-bg);
  color: var(--fs-full-ink);
  font-weight: 650;
}
body:has(#verify:disabled) .fs-verifying {
  display: flex;
}
.fs-spinner {
  flex: none;
  inline-size: 1.1rem;
  block-size: 1.1rem;
  border: 2px solid var(--fs-full-border);
  border-block-start-color: var(--fs-full-ink);
  border-radius: 50%;
  animation: fs-spin 0.8s linear infinite;
}
@keyframes fs-spin {
  to {
    transform: rotate(360deg);
  }
}

.fs-verdict-wrap {
  display: flex;
  align-items: flex-start;
  gap: var(--bm-space-4);
}
.fs-seal-slot {
  flex: none;
}
.fs-verdict-wrap:not(:has(.verdict-full, .verdict-partial, .verdict-fail, .verdict-input-error)) .fs-seal-slot {
  display: none;
}
.fs-verdict-wrap:has(.verdict-full) [data-seal="full"],
.fs-verdict-wrap:has(.verdict-partial) [data-seal="partial"],
.fs-verdict-wrap:has(.verdict-fail) [data-seal="fail"],
.fs-verdict-wrap:has(.verdict-input-error) [data-seal="input-error"] {
  display: block;
}
.fs-verdict-wrap:has(.verdict-full) .fs-seal-slot {
  color: var(--fs-full-ink);
}
.fs-verdict-wrap:has(.verdict-partial) .fs-seal-slot {
  color: var(--fs-partial-ink);
}
.fs-verdict-wrap:has(.verdict-fail) .fs-seal-slot {
  color: var(--fs-fail-ink);
}
.fs-verdict-wrap:has(.verdict-input-error) .fs-seal-slot {
  color: var(--fs-input-ink);
}

/* The verdict box is written by src/main.ts (frozen): plain text + one of the
 * four modifier classes. Word and exit code therefore live in the TEXT; the
 * skin adds a glyph and the seal geometry, so the verdict is never carried by
 * colour alone (spec §1.7). */
.verdict {
  display: none;
  flex: 1;
  min-inline-size: 0;
  align-items: flex-start;
  gap: var(--bm-space-3);
  border: 1px solid;
  border-radius: var(--bm-radius-lg);
  padding: var(--bm-space-4) var(--bm-space-5);
  font-family: var(--bm-font-display);
  font-size: 1.05rem;
  font-weight: 760;
  letter-spacing: -0.015em;
  line-height: 1.35;
}
.verdict.verdict-full,
.verdict.verdict-partial,
.verdict.verdict-fail,
.verdict.verdict-input-error {
  display: flex;
}
.verdict::before {
  flex: none;
  font-family: var(--bm-font-mono);
  font-size: 1.1rem;
  line-height: 1.25;
}
.verdict-full {
  border-color: var(--fs-full-border);
  background: var(--fs-full-bg);
  color: var(--fs-full-ink);
}
.verdict-full::before {
  content: "✓";
}
.verdict-partial {
  border-color: var(--fs-partial-border);
  background: var(--fs-partial-bg);
  color: var(--fs-partial-ink);
}
.verdict-partial::before {
  content: "◐";
}
.verdict-fail {
  border-color: var(--fs-fail-border);
  background: var(--fs-fail-bg);
  color: var(--fs-fail-ink);
}
.verdict-fail::before {
  content: "✕";
}
.verdict-input-error {
  border-color: var(--fs-input-border);
  background: var(--fs-input-bg);
  color: var(--fs-input-ink);
}
.verdict-input-error::before {
  content: "!";
}

/* ── report ───────────────────────────────────────────────────────────── */
.fs-oracle-line {
  margin: 0;
  color: var(--bm-text-soft);
  font-family: var(--bm-font-mono);
  font-size: 0.72rem;
}
.fs-oracle-line:empty {
  display: none;
}
.report {
  margin: 0;
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-lg);
  padding: var(--bm-space-4);
  background: var(--bm-sunken);
  color: var(--bm-text-soft);
  font-family: var(--bm-font-mono);
  font-size: 0.76rem;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-x: auto;
  max-block-size: 22rem;
}
.report:empty {
  display: none;
}
.report-errors {
  border-color: var(--fs-fail-border);
  color: var(--fs-fail-ink);
}

/* ── footer: conformance + exit legend ────────────────────────────────── */
.fs-footer {
  display: grid;
  gap: var(--bm-space-3);
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-lg);
  padding: var(--bm-space-4);
  background: var(--bm-surface);
}
.fs-conformance-line {
  margin: 0;
  color: var(--bm-text-soft);
  font-family: var(--bm-font-mono);
  font-size: 0.7rem;
  overflow-wrap: anywhere;
}
.fs-exit-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bm-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
.fs-exit-legend li {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-pill);
  padding: 0.3rem 0.7rem;
  font-family: var(--bm-font-mono);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
}
.fs-exit-legend li[data-exit="0"] {
  border-color: var(--fs-full-border);
  background: var(--fs-full-bg);
  color: var(--fs-full-ink);
}
.fs-exit-legend li[data-exit="3"] {
  border-color: var(--fs-partial-border);
  background: var(--fs-partial-bg);
  color: var(--fs-partial-ink);
}
.fs-exit-legend li[data-exit="1"] {
  border-color: var(--fs-fail-border);
  background: var(--fs-fail-bg);
  color: var(--fs-fail-ink);
}
.fs-exit-legend li[data-exit="2"] {
  border-color: var(--fs-input-border);
  background: var(--fs-input-bg);
  color: var(--fs-input-ink);
}
.fs-footer .fs-hint {
  margin: 0;
}

@media (max-width: 60rem) {
  .fs-split {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 30rem) {
  .fs-shell {
    inline-size: min(100% - 1.5rem, var(--bm-container));
  }
  .fs-verdict-wrap {
    flex-wrap: wrap;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}
@media (forced-colors: active) {
  .fs-panel,
  .fs-footer,
  .verdict,
  .fs-empty,
  .fs-verifying,
  .fs-exit-legend li,
  .fs-chip {
    border: 1px solid CanvasText;
  }
}
