:root{
  --paper:#f6f1e6;
  --paper-2:#efe7d6;
  --ink:#1d1b18;
  --ink-2:#4a4640;
  --ink-3:#7a7468;
  --rule:#1d1b18;
  --hair:#cfc6b4;
  --accent:#9b2c22;
  --gut:clamp(14px,1.6vw,24px);
  --f-mast:'UnifrakturMaguntia','Old Standard TT',serif;
  --f-hed:'Old Standard TT','Times New Roman',serif;
  --f-body:'Source Serif 4',Georgia,serif;
  --f-ui:'Libre Franklin','Helvetica Neue',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#e4dccb;color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.55;
  font-optical-sizing:auto;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit}

.paper{max-width:1280px;margin:0 auto;background:var(--paper);padding:clamp(16px,3vw,40px) clamp(14px,3vw,44px) 32px;
  box-shadow:0 0 0 1px #d6ccb8,0 10px 40px rgba(60,45,20,.12);
  background-image:radial-gradient(rgba(120,95,50,.045) 1px,transparent 1px);background-size:3px 3px}

/* ---------- Masthead ---------- */
.masthead{text-align:center}
.ears{display:grid;grid-template-columns:150px 1fr 150px;align-items:center;gap:16px}
.ear{font-family:var(--f-ui);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1.5;
  border:1px solid var(--rule);padding:8px 6px;color:var(--ink-2)}
.nameplate{font-family:var(--f-mast);font-weight:400;font-size:clamp(52px,9.5vw,128px);line-height:1;margin:0;letter-spacing:.01em}
.dateline{display:flex;justify-content:space-between;gap:12px;margin-top:14px;padding:6px 2px;
  border-top:3px double var(--rule);border-bottom:1px solid var(--rule);
  font-family:var(--f-ui);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.motto{font-family:var(--f-hed);font-style:italic;font-weight:400;text-transform:none;letter-spacing:0;font-size:15px}
.index{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 28px;padding:8px 0;border-bottom:3px solid var(--rule);
  font-family:var(--f-ui);font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.index a{text-decoration:none;padding:2px 0;border-bottom:2px solid transparent}
.index a:hover,.index a:focus-visible{border-bottom-color:var(--accent);color:var(--accent);outline:none}

/* ---------- Grid & rules ---------- */
.band{display:grid;grid-template-columns:repeat(12,1fr);padding:var(--gut) 0;border-bottom:1px solid var(--rule)}
.band > *{padding:0 var(--gut);min-width:0}
.band > *:first-child{padding-left:0}
.band > *:last-child{padding-right:0}
.band > * + *{border-left:1px solid var(--hair)}

.band-front .sonia1{grid-column:span 8}
.band-front .sonia2{grid-column:span 4}
.band-animals .jelly{grid-column:span 3}
.band-animals .dogs{grid-column:span 6}
.band-animals .snakes{grid-column:span 3}
.band-mixed .cats{grid-column:span 5}
.band-mixed .lizards{grid-column:span 3}
.band-mixed .scammers{grid-column:span 4}
.band-kitchen .runny{grid-column:span 7}
.band-kitchen .scrambled{grid-column:span 5}
.band-people .army{grid-column:span 5}
.band-people .sports-stack{grid-column:span 4}
.band-people .eli-col{grid-column:span 3}

/* ---------- Section flags ---------- */
.section-flag{margin:22px 0 0;display:flex;align-items:center;gap:14px;font-family:var(--f-ui);font-size:13px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;scroll-margin-top:12px}
.section-flag::before,.section-flag::after{content:"";flex:1;height:0;border-top:3px double var(--rule)}
.section-flag span{background:var(--ink);color:var(--paper);padding:5px 14px}
#front{scroll-margin-top:12px}

/* ---------- Story type ---------- */
.kicker{font-family:var(--f-ui);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 6px}
.hed{font-family:var(--f-hed);font-weight:700;line-height:1.04;margin:0 0 8px;letter-spacing:-.005em;text-wrap:balance}
.hed-xl{font-size:clamp(40px,5.4vw,72px);line-height:.98}
.hed-lg{font-size:clamp(28px,3vw,40px)}
.hed-md{font-size:clamp(23px,2.2vw,29px)}
.hed-sm{font-size:21px}
.deck{font-family:var(--f-hed);font-style:italic;font-size:18px;line-height:1.3;color:var(--ink-2);margin:0 0 10px;text-wrap:pretty}
.sonia1 .deck{font-size:21px;max-width:48ch}
.byline{font-family:var(--f-ui);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px;
  padding-bottom:10px;border-bottom:1px solid var(--hair);color:var(--ink-2)}
.story p{margin:0 0 .8em;hyphens:auto;text-wrap:pretty}
.story > p:not(.kicker):not(.deck):not(.byline),.cols-2 p,.story .alert-box > p:not(.kicker):not(.deck):not(.byline){text-align:justify;text-justify:inter-word}

.dropcap p{text-align:justify}
.sonia1 .cols-2 p{text-align:left!important}
.jump a{text-decoration:none;border-bottom:1px solid currentColor}
.jump a:hover{color:var(--ink)}
#part2{scroll-margin-top:12px}
.pull{margin:14px 0 16px;padding:12px 0;border-top:3px double var(--rule);border-bottom:1px solid var(--rule);font-family:var(--f-hed);font-style:italic;font-size:24px;line-height:1.25;color:var(--accent);text-align:center;text-wrap:balance}
.cols-2{columns:2;column-gap:var(--gut);column-rule:1px solid var(--hair)}
.cols-2 p{break-inside:auto}
.dropcap > p:first-child::first-letter,.dropcap-p::first-letter{float:left;font-family:var(--f-hed);font-weight:700;font-size:3.6em;line-height:.82;
  margin:.06em .08em 0 0;color:var(--accent)}

/* ---------- Figures ---------- */
.fig{margin:0 0 12px;background:var(--paper-2);border:1px solid var(--hair)}
.fig img{width:100%;mix-blend-mode:multiply}
.fig-crop img{aspect-ratio:2/3;object-fit:cover;object-position:center 40%}
.fig-crop-short img{aspect-ratio:4/3;object-fit:cover;object-position:center 25%}
.fig-tall img{aspect-ratio:2/3;object-fit:cover}

/* Sonia lead */
.sonia1-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--gut);align-items:start}
.sonia1-body .fig{margin:0}
.sonia1-body .fig img{aspect-ratio:2/3;object-fit:cover}
.jump{font-family:var(--f-ui);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);text-align:left!important}
.tbc{font-family:var(--f-hed);font-style:italic;font-size:20px;text-align:right!important;color:var(--accent);
  border-top:1px solid var(--hair);padding-top:8px}

/* Cats */
.breeds{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:2px solid var(--rule)}
.breed{padding:8px 10px 0;border-left:1px solid var(--hair)}
.breed:first-child{border-left:0;padding-left:0}
.breed:last-child{padding-right:0}
.breed h4{font-family:var(--f-ui);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:0 0 6px;line-height:1.3}
.breed ul{margin:0;padding:0;list-style:none}
.breed li{font-size:15px;line-height:1.4;padding:5px 0;border-bottom:1px dotted var(--hair)}
.breed li:last-child{border-bottom:0}

/* Scammers alert */
.alert-box{border:2px solid var(--rule);outline:1px solid var(--rule);outline-offset:3px;padding:14px 14px 4px;background:#fbf7ee;margin:4px}
.kicker-alert{display:inline-block;background:var(--accent);color:#fff;padding:3px 8px}

/* Kitchen */
.runny-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--gut);align-items:start;margin-bottom:12px}
.runny-grid .fig{margin:0}
.runny .method{columns:2;column-gap:var(--gut);column-rule:1px solid var(--hair)}
.recipe-box{border-top:2px solid var(--rule);border-bottom:1px solid var(--rule);padding:8px 0 4px;margin:0 0 12px}
.recipe-box h4{font-family:var(--f-ui);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin:0 0 4px;color:var(--accent)}
.recipe-box p{margin:0 0 6px;font-style:italic}
.steps,.facts{margin:0 0 12px;padding:0;list-style:none;counter-reset:s}
.steps li,.facts li{counter-increment:s;position:relative;padding:6px 0 6px 38px;border-bottom:1px dotted var(--hair);line-height:1.4}
.steps li::before,.facts li::before{content:counter(s);position:absolute;left:0;top:4px;width:26px;height:26px;border-radius:50%;
  background:var(--ink);color:var(--paper);font-family:var(--f-ui);font-weight:800;font-size:13px;display:grid;place-items:center}
.facts li{padding-left:34px}
.facts li::before{width:22px;height:22px;font-size:12px;top:6px;background:var(--accent)}
.tip{font-family:var(--f-hed);font-style:italic;font-size:17px;background:var(--paper-2);padding:8px 12px;border-left:3px solid var(--accent);text-align:left!important}
.tip strong{font-style:normal}

/* Profiles stack */
.profiles .story + .story{margin-top:var(--gut);padding-top:var(--gut);border-top:1px solid var(--rule)}

/* Footer */
.colophon{text-align:center;padding-top:20px;font-family:var(--f-ui);font-size:12px;color:var(--ink-3);letter-spacing:.03em}
.nameplate-sm{font-family:var(--f-mast);font-size:34px;color:var(--ink);margin:0 0 4px;letter-spacing:0}
.colophon p{margin:0 0 4px}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .band-front .sonia1,.band-front .sonia2{grid-column:span 12}
  .band-front .sonia2{border-left:0;padding:var(--gut) 0 0;margin-top:var(--gut);border-top:1px solid var(--rule);
    display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gut)}
  .band-front .sonia2 > .fig{grid-row:1 / span 6;grid-column:2}
  .band-front .sonia2 > *:not(.fig){grid-column:1}
  .band-animals .jelly{grid-column:span 4}
  .band-animals .dogs{grid-column:span 8}
  .band-animals .snakes{grid-column:span 12;border-left:0;padding:var(--gut) 0 0;margin-top:var(--gut);border-top:1px solid var(--rule)}
  .band-mixed .cats{grid-column:span 7}
  .band-mixed .lizards{grid-column:span 5;padding-right:0}
  .band-mixed .scammers{grid-column:span 12;border-left:0;padding:var(--gut) 0 0;margin-top:var(--gut);border-top:1px solid var(--rule)}
  .band-kitchen .runny,.band-kitchen .scrambled{grid-column:span 6}
  .runny-grid{grid-template-columns:1fr}
  .runny .method{columns:1}
  .band-people .army{grid-column:span 7}
  .band-people .sports-stack{grid-column:span 5;padding-right:0}
  .band-people .eli-col{grid-column:span 12;border-left:0;padding:var(--gut) 0 0;margin-top:var(--gut);border-top:1px solid var(--rule);
    display:grid;grid-template-columns:1fr 1fr;gap:var(--gut)}
  .eli-col{display:block!important}
  .band-animals .snakes .fig,.band-mixed .scammers .fig,.eli-col .fig{float:right;width:46%;margin:0 0 10px var(--gut)}
  .eli-col .fig img{aspect-ratio:4/3}
  .band-animals .snakes::after,.alert-box::after,.eli-col::after{content:"";display:block;clear:both}
}
@media (max-width:720px){
  body{background:var(--paper)}
  .paper{box-shadow:none;padding:14px 16px 24px}
  .ears{grid-template-columns:1fr}
  .ear{display:none}
  .dateline{flex-direction:column;align-items:center;gap:2px;font-size:11px}
  .index{gap:4px 16px;font-size:11.5px}
  .band{display:block;padding:12px 0}
  .band > *{padding:0!important;border-left:0!important}
  .band > * + *{margin-top:16px!important;padding-top:16px!important;border-top:1px solid var(--rule)!important}
  .band-front .sonia2,.band-people .profiles,.eli-col,.eli-col .story{display:block!important}
  .profiles .story + .story{border-left:0;padding-left:0;margin-top:16px;padding-top:16px;border-top:1px solid var(--rule)}
  .sonia1-body{grid-template-columns:1fr}
  .sonia1-body .fig img{aspect-ratio:4/3;object-position:center 30%}
  .fig-tall img{aspect-ratio:4/3;object-position:center 30%}
  .fig-crop img{aspect-ratio:4/3}
  .cols-2{columns:1}
  .breeds{grid-template-columns:1fr}
  .breed{border-left:0;padding:8px 0 0;border-top:1px solid var(--hair)}
  .breed:first-child{border-top:0}
  .story > p:not(.kicker):not(.deck):not(.byline),.cols-2 p,.story .alert-box > p:not(.kicker):not(.deck):not(.byline){text-align:left}
  .alert-box{margin:4px 4px 8px}
  .band-animals .snakes .fig,.band-mixed .scammers .fig,.eli-col .fig{float:none;width:auto;margin:0 0 12px}
  .dropcap p{text-align:left}
}
@media print{body{background:#fff}.paper{box-shadow:none}}