/* Style E: Style C's colors, type, buttons and cards + Style D's structure and effects
   C: off-white page, white bordered cards, one blue accent, Manrope everywhere, rounded blue buttons, round (i) help.
   D: street-sign logo, live dateline, "The day so far" timeline, pinned flyers with tear-off tabs, rubber stamps,
      public-notice box, police log, highlighter link swipe, drawn nav underline, flyers that straighten and lift. */
:root{
  --bg:#FAFAF8; --card:#FFFFFF; --soft:#F3F3EF;
  --ink:#111111; --body:#4A4A44; --muted:#5B5B54;
  --line:#E7E7E2; --line2:#D9D9D2;
  --blue:#2457F5; --blue-d:#1B3FB8; --tint:#EEF2FF; --tint2:#F2F5FF; --tint-line:#D5DEFB; --hl:#CFDBFF;
  --green:#0F6B3A; --rust:#9A3C06; --rust-tint:#FFF1E6;
  --sans:"Manrope",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.55 var(--sans)}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:10px 14px;z-index:50;border-radius:8px}
.skip:focus{left:8px}
.show-m{display:none}

/* ---------- text helpers ---------- */
.label{font:800 11.5px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.meta{font:600 13px/1.6 var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.meta a{color:var(--ink);font-weight:700}
.kicker{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 14px;
  font:800 12.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.kicker small{font:700 12px/1 var(--sans);letter-spacing:0;text-transform:none;color:var(--muted)}
/* D effect: highlighter swipe, in C blue */
.mark{background-image:linear-gradient(var(--hl),var(--hl));background-repeat:no-repeat;background-position:0 92%;
  background-size:0 40%;transition:background-size .25s ease;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.mark:hover,.mark:focus-visible{background-size:100% 40%}
.more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:800 14.5px/1 var(--sans);color:var(--blue)}

/* ---------- stamps (D effect, C colors) ---------- */
.stamp{display:inline-block;font:800 10.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  padding:5px 7px 4px;border:2px solid currentColor;border-radius:4px;transform:rotate(-2deg);white-space:nowrap}
.stamp.sp{color:var(--ink)}
.stamp.bp{color:var(--muted);border-style:dashed}
.stamp.ft{color:var(--blue)}
.stamp.pass{color:var(--green)}
.stamp.fail{color:var(--rust)}

/* ---------- buttons (C) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;
  font:700 15px/1 var(--sans);border:1.5px solid var(--blue);border-radius:10px;cursor:pointer;white-space:nowrap;
  transition:background .15s,color .15s,border-color .15s,transform .1s}
.btn:active{transform:scale(.98)}
.btn-ink{background:var(--blue);color:#fff}
.btn-ink:hover{background:var(--blue-d);border-color:var(--blue-d)}
.btn-line{background:#fff;color:var(--ink);border-color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fff}

/* ---------- help: C's round (i), D's taped note ---------- */
.help{position:relative;display:inline-flex;vertical-align:middle;margin-left:6px}
.help-btn{position:relative;width:18px;height:18px;padding:0;border-radius:50%;border:1.5px solid #77776F;background:transparent;
  color:#55554E;font:800 11px/1 var(--sans);cursor:help;display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s,border-color .15s}
.help-btn::after{content:"";position:absolute;inset:-13px}
.help-btn:hover,.help.open .help-btn{background:var(--ink);border-color:var(--ink);color:#fff}
.help-note{position:absolute;z-index:30;left:50%;top:calc(100% + 12px);width:240px;margin-left:-120px;
  background:#fff;color:var(--ink);border:1.5px solid var(--ink);border-radius:6px;
  font:600 13px/1.5 var(--sans);letter-spacing:0;text-transform:none;text-align:left;padding:14px 13px 12px;
  transform:rotate(-1.5deg);box-shadow:4px 4px 0 var(--ink);opacity:0;visibility:hidden;transition:opacity .15s,visibility .15s}
.help-note::before{content:"";position:absolute;top:-9px;left:50%;width:46px;height:16px;margin-left:-23px;
  background:var(--hl);opacity:.9;transform:rotate(-3deg)}
.help:hover .help-note,.help.open .help-note,.help-btn:focus-visible+.help-note{opacity:1;visibility:visible}
.help.l .help-note{left:auto;right:-10px;margin-left:0}
.help.r .help-note{left:-10px;margin-left:0}

/* ---------- dateline (C banner colors) ---------- */
.dateline{background:var(--tint);color:var(--blue-d);font:700 13px/1.2 var(--sans);font-variant-numeric:tabular-nums}
.dateline .wrap{display:flex;align-items:center;gap:16px;min-height:40px}
.dateline b{font-weight:800}
.dateline .sp{flex:1}
.dateline a{display:inline-flex;align-items:center;min-height:40px}
.dateline a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---------- masthead: D's street sign in C blue ---------- */
.masthead .wrap{display:flex;align-items:center;gap:26px;padding-top:20px;padding-bottom:18px}
.sign{display:inline-flex;flex-direction:column;align-items:flex-start;transition:transform .2s}
.sign:hover{transform:rotate(-1deg)}
.sign-plate{background:var(--blue);color:#fff;font:800 27px/1 var(--sans);letter-spacing:-.4px;
  padding:10px 15px 9px;border-radius:9px;box-shadow:inset 0 0 0 3px var(--blue),inset 0 0 0 5px #fff}
.sign-blade{margin-left:14px;background:#fff;color:var(--blue-d);font:800 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;
  padding:5px 10px 5px;border:2px solid var(--blue);border-top:0;border-radius:0 0 6px 6px}
.motto{font:600 15px/1.5 var(--sans);color:var(--muted);max-width:360px}
.masthead .sp{flex:1}

/* ---------- nav: C type, D drawn underline ---------- */
.navrow{border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line);background:var(--card)}
.navrow .wrap{display:flex;align-items:center;gap:8px;min-height:54px}
.nav{display:flex;gap:2px;margin-left:-12px}
.nav a{position:relative;font:700 15px/1 var(--sans);padding:19px 12px;white-space:nowrap;transition:color .15s}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:10px;height:2.5px;border-radius:2px;background:var(--blue);
  transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav a:hover{color:var(--blue-d)}
.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.cities{margin-left:auto;display:flex;align-items:center;gap:2px;font:700 14px/1 var(--sans);white-space:nowrap}
.cities .lab{margin-right:8px}
.cities a{padding:18px 8px;color:var(--body);transition:color .15s}
.cities a:hover{color:var(--ink)}
.cities a.on{color:var(--blue-d);text-decoration:underline;text-decoration-color:var(--blue);text-decoration-thickness:3px;text-underline-offset:6px}

/* ---------- cards (C) ---------- */
.front{display:grid;grid-template-columns:260px minmax(0,1fr) 340px;grid-template-areas:"day lead board";gap:24px;padding:28px 0 0}
.front>.day{grid-area:day;align-self:start;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:20px 18px 16px}
.front>.lead{grid-area:lead;padding:2px 4px 0}
.front>.board{grid-area:board}

/* timeline (D) */
.tt li>a{display:grid;grid-template-columns:62px 1fr;gap:8px;padding:11px 8px;margin:0 -8px;border-radius:10px;
  transition:background .15s,transform .15s}
.tt li+li>a{border-top:1px solid var(--line)}
.tt li>a:hover{background:var(--tint2);transform:translateX(3px)}
.tt time{font:700 12.5px/1.6 var(--sans);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.tt .t{font:700 15px/1.35 var(--sans)}
.tt .s{display:block;font:700 11px/1.5 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.tt .s.red{color:var(--ink)}
.day .foot-note{margin-top:10px;font-size:12px}

/* lead story */
.lead h1{font:800 44px/1.08 var(--sans);letter-spacing:-1.4px;margin:2px 0 12px}
.dek{font:500 18.5px/1.55 var(--sans);color:var(--body);margin:0 0 14px}
.byline{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;padding:10px 0;border-top:1.5px solid var(--line);margin-bottom:16px}
.byline>span{display:inline-flex;align-items:center}
.ph{border-radius:16px;border:1.5px solid var(--line);aspect-ratio:16/7.5;display:flex;align-items:flex-end;padding:12px;
  background:repeating-linear-gradient(135deg,#F3F3EF 0 8px,#EAEAE4 8px 9px)}
.ph span{font:700 12px/1 var(--sans);color:var(--muted);background:#fff;padding:6px 9px;border-radius:6px}
.short{margin:20px 0 6px;background:var(--tint);border-radius:16px;padding:18px 20px 10px}
.short .label{color:var(--blue-d)}
.short ol{margin-top:8px;counter-reset:s}
.short li{counter-increment:s;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:baseline;padding:9px 0;
  font:700 17px/1.45 var(--sans)}
.short li+li{border-top:1px solid var(--tint-line)}
.short li::before{content:counter(s);font:800 26px/.9 var(--sans);text-align:center;color:var(--blue-d);
  background:linear-gradient(transparent 50%,var(--hl) 50%,var(--hl) 92%,transparent 92%)}

/* bulletin board (D flyers, C colors) */
.board{background:var(--soft);border-radius:16px;padding:20px 20px 26px;display:flex;flex-direction:column;gap:22px;align-self:start}
.board-title{align-self:flex-start;font:800 12.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.flyer{position:relative;display:block;padding:26px 18px 16px;background:var(--card);border:1.5px solid var(--line);border-radius:12px;
  color:var(--ink);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.flyer::before{content:"";position:absolute;top:9px;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#8FA8FF,#2457F5 60%,#15318F);box-shadow:0 2px 3px rgba(0,0,0,.25)}
.flyer.y{background:var(--tint2);border-color:var(--tint-line);transform:rotate(-1.2deg)}
.flyer.b{transform:rotate(1deg)}
.flyer.p{transform:rotate(-.6deg)}
.flyer.lift:hover{transform:rotate(0) translateY(-3px);box-shadow:0 12px 28px -12px rgba(17,17,17,.28);border-color:#C4C4BC}
.flyer .top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.flyer h3{font:800 20px/1.2 var(--sans);letter-spacing:-.3px;margin:12px 0 6px}
.flyer p{font-size:14.5px;line-height:1.45;color:var(--body)}
.tabs{display:flex;margin:16px -18px -16px;border-top:1.5px dashed var(--line2);border-radius:0 0 11px 11px;overflow:hidden}
.tabs span{flex:1;height:92px;writing-mode:vertical-rl;transform:rotate(180deg);display:flex;align-items:center;justify-content:center;
  font:700 10.5px/1 var(--sans);letter-spacing:.04em;color:var(--body);border-right:1.5px dashed var(--line2)}
.tabs span:first-child{border-right:0}
.card-ix{background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:16px 18px 10px;transform:rotate(.6deg);transition:transform .22s}
.card-ix:hover{transform:rotate(0)}
.card-ix h3{font:800 12.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
.card-ix li{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:38px;font:700 15px/1.3 var(--sans);border-bottom:1px solid var(--line)}
.card-ix li:last-child{border-bottom:0}
.card-ix .hand{display:inline-flex;align-items:center;min-height:42px;font:800 14px/1 var(--sans);color:var(--blue)}
.card-ix .hand:hover{text-decoration:underline;text-underline-offset:3px}
.slot{display:block;border:1.5px dashed var(--line2);border-radius:12px;padding:18px;text-align:center;font:600 14.5px/1.4 var(--sans);
  color:var(--body);transition:background .15s,border-color .15s}
.slot:hover{background:#fff;border-color:var(--blue)}
.slot strong{display:block;font:800 15px/1.2 var(--sans);color:var(--ink);margin-bottom:3px}

/* on the record (C cards) */
.record{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr);gap:24px;padding-top:28px}
.record>section{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:22px 22px 20px}
.notice-line{display:flex;align-items:center;font:700 14.5px/1.4 var(--sans);margin:0 0 12px;color:var(--body)}
.log{width:100%;border-collapse:collapse;font:600 14px/1.4 var(--sans);font-variant-numeric:tabular-nums;margin-bottom:12px}
.log th{text-align:left;font:800 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  border-bottom:1.5px solid var(--line);padding:6px 8px 9px 0}
.log td{padding:11px 8px 11px 0;border-bottom:1px solid var(--line)}
.log tbody tr{transition:background .15s}
.log tbody tr:hover{background:var(--tint2)}
.record>section.notice-wrap{padding:8px;background:transparent;border:0}
.notice{height:100%;background:var(--card);border:1.5px solid var(--ink);border-radius:16px;padding:22px 20px 16px;text-align:center;
  box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 5.5px var(--ink)}
.notice .nh{font:800 13px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;padding-bottom:12px;margin-bottom:12px;border-bottom:1.5px solid var(--line)}
.notice .big{font:800 30px/1.1 var(--sans);letter-spacing:-.6px;margin:6px 0}
.notice p{font-size:15px;color:var(--body);margin:6px 0}
.notice .links{display:flex;flex-direction:column;align-items:center;margin-top:4px}
.item h3{font:800 19px/1.25 var(--sans);margin:4px 0 6px}
.item p{font-size:15px;color:var(--body);margin-bottom:4px}
.cal{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.cal:last-child{border-bottom:0}
.cal .d{border:1.5px solid var(--ink);border-radius:10px;text-align:center;font:800 10.5px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.1em;padding:6px 0 5px}
.cal .d b{display:block;font:800 22px/1 var(--sans);letter-spacing:0}
.cal .n{font:700 15.5px/1.3 var(--sans)}
.cal .n span{display:block}

/* lower row */
.lower{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;padding:28px 0 40px}
.coupon{position:relative;border:1.5px dashed var(--ink);border-radius:16px;padding:28px 26px 24px;background:var(--card)}
.coupon .scis{position:absolute;top:-14px;left:22px;background:var(--bg);padding:0 6px;line-height:0}
.coupon h2{font:800 26px/1.15 var(--sans);letter-spacing:-.5px;margin:0 0 6px}
.coupon p{display:flex;align-items:center;flex-wrap:wrap;font-size:15.5px;color:var(--body);margin-bottom:16px}
.subrow{display:flex;gap:10px;align-items:flex-end}
.field{display:flex;flex-direction:column;gap:6px}
.subrow .field{flex:1}
input[type=text],input[type=email],input[type=tel]{height:48px;width:100%;border:1.5px solid #CFCFC7;background:#fff;padding:0 14px;
  font:500 16px var(--sans);color:var(--ink);border-radius:10px;transition:border-color .15s,box-shadow .15s}
input:hover{border-color:#9A9A92}
input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px #DCE5FF}
.elsewhere{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:22px 22px 18px}
.elsewhere li{padding:12px 0;border-bottom:1px solid var(--line)}
.elsewhere li a{font:800 16.5px/1.3 var(--sans)}
.elsewhere li .meta{display:block;margin-top:2px}
.elsewhere>.meta{margin-top:12px}

/* footer (C, light) */
.foot{border-top:1.5px solid var(--line);background:var(--soft);color:var(--ink)}
.foot .wrap.cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;padding-top:32px;padding-bottom:22px}
.foot .sign-plate{font-size:20px;display:inline-block}
.foot p{font-size:14.5px;line-height:1.55;color:var(--body);margin-top:14px;max-width:460px}
.foot h4{font:800 11.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.foot a.fl{display:block;padding:7px 0;font:600 15px var(--sans)}
.foot a.fl:hover{color:var(--blue-d)}
.foot .base{border-top:1.5px solid var(--line);font:600 12.5px/1.5 var(--sans);color:var(--muted);padding-top:14px;padding-bottom:18px}

/* ---------- phone ---------- */
@media (max-width:900px){
  .wrap{padding:0 16px}
  .hide-m{display:none!important}
  .show-m{display:inline}
  .dateline .wrap{gap:12px;min-height:38px;font-size:12.5px}
  .masthead .wrap{flex-wrap:wrap;gap:12px 14px;padding-top:16px;padding-bottom:14px}
  .sign-plate{font-size:22px;padding:9px 12px 8px}
  .sign-blade{font-size:10px;margin-left:12px}
  .masthead .btn{min-height:44px;font-size:14px;padding:0 14px}
  .motto{order:3;width:100%;max-width:none;font-size:14.5px}
  .navrow .wrap{flex-direction:column;align-items:stretch;gap:0;padding:0}
  .nav{margin:0;padding:0 4px;overflow-x:auto;border-bottom:1.5px solid var(--line)}
  .nav a{padding:17px 12px}
  .cities{margin:0;padding:0 10px;overflow-x:auto}
  .cities a{padding:16px 8px}
  .front{grid-template-columns:1fr;grid-template-areas:"lead" "day" "board";gap:20px;padding-top:20px}
  .lead h1{font-size:32px;letter-spacing:-1px}
  .dek{font-size:17px}
  .short{padding:16px 16px 8px}
  .short li{font-size:16px;grid-template-columns:32px 1fr}
  .record,.lower,.foot .wrap.cols{grid-template-columns:1fr;gap:20px}
  .record{padding-top:20px}
  .lower{padding:20px 0 32px}
  .subrow{flex-direction:column;align-items:stretch}
  .record>section.notice-wrap{padding:0}
  .help-note{position:fixed;left:16px;right:16px;bottom:16px;top:auto;width:auto;margin-left:0;transform:rotate(-1deg);font-size:14px}
  .help.l .help-note,.help.r .help-note{left:16px;right:16px}
}

/* ---------- pages ---------- */
/* Inner pages (story, offer, post). Built from the tokens and card styles above; nothing above this line changes. */
.story,.offer,.post{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start;padding:28px 0 40px}
.crumbs{margin:0 0 14px}
.side{display:flex;flex-direction:column;gap:20px}
.side-card{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:20px 20px 16px}
.side-card p{font-size:15px;color:var(--body);margin:0 0 8px}
.side-card p.meta{font-size:13px;color:var(--muted);margin:4px 0 0}
.side .notice{height:auto}

/* story */
.story-main{padding:2px 4px 0}
.sample-note{margin:14px 0 0;padding:10px 14px;border:1.5px dashed var(--line2);border-radius:10px;font:600 13.5px/1.5 var(--sans);color:var(--muted)}
.agenda-item{margin-top:26px;padding-top:24px;border-top:1.5px solid var(--line)}
.agenda-item h2{font:800 25px/1.2 var(--sans);letter-spacing:-.5px;margin:6px 0 14px}
.facts{margin:0;display:grid;gap:12px}
.facts>div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:14px}
.facts dt{font:800 11.5px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.facts dd{margin:0;font:500 16.5px/1.6 var(--sans);color:var(--body)}
.side-card .facts{gap:8px}
.side-card .facts>div{grid-template-columns:80px minmax(0,1fr);gap:10px}
.side-card .facts dd{font:700 15px/1.5 var(--sans);color:var(--ink)}
.comment-box{margin-top:30px;background:var(--tint);border-radius:16px;padding:22px 22px 10px;scroll-margin-top:16px}
.comment-box h2{font:800 24px/1.2 var(--sans);letter-spacing:-.4px;margin:0 0 6px}
.comment-box>p{color:var(--body);margin:0 0 10px}
.ways li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--tint-line);font:500 15.5px/1.5 var(--sans);color:var(--body)}
.ways strong{font-weight:800;color:var(--blue-d)}
.story-foot{margin-top:18px}
.upd{margin:2px 0 6px}
.upd li{position:relative;padding:0 0 16px 24px}
.upd li::before{content:"";position:absolute;left:0;top:5px;width:12px;height:12px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px var(--tint)}
.upd li::after{content:"";position:absolute;left:5px;top:21px;bottom:2px;width:2px;background:var(--line)}
.upd li:last-child{padding-bottom:4px}
.upd li:last-child::after{display:none}
.upd li.next::before{background:#fff;border:2px solid var(--line2);box-shadow:none}
.upd time{display:block;font:700 12.5px/1.5 var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.upd .t{font:700 15px/1.4 var(--sans)}
.upd li.next .t{color:var(--muted)}

/* offer */
.flyer.offer-flyer{padding:36px 30px 24px;transform:rotate(-.6deg)}
.flyer.offer-flyer h1{font:800 40px/1.1 var(--sans);letter-spacing:-1.2px;margin:16px 0 8px}
.flyer .offer-biz{font:700 16px/1.4 var(--sans);color:var(--ink);margin-bottom:8px}
.flyer.offer-flyer>p{font-size:16px;line-height:1.55}
.offer-flyer .tabs{margin:24px -30px -24px}
.claim{margin-top:20px;padding:18px;background:var(--card);border:1.5px solid var(--tint-line);border-radius:12px;
  display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.claim .meta{margin:0}
.claim-code{display:inline-block;font:800 30px/1 var(--sans);letter-spacing:.12em;padding:14px 18px;border:2px dashed var(--ink);border-radius:10px;background:#fff;color:var(--ink)}
.fine{margin-top:28px}
.fine li{padding:9px 0;border-top:1px solid var(--line);font:500 15px/1.5 var(--sans);color:var(--body)}
.fine li:first-child{border-top:0}

/* post */
.post-form h1{font:800 40px/1.1 var(--sans);letter-spacing:-1.2px;margin:2px 0 10px}
.pform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:6px;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:22px}
.pform .full{grid-column:1/-1}
.pform .hint{font:600 12.5px/1.4 var(--sans);color:var(--muted)}
.pform-send{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.post-preview{position:sticky;top:20px}
.post-preview .board{padding-bottom:20px}
.post-preview .flyer h3{overflow-wrap:anywhere}

@media (max-width:900px){
  .story,.offer,.post{grid-template-columns:1fr;gap:20px;padding:20px 0 32px}
  .agenda-item h2{font-size:21px}
  .facts>div,.ways li{grid-template-columns:1fr;gap:2px}
  .side-card .facts>div{grid-template-columns:80px minmax(0,1fr);gap:10px}
  .comment-box{padding:18px 16px 8px}
  .flyer.offer-flyer{padding:30px 18px 16px}
  .flyer.offer-flyer h1{font-size:30px;letter-spacing:-.8px}
  .offer-flyer .tabs{margin:20px -18px -16px}
  .claim-code{font-size:24px}
  .claim .btn{align-self:stretch}
  .post-form h1{font-size:30px;letter-spacing:-.8px}
  .pform{grid-template-columns:1fr;padding:18px 16px}
  .pform-send .btn{width:100%}
  .post-preview{position:static}
}
