/* =====================================================================
   Kungfupunk · r7.css — 21 Oct 2026: /updates, the dated record of every change (A route, tools/PLAN-2026-10-21-updates-names.md).
   Loaded on updates.html only, after r6.css (it uses r6's diamonds and plate). Page and feed are generated by tools/updates-build.mjs.
   The idea: each entry that moved a fact ends on a status line, unlit → lit, drawn with the site's diamonds (solid = Official or
   Store data, dashed hollow = Press-reported or Unconfirmed, “––” = not on the site before). The dates hang in the left column on
   wide screens, so the column of dates is the timeline. No rounded corners, no gradients, no glow, no card fills, no italics;
   red only where r6 already puts it (the plate's pin and its short top line). No motion: the page is a record.
   ===================================================================== */

/* ---------- the plate and its legend ---------- */
.up-plate { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-bottom: 15px; } /* two equal halves: r6's min-content first column squeezes a sentence under a short figure */
.up-plate .r6-plate__s { max-width: 30ch; }
.up-legend { display: flex; flex-wrap: wrap; gap: 6px 26px; margin: 0 0 15px; max-width: none; font-size: 14px; line-height: 1.5; color: var(--ink-3); }
.up-legend > span { display: inline-flex; align-items: center; gap: 10px; }
.up-legend .r6-dia { width: 8px; height: 8px; }

/* ---------- one entry ---------- */
.up { margin: 0; max-width: var(--measure); }
.up + .up { margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--rule-soft); }
.ud > h2 + .up { margin-top: 0; }
/* line 1: the pages it touched (kicker voice) */
.up__pages { margin: 0 0 6px; max-width: none; font: 500 12px/1.6 var(--serif); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }
.up__pages a { position: relative; color: var(--ink-3); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; }
.up__pages a:hover, .up__pages a:focus-visible { color: var(--ink); text-decoration-color: var(--red); }
.up__pages a::after { content: ""; position: absolute; left: -3px; right: -3px; top: -14px; bottom: -14px; } /* 44px hit height */
.up__all { color: var(--ink-2); }
.up__sep { color: var(--ink-4); }
/* line 2: what changed (body voice, one beat under the kicker) */
.up__what { margin: 0 0 10px; color: var(--ink-2); }
.up__what [lang="zh-Hans"] { font-family: var(--kai); font-weight: 500; color: var(--ink); padding: 0 1px; }
/* line 3 and 4: source and status, small voice; a fixed label column so the two lines align */
.up__basis, .up__change { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 0; margin: 0; max-width: none; font-size: var(--fs-small); line-height: var(--lh-small); color: var(--ink-3); }
.up__basis .lv { margin-right: 8px; }
.up__basis--none { color: var(--ink-4); }
.up__k { flex: none; width: 68px; font: 500 11px/1.5 var(--serif); letter-spacing: .18em; text-transform: uppercase; color: var(--ink-4); }
.up__change { margin-top: 8px; align-items: center; font-size: 15.5px; }
.up__from, .up__to { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.up__from { color: var(--ink-3); }
.up__to { color: var(--ink); font-weight: 600; }
.up__to--dim { color: var(--ink-2); font-weight: 500; }
.up__arrow { margin: 0 12px; color: var(--ink-4); }
.up__none { font-variant-numeric: lining-nums; letter-spacing: .02em; color: var(--ink-4); }
.up__from .up__none { margin-right: -2px; }

/* ---------- wide screens: the date hangs in the left column (the house rule in style.css only hangs an H2 followed by text;
   an entry is an <article>, so the same hang is set here; specificity is above style.css's clear:left on section children) ---------- */
@media (min-width: 1200px) {
  .main section.ud:has(> h2:first-child):not(.lg, .hf, .bx, .no-hang) > h2:first-child { float: left; width: var(--hang); font-size: var(--fs-h2-hang); line-height: 1.1; text-wrap: balance; }
  .main section.ud:has(> h2:first-child):not(.lg, .hf, .bx, .no-hang) > article.up { clear: none; margin-left: calc(var(--hang) + 32px); }
}

/* ---------- phones ---------- */
@media (max-width: 760px) {
  .up-legend { gap: 4px 18px; font-size: 13px; }
  .up__pages { font-size: 11.5px; letter-spacing: .14em; }
  .up__k { width: 60px; }
  .up__change { font-size: 15px; }
  .up__arrow { margin: 0 10px; }
}