/* Copied from web/shared/components.css v0.1 (sections 0–6, 12, 14, 19 for the teaser).
   Verbatim rules; sections and rules this site does not use are left out.
   Edit the shared source, then re-copy (web/tools/copy_css_theunburied.py). Responsive layout lives in site.css / teaser.css. */
/* ---------- 0. Derived tokens (alpha versions of the primitives) ---------- */
:root{
  --text-muted:var(--ash-500);
  --border-hair:var(--ash-800);
  --border-strong:var(--ash-500);
  --r-xs:2px;

  --bone-a02:rgba(243,239,231,.02);
  --bone-a04:rgba(243,239,231,.04);
  --bone-a06:rgba(243,239,231,.06);
  --bone-a10:rgba(243,239,231,.10);
  --bone-a16:rgba(243,239,231,.16);
  --bone-a24:rgba(243,239,231,.24);
  --gold-a06:rgba(201,162,74,.06);
  --gold-a10:rgba(201,162,74,.10);
  --gold-a16:rgba(201,162,74,.16);
  --gold-a24:rgba(201,162,74,.24);
  --gold-a40:rgba(201,162,74,.40);
  --soil-a00:rgba(12,11,10,0);
  --soil-a60:rgba(12,11,10,.60);
  --soil-a78:rgba(12,11,10,.78);
  --soil-a92:rgba(12,11,10,.92);
  --ash-a40:rgba(42,41,38,.40);
  --returned-a08:rgba(201,119,74,.08);
  --returned-a14:rgba(201,119,74,.14);
  --returned-a40:rgba(201,119,74,.40);
  --sprout-a10:rgba(124,154,62,.10);
  --sprout-a16:rgba(124,154,62,.16);
  --sprout-a40:rgba(124,154,62,.40);
  --memorial-a20:rgba(123,31,36,.20);
  --memorial-a60:rgba(123,31,36,.60);

  --shadow-1:0 1px 2px rgba(0,0,0,.40);
  --shadow-2:0 12px 32px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.30);
  --shadow-3:0 32px 80px rgba(0,0,0,.60), 0 4px 16px rgba(0,0,0,.40);
  --ring-gold:0 0 0 3px var(--gold-a24);
  --ring-bone:0 0 0 3px var(--bone-a16);
  --ring-returned:0 0 0 3px var(--returned-a14);
}
/* ---------- 1. Board layout ---------- */
.stack{display:flex;flex-direction:column}
.row{display:flex;align-items:center}
.row-between{display:flex;align-items:center;justify-content:space-between}
.gap-1{gap:var(--s1)}.gap-2{gap:var(--s2)}.gap-3{gap:var(--s3)}.gap-4{gap:var(--s4)}.gap-5{gap:var(--s5)}
.gap-6{gap:var(--s6)}.gap-7{gap:var(--s7)}.gap-8{gap:var(--s8)}.gap-9{gap:var(--s9)}.gap-10{gap:var(--s10)}
.rule{height:1px;background:var(--border-hair);flex:none;align-self:stretch}
.rule-v{width:1px;background:var(--border-hair);flex:none;align-self:stretch}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.seam-h{height:1px;flex:none;align-self:stretch;background:linear-gradient(90deg,var(--gold-a06),var(--accent-seam) 50%,var(--gold-a06))}
.seam-h.is-solid{background:var(--accent-seam)}
.seam-v{width:1px;flex:none;align-self:stretch;background:linear-gradient(180deg,var(--gold-a06),var(--accent-seam) 50%,var(--gold-a06))}
.seam-v.is-solid{background:var(--accent-seam)}
.tex-soil{background:radial-gradient(120% 80% at 50% 0%,var(--ash-a40),var(--soil-a00) 60%),var(--surface-base)}
.tex-ember{background:radial-gradient(60% 45% at 50% 100%,var(--gold-a10),var(--soil-a00) 70%),radial-gradient(120% 80% at 50% 0%,var(--ash-a40),var(--soil-a00) 60%),var(--surface-base)}
.tex-vignette{background:radial-gradient(80% 70% at 50% 45%,var(--soil-a00) 40%,var(--soil-a92) 100%),var(--surface-raised)}
.tex-grain{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .95  0 0 0 0 .93  0 0 0 0 .9  0 0 0 .05 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}
/* ---------- 2. Brand marks ---------- */
.mark{display:block;flex:none;color:var(--accent-seam);fill:currentColor}
.mark-md{width:32px;height:80px}.mark-lg{width:64px;height:160px}.mark-xl{width:120px;height:300px}
.wordmark{font-family:var(--font-display);font-weight:600;font-size:18px;line-height:1;letter-spacing:.22em;text-transform:uppercase;color:var(--text-primary);white-space:nowrap}
/* ---------- 3. Typography ---------- */
.display-hero{font-family:var(--font-display);font-weight:600;font-size:120px;line-height:.96;letter-spacing:-.01em}
.display-title{font-family:var(--font-display);font-weight:600;font-size:72px;line-height:1.02;letter-spacing:-.005em}
.heading-h1{font-family:var(--font-display);font-weight:600;font-size:48px;line-height:1.08}
.heading-h2{font-family:var(--font-display);font-weight:600;font-size:32px;line-height:1.15}
.eyebrow{font-family:var(--font-sans);font-weight:500;font-size:12px;line-height:1.3;letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary)}
.eyebrow-sm{font-size:11px;letter-spacing:.16em}
.body-base{font-size:16px;line-height:1.6}
.body-sm{font-size:13px;line-height:1.5}
.caption{font-size:12px;line-height:1.45;color:var(--text-secondary)}
.t-primary{color:var(--text-primary)}.t-secondary{color:var(--text-secondary)}.t-muted{color:var(--text-muted)}
.t-accent{color:var(--text-accent)}.t-accent-light{color:var(--accent-seam-light)}.t-inverse{color:var(--text-inverse)}
.t-bone{color:var(--bone-100)}.t-returned{color:var(--status-returned)}.t-approved{color:var(--status-approved)}
.link{color:var(--text-primary);text-decoration:underline;text-decoration-color:var(--ash-500);text-underline-offset:3px;text-decoration-thickness:1px}
/* ---------- 4. Icons ---------- */
.icon{display:inline-block;flex:none;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.icon-xs{width:12px;height:12px}.icon-sm{width:14px;height:14px}.icon-md{width:18px;height:18px}
.icon-lg{width:20px;height:20px}.icon-xl{width:24px;height:24px}
.icon-fill{fill:currentColor;stroke:none}
/* ---------- 5. Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:none;width:max-content;height:48px;padding:0 28px;border:1px solid transparent;border-radius:var(--r-xs);background:transparent;color:var(--text-primary);font-family:var(--font-sans);font-weight:500;font-size:13px;line-height:1;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;text-decoration:none;cursor:pointer}
.btn .icon{width:16px;height:16px}
.btn-sm{height:36px;padding:0 16px;gap:8px;font-size:11px}
.btn-sm .icon{width:14px;height:14px}
.btn-lg{height:56px;padding:0 40px;font-size:14px;letter-spacing:.16em}
.btn-block{display:flex;width:100%}
.btn-primary{background:var(--accent-seam);border-color:var(--accent-seam);color:var(--text-inverse)}
.btn-primary:hover,.btn-primary.is-hover{background:var(--accent-seam-light);border-color:var(--accent-seam-light)}
.btn-primary.is-pressed{background:var(--accent-seam-deep);border-color:var(--accent-seam-deep);color:var(--text-inverse)}
.btn-secondary{background:transparent;border-color:var(--bone-100);color:var(--text-primary)}
.btn-secondary:hover,.btn-secondary.is-hover{background:var(--bone-a06)}
.btn-secondary.is-pressed{background:var(--bone-a16)}
.btn.is-focus,.btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--surface-base),0 0 0 4px var(--accent-seam-light)}
.btn.is-disabled,.btn:disabled{background:var(--surface-muted);border-color:var(--surface-muted);color:var(--text-muted);box-shadow:none;cursor:not-allowed}
.btn-secondary.is-disabled,.btn-secondary:disabled{background:transparent;border-color:var(--ash-700)}
.btn.is-loading{cursor:progress}
.btn-primary.is-loading{background:var(--accent-seam-deep);border-color:var(--accent-seam-deep)}
.spinner{display:inline-block;flex:none;width:14px;height:14px;border-radius:50%;border:1.5px solid currentColor;border-right-color:transparent;animation:spin .9s linear infinite}
.spinner-lg{width:22px;height:22px;border-width:2px}
@keyframes spin{to{transform:rotate(360deg)}}
.btn-text{height:auto;padding:0;border:0;background:none;color:var(--text-secondary);font-size:11px;letter-spacing:.18em}
.btn-text:hover,.btn-text.is-hover{color:var(--text-primary)}
/* ---------- 6. Form fields ---------- */
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-family:var(--font-sans);font-weight:500;font-size:13px;line-height:1.3;color:var(--bone-100)}
.field-optional{font-weight:400;font-size:12px;color:var(--text-muted)}
.field-hint{font-size:12px;line-height:1.45;color:var(--text-secondary)}
.field-error{display:flex;align-items:center;gap:6px;font-size:12px;line-height:1.45;color:var(--status-returned)}
.field-error .icon{width:14px;height:14px}
.input,.textarea,.select{display:flex;align-items:center;width:100%;height:48px;padding:0 16px;gap:10px;background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--r-xs);color:var(--text-primary);font-family:var(--font-sans);font-weight:400;font-size:15px;line-height:1.4;outline:none;-webkit-appearance:none;appearance:none}
.input::placeholder,.textarea::placeholder{color:var(--text-muted)}
.input:hover,.select:hover,.textarea:hover,.input.is-hover{border-color:var(--ash-500)}
.input:focus,.textarea:focus,.input.is-focus,.textarea.is-focus,.select.is-focus,.input-affix.is-focus{border-color:var(--accent-seam);box-shadow:var(--ring-gold)}
.input.is-error,.textarea.is-error,.select.is-error,.input-affix.is-error{border-color:var(--status-returned);box-shadow:var(--ring-returned)}
.input.is-disabled,.input:disabled,.textarea.is-disabled,.select.is-disabled,.input-affix.is-disabled{background:var(--surface-base);border-color:var(--ash-800);color:var(--text-muted);cursor:not-allowed}
.input-mono{font-family:var(--font-mono);letter-spacing:.04em}
.input-affix{display:flex;align-items:center;gap:10px;width:100%;height:48px;padding:0 6px 0 14px;background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--r-xs);color:var(--text-secondary)}
.input-bare{flex:1;min-width:0;height:100%;border:0;background:transparent;outline:none;color:var(--text-primary);font-family:var(--font-sans);font-size:15px}
.input-bare::placeholder{color:var(--text-muted)}
/* ---------- 12. Navigation ---------- */
.site-header{display:flex;align-items:center;justify-content:space-between;gap:32px;flex:none;height:88px;padding:0 64px;border-bottom:1px solid transparent}
.site-header.is-bordered{border-bottom-color:var(--border-hair)}
.site-header.is-mobile{height:64px;padding:0 20px}
.site-brand{display:flex;align-items:center;gap:14px;color:var(--text-primary);text-decoration:none}
.site-brand .mark{width:12px;height:30px}
.site-brand-name{font-family:var(--font-display);font-weight:600;font-size:17px;line-height:1;letter-spacing:.24em;text-transform:uppercase;white-space:nowrap}
/* ---------- 14. Cards & stats ---------- */
.callout{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:var(--surface-raised);border:1px solid var(--border-hair);border-radius:var(--r-sm);font-size:13px;line-height:1.55;color:var(--ash-100)}
.callout .icon{margin-top:2px;color:var(--text-secondary)}
.callout-title{display:block;font-weight:500;color:var(--text-primary)}
.callout-safety{box-shadow:inset 2px 0 0 var(--bone-100)}
.callout-returned{background:var(--returned-a08);border-color:var(--returned-a40)}
.callout-returned .icon{color:var(--status-returned)}
/* ---------- 19. Footer ---------- */
.footer-disclaimer{max-width:560px;font-size:13px;line-height:1.55;color:var(--text-secondary)}
.footer-min{display:flex;align-items:center;justify-content:space-between;gap:24px;flex:none;margin-top:auto;padding:28px 64px;font-size:12px;line-height:1.5;color:var(--text-muted)}
.footer-min.is-mobile{flex-direction:column;align-items:flex-start;gap:14px;padding:24px 20px}