:root{
  --red:#d7191f; --red-dark:#a80f14; --cream:#f7f3ea; --ink:#111; --yellow:#ffd21f; --yellow-dark:#e0b400;
  --head:'Anton','Impact','Arial Narrow Bold',sans-serif;
  --cond:'Barlow Condensed','Arial Narrow',sans-serif;
  --mono:'Courier Prime','Courier New',monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; color:var(--ink); font-family:var(--cond); font-size:18px; line-height:1.45;
  -webkit-text-size-adjust:100%;
}
/* Gingham tablecloth */
body{
  background:
    repeating-linear-gradient(0deg, rgba(215,25,31,.55) 0 40px, transparent 40px 80px),
    repeating-linear-gradient(90deg, rgba(215,25,31,.55) 0 40px, transparent 40px 80px),
    var(--cream);
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1120px, 100% - 32px); margin-inline:auto}

/* Crawl */
.crawl{display:flex; background:var(--ink); color:#fff; font-family:var(--head); letter-spacing:.04em; font-size:15px; overflow:hidden; border-bottom:4px solid var(--yellow)}
.crawl-label{background:var(--red); padding:8px 14px; flex:0 0 auto; position:relative; z-index:1}
.crawl-track{display:flex; white-space:nowrap; animation:crawl 38s linear infinite; padding:8px 0}
.crawl-track span{padding-right:20px}
@keyframes crawl{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.crawl-track{animation:none}}

/* Masthead */
.masthead{background:#fff; border-bottom:6px double var(--ink)}
.masthead-inner{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; flex-wrap:wrap}
.paper-name{font-family:var(--head); font-size:clamp(22px,4vw,34px); letter-spacing:.06em; color:var(--red)}
.paper-meta{font-weight:700; letter-spacing:.12em; font-size:14px; display:flex; gap:8px}
.paper-meta .dot{color:var(--red)}

/* Hero */
.hero{padding:clamp(20px,3.5vw,40px) 0}
.hero-grid{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:clamp(24px,4vw,48px); align-items:center;
  background:#fff; border:4px solid var(--ink); box-shadow:10px 10px 0 var(--ink); padding:clamp(16px,3vw,32px)}
.evidence-photo{margin:0; background:#fff; padding:10px 10px 0; border:2px solid var(--ink); transform:rotate(-2deg); box-shadow:6px 6px 0 rgba(0,0,0,.25)}
.evidence-photo img{width:100%; height:auto; aspect-ratio:1/1; object-fit:cover}
.evidence-photo figcaption{font-family:var(--mono); font-size:14px; padding:8px 2px 10px; text-align:center}
.kicker{display:inline-flex; gap:10px; align-items:center; background:var(--red); color:#fff; font-family:var(--head); letter-spacing:.08em; padding:6px 12px; font-size:16px}
.live{color:var(--yellow); animation:blink 1.2s steps(2,start) infinite}
@keyframes blink{to{visibility:hidden}}
@media (prefers-reduced-motion:reduce){.live{animation:none}}
h1{font-family:var(--head); font-weight:400; text-transform:uppercase; line-height:.95; font-size:clamp(42px,6.2vw,74px); margin:12px 0 10px; letter-spacing:.01em}
.h-breaking{color:var(--red); display:block}
.subline{font-size:clamp(20px,2.4vw,26px); font-weight:600; font-style:italic; margin:0 0 18px; border-left:6px solid var(--yellow); padding-left:12px}

/* Evidence tag */
.tag{position:relative; display:inline-block; background:var(--yellow); color:var(--ink); font-family:var(--head); border:2px solid var(--ink);
  clip-path:polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%)}
.ticker{font-size:clamp(34px,4.5vw,48px); padding:2px 36px 2px 44px; line-height:1.2}
.ticker::before{content:""; position:absolute; left:14px; top:50%; width:14px; height:14px; margin-top:-7px; border-radius:50%; background:#fff; border:2px solid var(--ink)}

/* CA box */
.ca-box{margin:18px 0 16px; border:3px dashed var(--ink); background:var(--cream); padding:12px 14px}
.ca-label{font-family:var(--head); letter-spacing:.08em; font-size:14px; color:var(--red); text-transform:uppercase; margin-bottom:6px}
.ca-row{display:flex; gap:10px; align-items:center}
.ca-value{flex:1 1 auto; min-width:0; font-family:var(--mono); font-size:16px; font-weight:700; background:#fff; border:2px solid var(--ink); padding:10px 12px; overflow-wrap:anywhere; word-break:break-all}
.ca-value:not(.is-live){word-break:normal; overflow-wrap:break-word}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; font-family:var(--head); letter-spacing:.06em; text-transform:uppercase; text-decoration:none;
  border:3px solid var(--ink); padding:12px 22px; font-size:18px; cursor:pointer; box-shadow:4px 4px 0 var(--ink); transition:transform .08s, box-shadow .08s; min-height:48px}
.btn:hover{transform:translate(-1px,-1px); box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(3px,3px); box-shadow:1px 1px 0 var(--ink)}
.btn:focus-visible{outline:3px solid var(--yellow); outline-offset:3px}
.btn-copy{background:var(--yellow); color:var(--ink); flex:0 0 auto; padding:10px 16px; font-size:16px}
.btn-copy:disabled{background:#ddd; color:#777; cursor:not-allowed; box-shadow:2px 2px 0 #777; border-color:#777; transform:none}
.btn-buy{background:var(--red); color:#fff; font-size:22px; padding:14px 28px}
.btn-ghost{background:#fff; color:var(--ink)}
.cta-row{display:flex; flex-wrap:wrap; gap:14px}

/* Section titles */
section.headlines, section.how{padding:clamp(28px,5vw,56px) 0}
.section-title{text-align:center; margin:0 0 28px}
.section-title span{display:inline-block; font-family:var(--head); font-weight:400; text-transform:uppercase; font-size:clamp(30px,5vw,52px); line-height:1.05;
  background:var(--ink); color:#fff; padding:8px 22px; border-bottom:6px solid var(--yellow); box-shadow:6px 6px 0 var(--red-dark)}

/* Clippings */
.headline-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px}
.clip{background:#fff; border:3px solid var(--ink); padding:18px 18px 20px; box-shadow:6px 6px 0 var(--ink); position:relative}
.clip:nth-child(odd){transform:rotate(-1deg)} .clip:nth-child(even){transform:rotate(1deg)}
.clip-tag{display:inline-block; background:var(--yellow); border:2px solid var(--ink); font-family:var(--head); font-size:13px; letter-spacing:.1em; padding:2px 8px}
.clip p{font-family:var(--head); font-size:clamp(22px,2.4vw,28px); line-height:1.12; margin:12px 0 0; text-transform:uppercase}
.clip strong{color:var(--red); font-weight:400}

/* Steps */
.steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; counter-reset:none}
.step{background:#fff; border:3px solid var(--ink); padding:22px; box-shadow:6px 6px 0 var(--ink)}
.step-num{width:54px; height:54px; display:grid; place-items:center; background:var(--red); color:#fff; font-family:var(--head); font-size:30px; border:3px solid var(--ink); margin-bottom:10px}
.step h3{font-family:var(--head); font-weight:400; text-transform:uppercase; font-size:28px; margin:0 0 6px; letter-spacing:.02em}
.step p{margin:0; font-size:18px; font-weight:500}

/* Footer */
.footer{background:var(--ink); color:#eee; padding:36px 0 44px; border-top:6px solid var(--yellow); text-align:center}
.footer-brand{display:inline-flex; align-items:center; gap:10px; font-family:var(--head); font-size:22px; text-transform:uppercase; letter-spacing:.04em}
.footer-brand img{border:2px solid #fff}
.footer-brand span{color:var(--yellow)}
.disclaimer{max-width:760px; margin:16px auto 8px; font-size:17px; line-height:1.5}
.fineprint{margin:0; font-family:var(--mono); font-size:13px; color:#aaa}

/* Toast */
.toast{position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); background:var(--ink); color:#fff; border:2px solid var(--yellow); padding:10px 16px; font-weight:700; opacity:0; pointer-events:none; transition:.2s; z-index:10}
.toast.show{opacity:1; transform:translate(-50%,0)}

/* Responsive */
@media (max-width:900px){
  .headline-grid,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  body{font-size:17px;
    background:
      repeating-linear-gradient(0deg, rgba(215,25,31,.55) 0 28px, transparent 28px 56px),
      repeating-linear-gradient(90deg, rgba(215,25,31,.55) 0 28px, transparent 28px 56px),
      var(--cream);}
  .hero-grid{grid-template-columns:1fr; box-shadow:6px 6px 0 var(--ink)}
  .evidence-photo{max-width:250px; margin:4px auto 0; width:100%}
  .evidence-photo figcaption{font-size:12px}
  h1{margin-top:10px}
  .hero-copy{text-align:left}
  .headline-grid,.steps{grid-template-columns:1fr}
  .cta-row .btn{flex:1 1 100%}
  .masthead-inner{justify-content:center; text-align:center}
  .paper-meta{font-size:12px}
}
@media (max-width:400px){
  .ca-row{flex-direction:column; align-items:stretch}
  .btn-copy{width:100%}
}