/* Article figures use the site's existing colour and type tokens. */
.article-column .prose > figure > img { width: 100%; }
.article-credit { margin: .9rem 0 1.5rem; color: var(--ink-secondary); font-size: .82rem; }
.article-credit a { color: var(--accent-deep); }
.article-quick-link { margin-block: 1.2rem; font-weight: 600; }
.prose .explainer { margin: 2.2rem 0; padding: 1.7rem; border: 1px solid var(--rule); border-radius: 18px; background: var(--paper); overflow: hidden; }
.explainer .figure-kicker { display: block; font-family: var(--font-mono); font-size: .67rem; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-deep); }
.prose .explainer h3 { margin: .65rem 0 1.6rem; max-width: 24ch; font-size: clamp(1.45rem, 3vw, 1.9rem); line-height: 1.2; font-weight: 500; letter-spacing: -.035em; }
.explainer .figure-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.explainer .figure-step { min-width: 0; position: relative; }
.explainer .step-index { font-family: var(--font-mono); font-size: .7rem; color: var(--ink-secondary); }
.explainer .figure-icon { display: block; width: 100%; height: 100px; margin: .6rem 0 1rem; color: var(--ink); }
.explainer .figure-number { display: block; font-size: clamp(1.7rem, 3.5vw, 2.5rem); line-height: 1.12; letter-spacing: -.05em; font-weight: 500; font-variant-numeric: tabular-nums; }
.explainer .figure-unit { font-size: .8rem; letter-spacing: 0; font-weight: 500; }
.explainer .figure-step p { margin: .55rem 0 0; font-size: .84rem; line-height: 1.5; color: var(--ink-secondary); }
.explainer .figure-step p strong { color: var(--ink); font-weight: 600; }
.explainer .figure-result { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.3rem; margin-top: 1.6rem; border-radius: 10px; background: var(--lock); color: var(--paper); }
.explainer .figure-result p { margin: 0; font-size: .88rem; line-height: 1.5; }
.explainer .figure-result strong { white-space: nowrap; color: var(--accent); font-size: 1.6rem; font-weight: 500; letter-spacing: -.03em; }
.prose .explainer figcaption { margin: 1rem 0 0; font-size: .78rem; line-height: 1.55; color: var(--ink-secondary); }
.explainer .rice-paths { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.3rem; align-items: start; }
.explainer .rice-path { min-width: 0; }
.explainer .rice-path .figure-number { margin-top: .4rem; }
.explainer .rice-path p { margin: .6rem 0 0; font-size: .84rem; color: var(--ink-secondary); }
.explainer .rice-equals { align-self: center; color: var(--accent-deep); font-size: 2rem; }
.explainer .figure-caution { padding: 1rem 0 0; margin: 1rem 0 0; border-top: 1px solid var(--rule); font-size: .84rem; line-height: 1.6; }
.explainer .figure-caution strong { font-weight: 600; }
.explainer .photo-layout { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 1.7rem; }
.explainer .plate-diagram { width: 100%; max-height: 300px; }
.explainer .photo-notes { margin: 0; padding: 0; list-style: none; }
.explainer .photo-notes li { margin: 0; padding: .8rem 0; border-bottom: 1px solid var(--rule); font-size: .83rem; line-height: 1.5; color: var(--ink-secondary); }
.explainer .photo-notes li:last-child { border: 0; }
.explainer .photo-notes strong { display: block; color: var(--ink); font-size: .92rem; margin-bottom: .2rem; }
.explainer .photo-legend { display: flex; gap: .5rem; align-items: center; margin: .7rem 0 0; font-size: .76rem; color: var(--ink-secondary); }
.explainer .photo-legend span { height: .55rem; width: .55rem; background: var(--accent); border-radius: 50%; flex: 0 0 auto; }
.explainer .midnight-days { display: grid; grid-template-columns: 1fr 1fr; position: relative; }
.explainer .midnight-day { padding: .7rem 1.4rem 1.1rem; text-align: center; }
.explainer .midnight-day + .midnight-day { border-left: 1px dashed var(--ink-tertiary); }
.explainer .midnight-clock { display: block; font-family: var(--font-mono); font-size: clamp(1.55rem, 4vw, 2.7rem); margin: .7rem 0 .35rem; letter-spacing: -.05em; }
.explainer .midnight-day p { margin: .5rem 0 0; font-size: .84rem; }
.explainer .midnight-day p strong { color: var(--accent-deep); font-size: 1.35rem; font-weight: 500; }
.explainer .midnight-flow { display: block; width: 100%; height: 36px; margin: .6rem 0 0; }
.explainer .midnight-label { text-align: center; margin: .3rem 0 0; font-size: .78rem; color: var(--ink-secondary); }
.article-column .actions { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; margin-top: 1.5rem; }
.article-column .store-badge { display: inline-block; flex: 0 0 auto; border: 0; }
.article-column .store-badge img { width: 156px; height: 52px; }
.editorial-page { max-width: 780px; margin: 0 auto; padding: 3rem 1.25rem 5rem; }
.editorial-page .prose { margin-top: 2rem; }
.editorial-page h1 { max-width: 16ch; }
.prose .evidence-table { min-width: 560px; }
@media (max-width: 560px) {
  .prose .explainer { padding: 1.2rem; border-radius: 14px; }
  .explainer .figure-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .explainer .figure-step { display: grid; grid-template-columns: 90px 1fr; column-gap: 1rem; align-items: center; padding-bottom: 1.2rem; border-bottom: 1px solid var(--rule); }
  .explainer .figure-step:last-child { padding-bottom: 0; border: 0; }
  .explainer .step-index { grid-column: 1 / -1; }
  .explainer .figure-step .figure-icon { grid-column: 1; grid-row: 2 / 4; height: 90px; margin: .5rem 0 0; }
  .explainer .figure-step .figure-number { grid-column: 2; margin-top: .5rem; }
  .explainer .figure-step p { grid-column: 2; margin-top: .3rem; }
  .explainer .figure-result { align-items: flex-start; flex-direction: column; gap: .5rem; padding: 1rem; }
  .explainer .rice-paths { gap: .6rem; }
  .explainer .rice-path .figure-icon { height: 75px; }
  .explainer .rice-path .figure-number { font-size: 1.8rem; }
  .explainer .rice-path .figure-kicker { font-size: .6rem; letter-spacing: .015em; }
  .explainer .photo-layout { grid-template-columns: 1fr; gap: .5rem; }
  .explainer .plate-diagram { max-height: 230px; }
  .explainer .midnight-day { padding: .5rem .6rem; }
  .article-column .actions { align-items: flex-start; flex-direction: column; gap: 1.2rem; }
}