/* Broken Zine 1.3 — dense, zany, readable, responsive.
   Keep the Mad/Onion newspaper logic; remove the billboard-scale hero and rigid-card feel. */

.bzfp{
  --paper:#f1eadb;
  --paper2:#e5dccb;
  background-color:var(--paper);
  background-image:
    radial-gradient(circle at 18% 12%,rgba(17,17,17,.035) 0 1px,transparent 1.2px),
    radial-gradient(circle at 72% 64%,rgba(228,56,36,.025) 0 1px,transparent 1.1px);
  background-size:13px 13px,19px 19px;
}
.bzfp-shell{width:min(1540px,calc(100% - 34px))}

/* Top front page: still important, no longer a billboard. */
.bzfp-splash{grid-template-columns:minmax(0,1.92fr) minmax(285px,.68fr)}
.bzfp-lead{
  grid-template-columns:minmax(0,.82fr) minmax(380px,1.18fr);
  min-height:445px;
  column-gap:1.1rem;
  padding-bottom:.7rem;
}
.bzfp-lead__copy{padding-top:.2rem}
.bzfp-lead h1{
  font-size:clamp(3.25rem,4.8vw,6.15rem);
  line-height:.84;
  max-width:9.2ch;
  margin-bottom:.65rem;
}
.bzfp-lead__dek{font-size:clamp(.98rem,1.08vw,1.18rem);max-width:36ch}
.bzfp-lead__media{min-height:350px;height:420px;max-height:420px}
.bzfp-lead__media img{min-height:0;height:420px;max-height:420px}
.bzfp-lead__go{font-size:.69rem;margin-top:.7rem}

/* A tight tabloid rail, not a tower of cards. */
.bzfp-frontstack{padding-left:.65rem}
.bzfp-frontstack__item{padding:.58rem .35rem .62rem}
.bzfp-frontstack__item.is-red{padding:.68rem .7rem .78rem;margin-left:-.65rem}
.bzfp-frontstack__item h2{font-size:clamp(1.35rem,1.75vw,2.25rem);line-height:.91}
.bzfp-frontstack__item p{font-size:.8rem;line-height:1.22;margin-top:.35rem}
.bzfp-burst{width:92px;height:92px;right:-8px;font-size:.58rem}

/* The human-work strip remains a reliable anchor. */
.bzfp-human{padding-top:.5rem}
.bzfp-human__mast strong{font-size:clamp(1.15rem,1.8vw,2rem)}
.bzfp-human-card{min-height:126px;padding-top:.62rem;padding-bottom:.66rem}
.bzfp-human-card h3{font-size:clamp(1rem,1.18vw,1.3rem)}
.bzfp-human-card p{font-size:.76rem}

/* Make the rotating field feel assembled, not card-generated. */
.bzfp-chaoshead{padding-top:.68rem}
.bzfp-chaoshead strong{font-size:clamp(1.55rem,2.55vw,3rem)}
.bzfp-chaos{
  gap:clamp(7px,.75vw,13px);
  padding:.72rem 0 1rem;
  border-bottom-width:5px;
  align-items:start;
}
.bzfp-story{
  border:1px solid rgba(17,17,17,.55);
  min-height:228px;
  background:#f5efe2;
  box-shadow:2px 2px 0 rgba(17,17,17,.12);
}
.bzfp-story:nth-child(4n+2){transform:rotate(.18deg)}
.bzfp-story:nth-child(5n+3){transform:rotate(-.18deg)}
.bzfp-story__image{height:155px}
.bzfp-story h3{font-size:clamp(1.25rem,1.65vw,2rem)}
.bzfp-story p{font-size:.83rem}

.bzfp-story.is-screamer{
  min-height:370px;
  border:0;
  border-top:5px solid var(--ink);
  border-bottom:2px solid var(--ink);
  background:transparent;
  box-shadow:none;
}
.bzfp-story.is-screamer .bzfp-story__image{height:245px}
.bzfp-story.is-screamer h3{font-size:clamp(2.5rem,3.6vw,4.8rem);max-width:14ch}

.bzfp-story.is-column{
  min-height:315px;
  background:transparent;
  box-shadow:none;
  border:0;
  border-left:4px solid var(--ink);
}
.bzfp-story.is-column .bzfp-story__image{height:125px}

.bzfp-story.is-tall{min-height:520px}
.bzfp-story.is-tall .bzfp-story__image{height:300px}
.bzfp-story.is-tall h3{font-size:clamp(1.85rem,2.45vw,3rem)}

.bzfp-story.is-brief{
  min-height:155px;
  background:var(--paper2);
  box-shadow:none;
  border:0;
  border-top:2px solid var(--ink);
  border-bottom:1px solid var(--ink);
}

.bzfp-story.is-strip{
  min-height:160px;
  grid-template-columns:165px 1fr;
  background:transparent;
  box-shadow:none;
  border:0;
  border-top:4px solid var(--ink);
  border-bottom:1px solid var(--ink);
}
.bzfp-story.is-strip .bzfp-story__image{height:160px}

.bzfp-story.is-poster{
  min-height:220px;
  border:3px solid var(--ink);
  box-shadow:5px 5px 0 rgba(17,17,17,.18);
  transform:rotate(-.5deg);
}
.bzfp-story.is-photo{border:0;box-shadow:none}
.bzfp-story.is-photo .bzfp-story__image{height:300px}
.bzfp-story.is-sideeye{min-height:220px;background:transparent;box-shadow:none;border-top:0;border-right:0;border-bottom:0}

.bzfp-archive__image{height:135px}

/* Intermediate desktop: keep density, stop squeezing the right rail. */
@media(max-width:1280px){
  .bzfp-shell{width:min(100% - 28px,1540px)}
  .bzfp-splash{grid-template-columns:minmax(0,1.7fr) minmax(260px,.72fr)}
  .bzfp-lead{grid-template-columns:minmax(0,.78fr) minmax(350px,1.22fr);min-height:410px}
  .bzfp-lead h1{font-size:clamp(3rem,4.7vw,5.25rem)}
  .bzfp-lead__media,.bzfp-lead__media img{height:385px;max-height:385px}
  .bzfp-frontstack__item h2{font-size:clamp(1.22rem,1.65vw,1.88rem)}
  .bzfp-burst{display:none}
}

/* Laptop / narrow desktop: lead stays visual, secondary headlines become a horizontal desk. */
@media(max-width:1080px){
  .bzfp-splash{grid-template-columns:1fr}
  .bzfp-lead{
    border-right:0;
    border-bottom:2px solid var(--rule);
    grid-template-columns:minmax(245px,.7fr) minmax(0,1.3fr);
    min-height:0;
    padding-right:0;
  }
  .bzfp-lead h1{font-size:clamp(3rem,6vw,4.8rem);max-width:9.5ch}
  .bzfp-lead__media{grid-column:2;grid-row:2/4;height:350px;min-height:0;max-height:350px}
  .bzfp-lead__media img{height:350px;min-height:0;max-height:350px}
  .bzfp-frontstack{grid-template-columns:repeat(4,minmax(0,1fr));padding:0}
  .bzfp-frontstack__item{border-right:1px solid var(--rule);border-bottom:0;min-height:145px;padding:.65rem}
  .bzfp-frontstack__item:last-child{border-right:0}
  .bzfp-frontstack__item.is-red{margin:0;padding:.65rem}
  .bzfp-frontstack__item h2{font-size:clamp(1.15rem,1.9vw,1.55rem)}
  .bzfp-frontstack__item p{display:none}
  .bzfp-human__list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bzfp-human-card:nth-child(3){border-right:0}
  .bzfp-chaos{grid-template-columns:repeat(12,minmax(0,1fr))}
  .bzfp-story.is-screamer{grid-column:span 8}
  .bzfp-story.is-column{grid-column:span 4}
  .bzfp-story.is-tall{grid-column:span 6}
  .bzfp-story.is-brief{grid-column:span 4}
  .bzfp-story.is-strip{grid-column:span 8}
  .bzfp-story.is-poster{grid-column:span 4}
  .bzfp-story.is-photo{grid-column:span 6}
  .bzfp-story.is-sideeye{grid-column:span 4}
}

/* Tablet: two-column newspaper, not a crushed desktop. */
@media(max-width:840px){
  .bzfp-edition{grid-template-columns:1fr auto}.bzfp-edition__center{display:none}
  .bzfp-lead{grid-template-columns:1fr}
  .bzfp-lead__copy{grid-column:1;grid-row:auto}
  .bzfp-lead h1{font-size:clamp(2.8rem,9vw,4.5rem);max-width:12ch}
  .bzfp-lead__media{grid-column:1;grid-row:auto;height:300px;max-height:300px;margin-top:.4rem}
  .bzfp-lead__media img{height:300px;max-height:300px}
  .bzfp-frontstack{grid-template-columns:1fr 1fr}
  .bzfp-frontstack__item{border-bottom:1px solid var(--rule)}
  .bzfp-frontstack__item:nth-child(even){border-right:0}
  .bzfp-human__list{grid-template-columns:1fr 1fr}
  .bzfp-human-card:nth-child(3){border-right:1px solid var(--rule)}
  .bzfp-human-card:nth-child(even){border-right:0}
  .bzfp-chaoshead,.bzfp-chaoshead div{align-items:flex-start;flex-direction:column;gap:.4rem}
  .bzfp-chaoshead p{text-align:left}
  .bzfp-chaos{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
  .bzfp-story,.bzfp-story.is-column,.bzfp-story.is-tall,.bzfp-story.is-brief,.bzfp-story.is-poster,.bzfp-story.is-sideeye{grid-column:span 4;grid-row:auto;min-height:0}
  .bzfp-story.is-screamer,.bzfp-story.is-strip,.bzfp-story.is-photo{grid-column:span 8}
  .bzfp-story.is-screamer h3{font-size:clamp(2.3rem,7vw,3.7rem)}
}

/* Phone: preserve hierarchy and artwork; remove decorative rotation. */
@media(max-width:560px){
  .bzfp-shell{width:calc(100% - 18px)}
  .bzfp-lead h1{font-size:clamp(2.55rem,12.5vw,4rem);max-width:none}
  .bzfp-lead__media,.bzfp-lead__media img{height:235px;max-height:235px}
  .bzfp-frontstack{grid-template-columns:1fr}
  .bzfp-frontstack__item{border-right:0;min-height:0}
  .bzfp-human__list{grid-template-columns:1fr}
  .bzfp-human-card,.bzfp-human-card:nth-child(3),.bzfp-human-card:nth-child(even){border-right:0}
  .bzfp-chaos{grid-template-columns:1fr;gap:0;padding-top:.3rem}
  .bzfp-story,.bzfp-story.is-screamer,.bzfp-story.is-column,.bzfp-story.is-tall,.bzfp-story.is-brief,.bzfp-story.is-strip,.bzfp-story.is-poster,.bzfp-story.is-photo,.bzfp-story.is-sideeye{
    grid-column:1!important;grid-row:auto!important;transform:none;box-shadow:none;border-left:0;border-right:0;
  }
  .bzfp-story__image,.bzfp-story.is-screamer .bzfp-story__image,.bzfp-story.is-tall .bzfp-story__image,.bzfp-story.is-photo .bzfp-story__image{height:210px}
  .bzfp-story.is-strip{display:block}
  .bzfp-story.is-strip .bzfp-story__image{height:205px;margin:-.78rem -.78rem .65rem}
  .bzfp-archive__row{grid-template-columns:1fr}
}