/* Shared content thumbnails; publisher logos are not story artwork. */
.card-media{float:right;display:block;width:clamp(76px,29%,136px);margin:0 0 12px 14px;line-height:1.3}
.card-media img{display:block;width:100%;height:auto;max-height:132px;object-fit:contain!important;object-position:center;background:#f5f1e8;border-radius:6px}
.card-media-label{display:block;font:11px/1.4 var(--body);color:var(--ink2);margin-top:4px}
.brief-card-copy,.plan-copy,.cal-copy,.desk-update-copy,.desk-tile-body{min-width:0;display:flow-root}
.brief-card-copy>.source,.brief-actions,.plan-footer{clear:both}
.brief-card .editorial-image-label{display:none}
.desk-update-copy{flex:1}.desk-update:has(.card-media) .desk-date{display:none}
.desk-update:has(.card-media){align-items:start}
.article-body{min-width:0;max-width:72ch;color:var(--ink,#17354a)}
.article-body p,.article-body li,.article-body blockquote,.article-body .editorial-guidance p{color:var(--ink,#17354a);line-height:1.7}
.source-prose p{margin:0 0 1em;overflow-wrap:anywhere}
/* READING LAYERS. The lead and the fact list were the same size on the same
   plane, so an event page met the eye as one slab with nowhere to start. The
   layers now come from surface and from the fact tiles, not from inflating the
   prose. Presentation only: no publisher text is reworded, reordered, shortened
   or hidden.

   An earlier pass set the first paragraph to 21px as an entry point. That was
   wrong: nearly every lead here is a single paragraph, so it
   enlarged the whole lead and produced a bigger slab rather than somewhere to
   start -- seven lines of it on the Whiteside Forum page. A real deck only works
   when it is written as one, and ours is verbatim publisher prose. */
.detail-lead{font-size:17px;line-height:1.6;max-width:62ch;margin:0 0 1.6rem}
.detail-lead>p{font-size:17px;margin:0 0 .9em}
.detail-lead>p:last-child{margin-bottom:0}
.article-body .source-attribution,.article-media figcaption{font-size:13px;color:var(--ink2,#52616a);line-height:1.5}
.article-media{margin:20px 0 26px;max-width:480px}
.article-media .detail-image{display:block;width:auto;max-width:100%;height:auto;max-height:320px;object-fit:contain;margin:0 0 10px;border-radius:6px}
.editorial-original{margin-top:1.6rem;font-size:17px}.editorial-original h2{font-size:22px}
.article-body .editorial-guidance{margin:18px 0}
@media(max-width:560px){.card-media{width:28%;margin-left:12px}.card-media img{max-height:112px}.cal-copy .card-media{width:30%;min-width:52px;margin-left:8px}.cal-copy h3{font-size:17px}.article-media .detail-image{max-height:260px}.article-body{max-width:100%}.detail-layout{gap:24px}}
/* Today has its own later stylesheet: retain the same shared flow there. */
.content-first .brief-card-copy,.content-first .desk-tile-body{display:flow-root}
.content-first .headlines-grid>.brief-card .brief-card-copy{display:flow-root}
.desk-updates .desk-update:has(.card-media){grid-template-columns:minmax(0,1fr) 18px}
/* A feed illustration is not a license to turn a one-line notice into a feature. */
.detail-title-raw{overflow-wrap:anywhere}
.source-prose ul{padding-left:1.4em;margin:0 0 1.2em}
.source-prose li{margin:.4em 0}
.editorial-media-note{font:13px/1.5 var(--body);color:var(--ink2,#52616a);margin:10px 0 0;max-width:62ch}
/* The facts lift onto their own surface against the warm page, so "what this is"
   and "when and where" stop competing. The tinted header, this panel and the
   visit panel then read as three steps rather than one flat column. */
.details-block{background:var(--surface);border:1px solid var(--panel-line);
  border-radius:var(--panel-radius);padding:4px 22px 8px;margin-top:30px}
.details-block .section-heading{border-bottom:1px solid var(--panel-line);padding:14px 0 11px}
.details-block .section-heading h2{font-size:23px}
.details-block .fact-list>div:last-of-type{border-bottom:0}
.details-block .fact-sources{border-top:1px solid var(--panel-line);margin-top:0;padding-top:4px}
/* A fact value carries the answer; its label only names the question. */
.fact-list dt{color:var(--ink2,#52616a)}

/* FACT TILES. When, where and what it costs are the questions a reader has
   before they have any others, and in a row list they were three more lines to
   read in order. As tiles they are answered at a glance and the prose underneath
   stops competing. Only settled facts get here -- anything disputed, annotated
   or carrying a link stays a row, where there is room to show why. */
.fact-chips{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;margin:16px 0 4px;padding:0}
.fact-chip{border-radius:11px;padding:12px 14px;background:#eef1ee;border:1px solid #0e2e4414}
.fact-chip>.eyebrow{font-size:10px;color:var(--ink2,#52616a);margin-bottom:5px}
.fact-chip>strong{display:block;font-size:17px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
/* The one word a reader is looking for, in the first line they read. */
.day-badge{font-weight:700;letter-spacing:.14em}
.fact-chip[data-chip="when"]{background:#e3eee7;border-color:#2c5f4a26}
.fact-chip[data-chip="cost"]{background:#e5ecf4;border-color:#2b4f6e26}
/* The whole address is the verification path, so it is never shortened.
   Its weight is a type problem -- smaller, muted, breaking anywhere it must. */
.fact-list dd a[href^="http"]{font-size:15px;color:var(--ink2,#52616a);
  word-break:break-all;text-underline-offset:2px}
@media(max-width:560px){
  .details-block{padding:2px 16px 6px;margin-top:24px}
  .detail-lead{max-width:100%}
  .fact-chips{grid-template-columns:1fr 1fr;gap:8px}
  .fact-chip{padding:10px 12px}
  .fact-chip>strong{font-size:16px}
}
/* Brief cards: one uniform picture box so a row of cards lines up. Source photos
   and illustrations arrive at different aspects (1.84:1 and 3:2 here), which made
   each card wrap its text at a different depth. Narrower than the shared default
   so the headline and body keep the measure they had before the picture existed. */
.brief-card .card-media{width:clamp(72px,24%,116px);margin-top:3px;margin-left:16px}
.brief-card .card-media img{aspect-ratio:3/2;height:auto;max-height:none}
/* A past weekend day shows what was on rather than two empty columns. It is
   labelled so it cannot be mistaken for something still to come: a blank
   Friday and Saturday read as "nothing happens here", which is the opposite
   of what the calendar actually held. */
.weekend-past{font:11px var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink2,#52616a);margin:0 0 6px}
.weekend-day:has(.weekend-past) .plan-row{opacity:.82}
