/* Direction: Set Ready, Warrior Defense Fund. Parade-ground navy, brass accents, a sturdy serif display on warm paper. */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  --canvas: #f6f2e9;
  --surface: #fffdf8;
  --surface-2: #ebe5d6;
  --border: #d4d1ca;
  --border-strong: #adaca7;
  --ink: #14202b;
  --muted: #55606b;
  --accent: #1d3a5c;
  --accent-hover: #19314e;
  --accent-ink: #ffffff;
  --accent-text: #1d3a5c;
  --accent-strong: #1d3a5c;
  --accent-soft: #dde6f0;
  --accent-border: #949faa;
  --success: #2f6b43;
  --success-ink: #ffffff;
  --success-soft: #dee2d5;
  --success-strong: #2f6b43;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #eedfce;
  --warning-strong: #994607;
  --danger: #a32626;
  --danger-ink: #ffffff;
  --danger-soft: #ecdad2;
  --danger-strong: #a32626;
  --chart-1: #1d3a5c;
  --chart-2: #6a3682;
  --chart-3: #852537;
  --chart-4: #5e4b00;
  --chart-5: #127039;
  --chart-6: #0a6889;

  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --display-weight: 700;
  --display-tracking: -0.02em;
  --radius-card: 14px;
  --radius-btn: 10px;
  --radius-input: 10px;
  --x-band: #0e1b2b;
  --x-on-photo: #ffffff;
  --x-brass: #d9a441;
  --x-brass-ink: #1a1304;
  --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-sans: "Inter", system-ui, sans-serif;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="dark"] {
  --canvas: #04080d;
  --surface: #1d2125;
  --surface-2: #111419;
  --border: #272b2f;
  --border-strong: #4f5256;
  --ink: #f6f2e9;
  --muted: #959491;
  --accent: #1d3a5c;
  --accent-hover: #3f5874;
  --accent-ink: #ffffff;
  --accent-text: #8190a4;
  --accent-strong: #76869c;
  --accent-soft: #0a131e;
  --accent-border: #0f1e31;
  --success: #2f6b43;
  --success-ink: #ffffff;
  --success-soft: #0d1e19;
  --success-strong: #6a9579;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #2b190c;
  --warning-strong: #c57a40;
  --danger: #a32626;
  --danger-ink: #ffffff;
  --danger-soft: #270f13;
  --danger-strong: #c27070;
  --chart-1: #537298;
  --chart-2: #a771c1;
  --chart-3: #c15c68;
  --chart-4: #b27601;
  --chart-5: #5f913a;
  --chart-6: #24aead;
}

.btn-brass {
  background: var(--x-brass);
  color: var(--x-brass-ink);
  border-color: var(--x-brass);
}
.btn-brass:hover {
  filter: brightness(1.08);
}
.btn-brass:active {
  transform: translateY(1px);
}
.btn-ghost-photo {
  background: transparent;
  color: var(--x-on-photo);
  border: 1px solid color-mix(in srgb, var(--x-on-photo) 45%, transparent);
}
.btn-ghost-photo:hover {
  background: color-mix(in srgb, var(--x-on-photo) 12%, transparent);
}
.goal-track {
  background: color-mix(in srgb, var(--x-on-photo) 25%, transparent);
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
}
.goal-fill {
  height: 100%;
  background: var(--x-brass);
  border-radius: 999px;
  transform-origin: left center;
  animation: goal-grow 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
@keyframes goal-grow {
  from { transform: scaleX(0.15); }
  to { transform: scaleX(1); }
}
html.reduced-motion .goal-fill { animation: none; }
.hero-scrim {
  background: linear-gradient(180deg, color-mix(in srgb, var(--x-band) 78%, transparent) 0%, color-mix(in srgb, var(--x-band) 92%, transparent) 100%);
}
.step-num {
  font-family: var(--font-display);
  color: var(--accent-text);
  -webkit-text-stroke: 0;
}
.on-band { color: var(--x-on-photo); }
.logo-chip {
  display: inline-flex;
  align-items: center;
  background: var(--x-on-photo);
  border-radius: 10px;
  padding: 6px 10px;
  box-shadow: 0 4px 14px rgb(0 0 0 / 0.25);
  transition: transform 0.15s ease;
}
.logo-chip-round { border-radius: 9999px; padding: 3px; }
.logo-chip:hover { transform: translateY(-1px); }
.logo-chip:focus-visible { outline: 2px solid var(--x-brass); outline-offset: 3px; }
.band-rule { border-top: 1px solid color-mix(in srgb, var(--x-on-photo) 22%, transparent); }
.phx-ink { stroke: var(--ink); }
.phx-1 { stroke: var(--x-brass); }
.phx-2 { stroke: var(--warning); }
.phx-3 { stroke: var(--danger); }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
.on-band-muted { color: color-mix(in srgb, var(--x-on-photo) 78%, transparent); }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details[open] .faq-chevron { transform: rotate(180deg); }
.faq-chevron { transition: transform 0.2s ease; }

/* Printable fact sheet: one US Letter page, backgrounds kept */
@page { size: letter; margin: 0.35in; }
@media print {
  html, body { background: transparent; }
  .sheet, .sheet * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sheet { max-height: 10.2in; overflow: hidden; break-inside: avoid; page-break-after: avoid; }
  .logo-chip { box-shadow: none; }
}
