/* ================================================================
   GoConMe — Direction B: Full Patriot Maximalism
   ----------------------------------------------------------------
   Two typographic registers, and the contrast between them IS the joke:
     - DISPLAY (Arial Black, chrome gradient, skew): the sincere,
       shouting, patriotic voice.
     - PLAIN (system sans, muted, small): the honest voice that tells
       you exactly what you are buying and what it does not accomplish.
   The plain register must never be removed or hidden. It is both the
   punchline and the legal disclosure, and it is deliberately always
   adjacent to the loud claim it undercuts.
   ================================================================ */

:root {
  --navy-900:#070f26;
  --navy-800:#0a1633;
  --navy-700:#12224d;
  --crimson:#c8102e;
  --crimson-dk:#8a0b1f;
  --red-btn:#e63946;
  --red-btn-dk:#a4111f;
  --gold:#ffd75e;
  --gold-dk:#b8860b;
  --ink-plain:#c2cee6;   /* honest-copy body — AA on navy */
  --ink-quiet:#8f9dbb;   /* honest-copy secondary */
  --line:rgba(255,255,255,.14);

  --display:"Arial Black","Arial Bold",Impact,system-ui,sans-serif;
  --plain:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* 'Merica mode: the palette goes harder, the stripes get louder. */
body.merica {
  --navy-900:#0a0a1f;
  --navy-800:#101033;
  --navy-700:#1b1b5c;
  --gold:#ffe066;
}

*, *::before, *::after { box-sizing:border-box; }

body {
  margin:0;
  font:16px/1.65 var(--plain);
  color:var(--ink-plain);
  background:var(--navy-900);
  -webkit-font-smoothing:antialiased;
}

.wrap { max-width:62rem; margin-inline:auto; padding-inline:1.5rem; }

/* ---------------- shared display type ---------------- */
.display {
  font-family:var(--display);
  text-transform:uppercase;
  letter-spacing:-.02em;
  line-height:.95;
  background:linear-gradient(180deg,#fff 28%,var(--gold) 62%,var(--gold-dk) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 3px 0 rgba(0,0,0,.5));
}

.kicker {
  display:inline-block; background:var(--crimson); color:#fff;
  padding:.32rem 1rem; font-size:.7rem; font-weight:800;
  letter-spacing:.18em; transform:skewX(-8deg); font-family:var(--plain);
}
.kicker > span { display:inline-block; transform:skewX(8deg); }

/* honest register */
.honest { font-family:var(--plain); font-weight:400; color:var(--ink-quiet);
          font-size:.82rem; line-height:1.65; }

/* ---------------- header ---------------- */
.site-head {
  background:var(--navy-900); border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:20;
}
.site-head .wrap { display:flex; align-items:center; gap:1rem;
                   justify-content:space-between; padding-block:.85rem; }
.brand { font-family:var(--display); font-size:1.35rem; text-transform:uppercase;
         color:#fff; letter-spacing:-.02em; text-decoration:none; }
.brand em { font-style:normal; color:var(--crimson); }

/* 'Merica toggle */
.merica-toggle { display:flex; align-items:center; gap:.6rem; cursor:pointer;
                 font-size:.7rem; letter-spacing:.12em; font-weight:700;
                 color:var(--ink-quiet); text-transform:uppercase; }
.merica-toggle input { position:absolute; opacity:0; width:0; height:0; }
.switch { width:46px; height:25px; border-radius:99px; background:#26304d;
          border:1px solid var(--line); position:relative; transition:background .18s; flex:none; }
.switch::after { content:""; position:absolute; top:2px; left:2px; width:19px; height:19px;
                 border-radius:50%; background:#fff; transition:transform .18s; }
.merica-toggle input:checked + .switch { background:var(--crimson); }
.merica-toggle input:checked + .switch::after { transform:translateX(21px); }
.merica-toggle input:focus-visible + .switch { outline:2px solid var(--gold); outline-offset:2px; }

/* ---------------- hero ---------------- */
.hero {
  position:relative; overflow:hidden; text-align:center;
  padding:4.5rem 0 4rem;
  background:linear-gradient(178deg,var(--navy-800) 0%,var(--navy-700) 45%,#3b0d12 100%);
}
.hero::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(90deg,transparent 0 38px,rgba(255,255,255,.03) 38px 76px);
}
body.merica .hero::before {
  background:repeating-linear-gradient(96deg,transparent 0 26px,rgba(255,255,255,.05) 26px 52px);
}
.hero > .wrap { position:relative; }
.hero h1 { margin:1rem 0 .4rem; font-size:clamp(2.6rem,8vw,4.6rem); }
.hero .lede { margin:0 auto 2rem; font-size:.85rem; letter-spacing:.08em;
              color:var(--ink-plain); font-weight:600; text-transform:uppercase; }

/* counter */
.counter { margin:0 0 .2rem; font-family:var(--display); font-size:clamp(3.4rem,12vw,6rem);
           line-height:1; color:var(--gold); font-variant-numeric:tabular-nums;
           text-shadow:0 0 34px rgba(255,215,94,.45); }
.counter-label { font-size:.7rem; letter-spacing:.22em; font-weight:700;
                 color:var(--ink-plain); text-transform:uppercase; }
#honest-line { max-width:34rem; margin:1.1rem auto 0; }

/* ---------------- buttons ---------------- */
.btn {
  display:inline-block; padding:.95rem 2.1rem; border:0; cursor:pointer;
  font-family:var(--display); font-size:1.02rem; text-transform:uppercase;
  letter-spacing:.03em; color:#fff; border-radius:5px;
  background:linear-gradient(180deg,var(--red-btn),var(--red-btn-dk));
  box-shadow:0 4px 0 #6d0b15, 0 10px 24px rgba(0,0,0,.5);
  transition:transform .08s, box-shadow .08s;
}
.btn:hover { transform:translateY(1px); box-shadow:0 3px 0 #6d0b15, 0 8px 18px rgba(0,0,0,.5); }
.btn:active { transform:translateY(4px); box-shadow:0 0 0 #6d0b15, 0 4px 10px rgba(0,0,0,.5); }
.btn:disabled { opacity:.55; cursor:default; transform:none; }
.btn:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.btn.small { padding:.7rem 1.3rem; font-size:.85rem; }

/* ---------------- sections ---------------- */
section { padding-block:5rem; border-top:1px solid var(--line); }
.sec-head { text-align:center; margin-bottom:2.75rem; }
.sec-head h2 { margin:.7rem 0 .3rem; font-size:clamp(1.7rem,5vw,2.6rem); }
.sec-head p { margin:0 auto; max-width:38rem; }

/* waitlist form */
.form-card { background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
             padding:1.75rem; max-width:34rem; margin-inline:auto; }
form { display:grid; gap:1.15rem; }
label { display:block; font-weight:600; font-size:.88rem; color:#fff; }
input[type=email], input[type=text] {
  display:block; width:100%; margin-top:.4rem; padding:.7rem .8rem;
  font:inherit; color:#fff; background:var(--navy-900);
  border:1px solid var(--line); border-radius:6px;
}
input[type=email]:focus, input[type=text]:focus {
  outline:2px solid var(--gold); outline-offset:1px; border-color:transparent;
}
fieldset { border:1px solid var(--line); border-radius:6px; padding:1rem 1.1rem; margin:0; }
legend { font-weight:600; font-size:.88rem; color:#fff; padding-inline:.4rem; }
fieldset label { font-weight:400; display:flex; gap:.55rem; align-items:flex-start;
                 margin:.45rem 0; color:var(--ink-plain); }
.consent { font-weight:400; display:flex; gap:.65rem; align-items:flex-start;
           background:var(--navy-900); border:1px solid var(--line);
           padding:.95rem; border-radius:6px; color:var(--ink-plain); font-size:.85rem; }
.hint, .optional { display:block; font-weight:400; font-size:.78rem; color:var(--ink-quiet); }
.form-status { margin:0; font-size:.87rem; min-height:1.4em; font-weight:600; }
.form-status.error { color:#ff8a95; }
.form-status.success { color:#7ee2a8; }
.waitlist-count { text-align:center; margin:1.25rem 0 0; font-size:.9rem; }
.waitlist-count strong { color:var(--gold); font-family:var(--display); font-size:1.15rem; }

/* ticker */
.ticker-box { background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
              padding:1.25rem 1.4rem; max-width:38rem; margin-inline:auto; }
.ticker-empty { text-align:center; margin:0; }

/* footer */
footer { border-top:1px solid var(--line); padding-block:2.5rem; background:var(--navy-900); }
footer nav { display:flex; gap:1.1rem; flex-wrap:wrap; justify-content:center;
             margin-bottom:1.2rem; }
footer a { color:var(--ink-plain); font-size:.87rem; }
.fine-print { max-width:44rem; margin-inline:auto; text-align:center; }

a { color:var(--gold); }
a:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition:none !important; animation:none !important; }
}

/* ---------------- buy dialog ---------------- */
#buy-dialog { border:1px solid var(--line); border-radius:10px; padding:0;
              background:var(--navy-800); color:var(--ink-plain); max-width:26rem; width:calc(100% - 2rem); }
#buy-dialog::backdrop { background:rgba(3,7,18,.75); }
#buy-form { display:grid; gap:.85rem; padding:1.6rem; }
#buy-form h3 { margin:0; font-family:var(--display); font-size:1.15rem;
               text-transform:uppercase; color:#fff; }
#buy-form label { font-size:.85rem; }
.dialog-actions { display:flex; gap:.6rem; justify-content:flex-end; flex-wrap:wrap; margin-top:.3rem; }
.btn.ghost { background:none; border:1px solid var(--line); box-shadow:none; color:var(--ink-plain); }
.btn.ghost:hover { transform:none; box-shadow:none; border-color:var(--ink-quiet); }

/* ---------------- rate badge ---------------- */
.rate-badge { display:inline-flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  justify-content:center; margin-top:1.75rem; padding:.7rem 1.2rem;
  border:1px solid var(--line); border-radius:99px; background:rgba(0,0,0,.25); }
.rate-figure { font-family:var(--display); font-size:1.5rem; color:var(--gold);
  line-height:1; font-variant-numeric:tabular-nums; }
.rate-text { font-size:.78rem; color:var(--ink-plain); }
#rate-note { color:var(--ink-quiet); }

/* ---------------- how it works ---------------- */
.steps { list-style:none; counter-reset:step; margin:0; padding:0;
  display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); }
.step { counter-increment:step; position:relative; background:var(--navy-800);
  border:1px solid var(--line); border-radius:9px; padding:1.5rem 1.3rem 1.3rem; }
.step::before { content:counter(step); position:absolute; top:-.75rem; left:1.2rem;
  font-family:var(--display); font-size:1.5rem; line-height:1; color:var(--gold);
  background:var(--navy-900); padding:0 .45rem; border-radius:4px; }
.step h3 { margin:.4rem 0 .5rem; font-family:var(--display); font-size:.95rem;
  text-transform:uppercase; color:#fff; line-height:1.25; letter-spacing:.01em; }
.step p { margin:0; }

/* ---------------- amount picker ---------------- */
.presets { display:grid; gap:.75rem; grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));
  margin-bottom:1.75rem; }
.preset { display:flex; flex-direction:column; gap:.3rem; align-items:center;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  padding:1.1rem .9rem; cursor:pointer; font:inherit; color:inherit;
  transition:border-color .12s, transform .08s; }
.preset:hover { border-color:var(--ink-quiet); }
.preset:active { transform:translateY(1px); }
.preset[aria-pressed="true"] { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.preset.featured { border-color:rgba(255,215,94,.45); }
.preset:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.preset-price { font-family:var(--display); font-size:1.5rem; color:var(--gold); line-height:1; }
.preset-name { font-family:var(--display); font-size:.78rem; text-transform:uppercase;
  color:#fff; text-align:center; line-height:1.25; }
.preset-libs { font-size:.72rem; color:var(--ink-quiet); }

.custom-amount { max-width:32rem; margin-inline:auto; text-align:center;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px; padding:1.6rem; }
.custom-amount > label { display:block; margin-bottom:.7rem; }
.amount-row { display:flex; align-items:center; justify-content:center; gap:.5rem; }
.currency-prefix, .currency-suffix { font-family:var(--display); font-size:1.1rem;
  color:var(--ink-quiet); }
#custom-input { width:9rem; margin-top:0; text-align:center;
  font-family:var(--display); font-size:1.6rem; padding:.5rem .6rem; }
#custom-input::-webkit-outer-spin-button, #custom-input::-webkit-inner-spin-button {
  -webkit-appearance:none; margin:0; }
#custom-input { -moz-appearance:textfield; }
.preview { margin:1.1rem 0 1.3rem; font-size:.9rem; color:var(--ink-plain); min-height:2.6em; }
#charge-note { margin:1rem 0 0; }

.ticker-list { list-style:none; margin:0; padding:0; display:grid; gap:.5rem;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  padding:1.25rem 1.4rem; max-width:38rem; margin-inline:auto; }

/* ---------------- your rights ---------------- */
.rights-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(17rem,1fr)); }
.rights-col { background:var(--navy-800); border:1px solid var(--line);
  border-radius:9px; padding:1.5rem 1.4rem; }
.rights-col h3 { margin:0 0 .9rem; font-family:var(--display); font-size:.9rem;
  text-transform:uppercase; letter-spacing:.06em; color:#fff; }
.rights-col ul { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.rights-col li { position:relative; padding-left:1.75rem; font-size:.88rem;
  color:var(--ink-plain); line-height:1.5; }
.rights-col li::before { position:absolute; left:0; top:-.05em; font-size:1.05rem;
  font-weight:700; line-height:1.4; }
.rights-col.yes li::before { content:"\2713"; color:#7ee2a8; }
.rights-col.no  li::before { content:"\2715"; color:#ff8a95; }
.rights-col.yes { border-color:rgba(126,226,168,.28); }
.rights-col.no  { border-color:rgba(255,138,149,.28); }
.rights-note { text-align:center; margin:1.5rem auto 0; max-width:34rem; }

/* ---------------- faq ---------------- */
.faq-list { max-width:44rem; margin-inline:auto; display:grid; gap:.6rem; }
.faq-list details { background:var(--navy-800); border:1px solid var(--line);
  border-radius:9px; overflow:hidden; }
.faq-list summary { cursor:pointer; padding:1rem 1.25rem; font-weight:600;
  font-size:.94rem; color:#fff; list-style:none; display:flex;
  justify-content:space-between; align-items:center; gap:1rem; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:"+"; font-family:var(--display); font-size:1.2rem;
  color:var(--gold); line-height:1; flex:none; }
.faq-list details[open] summary::after { content:"\2013"; }
.faq-list summary:hover { color:var(--gold); }
.faq-list summary:focus-visible { outline:2px solid var(--gold); outline-offset:-2px; }
.faq-list details p { margin:0; padding:0 1.25rem 1.15rem; }

/* ---------------- the free owning machine ---------------- */
.machine { max-width:38rem; margin-inline:auto; text-align:center;
  background:var(--navy-800); border:1px solid var(--line); border-radius:11px;
  padding:1.75rem; }
.machine-screen { background:var(--navy-900); border:1px solid var(--line);
  border-radius:8px; padding:1.6rem 1.4rem; min-height:7.5rem;
  display:flex; align-items:center; justify-content:center; }
.machine-output { margin:0; font-size:1.08rem; line-height:1.5; color:#fff;
  max-width:28rem; }
.machine-output.is-fresh { animation:machine-in .28s ease-out; }
@keyframes machine-in {
  from { opacity:0; transform:translateY(6px); }
  to   { opacity:1; transform:none; }
}
.machine-readout { display:flex; align-items:baseline; justify-content:center;
  gap:.8rem; margin-top:1.3rem; }
.machine-label { font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-quiet); font-weight:700; }
.machine-count { font-family:var(--display); font-size:2.4rem; line-height:1;
  color:var(--gold); font-variant-numeric:tabular-nums; }
.machine-status { margin:.7rem auto 1.4rem; max-width:30rem; min-height:2.6em; }

/* ---------------- partner denial notice ---------------- */
textarea { display:block; width:100%; margin-top:.4rem; padding:.7rem .8rem;
  font:inherit; color:#fff; background:var(--navy-900);
  border:1px solid var(--line); border-radius:6px; resize:vertical; }
textarea:focus { outline:2px solid var(--gold); outline-offset:1px; border-color:transparent; }

.denial { max-width:38rem; margin:2rem auto 0; }
.denial-doc { background:#f4f2ed; color:#1c1a17; padding:2rem 1.9rem;
  font-family:ui-monospace,Consolas,monospace; border:3px solid #8a1f1f;
  box-shadow:0 24px 60px rgba(0,0,0,.5); }
.denial-head { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:#6b6459; }
.denial-rule { border:0; border-top:3px solid #1c1a17; margin:1rem 0 1.2rem; }
.denial-verdict { margin:0; font-family:ui-serif,Georgia,serif; font-size:2rem;
  color:#8a1f1f; letter-spacing:-.02em; }
.denial-applicant { margin:.3rem 0 1.4rem; font-size:1.05rem; font-weight:700;
  word-break:break-all; }
.denial-reasons { margin:0; padding-top:1rem; border-top:1px solid #cfc9bd;
  display:grid; gap:.35rem; }
.denial-reasons dt { font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:#6b6459; margin-top:.6rem; }
.denial-reasons dd { margin:0; font-size:.86rem; line-height:1.55; }
.denial-foot { margin:1.4rem 0 0; padding-top:.9rem; border-top:1px solid #cfc9bd;
  font-size:.68rem; line-height:1.7; color:#6b6459; }

/* ---------------- alberta separation ---------------- */
.separation-card { max-width:34rem; margin-inline:auto; text-align:center;
  background:var(--navy-800); border:1px solid var(--line); border-radius:11px;
  padding:1.9rem 1.7rem; }
.separation-pitch { margin:0 0 1.4rem; font-size:1rem; color:#fff; line-height:1.55; }
.separation-facts { list-style:none; margin:1.6rem 0; padding:1.1rem 0 0;
  border-top:1px solid var(--line); display:grid; gap:.55rem; text-align:left; }
.separation-facts li { display:flex; justify-content:space-between; gap:1rem;
  font-size:.84rem; color:var(--ink-quiet); }
.separation-facts strong { color:var(--gold); font-family:var(--display);
  font-size:.82rem; text-transform:uppercase; white-space:nowrap; }
#sep-input { width:9rem; text-align:center; font-family:var(--display);
  font-size:1.6rem; padding:.5rem .6rem; margin-top:0; }
#sep-input::-webkit-outer-spin-button, #sep-input::-webkit-inner-spin-button {
  -webkit-appearance:none; margin:0; }
#sep-input { -moz-appearance:textfield; }

/* ---------------- final-sale notice ---------------- */
.final-notice { margin:1.4rem 0; padding:1rem 1.15rem; border-radius:8px;
  border:1px solid rgba(255,138,149,.4); background:rgba(200,16,46,.12); text-align:left; }
.final-notice-head { margin:0 0 .45rem; font-family:var(--display); font-size:.9rem;
  text-transform:uppercase; letter-spacing:.03em; color:#ff8a95; line-height:1.3; }
.final-notice .honest { margin:0; }
.final-notice a { color:#ff8a95; }

/* ================================================================
   'MERICA MODE — stars and stripes
   ----------------------------------------------------------------
   The previous version only swapped a few colour tokens, which read as
   the same site with a filter on it. This changes the actual surfaces:
   real horizontal stripes on the hero, a tiled star field over it, a
   stripe rule under the header, and star bullets in the rights list.
   ================================================================ */
body.merica {
  --navy-900:#0a0f2c;
  --navy-800:#101a4d;
  --navy-700:#16246b;
  --crimson:#b31942;          /* Old Glory Red */
  --gold:#ffffff;
  --line:rgba(255,255,255,.2);
}

/* stripes across the hero */
body.merica .hero {
  background:
    repeating-linear-gradient(180deg,
      rgba(179,25,66,.30) 0 34px,
      rgba(255,255,255,.06) 34px 68px),
    linear-gradient(178deg, #0a1a4f 0%, #14265f 55%, #6b0f22 100%);
}

/* tiled star field over the stripes */
body.merica .hero::before {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='%23ffffff' fill-opacity='0.13'%3E%3Cpath d='M32 14l3.9 8.4 9.2 1.1-6.8 6.3 1.8 9.1L32 34.5l-8.1 4.4 1.8-9.1-6.8-6.3 9.2-1.1z'/%3E%3Cpath d='M104 82l3.9 8.4 9.2 1.1-6.8 6.3 1.8 9.1-8.1-4.4-8.1 4.4 1.8-9.1-6.8-6.3 9.2-1.1z'/%3E%3Cpath d='M72 46l2.6 5.6 6.1.7-4.5 4.2 1.2 6.1-5.4-2.9-5.4 2.9 1.2-6.1-4.5-4.2 6.1-.7z'/%3E%3C/g%3E%3C/svg%3E");
  background-size:140px 140px;
}

/* stripe rule under the sticky header */
body.merica .site-head {
  border-bottom:0;
  box-shadow:
    inset 0 -6px 0 var(--crimson),
    inset 0 -12px 0 #fff,
    inset 0 -18px 0 var(--crimson);
  padding-bottom:12px;
}

/* the kicker becomes a flag chip */
body.merica .kicker {
  background:
    repeating-linear-gradient(180deg, var(--crimson) 0 4px, #fff 4px 8px);
  color:#0a0f2c; text-shadow:0 1px 0 rgba(255,255,255,.85);
  font-weight:900;
}

/* display type goes white-hot instead of gold */
body.merica .display {
  background:linear-gradient(180deg,#fff 34%,#e8ecff 60%,#9fb0e8 100%);
  -webkit-background-clip:text; background-clip:text;
}
body.merica .counter { color:#fff; text-shadow:0 0 38px rgba(255,255,255,.55); }
body.merica .rate-figure { color:#fff; }

/* star bullets replace ticks */
body.merica .rights-col.yes li::before { content:"\2605"; color:#fff; }
body.merica .rights-col.no  li::before { content:"\2605"; color:#b31942; }

/* section rules become thin stripes */
body.merica section {
  border-top:0;
  background-image:linear-gradient(90deg,
    var(--crimson) 0 25%, #fff 25% 50%, var(--crimson) 50% 75%, #fff 75% 100%);
  background-size:100% 3px;
  background-repeat:no-repeat;
  background-position:top left;
}

body.merica .btn {
  background:linear-gradient(180deg,#d62839,#8c0f24);
  box-shadow:0 4px 0 #5c0a17, 0 10px 24px rgba(0,0,0,.55);
}
body.merica .machine-count { color:#fff; }

/* ---------------- top ticker banner ---------------- */
.tickerbar { position:relative; overflow:hidden; background:var(--crimson);
  color:#fff; font-size:clamp(.8rem, 1.5vw, .95rem); letter-spacing:.11em;
  text-transform:uppercase; font-weight:700; padding:.55rem 0;
  border-bottom:1px solid rgba(0,0,0,.25);
  /* Letters slide across a stripe boundary every few characters, so the
     effective contrast oscillates the whole time it is moving. A shadow holds
     the glyph edges over the lighter band without dulling the stripes. */
  text-shadow:0 1px 2px rgba(0,0,0,.6); }
.tickerbar-track { display:inline-flex; gap:2.5rem; white-space:nowrap;
  will-change:transform; animation:tickerbar 44s linear infinite; }
.tickerbar-track span::before { content:"\2605"; margin-right:.7rem; opacity:.65; }
@keyframes tickerbar { from { transform:translateX(0); } to { transform:translateX(-50%); } }
body.merica .tickerbar {
  /* 72px bands rather than 40px: a word now sits inside one stripe instead of
     straddling two, which is most of the legibility problem. The two reds are
     also closer together than before - the stripe still reads as a stripe. */
  background:repeating-linear-gradient(90deg, var(--crimson) 0 72px, #a50d26 72px 144px); }

/* the hero counter settles rather than snapping */
.counter.is-winding { color:#fff; }

/* ---------------- fireworks (certificate page) ---------------- */
#fireworks { position:fixed; inset:0; pointer-events:none; z-index:50; }

@media (prefers-reduced-motion:reduce) {
  .tickerbar-track { animation:none; }
  #fireworks { display:none; }
}

/* ---------------- support block ---------------- */
.support-real { max-width:34rem; margin:1.75rem auto 0; text-align:left;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  padding:1.3rem 1.4rem; }
.support-head { margin:0 0 .5rem; font-family:var(--display); font-size:.9rem;
  text-transform:uppercase; color:#fff; letter-spacing:.02em; }
.support-real .honest { margin:0; }

/* ---------------- wall of owners ---------------- */
.wall-list { display:grid; gap:.6rem; grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
  max-width:58rem; margin-inline:auto; }
.wall-card { display:flex; flex-direction:column; gap:.25rem; text-decoration:none;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  padding:1rem 1.1rem; transition:border-color .12s; }
.wall-card:hover { border-color:var(--gold); }
.wall-name { font-family:var(--display); font-size:.95rem; text-transform:uppercase;
  color:#fff; word-break:break-word; line-height:1.25; }
.wall-meta { font-size:.75rem; color:var(--ink-quiet); }
.wall-card.is-reclassified { border-color:rgba(255,138,149,.45); }
.wall-card.is-reclassified .wall-name { color:#ff8a95; text-decoration:line-through; }
.wall-card.is-reclassified .wall-meta { color:#ff8a95; }

/* ---------------- recent owners feed ---------------- */
.head-nav a { color:var(--ink-plain); font-size:.78rem; text-decoration:none;
  letter-spacing:.1em; text-transform:uppercase; font-weight:700; }
.head-nav a:hover { color:var(--gold); }
.site-head .wrap { gap:1.25rem; }

.owners-feed { display:grid; gap:.75rem; max-width:46rem; margin-inline:auto; }
.owner-row { display:flex; flex-direction:column; gap:.3rem; text-decoration:none;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  padding:1.1rem 1.25rem; transition:border-color .12s, transform .08s; }
.owner-row:hover { border-color:var(--gold); transform:translateY(-1px); }
.owner-row:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.owner-line { font-size:1rem; color:#fff; line-height:1.4; }
.owner-line strong { font-family:var(--display); text-transform:uppercase;
  font-size:.98rem; letter-spacing:.01em; }
.owner-line .libs { color:var(--gold); font-family:var(--display); }
.owner-method { font-size:.85rem; color:var(--ink-quiet); line-height:1.5; }
.owner-cta { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-quiet); font-weight:700; margin-top:.15rem; }
.owner-row:hover .owner-cta { color:var(--gold); }
.owners-empty { text-align:center; max-width:34rem; margin-inline:auto; }
.owners-more { text-align:center; margin:1.5rem 0 0; }
.wall-method { font-size:.72rem; color:var(--ink-quiet); line-height:1.45; margin-top:.15rem; }
.wall-cta { font-size:.66rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-quiet); font-weight:700; margin-top:.45rem; }
.wall-card:hover .wall-cta { color:var(--gold); }

/* ---------------- partner denial advice ---------------- */
.denial-advice { max-width:34rem; margin:1.5rem auto 0; padding:1.15rem 1.3rem;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px; }
.denial-advice-head { margin:0 0 .45rem; font-family:var(--display); font-size:.85rem;
  text-transform:uppercase; color:#fff; letter-spacing:.03em; }
.denial-advice .honest { margin:0 0 .6rem; }
.denial-advice .honest:last-child { margin-bottom:0; }

/* ---------------- buyer messages + reporting ---------------- */

/* The message a buyer left for the libs. Quoted visually rather than with
   literal quote marks, so an entry that already contains quotes does not
   end up double-quoted. */
.owner-message { font-size:.9rem; color:var(--ink-plain); line-height:1.5;
  border-left:2px solid var(--gold); padding-left:.75rem; margin:.35rem 0 .1rem;
  font-style:italic; word-break:break-word; }
.wall-card .owner-message { font-size:.82rem; margin:.3rem 0 .1rem; }

/* Wrapper exists so the report button can sit over a card that is itself an
   anchor. Nesting a button in a link is invalid and keyboard-unreachable. */
.owner-item { position:relative; }

.report-btn { position:absolute; top:.45rem; right:.5rem; z-index:2;
  background:transparent; border:0; padding:.3rem .45rem; border-radius:5px;
  font:inherit; font-size:.62rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-quiet); cursor:pointer;
  opacity:.5; transition:opacity .12s, color .12s, background-color .12s; }
/* Always present, never hover-only: a control that appears on hover does not
   exist on a touchscreen. */
.owner-item:hover .report-btn { opacity:1; }
.report-btn:hover { color:#ff8a95; background:rgba(255,138,149,.1); }
.report-btn:focus-visible { opacity:1; outline:2px solid var(--gold);
  outline-offset:2px; }

#report-dialog fieldset { border:1px solid var(--line); border-radius:8px;
  padding:.9rem 1rem; margin:0 0 1rem; }
#report-dialog fieldset label { display:block; font-weight:400; margin:.3rem 0; }
#report-dialog legend { padding:0 .4rem; font-weight:600; font-size:.85rem; }
#report-dialog textarea { width:100%; }

/* ---------------- grift-free / gift block ---------------- */
.griftfree-gift { max-width:34rem; margin:1.75rem auto 0; padding:1.15rem 1.3rem;
  background:var(--navy-800); border:1px solid var(--line); border-radius:9px;
  text-align:left; }
.griftfree-gift-head { margin:0 0 .45rem; font-family:var(--display); font-size:.85rem;
  text-transform:uppercase; color:#fff; letter-spacing:.03em; }
.griftfree-gift .honest { margin:0; }

/* ---------------- skin toggle (segmented, three-way) ---------------- */
/* Replaced the two-state checkbox: three voices do not fit in a switch. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

.skin-toggle { display:inline-flex; gap:0; margin:0; padding:2px; border:0;
  background:rgba(255,255,255,.06); border-radius:999px;
  outline:1px solid var(--line); }
.skin-toggle label { position:relative; cursor:pointer; }
.skin-toggle input { position:absolute; opacity:0; width:100%; height:100%;
  margin:0; cursor:pointer; }
.skin-toggle span { display:block; padding:.34rem .78rem; border-radius:999px;
  font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-quiet); transition:background-color .14s, color .14s; }
.skin-toggle input:checked + span { background:var(--gold); color:#1a1408; }
.skin-toggle input:focus-visible + span { outline:2px solid var(--gold);
  outline-offset:2px; }
.skin-toggle label:hover input:not(:checked) + span { color:#fff; }

/* Berta wears the provincial blue in the ticker, the way Merica wears stripes. */
body.berta .tickerbar {
  background:repeating-linear-gradient(90deg, #00457c 0 72px, #003a68 72px 144px); }

@media (max-width:640px) {
  .skin-toggle span { padding:.32rem .55rem; font-size:.62rem; letter-spacing:.06em; }
}

/* ---------------- scrolling owners feed ---------------- */
/* A bounded scroll area rather than an ever-growing page: the feed pages in
   as you reach the bottom and stops at DOM_CAP, handing off to the full wall. */
.owners-feed.is-scrolling { max-height:min(70vh, 40rem); overflow-y:auto;
  overscroll-behavior:contain; padding-right:.4rem;
  scrollbar-width:thin; scrollbar-color:var(--gold) transparent; }
.owners-feed.is-scrolling::-webkit-scrollbar { width:8px; }
.owners-feed.is-scrolling::-webkit-scrollbar-track { background:transparent; }
.owners-feed.is-scrolling::-webkit-scrollbar-thumb {
  background:rgba(255,215,94,.35); border-radius:99px; }
.owners-feed.is-scrolling::-webkit-scrollbar-thumb:hover {
  background:rgba(255,215,94,.6); }

/* Zero-height marker the IntersectionObserver watches. */
#owners-sentinel { height:1px; }

@media (prefers-reduced-motion:reduce) {
  .owners-feed.is-scrolling { scroll-behavior:auto; }
}

/* Moderation heads-up in the buy dialog. Slightly separated from the field
   hints so it reads as a policy note rather than help text for one input. */
.moderation-note { margin:.6rem 0 0; padding:.7rem .85rem; line-height:1.55;
  background:rgba(255,215,94,.07); border-left:2px solid rgba(255,215,94,.45);
  border-radius:0 6px 6px 0; }