/* THE DARK THEME FOR THE TWO YARD DOORS: /claim/ (claim your listing) and /portal/ (yard sign-in).
   Mason, 2026-09-24: the software side goes dark, "near-black page with loam-green panels ...
   Truck 6 ORANGE as the single accent", and these two pages are on that side. Since 2026-09-29 GREEN
   leads here as on /for-yards/ (owner: "dark, green, hints of orange"), --go on every action.

   A LAYER, NOT A FORK. Both pages keep linking /tokens.css, /components.css and the buyer
   /style.css, and link this sheet after them; it gives the shared token names their dark values
   (the same values as /for-yards/style.css, where the reasoning is written out) and repaints the
   few fills the buyer sheet hard-codes. Nothing here draws a picture: both pages are yard-specific
   surfaces in marketplace/lib/artLicense.js, where no generated or sidecar image may appear, so
   this sheet is colour only. The contrast table covering these two pages is in
   docs/for-yards/SCROLL-STORY-2026-09-24.md. */
:root {
  color-scheme: dark;
  --night: #070c0a; --night-2: #0c1511; --loam: #123123; --loam-2: #173a29; --line: #2e5240;
  --leaf: #8fd0a9; --orange: #f2711c; --orange-2: #ff8a3d; --orange-ink: #14181a;
  --go: #4cbf7a; --go-2: #6fd395; --go-ink: #06120b;

  --white: var(--night);
  --band: var(--night-2);
  --band-2: var(--loam);
  --ink: #eef3ef;
  --muted: #b3c6bb;
  --faint: #93a99c;
  --border: #61826f;
  --rule: #2e5240;
  --rule-soft: #18291f;

  --green-900: #123123;
  --green-800: #173a29;
  --green-700: var(--leaf);
  --green-600: #2e7d4f;
  --green-500: #8fd0a9;
  --green-100: #1d3f2c;
  --green-50: #0f1d16;

  --blue-800: var(--leaf);
  --blue-600: var(--leaf);
  --blue-400: var(--leaf);
  --blue-100: #1d3f2c;
  --blue-50: #0f1d16;

  --amber-600: #f5b25b;
  --amber-100: #2e2210;
  --red-600: #ff9d8f;
  --red-100: #2d1411;
}
body { background: var(--night); color: var(--ink); }
::selection { background: var(--go); color: var(--go-ink); }

.nav { background: rgba(7, 12, 10, 0.86); border-bottom-color: var(--line); }
.nav nav > a, .nav .nav-links > a { color: var(--muted); }
.nav nav > a:hover, .nav .nav-links > a:hover { color: var(--ink); background: var(--green-50); }
.nav nav > a.active, .nav nav > a[aria-current], .nav .nav-links > a[aria-current] { color: var(--ink); background: var(--loam-2); }
.nav .cta, .nav .cta:hover, .nav .cta.active, .nav .cta[aria-current] { background: var(--go); color: var(--go-ink); }
.nav-sidebar { background: var(--night-2); }
.nav-sidebar a { color: var(--ink); border-bottom-color: var(--line); }
.brand-mark, .foot-mark { filter: brightness(0) invert(0.94); }

.btn-primary, .btn-amber { background: var(--go); color: var(--go-ink); box-shadow: 0 8px 22px rgba(76, 191, 122, 0.22); }
.btn-primary:hover, .btn-amber:hover { background: var(--go-2); color: var(--go-ink); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--border); }
.btn-ghost:hover { background: var(--green-50); border-color: var(--leaf); color: var(--ink); }
.pb-pile-go { color: var(--go-ink); background: var(--go); }
.pb-pile-go:hover { background: var(--go-2); }
input, select, textarea { color: var(--ink); background: var(--night-2); border-color: var(--border); }
input::placeholder, textarea::placeholder { color: var(--faint); opacity: 1; }
.form-result.ok { background: var(--loam); border-color: var(--leaf); color: var(--ink); }
.form-result.err { background: var(--red-100); border-color: #7a3027; color: var(--red-600); }
.page-hero { background: radial-gradient(900px 420px at 50% -20%, rgba(46, 125, 79, 0.24), transparent 70%), var(--night); color: var(--ink); }
.kicker { color: var(--leaf); }
.card, .step, .panel { background: var(--loam); border-color: var(--line); }
footer { background: #050907; color: var(--muted); border-top: 1px solid var(--line); }
footer a, footer .legal-links a { color: var(--ink); }
footer .fine, footer .privacy-line, footer .affil-line, footer .legal-links { color: var(--faint); }
/* The send-the-code button: the buyer sheet paints it with pale type, which fails AA on the go
   green; it keeps the dark ink here, as every filled action does on this side (8.23:1). */
.submit, button.submit { background: var(--go); color: var(--go-ink); }
.submit:hover, button.submit:hover { background: var(--go-2); color: var(--go-ink); }

/* THE SIGNED-IN PORTAL. portal/index.html carries its own <style> block, AFTER this sheet, for the
   dashboard portal.js draws once a yard has signed in: status pills, the ghost "take it down"
   buttons, the intake assistant's callouts, the capacity toggles. It hard-codes light-theme pairs
   (#a3221a on the night; --green-900 text on --green-100; near-white #fdfbf5 and #fbf0dd grounds
   under the dark theme's pale text) that measure 1.1:1 to 2.6:1 on the dark side (the design
   critic's review, 2026-09-24). Each is repainted here with one extra element of weight (`body`),
   so this sheet wins without the page's markup changing. Every pair below is 4.5:1 or better:
   leaf #8fd0a9 on #1d3f2c 6.5:1, #ff9d8f on #2d1411 8.6:1 and on the night 9.8:1,
   #f5b25b on #2e2210 8.4:1, #9fd3ff on #0f2a3a 9.4:1, ink on #2e2210 13.8:1 (muted 8.7:1, faint
   6.2:1), and the green buttons (--go) keep their dark ink at 8.23:1. Green leads here as on
   the rest of the software side (owner, 2026-09-29); orange is no longer an action colour. */
body .p-status.confirmed, body .p-status.approved, body .acc-chip.have, body .cn-pill.good,
body .in-chip.high, body .speed.live { background: #1d3f2c; color: var(--leaf); }
body .p-status.declined, body .p-status.canceled, body .p-status.rejected, body .cn-pill.bad,
body .tabs button .n { background: #2d1411; color: #ff9d8f; }
body .tabs button.on .n { background: var(--go-ink); color: var(--go); }
body .p-status.placed, body .p-status.pending_review, body .in-chip.medium, body .speed.review { background: #2e2210; color: #f5b25b; }
body .p-status.ready { background: #0f2a3a; color: #9fd3ff; }
body .p-acts button.ghost { background: transparent; color: #ff9d8f; border-color: #7a3027; }
body .ph button { color: #ff9d8f; }
body .p-card.needs { border-left-color: #ff9d8f; }
body .in-row.is-missing, body .in-ask, body .in-stop, body .cap-day.is-paused, body .cap-btn.on { background: #2e2210; }
body .in-ask, body .in-stop, body .cap-btn.on { border-color: #8a6a2a; }
body .p-acts button, body .p-sites-row button[aria-pressed="true"], body .tabs button.on { background: var(--go); border-color: var(--go); color: var(--go-ink); }