/* ==========================================================================
   Previously — News Hub styles (2026-10-06)
   James: "we need to make a news hub... build this page from the ground up."
   Bright, inviting news chrome — clean paper background, dark ink, brand red
   accents. Story art comes from the feed;never a colored placeholder box.
   Mobile-first: single column at 390px, grids open up at 720px / 1100px.
   ========================================================================== */
:root{
  --nh-bg:var(--desert-card);
  --nh-ink:var(--desert-ink);
  --nh-ink-soft:var(--desert-pressed);
  --nh-ink-faint:var(--desert-ink-dim);
  --nh-card:var(--desert-card);
  --nh-rule:var(--desert-pressed);
  --nh-red:var(--brand-red-deep);
  --nh-red-dark:var(--desert-accent-deep);
  --nh-gold:var(--color-warn);
  --nh-serif:Georgia,'Times New Roman',serif;
  --nh-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --nh-radius:14px;
  --nh-shadow:0 1px 2px rgba(var(--desert-ink-rgb), .06),0 8px 24px rgba(var(--desert-ink-rgb), .07);
}.nhub{
  background:var(--nh-bg);
  color:var(--nh-ink);
  font-family:var(--nh-sans);
  padding:0 0 64px;
}.nhub a{color:inherit;text-decoration:none;}.nhub img{display:block;max-width:100%;}/* ---------- masthead ---------- */
.nhub-mast{
  max-width:1240px;
  margin:0 auto;
  padding:34px clamp(16px,4vw,32px) 8px;
}.nhub-kicker{
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--nh-red);
  font-weight:700;
  margin:0 0 10px;
}.nhub-mast h1{
  font-family:var(--nh-serif);
  font-size:clamp(34px,6vw,54px);
  line-height:1.04;
  letter-spacing:-.01em;
  margin:0 0 10px;
  font-weight:700;
}.nhub-sub{
  color:var(--nh-ink-soft);
  font-size:clamp(14px,2.4vw,17px);
  line-height:1.5;
  margin:0 0 18px;
  max-width:62ch;
}.nhub-sub b{color:var(--nh-ink);}/* ---------- section chips (sticky) ---------- */
.nhub-chips{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(var(--desert-card-rgb), .94);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-top:1px solid var(--nh-rule);
  border-bottom:1px solid var(--nh-rule);
  margin:0 calc(-1 * clamp(16px,4vw,32px));
  padding:10px clamp(16px,4vw,32px);
}.nhub-chips__inner{
  display:flex;
  gap:8px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  max-width:1240px;
  margin:0 auto;
}.nhub-chips__inner::-webkit-scrollbar{display:none;}.nhub-chip{
  flex:0 0 auto;
  font-size:13px;
  font-weight:600;
  padding:8px 14px;
  border:1px solid var(--nh-rule);
  border-radius:999px;
  background:var(--nh-card);
  color:var(--nh-ink-soft);
  white-space:nowrap;
}.nhub-chip .n{color:var(--nh-ink-faint);font-weight:500;margin-left:6px;}.nhub-chip:hover{border-color:var(--nh-red);color:var(--nh-ink);}.nhub-chip.is-active{background:var(--nh-ink);border-color:var(--nh-ink);color:var(--desert-card);}.nhub-chip.is-active .n{color:rgba(var(--desert-card-rgb), .65);}/* ---------- top stories ---------- */
.nhub-top{
  max-width:1240px;
  margin:0 auto;
  padding:26px clamp(16px,4vw,32px) 6px;
}.nhub-sec-title{
  display:flex;
  align-items:baseline;
  gap:12px;
  margin:0 0 16px;
}.nhub-sec-title h2{
  font-family:var(--nh-serif);
  font-size:clamp(22px,3.4vw,30px);
  margin:0;
  font-weight:700;
  letter-spacing:-.01em;
}.nhub-sec-title .rule{flex:1;height:1px;background:var(--nh-rule);}.nhub-sec-title .count{
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--nh-ink-faint);
  font-weight:600;
}.nhub-lead-grid{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}.nhub-lead{
  position:relative;
  border-radius:var(--nh-radius);
  overflow:hidden;
  background:var(--nh-ink);
  box-shadow:var(--nh-shadow);
  min-height:320px;
  display:flex;
  align-items:flex-end;
}.nhub-lead img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
}.nhub-lead__scrim{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.45) 55%,rgba(0,0,0,.85) 100%);
}.nhub-lead__copy{
  position:relative;
  padding:22px;
  color:var(--desert-card);
  width:100%;
}.nhub-lead__copy .desk{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--desert-card);
  background:var(--nh-red);
  border-radius:6px;
  padding:5px 10px;
  margin-bottom:12px;
}.nhub-lead__copy h3{
  font-family:var(--nh-serif);
  font-size:clamp(24px,4.6vw,40px);
  line-height:1.08;
  margin:0 0 10px;
  font-weight:700;
  overflow-wrap:normal;
  word-break:normal;
}.nhub-lead__copy h3 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;}.nhub-lead__copy p{
  margin:0 0 12px;
  font-size:clamp(14px,2.4vw,16px);
  line-height:1.5;
  color:rgba(var(--desert-card-rgb), .86);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}.nhub-meta{
  font-size:12px;
  color:rgba(var(--desert-card-rgb), .72);
  letter-spacing:.02em;
}.nhub-top__side{
  display:grid;
  gap:12px;
  grid-template-columns:1fr 1fr;
}/* ---------- story cards ---------- */
.nhub-card{
  background:var(--nh-card);
  border:1px solid var(--nh-rule);
  border-radius:var(--nh-radius);
  overflow:hidden;
  box-shadow:var(--nh-shadow);
  display:flex;
  flex-direction:column;
  transition:transform .16s ease,box-shadow .16s ease;
}.nhub-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(var(--desert-ink-rgb), .08),0 14px 32px rgba(var(--desert-ink-rgb), .12);}.nhub-card__img{aspect-ratio:16/9;overflow:hidden;background:var(--desert-pressed);}.nhub-card__img img{width:100%;height:100%;object-fit:cover;}.nhub-card__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;}.nhub-desk{
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--nh-red);
}.nhub-card__body h3{
  font-family:var(--nh-serif);
  font-size:16.5px;
  line-height:1.28;
  margin:0;
  font-weight:700;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  overflow-wrap:normal;
  word-break:normal;
}.nhub-card__body h3 a:hover{color:var(--nh-red-dark);}.nhub-card__meta{
  margin-top:auto;
  font-size:12px;
  color:var(--nh-ink-faint);
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}.nhub-badge{
  display:inline-block;
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-radius:5px;
  padding:3px 8px;
}.nhub-badge--breaking{background:var(--nh-red);color:var(--desert-card);}.nhub-badge--updated{background:var(--nh-gold);color:var(--desert-card);}.nhub-badge--live{background:var(--color-win);color:var(--desert-card);}/* horizontal mini cards (side stack, latest rail) */
.nhub-mini{
  display:flex;
  flex-direction:column;
  gap:0;
  background:var(--nh-card);
  border:none;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 1px 2px rgba(var(--desert-ink-rgb), .07), 0 6px 20px rgba(var(--desert-ink-rgb), .09);
  padding:0;
  align-items:stretch;
}.nhub-mini__img{
  flex:none;
  width:100%;
  aspect-ratio:16/9;
  border-radius:0;
  overflow:hidden;
  background:var(--desert-pressed);
}.nhub-mini__img img{width:100%;height:100%;object-fit:cover;}.nhub-mini__body{min-width:0;flex:1;padding:12px 14px 14px;}.nhub-mini__body h4{
  font-family:var(--nh-serif);
  font-size:14.5px;
  line-height:1.32;
  margin:2px 0 6px;
  font-weight:700;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  overflow-wrap:normal;
  word-break:normal;
}.nhub-mini__body h4 a:hover{color:var(--nh-red-dark);}.nhub-mini__meta{font-size:11.5px;color:var(--nh-ink-faint);}/* ---------- per-section blocks ---------- */
.nhub-sec{
  max-width:1240px;
  margin:0 auto;
  padding:30px clamp(16px,4vw,32px) 4px;
  scroll-margin-top:64px;
}.nhub-sec__head{
  display:flex;
  align-items:baseline;
  gap:12px;
  margin:0 0 16px;
}.nhub-sec__head h2{
  font-family:var(--nh-serif);
  font-size:clamp(24px,3.8vw,32px);
  margin:0;
  font-weight:700;
}.nhub-sec__head .rule{flex:1;height:1px;background:var(--nh-rule);}.nhub-sec__head .count{
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--nh-ink-faint);font-weight:600;white-space:nowrap;
}.nhub-sec__lead{margin-bottom:14px;}.nhub-sec__grid{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
}.nhub-sec__more{
  margin-top:14px;
  text-align:center;
}.nhub-sec__more button{
  font:600 13px var(--nh-sans);
  letter-spacing:.06em;
  padding:10px 22px;
  border-radius:999px;
  border:1px solid var(--nh-rule);
  background:var(--nh-card);
  color:var(--nh-ink);
  cursor:pointer;
}.nhub-sec__more button:hover{border-color:var(--nh-red);color:var(--nh-red-dark);}/* ---------- latest rail ---------- */
.nhub-latest{
  max-width:1240px;
  margin:0 auto;
  padding:30px clamp(16px,4vw,32px) 8px;
}.nhub-latest__list{display:grid;gap:10px;grid-template-columns:1fr;}/* ---------- ads ---------- */
.nhub-ad{
  max-width:1240px;
  margin:26px auto 6px;
  padding:0 clamp(16px,4vw,32px);
  text-align:center;
}.nhub-ad .pv-adsense-label{
  display:block;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--desert-ink-dim);
  margin-bottom:6px;
}/* ---------- skeleton / empty ---------- */
.nhub-skel{
  border-radius:var(--nh-radius);
  background:linear-gradient(100deg,var(--desert-pressed) 40%,var(--desert-pressed) 50%,var(--desert-pressed) 60%);
  background-size:200% 100%;
  animation:nhub-shimmer 1.4s infinite;
  min-height:120px;
}@keyframes nhub-shimmer{to{background-position:-200% 0;}}.nhub-empty{
  text-align:center;
  color:var(--nh-ink-faint);
  padding:48px 20px;
  font-size:15px;
}/* ---------- footer note ---------- */
.nhub-foot-note{
  max-width:1240px;
  margin:26px auto 0;
  padding:0 clamp(16px,4vw,32px);
  color:var(--nh-ink-faint);
  font-size:13px;
  line-height:1.6;
}.nhub-foot-note a{color:var(--nh-red-dark);font-weight:600;}/* ---------- responsive ---------- */
@media (max-width:480px){
  /* On narrow phones, horizontal mini-cards stack vertically so text
     never gets squeezed into an unreadable sliver (James, 2026-10-06).
     Image on top, full width; text below with room to breathe. */
  .nhub-mini{
    flex-direction:column;
    align-items:stretch;
    padding:0;
  }
  .nhub-mini__img{
    flex:none;
    width:100%;
    aspect-ratio:16/9;
    border-radius:12px 12px 0 0;
  }
  .nhub-mini__body{padding:10px 12px 12px;}
  .nhub-mini__body h4{font-size:15px;-webkit-line-clamp:3;}
}@media (min-width:720px){.nhub-lead-grid{grid-template-columns:1.5fr 1fr;}.nhub-top__side{grid-template-columns:1fr;}.nhub-lead{min-height:420px;}.nhub-sec__grid{grid-template-columns:repeat(2,1fr);}.nhub-latest__list{grid-template-columns:repeat(2,1fr);}
}@media (min-width:1100px){.nhub-sec__grid{grid-template-columns:repeat(4,1fr);}.nhub-latest__list{grid-template-columns:repeat(3,1fr);}.nhub-top__side{grid-template-columns:1fr 1fr;}.nhub-lead-grid{grid-template-columns:1.6fr 1fr;}
}/* James 2026-10-06: defensive fix for giant SVG glitch — constrain any SVG
   on the news hub that doesn't have explicit dimensions */
.nhub svg:not([width]):not([height]){
  max-width: 24px;
  max-height: 24px;
}

/* ---------- story search (James 2026-10-16) ----------
   Full-archive story search on the News front. Token-driven via the
   --nh-* aliases only, so the black/silver/white conversion re-skins
   this band by flipping tokens, not by editing these rules. */
.nhub-search{
  max-width:1240px;
  margin:0 auto;
  padding:26px clamp(16px,4vw,32px) 6px;
}
.nhub-search__label{
  display:block;
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--nh-red);
  font-weight:700;
  margin:0 0 10px;
}
.nhub-search__bar{
  display:flex;
  gap:10px;
  align-items:stretch;
}
.nhub-search__bar input{
  flex:1 1 auto;
  min-width:0;
  font:400 16px/1.35 var(--nh-sans);
  color:var(--nh-ink);
  background:var(--nh-card);
  border:1px solid var(--nh-rule);
  border-radius:var(--nh-radius);
  padding:13px 16px;
  box-shadow:var(--nh-shadow);
  -webkit-appearance:none;
  appearance:none;
}
.nhub-search__bar input::placeholder{color:var(--nh-ink-faint);}
.nhub-search__bar input:focus{
  outline:2px solid var(--nh-red);
  outline-offset:1px;
  border-color:var(--nh-red);
}
.nhub-search__bar button{
  flex:0 0 auto;
  font:600 13px var(--nh-sans);
  letter-spacing:.06em;
  padding:10px 20px;
  border-radius:var(--nh-radius);
  border:1px solid var(--nh-rule);
  background:var(--nh-card);
  color:var(--nh-ink);
  cursor:pointer;
}
.nhub-search__bar button:hover{border-color:var(--nh-red);color:var(--nh-red-dark);}
.nhub-search__hint{
  margin:10px 0 0;
  font-size:13px;
  line-height:1.5;
  /* NOT --nh-ink-soft: its --desert-pressed alias currently resolves to a
     cream surface tone (measured 1.15:1 on the card — invisible). The
     ink-dim alias is the hub's proven readable secondary tone. */
  color:var(--nh-ink-faint);
}
.nhub-search__results{padding-top:26px;}
.nhub-search__results .nhub-sec-title h2{
  font-family:var(--nh-serif);
  font-weight:700;
}
.nhub-scard__snip{
  margin:0;
  font-size:13.5px;
  line-height:1.55;
  color:var(--nh-ink-faint); /* see hint note: --nh-ink-soft alias is broken */
}
.nhub-scard__snip mark{
  background:rgba(var(--desert-ink-rgb), .10);
  color:var(--nh-ink);
  font-weight:600;
  padding:0 1px;
  border-radius:2px;
}
.nhub-sres__empty{
  border:1px solid var(--nh-rule);
  border-radius:var(--nh-radius);
  background:var(--nh-card);
  padding:22px 20px;
  text-align:center;
}
.nhub-sres__none{
  margin:0 0 8px;
  font-size:15px;
  color:var(--nh-ink);
}
.nhub-sres__site{
  font-weight:600;
  color:var(--nh-red-dark);
  text-decoration:underline;
}