:root{
  --paper:#fbf6ea; --paper-2:#f3ecd9; --ink:#1d1a16; --ink-2:#4a443b; --rule:#d8cdb2;
  --honk:#d62839; --honk-ink:#a81e2c; --brass:#f2b134; --brass-dark:#b47f12; --banana:#ffe066;
  --clown-1:#e63946; --clown-2:#2a9d8f; --clown-3:#f4a261; --clown-4:#6a4c93;
  --link:#1d1a16; --bar:#1d1a16; --bar-ink:#fbf6ea; --card:#fffdf6; --shadow:0 1px 0 rgba(0,0,0,.06);
  --serif: Georgia, "Times New Roman", Cambria, "Liberation Serif", serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#16140f; --paper-2:#1f1c16; --ink:#efe8d8; --ink-2:#b9b09c; --rule:#3a352b;
    --honk:#ff5a68; --honk-ink:#ff8a94; --brass:#f2b134; --brass-dark:#c48d1c;
    --link:#efe8d8; --bar:#000; --bar-ink:#efe8d8; --card:#1c1914; color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --paper:#16140f; --paper-2:#1f1c16; --ink:#efe8d8; --ink-2:#b9b09c; --rule:#3a352b;
  --honk:#ff5a68; --honk-ink:#ff8a94; --brass:#f2b134; --brass-dark:#c48d1c;
  --link:#efe8d8; --bar:#000; --bar-ink:#efe8d8; --card:#1c1914; color-scheme: dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.55}
a{color:var(--link);text-decoration-color:var(--honk);text-underline-offset:3px}
a:hover{color:var(--honk-ink)}
.skip{position:absolute;left:-999px}
.skip:focus{left:8px;top:8px;background:var(--banana);color:#000;padding:6px 10px;z-index:10}
.notice-bar{background:var(--bar);color:var(--bar-ink);font-family:var(--sans);font-size:13px;text-align:center;padding:7px 16px;letter-spacing:.01em}
.masthead{max-width:1180px;margin:0 auto;padding:10px 16px 0;text-align:center;border-bottom:3px double var(--ink)}
.mast-top{display:flex;justify-content:space-between;gap:12px;font-family:var(--sans);font-size:12px;color:var(--ink-2);border-bottom:1px solid var(--rule);padding-bottom:6px;flex-wrap:wrap}
.linkish{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-decoration-color:var(--honk);cursor:pointer}
.brand{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink);margin:10px 0 2px}
.mascot{width:96px;height:52px;transform-origin:30% 50%;transition:transform .15s}
.brand:hover .mascot,.mascot.squeeze{transform:scale(.9,1.08) rotate(-4deg)}
.wordmark{font-family:var(--serif);font-weight:900;font-size:clamp(56px,11vw,112px);letter-spacing:.06em;line-height:1;text-shadow:3px 3px 0 var(--brass)}
.motto{margin:2px 0 8px;font-style:italic;color:var(--ink-2)}
.tiny{font-size:13px;color:var(--ink-2);font-family:var(--sans)}
.sections{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px;font-family:var(--sans);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:8px 0;border-top:1px solid var(--rule)}
.sections.minor{font-weight:500;text-transform:none;letter-spacing:0;font-size:13px;padding-top:4px}
.sections a{text-decoration:none;color:var(--ink)}
.sections a[aria-current]{color:var(--honk-ink);text-decoration:underline}
.sections a:hover{color:var(--honk-ink)}
.ticker{display:flex;max-width:1180px;margin:0 auto;border-bottom:1px solid var(--rule);font-family:var(--sans);font-size:14px;overflow:hidden}
.ticker-label{background:var(--honk);color:#fff;font-weight:800;padding:6px 10px;white-space:nowrap;letter-spacing:.08em}
.ticker-track{overflow:hidden;flex:1;position:relative}
.ticker-move{display:inline-flex;white-space:nowrap;animation:tick 70s linear infinite;padding:6px 0}
.ticker-move span{padding:0 22px;position:relative}
.ticker-move span::after{content:"📯";position:absolute;right:-9px;font-size:11px}
.ticker:hover .ticker-move{animation-play-state:paused}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.ticker-move{animation:none;flex-wrap:wrap;white-space:normal}}
main{max-width:1180px;margin:0 auto;padding:22px 16px 40px}
h1,h2,h3{font-family:var(--serif);line-height:1.15;margin:.2em 0 .35em}
h1{font-size:clamp(30px,4.6vw,48px);font-weight:800}
h3{font-size:22px}
.kicker-sec{font-family:var(--sans);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--honk-ink);text-decoration:none}
.dek{color:var(--ink-2);margin:.2em 0 .5em}
.dek.big{font-size:21px;font-style:italic}
.meta{font-family:var(--sans);font-size:13px;color:var(--ink-2);margin:.3em 0}
.front{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px}
.lead{border-bottom:1px solid var(--rule);padding-bottom:18px;margin-bottom:18px}
.lead h1 a{text-decoration:none}
.lead-text{font-size:19px}
.readmore{font-family:var(--sans);font-size:14px;font-weight:600}
.secondary{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px}
.card{border-top:3px solid var(--ink);padding-top:8px}
.card h3 a{text-decoration:none}
.card.sm h3{font-size:19px}
.card.sec-clownfeed{border-top-color:var(--clown-1);border-image:linear-gradient(90deg,var(--clown-1),var(--clown-3),var(--banana),var(--clown-2),var(--clown-4)) 1}
.rail{display:flex;flex-direction:column;gap:20px}
.box{background:var(--card);border:1px solid var(--rule);padding:14px 16px;box-shadow:var(--shadow)}
.box-title{font-family:var(--sans);font-size:13px;text-transform:uppercase;letter-spacing:.1em;border-bottom:2px solid var(--ink);padding-bottom:6px;margin:0 0 10px}
.box-title a{text-decoration:none}
.box-sub{margin:0 0 8px;font-style:italic;color:var(--ink-2);font-size:15px}
.clownbox{border:3px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,repeating-linear-gradient(45deg,var(--clown-1) 0 12px,#fff 12px 24px,var(--clown-2) 24px 36px,var(--banana) 36px 48px) border-box}
.clownlist{list-style:none;margin:0;padding:0}
.clownlist li{padding:7px 0;border-bottom:1px dotted var(--rule);font-size:16px;line-height:1.3}
.clownlist li:last-child{border:0}
.clownlist li::before{content:"🤡 "}
.honkbox{text-align:center}
.honk-btn{font-family:var(--sans);font-weight:800;font-size:22px;letter-spacing:.08em;background:var(--honk);color:#fff;border:0;border-radius:999px;padding:14px 28px;cursor:pointer;box-shadow:0 4px 0 var(--honk-ink);transition:transform .06s,box-shadow .06s}
.honk-btn:active,.honk-btn.pressed{transform:translateY(3px) scale(.97);box-shadow:0 1px 0 var(--honk-ink)}
.honk-btn.small{font-size:15px;padding:9px 18px}
.honk-btn:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--brass);outline-offset:2px}
.honk-count{font-family:var(--sans);margin:10px 0 2px}
.honk-world{font-family:var(--sans);font-size:13px;color:var(--ink-2);margin:8px 0 0;font-variant-numeric:tabular-nums}
.weather{list-style:none;margin:0;padding:0;font-size:15px}
.weather li{display:flex;gap:10px;padding:6px 0;border-bottom:1px dotted var(--rule);line-height:1.3}
.weather li:last-child{border:0}
.wx-icon{font-size:22px;width:28px;text-align:center}
.market{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px}
.market td{padding:4px 0;border-bottom:1px dotted var(--rule)}
.market td:last-child{text-align:right;font-weight:700}
.up{color:#2a8a3f}.down{color:var(--honk-ink)}.flat{color:var(--ink-2)}
.mostread{margin:0;padding-left:20px;font-size:16px}
.mostread li{padding:3px 0}
.rule-title{font-family:var(--sans);font-size:14px;text-transform:uppercase;letter-spacing:.12em;border-top:3px double var(--ink);padding-top:8px;margin:34px 0 14px}
.rule-title a{text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px 28px}
.bottom-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.bottom-strip p{font-size:16px}
.story{max-width:720px;margin:0 auto}
.crumbs{font-family:var(--sans);font-size:13px;color:var(--ink-2)}
.crumbs a{color:var(--ink-2)}
.story-body{font-size:19px;margin-top:18px;border-top:1px solid var(--rule);padding-top:14px}
.dateline{font-family:var(--sans);font-weight:800;font-size:14px;letter-spacing:.06em}
.dateline-p::first-letter{font-size:1em}
.kicker{font-style:italic;color:var(--ink-2);border-top:1px solid var(--rule);padding-top:12px;margin-top:22px;font-size:16px}
.story-honk{margin:18px 0}
.prevnext{display:flex;justify-content:space-between;gap:16px;font-family:var(--sans);font-size:14px;border-top:1px solid var(--rule);padding-top:12px;margin-top:10px}
.prevnext a{max-width:48%}
.prevnext a:last-child{text-align:right}
.section-page h1{font-size:clamp(36px,6vw,64px)}
.sec-clownfeed h1{background:linear-gradient(90deg,var(--clown-1),var(--clown-3),var(--brass),var(--clown-2),var(--clown-4));-webkit-background-clip:text;background-clip:text;color:transparent}
.clown-intro{background:var(--card);border-left:6px solid var(--clown-1);padding:10px 16px;margin:0 0 24px}
.plain{max-width:780px;margin:0 auto}
.plain h2{font-size:24px;margin-top:1.2em}
.corrections li{margin:0 0 14px}
.signs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.sign{background:var(--card);border:1px solid var(--rule);padding:12px 14px}
.sign h2{margin:0;font-size:22px}
.classifieds{columns:2 280px;column-gap:28px}
.cl-cat{break-inside:avoid;margin-bottom:18px}
.cl-cat h2{font-family:var(--sans);font-size:14px;text-transform:uppercase;letter-spacing:.12em;background:var(--ink);color:var(--paper);padding:4px 8px;margin:0 0 8px}
.ad{font-family:var(--sans);font-size:15px;border:1px dashed var(--rule);padding:8px 10px;margin:0 0 8px;break-inside:avoid}
.letter{background:var(--card);border:1px solid var(--rule);padding:14px 18px;margin:0 0 18px}
.salute{font-style:italic}
.sig{text-align:right;font-style:italic;color:var(--ink-2)}
.reply{border-top:1px dotted var(--rule);padding-top:8px;font-size:16px}
.entry{border-bottom:1px solid var(--rule);padding:12px 0}
.entry h2{margin:0;font-size:26px}
.pos{font-family:var(--sans);font-size:13px;color:var(--ink-2);margin:0 0 6px;font-style:italic}
.example{font-style:italic;color:var(--ink-2);border-left:3px solid var(--brass);padding-left:10px}
.vote{font-family:var(--sans);font-size:13px;background:var(--paper-2);border:1px solid var(--rule);border-radius:4px;padding:3px 9px;cursor:pointer;color:var(--ink)}
.archive{list-style:none;padding:0}
.archive li{padding:10px 0;border-bottom:1px dotted var(--rule)}
.site-foot{border-top:3px double var(--ink);max-width:1180px;margin:0 auto;padding:20px 16px 90px;text-align:center;font-family:var(--sans);font-size:14px;color:var(--ink-2)}
.foot-notice{max-width:760px;margin:12px auto;font-size:14px;color:var(--ink)}
.foot-small{font-size:12px}
.cookie{position:fixed;left:16px;right:16px;bottom:16px;max-width:520px;margin:0 auto;background:var(--card);color:var(--ink);border:2px solid var(--ink);box-shadow:6px 6px 0 var(--brass);padding:14px 16px;font-family:var(--sans);font-size:14px;z-index:20}
.cookie p{margin:0 0 10px}
.cookie-btns{display:flex;gap:10px;flex-wrap:wrap}
.cookie button{font:inherit;font-weight:700;background:var(--ink);color:var(--paper);border:2px solid var(--ink);padding:7px 14px;cursor:pointer}
.cookie button.ghost{background:transparent;color:var(--ink)}
.toast{position:fixed;left:50%;top:18px;transform:translate(-50%,-140%);background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:14px;padding:9px 16px;border-radius:999px;transition:transform .25s;z-index:30;max-width:calc(100% - 32px);text-align:center}
.toast.show{transform:translate(-50%,0)}
body.shake main{animation:shake .35s}
@keyframes shake{0%,100%{transform:none}25%{transform:translateX(-4px) rotate(-.3deg)}75%{transform:translateX(4px) rotate(.3deg)}}
@media (prefers-reduced-motion: reduce){body.shake main{animation:none}.toast{transition:none}}
@media (max-width:900px){
  .front{grid-template-columns:1fr}
  .bottom-strip{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:17px}
  .secondary{grid-template-columns:1fr}
  .mascot{width:64px;height:35px}
  .brand{gap:8px}
  .mast-top{justify-content:center}
  .prevnext{flex-direction:column}
  .prevnext a{max-width:100%}
  .prevnext a:last-child{text-align:left}
}