:root{
  /* Brand field: PURPLE REIGN (V3), owner pick 2026-10-15 — canonical stops
     #18388a / #56228a / #b81e2e; --navy/--navy2 keep legacy names, now the
     purple field bottom/top shades (was navy #0a1628 / #10203a). */
  --deep-blue:#18388a; --deep-purple:#56228a; --deep-red:#b81e2e;
  --brand-gradient:linear-gradient(90deg,#18388a 0%,#56228a 50%,#b81e2e 100%);
  /* Brand field 2026-10-19 (owner order): HONEYCOMB over the Purple Reign
     gradient — the Constitution Series endcard field. Stops + line color are
     PIXEL-SAMPLED from ep01-preamble/endcard.png: fill runs deep navy
     #101131 (top) through #1a123c / #251447 / #2f1553 to rich purple
     #39165d (bottom); hexagon outline is #5f3194 throughout. Tile is a
     seamless flat-top hexagon SVG (90x52 viewBox, R=30, drawn at 180x104
     so hexagons land ~120px wide like the endcard); it layers OVER the
     vertical gradient on body. Cards/header keep their solid fills. */
  --field-gradient:linear-gradient(180deg,#0d0d2b 0%,#1a123c 28%,#251447 52%,#2f1553 76%,#39165d 100%);
  --honeycomb:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='52' viewBox='0 0 90 52'%3E%3Cg fill='none' stroke='%235f3194' stroke-width='1.6'%3E%3Cpath d='M30 0L15 26L-15 26L-30 0L-15-26L15-26Z'/%3E%3Cpath d='M120 0L105 26L75 26L60 0L75-26L105-26Z'/%3E%3Cpath d='M30 52L15 78L-15 78L-30 52L-15 26L15 26Z'/%3E%3Cpath d='M120 52L105 78L75 78L60 52L75 26L105 26Z'/%3E%3Cpath d='M75 26L60 52L30 52L15 26L30 0L60 0Z'/%3E%3C/g%3E%3C/svg%3E");
  --navy:#512082; --navy2:#592390; --blue:#4CC9F0; --red:#e63946;
  --white:#f4f7fb; --muted:#9fb0c7;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:clip}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
     background-color:#1a123c;
     background-image:var(--honeycomb),var(--field-gradient);
     background-size:180px 104px,100% 100%;
     background-repeat:repeat,no-repeat;
     color:var(--white);line-height:1.6;
     overflow-wrap:break-word}
a{color:var(--blue)}
img,video,iframe{max-width:100%}
img{height:auto}
header{position:sticky;top:0;z-index:10;background:rgba(81,32,130,.95);
       backdrop-filter:blur(6px);border-bottom:1px solid rgba(76,201,240,.15)}
nav{max-width:1000px;margin:0 auto;display:flex;align-items:center;gap:14px;
    padding:14px 20px;position:relative}
nav img{width:44px;height:44px;border-radius:50%}
nav .brand{font-weight:800;font-size:1.25rem;letter-spacing:.5px;
           text-decoration:none;color:var(--white);white-space:nowrap}
nav .brand span{color:var(--blue)}
nav .links{margin-left:auto;display:flex;gap:22px;font-size:.95rem}
nav .links a{color:var(--white);text-decoration:none;opacity:.85}
nav .links a:hover,nav .links a.active{opacity:1;color:var(--blue)}
/* Hamburger: hidden on desktop, shown on tablet-portrait and phones */
.menu-btn{display:none;margin-left:auto;background:none;border:0;cursor:pointer;
          padding:10px;flex-direction:column;gap:5px;align-items:center;
          justify-content:center;min-width:44px;min-height:44px}
.menu-btn span{display:block;width:24px;height:2px;background:var(--white);
               border-radius:2px;transition:transform .18s ease,opacity .18s ease}
nav.menu-open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
nav.menu-open .menu-btn span:nth-child(2){opacity:0}
nav.menu-open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.hero{max-width:1000px;margin:0 auto;padding:90px 20px 70px;text-align:center}
.hero.compact{padding:64px 20px 36px}
.hero img{width:150px;height:150px;border-radius:50%;
          border:3px solid var(--blue);margin-bottom:26px}
.hero h1{font-size:3rem;letter-spacing:1px;margin-bottom:14px}
.hero h1 span{color:var(--blue)}
.hero p.lede{font-size:1.25rem;color:var(--muted);max-width:640px;margin:0 auto 34px}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 28px;border-radius:8px;font-weight:700;
     text-decoration:none;font-size:1rem;transition:transform .12s ease}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--blue);color:var(--navy)}
.btn.ghost{border:2px solid var(--blue);color:var(--blue)}
.tagline{margin-top:30px;color:var(--muted);font-style:italic}
.tagline strong{color:var(--white);font-style:normal}
section{max-width:1000px;margin:0 auto;padding:56px 20px}
section h2{font-size:1.8rem;margin-bottom:8px}
section h2 .bar{display:block;width:64px;height:4px;background:var(--red);
                border-radius:2px;margin-top:10px}
section p.body{color:#d5dee9;max-width:720px;margin-top:18px;font-size:1.05rem}
.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
        gap:18px;margin-top:28px}
.card{background:var(--navy2);border:1px solid rgba(76,201,240,.18);
      border-radius:12px;padding:24px;min-width:0}
.card h3{color:var(--blue);font-size:1.05rem;margin-bottom:8px}
.card p{color:#c6d2e2;font-size:.95rem}
a.cardlink{text-decoration:none;display:block;transition:transform .12s ease,border-color .12s ease}
a.cardlink:hover{transform:translateY(-3px);border-color:var(--blue)}
.cardlink .more{color:var(--blue);font-weight:700;font-size:.95rem;margin-top:10px;display:inline-block}
.join{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
      gap:18px;margin-top:28px}
.join a.card{text-decoration:none;display:flex;gap:16px;align-items:flex-start;
             transition:transform .12s ease}
.join a.card:hover{transform:translateY(-3px);border-color:var(--blue)}
.join .card h3{font-size:1.15rem;margin-bottom:4px}
.join .card p.desc{color:#c6d2e2;font-size:.95rem}
.join .card p.handle{color:var(--muted);font-size:.9rem;margin-top:4px}
.picon{flex:0 0 48px;width:48px;height:48px;border-radius:50%;
       background:rgba(76,201,240,.12);display:flex;align-items:center;
       justify-content:center;color:var(--blue)}
.picon svg{width:24px;height:24px;fill:currentColor}
.coming{margin-top:22px;color:var(--muted);font-size:.9rem;font-style:italic}
.chips{max-width:1000px;margin:6px auto 0;padding:0 20px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.chip{background:transparent;border:2px solid rgba(76,201,240,.4);color:var(--white);
      border-radius:999px;padding:8px 20px;font-size:.95rem;font-weight:600;cursor:pointer;
      white-space:nowrap;flex:0 0 auto}
.chip.active,.chip:hover{background:var(--blue);color:var(--navy);border-color:var(--blue)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:18px;margin-top:24px}
.cardtop{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.topic{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.badge{font-size:.78rem;font-weight:700;border-radius:999px;padding:4px 12px;white-space:nowrap}
.badge.live{background:var(--red);color:#fff}
.badge.soon{background:rgba(76,201,240,.15);color:var(--blue);border:1px solid rgba(76,201,240,.4)}
.badge.pin{background:#6d28d9;color:#fff}
.airdate{color:var(--muted);font-size:.9rem;margin-bottom:8px}
.hook{color:#d5dee9;font-style:italic;margin-bottom:12px}
.embedwrap{position:relative;padding-bottom:177.78%;height:0;overflow:hidden;border-radius:10px;margin-bottom:12px;background:#000}
.embedwrap iframe,.embedwrap video{position:absolute;top:0;left:0;width:100%;height:100%;border:0;background:#000}
.plinks{font-size:.92rem;margin-bottom:12px;overflow-wrap:anywhere}
.plinks.note{color:var(--muted);font-style:italic}
details.transcript{margin:10px 0;border:1px solid rgba(76,201,240,.25);border-radius:8px}
details.transcript summary{cursor:pointer;padding:10px 14px;font-weight:700;color:var(--blue);font-size:.95rem}
details.transcript .t{padding:0 14px 14px;color:#c6d2e2;font-size:.93rem}
details.transcript .t p{margin-bottom:8px}
.tlabel{font-weight:700;color:var(--white);margin-top:12px!important}
.tend{color:var(--muted);font-style:italic}
.disclosure{font-size:.8rem;color:var(--muted);font-style:italic;margin-top:10px}
.prompt .q{font-size:1.08rem;color:var(--white);margin:10px 0 6px}
.prompt .ptopic{color:var(--muted);font-size:.88rem}
.sampletag{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:1px;
            background:rgba(230,57,70,.15);color:var(--red);border:1px solid var(--red);
            border-radius:4px;padding:3px 10px}
.steel p{color:#c6d2e2;font-size:.98rem;margin-bottom:12px}
.steel .src{font-size:.88rem;color:var(--muted)}
.steel .disclosure{font-style:normal;font-weight:700;color:var(--white)}
.soon-card h3{color:var(--muted)}
.soon-card p{color:var(--muted);font-size:.95rem;font-style:italic}
footer{border-top:1px solid rgba(76,201,240,.15);margin-top:40px}
footer .inner{max-width:1000px;margin:0 auto;padding:28px 20px;display:flex;
             gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
             color:var(--muted);font-size:.9rem}

/* ---------- Content variants: mobile gets the optimized cut, desktop the full cut ---------- */
.mobile-only{display:none!important}
@media(max-width:1024px){
  .desktop-only{display:none!important}
  .mobile-only{display:block!important}
}

/* ---------- Tablet (portrait) and smaller: hamburger menu, same links, same destinations ---------- */
@media(max-width:900px){
  .menu-btn{display:flex}
  nav .links{display:none;position:absolute;top:100%;left:0;right:0;margin-left:0;
             background:var(--navy2);flex-direction:column;gap:0;padding:6px 0 10px;
             border-bottom:1px solid rgba(76,201,240,.25);
             box-shadow:0 18px 30px rgba(0,0,0,.45)}
  nav.menu-open .links{display:flex}
  nav .links a{padding:14px 22px;font-size:1.05rem;border-top:1px solid rgba(255,255,255,.06)}
  nav .links a:first-child{border-top:0}
}

/* ---------- Tablet tuning ---------- */
@media(max-width:1024px){
  .hero{padding:70px 20px 54px}
  .hero.compact{padding:52px 20px 30px}
  .hero h1{font-size:2.5rem}
  .hero p.lede{font-size:1.12rem}
  section{padding:46px 20px}
}

/* ---------- Phones ---------- */
@media(max-width:640px){
  nav{padding:12px 16px;gap:10px}
  nav .brand{font-size:1.1rem}
  nav img{width:38px;height:38px}
  .hero{padding:48px 16px 36px}
  .hero.compact{padding:40px 16px 24px}
  .hero img{width:110px;height:110px;margin-bottom:20px}
  .hero h1{font-size:2rem}
  .hero p.lede{font-size:1.05rem;margin-bottom:26px}
  .cta{flex-direction:column;align-items:stretch}
  .cta .btn{text-align:center;padding:14px 20px}
  section{padding:40px 16px}
  section h2{font-size:1.5rem}
  section p.body{font-size:1rem}
  .grid,.values,.join{grid-template-columns:1fr}
  .card{padding:20px}
  .chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;
         -webkit-overflow-scrolling:touch;padding-bottom:10px;
         scrollbar-width:thin}
  .embedwrap{margin-left:-4px;margin-right:-4px}
  footer .inner{justify-content:center;text-align:center}
}

/* ---------- About flagship feature + email signup (2026-10-15 build) ---------- */
.embedwrap.wide{padding-bottom:56.25%}
.feature{margin:26px 0 6px}
.feature .cap{color:var(--muted);font-size:.92rem;margin-top:10px;text-align:center}
.signup{margin-top:28px}
.signup-form{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.signup-form input[type=email]{flex:1 1 260px;padding:13px 16px;border-radius:8px;
  border:2px solid rgba(76,201,240,.4);background:var(--navy);color:var(--white);font-size:1rem}
.signup-form input[type=email]::placeholder{color:var(--muted)}
.signup-form button{cursor:pointer;border:0}
.purple-note{border-left:4px solid var(--deep-purple);background:var(--navy2);
  border-radius:0 12px 12px 0;padding:20px 24px;margin-top:26px}
.purple-note p{color:#d5dee9;margin-bottom:10px}
.purple-note p:last-child{margin-bottom:0}
.gradient-bar{height:10px;border-radius:5px;background:var(--brand-gradient);margin-top:14px}

/* ---------- Election Series template (2026-10-24, owner directive) ----------
   Patriotic red/white/blue election treatment for the Election Series ONLY.
   Every rule is scoped to body.election or to classes used solely by the
   Election Series pages, so the rest of the site — Constitution Series
   included — keeps its existing look. Reading typography stays at the
   site's bar; this is a color/branding treatment, not a redesign. */
:root{
  --election-field:linear-gradient(180deg,#081226 0%,#0a1c3f 30%,#0d2450 55%,#132c60 100%);
  --stars:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='%23ffffff'%3E%3Cpath opacity='.13' d='M30 18l2.6 6.2 6.7.5-5.1 4.4 1.6 6.5L30 32l-5.8 3.6 1.6-6.5-5.1-4.4 6.7-.5z'/%3E%3Cpath opacity='.08' d='M150 40l2 4.8 5.2.4-4 3.4 1.2 5L150 51l-4.4 2.6 1.2-5-4-3.4 5.2-.4z'/%3E%3Cpath opacity='.11' d='M84 96l2.3 5.5 5.9.4-4.5 3.9 1.4 5.7-5.1-3.2-5.1 3.2 1.4-5.7-4.5-3.9 5.9-.4z'/%3E%3Cpath opacity='.07' d='M196 120l1.8 4.3 4.7.3-3.6 3.1 1.1 4.5-4-2.5-4 2.5 1.1-4.5-3.6-3.1 4.7-.3z'/%3E%3Cpath opacity='.1' d='M44 168l2.1 5 5.4.4-4.1 3.5 1.3 5.2-4.7-2.9-4.7 2.9 1.3-5.2-4.1-3.5 5.4-.4z'/%3E%3Cpath opacity='.08' d='M160 186l1.8 4.3 4.7.3-3.6 3.1 1.1 4.5-4-2.5-4 2.5 1.1-4.5-3.6-3.1 4.7-.3z'/%3E%3C/g%3E%3C/svg%3E");
  --glory-red:#b22234; --glory-blue:#3c3b6e;
}
body.election{background-color:#0a1c3f;
  background-image:var(--stars),var(--election-field);
  background-size:220px 220px,100% 100%;
  background-repeat:repeat,no-repeat}
body.election header{background:rgba(8,18,38,.96);border-bottom:1px solid rgba(255,255,255,.16)}
body.election nav .brand span{color:#ff5964}
body.election nav .links a:hover,body.election nav .links a.active{color:#ff5964}
.flagbar{height:8px;background:linear-gradient(90deg,var(--glory-red) 0%,var(--glory-red) 33.4%,#f4f7fb 33.4%,#f4f7fb 66.7%,var(--glory-blue) 66.7%,var(--glory-blue) 100%)}
body.election .hero h1 span{color:#ff5964}
body.election .card{background:#10224a;border-color:rgba(255,255,255,.18)}
body.election .card h3{color:#fff;font-size:1.12rem;line-height:1.35}
body.election .topic{color:#ff8f98}
body.election .chip{border-color:rgba(255,255,255,.4);text-decoration:none;display:inline-block}
body.election .chip:hover{background:var(--glory-red);border-color:var(--glory-red);color:#fff}
body.election section h2 .bar{background:var(--glory-red)}
.badge.none{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.5)}
.badge.lean{background:var(--glory-blue);color:#fff}
/* Article reading pages */
.crumbs{font-size:.92rem;margin-bottom:6px}
.crumbs.bottom{margin-top:30px}
.article-body{max-width:760px;margin:0 auto}
.article-body p{color:#dde6f2;font-size:1.07rem;line-height:1.78;margin-bottom:18px}
.article-body p.lede{font-size:1.17rem;color:#fff;font-style:italic;line-height:1.65}
.article-body h2{font-size:1.45rem;line-height:1.3;color:#fff;margin:38px 0 14px;
  border-left:4px solid var(--glory-red);padding-left:12px}
.article-body h2.sources-head{margin-top:10px}
.article-body ul,.article-body ol{margin:0 0 18px 22px;color:#dde6f2;font-size:1.03rem;line-height:1.7}
.article-body li{margin-bottom:8px}
.article-body a{color:#8fc1ff}
.article-body hr.rule{border:0;height:3px;border-radius:2px;margin:34px 0;
  background:linear-gradient(90deg,var(--glory-red),#f4f7fb,var(--glory-blue))}
.article-body ul.sources{font-size:.93rem;color:var(--muted);line-height:1.6}
.article-body ul.sources a{overflow-wrap:anywhere}
.article-body .disclosure{font-size:.85rem;color:var(--muted);font-style:italic;margin-top:26px}
.verdict-note{border:1px solid rgba(255,255,255,.25);border-left:5px solid var(--glory-red);
  background:rgba(255,255,255,.05);border-radius:0 12px 12px 0;padding:18px 22px;margin:24px 0 30px}
.verdict-note .vlabel{display:block;font-size:.78rem;font-weight:700;text-transform:uppercase;
  letter-spacing:1px;color:#ff8f98;margin-bottom:6px}
.verdict-note p{color:#fff;font-size:1.12rem;font-weight:600;margin:0;line-height:1.5}
body.election .hero.compact h1{font-size:2.05rem;line-height:1.25;letter-spacing:.2px}
@media(max-width:640px){body.election .hero.compact h1{font-size:1.6rem}}