:root{
  --paper:#f7f1e7;
  --paper-2:#fffaf2;
  --ink:#171513;
  --muted:#6f675f;
  --line:#d9d0c4;
  --coral:#ff5e3a;
  --orange:#ff9d2e;
  --pink:#f45bb7;
  --violet:#7657d8;
  --teal:#22aaa1;
  --green:#6ebc73;
  --blue:#53a7df;
  --shadow:0 10px 35px rgba(36,25,15,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(circle at 10% 5%,rgba(255,94,58,.06),transparent 18rem),
    radial-gradient(circle at 87% 14%,rgba(83,167,223,.07),transparent 22rem),
    var(--paper);
  font-family:Georgia,"Times New Roman",serif;
}
a{color:inherit}
.top-art{
  height:112px;
  overflow:hidden;
  position:relative;
  border-bottom:1px solid rgba(23,21,19,.16);
  background:
    radial-gradient(circle at 53% 35%,rgba(255,242,185,.95) 0 42px,transparent 43px),
    linear-gradient(118deg,#fff4df 0 31%,#ffbf97 44%,#f970a7 57%,#6455be 76%,#124c63 100%);
}
.top-art:after{
  content:"";
  position:absolute;
  left:-4%;right:-4%;bottom:-50px;height:94px;
  border-radius:50% 52% 0 0;
  background:linear-gradient(115deg,#ff743c,#e94a9a 38%,#684fbd 68%,#163f58);
  transform:rotate(-2deg);
  opacity:.92;
}
.top-art .hill{
  position:absolute;
  bottom:-40px;
  width:52%;height:90px;
  border-radius:50% 50% 0 0;
  filter:saturate(.95);
}
.top-art .h1{left:-8%;background:#ff9d2e;transform:rotate(4deg)}
.top-art .h2{right:-7%;background:#14586b;transform:rotate(-5deg)}
.sun{
  position:absolute;left:4%;top:24px;width:26px;height:26px;border-radius:50%;
  background:var(--orange);box-shadow:0 0 0 10px rgba(255,157,46,.08);
}
.sun:before,.sun:after{content:"";position:absolute;inset:-13px;border:2px dotted var(--coral);border-radius:50%}
.spark{position:absolute;color:#fff6df;font:bold 26px Arial,sans-serif;z-index:2}
.s1{right:13%;top:26px}.s2{right:6%;bottom:12px;font-size:18px}

.masthead{max-width:1240px;margin:auto;padding:20px 28px 22px;text-align:center}
.mast-meta{
  display:flex;align-items:center;justify-content:center;gap:10px;
  font:700 10px/1.2 Arial,sans-serif;text-transform:uppercase;letter-spacing:.22em;color:var(--muted)
}
.mini-mark{font-size:20px;color:var(--coral);letter-spacing:0}
.edition-date:before{content:"·";margin-right:10px}
.masthead h1{
  margin:10px 0 5px;
  font-size:clamp(3.1rem,7.4vw,7rem);
  line-height:.88;letter-spacing:-.055em;font-weight:700;
}
.tagline{
  margin:0 auto;max-width:700px;
  font:600 12px/1.4 Arial,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#38322e
}
.nav{
  position:sticky;top:0;z-index:20;
  background:rgba(247,241,231,.93);
  backdrop-filter:blur(12px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)
}
.nav-inner{max-width:1240px;margin:auto;padding:0 28px;display:flex;gap:30px;align-items:center;overflow:auto}
.nav a{
  flex:0 0 auto;text-decoration:none;padding:15px 0 13px;
  font:700 13px/1 Arial,sans-serif;position:relative
}
.nav a.active:after{
  content:"";position:absolute;left:0;right:0;bottom:8px;height:3px;
  background:linear-gradient(90deg,var(--coral),var(--pink));border-radius:99px
}

.page{max-width:1240px;margin:auto;padding:22px 28px 72px}
.lead-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;align-items:stretch}
.lead-story{
  position:relative;display:grid;grid-template-columns:minmax(300px,.86fr) minmax(350px,1.14fr);
  min-height:500px;background:var(--paper-2);border:1px solid var(--line);
  box-shadow:var(--shadow);overflow:hidden;border-radius:2px
}
.lead-copy{padding:30px 28px 54px;display:flex;flex-direction:column;align-items:flex-start;z-index:2}
.story-kicker{display:flex;align-items:center;gap:9px;font:800 10px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.16em;color:var(--accent,var(--coral))}
.story-kicker i{display:block;width:44px;height:4px;border-radius:10px;background:linear-gradient(90deg,var(--accent,var(--coral)),var(--accent-2,var(--pink)))}
.lead-story h2{font-size:clamp(2.35rem,4.6vw,4.9rem);line-height:.91;letter-spacing:-.048em;margin:18px 0 16px;max-width:9.8em}
.lead-story h2 a,.story-card h3 a{text-decoration:none}
.lead-story h2 a:hover,.story-card h3 a:hover{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.08em}
.lead-story p{font-size:1.04rem;line-height:1.46;margin:0 0 16px;color:#342f2b}
.evidence-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:8px}
.evidence-row span,.mini-chip{
  border:1px solid color-mix(in srgb,var(--accent,var(--coral)) 42%,var(--line));
  background:color-mix(in srgb,var(--accent,var(--coral)) 8%,white);
  color:#3c3530;border-radius:999px;padding:6px 9px;
  font:800 9px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em
}
.button{
  margin-top:18px;text-decoration:none;background:var(--ink);color:#fff;
  padding:11px 15px;border-radius:999px;font:800 12px/1 Arial,sans-serif;
  display:inline-flex;align-items:center;gap:18px;transition:transform .18s ease
}
.button:hover{transform:translateY(-2px)}
.button span{font-size:18px}
.source-line{
  position:absolute;left:28px;bottom:18px;color:var(--muted);
  font:700 9px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em
}
.lead-art{
  position:relative;overflow:hidden;min-height:100%;
  background:
    radial-gradient(circle at 70% 24%,#ffe6a6 0 55px,transparent 56px),
    linear-gradient(145deg,#ffd5b9 0%,#f1a0b4 30%,#9073ca 61%,#416d8d 100%);
}
.lead-art:before{
  content:"";position:absolute;left:-16%;right:-16%;bottom:5%;height:41%;
  background:linear-gradient(135deg,var(--accent,var(--coral)),var(--accent-2,var(--pink)));
  border-radius:52% 46% 0 0;transform:rotate(-5deg);opacity:.92
}
.lead-art:after{
  content:"";position:absolute;left:-25%;right:17%;bottom:-12%;height:39%;
  background:rgba(19,66,83,.82);border-radius:50% 60% 0 0;transform:rotate(4deg)
}
.art-sun{position:absolute;width:16px;height:16px;border-radius:50%;background:#fff6d7;right:20%;top:22%;box-shadow:0 0 0 8px rgba(255,255,255,.08)}
.art-orbit{position:absolute;width:180px;height:180px;border:1px dashed rgba(255,255,255,.55);border-radius:50%;right:7%;top:9%}
.art-horizon{position:absolute;left:9%;bottom:24%;width:67%;height:2px;background:rgba(255,250,240,.7);transform:rotate(-8deg);z-index:3}
.lead-art p{
  position:absolute;right:28px;bottom:28px;z-index:4;margin:0;color:#fffaf0;
  font:800 12px/1.35 "Courier New",monospace;text-transform:uppercase;letter-spacing:.16em;
  transform:rotate(-6deg)
}

.signal{
  border:1px solid var(--line);background:rgba(255,250,242,.82);
  padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:500px
}
.mood-art{
  height:122px;position:relative;overflow:hidden;margin:-1px -1px 18px;
  background:linear-gradient(145deg,#bfe6e4,#ffe2a4 58%,#ff9ba5)
}
.mood-art:before{content:"";position:absolute;width:84px;height:84px;border-radius:50%;right:22px;top:18px;background:rgba(255,244,181,.9)}
.mood-art span,.mood-art i,.mood-art b{position:absolute;bottom:-10px;border-radius:60% 60% 0 0}
.mood-art span{left:-20px;width:150px;height:63px;background:#f45bb7;transform:rotate(9deg)}
.mood-art i{left:85px;width:120px;height:75px;background:#ff7c3c;transform:rotate(-7deg)}
.mood-art b{right:-30px;width:130px;height:54px;background:#7657d8}
.eyebrow{margin:0 0 8px;font:800 10px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.16em;color:var(--coral)}
.signal h2{font-size:2.25rem;line-height:.95;margin:0 0 9px}
.signal-copy{font-size:.94rem;line-height:1.42;margin:0 0 16px}
.signal-list{border-top:1px solid var(--line);margin-top:auto}
.signal-list div{display:grid;grid-template-columns:48px 1fr;gap:10px;padding:15px 0;border-bottom:1px solid var(--line);align-items:start}
.signal-list strong{font:800 1.45rem/1 Arial,sans-serif;color:var(--accent,var(--coral))}
.signal-list span{font:600 11px/1.35 Arial,sans-serif;color:#4d4641}

.more-section{padding-top:32px}
.section-head{display:flex;align-items:center;gap:10px;margin-bottom:15px;border-bottom:1px solid var(--ink);padding-bottom:10px}
.section-head h2{font-size:2rem;margin:0;letter-spacing:-.035em}
.scribble{font:800 28px/1 Arial,sans-serif;color:var(--coral);transform:rotate(-3deg)}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.story-card{
  --accent:var(--coral);--accent-2:var(--pink);
  background:var(--paper-2);border:1px solid var(--line);box-shadow:0 8px 22px rgba(36,25,15,.04);
  min-width:0;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease
}
.story-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card-art{height:142px;position:relative;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 70%,white),color-mix(in srgb,var(--accent-2) 74%,white))}
.card-art:before{content:"";position:absolute;left:-18%;bottom:-52px;width:84%;height:110px;border-radius:50%;background:rgba(255,249,226,.5)}
.card-art:after{content:"";position:absolute;right:-18%;bottom:-25px;width:70%;height:80px;border-radius:50% 50% 0 0;background:rgba(18,73,89,.36)}
.card-art span{position:absolute;width:45px;height:45px;border-radius:50%;right:20px;top:20px;background:rgba(255,241,173,.82)}
.card-art i{position:absolute;left:24px;top:24px;width:42px;height:4px;background:#fff;border-radius:99px;transform:rotate(-12deg)}
.card-art b{position:absolute;left:30px;top:38px;width:24px;height:4px;background:#fff;border-radius:99px;transform:rotate(10deg)}
.card-body{padding:15px 16px 16px;display:flex;flex-direction:column;flex:1}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font:800 9px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em}
.card-meta span{color:var(--accent)}.card-meta time{color:var(--muted);font-weight:700}
.story-card h3{font-size:1.4rem;line-height:1.02;letter-spacing:-.025em;margin:10px 0 8px}
.story-card p{color:#514943;font-size:.91rem;line-height:1.38;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:auto}
.card-footer>a{
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;text-decoration:none;
  background:color-mix(in srgb,var(--accent) 10%,white);color:var(--accent);font:bold 17px Arial,sans-serif
}

.topic-environment{--accent:#16a384;--accent-2:#76c46a}
.topic-health{--accent:#ef5b62;--accent-2:#f38d62}
.topic-science{--accent:#6557ce;--accent-2:#56a9df}
.topic-people{--accent:#ed5caa;--accent-2:#ff8f4a}
.topic-cities{--accent:#278bbb;--accent-2:#6e64cc}
.topic-energy{--accent:#f2952e;--accent-2:#f5c84f}
.topic-animals{--accent:#45a773;--accent-2:#79c7bd}
.topic-other{--accent:#e76b4b;--accent-2:#9a61ca}

.empty-state{
  grid-column:1;background:var(--paper-2);border:1px solid var(--line);min-height:500px;
  padding:56px;position:relative;overflow:hidden;box-shadow:var(--shadow)
}
.empty-state h2{font-size:clamp(2.5rem,5vw,5rem);line-height:.92;letter-spacing:-.05em;max-width:7em;margin:16px 0}
.empty-state>p:not(.eyebrow){max-width:520px;font-size:1.1rem;line-height:1.5}
.empty-orb{position:absolute;width:260px;height:260px;border-radius:50%;right:-30px;bottom:-50px;background:linear-gradient(135deg,#ffb13b,#f45bb7,#5f58c9);opacity:.85}

.archive-section{padding-top:40px}
.archive-intro{max-width:820px;margin:0 0 20px;color:#4f4741;font-size:1rem;line-height:1.5}
.archive-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.archive-stats div{background:var(--paper-2);border:1px solid var(--line);padding:18px;box-shadow:0 6px 18px rgba(36,25,15,.035)}
.archive-stats strong{display:block;font:800 2rem/1 Arial,sans-serif;color:var(--violet);margin-bottom:6px}
.archive-stats span{font:700 10px/1.35 Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.archive-claims{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.archive-claims li{background:linear-gradient(145deg,rgba(255,250,242,.96),rgba(246,237,255,.72));border:1px solid var(--line);padding:18px;min-height:150px}
.archive-claims strong{display:block;font-size:1.05rem;line-height:1.3;margin-bottom:16px}
.archive-claims span{font:700 9px/1.35 Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.archive-empty{grid-column:1/-1;border:1px dashed var(--line);padding:20px;background:rgba(255,250,242,.55);color:var(--muted)}
.archive-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px}
.archive-links a{font:800 11px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;text-decoration:none;border-bottom:2px solid var(--coral);padding-bottom:3px}

.closing{
  position:relative;overflow:hidden;background:#1c1a18;color:#fffaf0;min-height:250px;
  border-top:1px solid #1c1a18
}
.closing-wave{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 83% 34%,rgba(255,238,168,.95) 0 42px,transparent 43px),
    linear-gradient(120deg,#fa623e 0 23%,#ef4d9a 36%,#6f55cc 64%,#194f61 100%);
}
.closing-wave:after{
  content:"";position:absolute;left:-10%;right:-10%;bottom:-90px;height:180px;
  background:#1c1a18;border-radius:50% 48% 0 0;transform:rotate(-2deg)
}
.closing-inner{position:relative;z-index:2;max-width:1240px;margin:auto;padding:60px 28px 90px}
.closing .eyebrow{color:#fff6df}
.closing h2{max-width:850px;font-size:clamp(2rem,4.8vw,4.5rem);line-height:.97;letter-spacing:-.04em;margin:12px 0 0}

footer{
  max-width:1240px;margin:auto;padding:38px 28px 56px;
  display:grid;grid-template-columns:1fr 1fr;gap:54px;border-top:1px solid var(--line)
}
footer strong{font:800 11px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:.15em}
footer p{font-size:.9rem;line-height:1.5;color:var(--muted);max-width:560px}

@media(max-width:900px){
  .lead-layout{grid-template-columns:1fr}
  .lead-story{grid-template-columns:1fr;min-height:0}
  .lead-copy{padding-bottom:58px}.lead-art{min-height:300px}
  .signal{min-height:0;display:grid;grid-template-columns:180px 1fr;column-gap:20px}
  .mood-art{grid-row:1/5;height:auto;min-height:220px;margin:-1px 0 -1px -1px}
  .signal-list{grid-column:2}
  .story-grid{grid-template-columns:repeat(2,1fr)}
  .archive-stats{grid-template-columns:repeat(2,1fr)}
  .archive-claims{grid-template-columns:1fr}
}
@media(max-width:620px){
  .top-art{height:72px}
  .masthead{padding:16px 18px 18px;text-align:left}
  .mast-meta{justify-content:flex-start;flex-wrap:wrap;letter-spacing:.13em}.edition-date{display:none}
  .masthead h1{font-size:clamp(3.2rem,17vw,5.4rem)}
  .tagline{text-align:left;font-size:9px;letter-spacing:.16em}
  .nav-inner{padding:0 18px;gap:22px}.nav a{font-size:12px}
  .page{padding:16px 14px 48px}
  .lead-story h2{font-size:clamp(2.7rem,13vw,4.2rem)}
  .lead-copy{padding:24px 20px 54px}.source-line{left:20px}
  .lead-art{min-height:245px}
  .signal{display:block;padding:14px}.mood-art{height:150px;min-height:0;margin:-1px -1px 16px}
  .story-grid{grid-template-columns:1fr}.card-art{height:160px}
  .archive-stats{grid-template-columns:1fr 1fr}.archive-stats strong{font-size:1.6rem}
  .empty-state{min-height:430px;padding:36px 22px}
  .closing-inner{padding:46px 20px 72px}
  footer{grid-template-columns:1fr;gap:24px;padding:32px 20px 48px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.story-card,.button{transition:none}}
