/* One gazette — its page and its text view (F1 WP-5, WP-8). Loaded per page through
   {% block extra_css %}. Semantic tokens only. */

.gazette { max-width: 68rem; }                  /* wider, for less scrolling (the owner, 2026-10-18) */
.gazette--text { max-width: 54rem; }            /* the text view keeps the measure */
.gazette__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
.gazette__kicker .label { letter-spacing: 0.05em; }
.gazette h1 { margin-bottom: var(--space-2); }
.unbroken { white-space: nowrap; }              /* the name's date (D-44) */

.actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-3) 0 var(--space-4); }
.actions .btn-gf { min-height: 2.75rem; padding-inline: var(--space-4); font-size: var(--text-sm); }
@media (max-width: 30rem) { .actions .btn-gf { flex: 1 1 100%; white-space: normal; text-align: center; } }

/* Share (F8 SC-1, SC-7): the last action; its panel the menus' panel, under the button (share.js keeps it in the
   window), static below 30 rem. On a phone Bookmark and Share share a line; Share open takes its own. */
.share { position: relative; }
.share > summary, .share__sub > summary { list-style: none; cursor: pointer; }
.share > summary::-webkit-details-marker, .share__sub > summary::-webkit-details-marker { display: none; }
.share[open] > summary { border-color: var(--color-accent); background: var(--color-accent-tint); }
.share__icon { width: 18px; height: 18px; flex: none; }
.share__panel { min-width: 17rem; max-width: calc(100vw - 2 * var(--gutter)); }
.share__head { margin: var(--space-1) var(--space-3) var(--space-2); }
.share__item { display: flex; align-items: center; gap: var(--space-3); width: 100%; padding: var(--space-2) var(--space-3); border: 0; border-radius: var(--radius-sm); background: none; color: var(--color-ink); font: var(--weight-regular) var(--text-sm) / 1.3 var(--font-sans); text-align: left; text-decoration: none; cursor: pointer; }
.share__item:hover, .share__item:focus-visible { background: var(--color-accent-tint); color: var(--color-ink); text-decoration: none; }
.share__item.is-copied { color: var(--color-highlight-ink); }
.share__sub > summary::after { content: "BE"; margin-left: auto; color: var(--color-ink-muted); }
.share__sub-body { padding: var(--space-1) var(--space-3) var(--space-3) calc(18px + 2 * var(--space-3)); font-size: var(--text-sm); color: var(--color-ink-soft); }
.share__sub-body p { margin: 0 0 var(--space-2); max-width: 26rem; }
.share__sub-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.share__caption { display: block; width: 100%; margin-top: var(--space-1); padding: var(--space-2); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-ink); font: var(--text-xs) / 1.4 var(--font-sans); resize: vertical; }
@media (max-width: 30rem) {
  .actions > .ctl, .actions > .share { flex: 1 1 0; }
  .actions > .share[open] { flex-basis: 100%; }
  .share > summary { width: 100%; }
  .share__panel { position: static; min-width: 0; max-width: none; margin-top: var(--space-2); box-shadow: none; }
}

/* "Something wrong with this gazette?" (F12 UI-1). */
.report-line { margin: calc(-1 * var(--space-2)) 0 var(--space-3); font-size: var(--text-sm); color: var(--color-ink-muted); }

/* "Follow new gazettes from" (F7 UI-2): the authority and the kind as small follow controls. */
.follow-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: calc(-1 * var(--space-2)) 0 var(--space-3); font-size: var(--text-sm); color: var(--color-ink-soft); }

/* Status banners: a withdrawal, the parts, the other gazettes under this number, a newer file. */
.banner {
  margin: 0 0 var(--space-3);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-line);
  border-left: 4px solid var(--color-ink-soft);
  border-radius: var(--radius);
  background: var(--color-surface-alt);
  font-size: var(--text-sm);
}
.banner p { margin: 0; max-width: none; }
.banner p + p, .banner p + ul, .banner ul + p { margin-top: var(--space-2); }
.banner__list { margin: var(--space-2) 0 0; padding: 0; list-style: none; display: grid; gap: var(--space-1); }
.banner__list li { max-width: none; }
.banner__list [aria-current] { font-weight: var(--weight-semibold); }

/* The facts grid: each fact a label over its value; an absent fact is left out. */
.facts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
  gap: var(--space-2) var(--space-5);
  margin: 0 0 var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}
.facts div { min-width: 0; }
.facts dt { margin-bottom: var(--space-1); }
.facts dd { margin: 0; font-variant-numeric: tabular-nums lining-nums; }
.facts dd.serif { font-size: var(--text-lg); line-height: 1.25; }
.facts[data-group] { border-left: 4px solid var(--group); }   /* the row's strip, carried over (D-31) */
.group-tag { font-size: var(--text-xs); font-weight: var(--weight-semibold); color: var(--color-ink-soft); text-decoration: none; }
.group-tag:hover { color: var(--color-accent); text-decoration: underline; }
.facts__wide { grid-column: 1 / -1; }           /* the contents line: ours, labelled so beneath it */
/* D-44: the date on one line — two tracks for it once there are two (2 × 11 rem + the gap) */
.facts { container-type: inline-size; grid-auto-flow: row dense; }
@container (min-width: 23.5rem) {
  .facts__date { grid-column: span 2; }
  .facts__date dd { white-space: nowrap; }
}
.facts__note { display: block; margin: var(--space-1) 0 0; }

.section { margin: 0 0 var(--space-4); }
.section h2 { font-size: var(--text-lg); margin-bottom: var(--space-2); }
/* the sub-title under the name, and the notices the contents page lists (GZ-14) */
.gazette__subtitle { margin: 0 0 var(--space-1); font-family: var(--font-serif); font-size: var(--text-lg); line-height: 1.3; color: var(--color-ink); }
.gazette__also { font-family: var(--font-sans); font-size: var(--text-sm); white-space: nowrap; }
.notices__department { font-size: var(--text-base); margin: var(--space-4) 0 var(--space-1); }
.notice { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) auto; gap: 0 var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--color-line); }
.notice__no, .notice__act, .notice__page { font-size: var(--text-sm); color: var(--color-ink-muted); font-variant-numeric: tabular-nums; }
.notice__title, .notice__act { display: block; }
.notice__class { display: inline-block; color: var(--color-accent); text-decoration: none; }   /* F15 LP-5 */
.notice__page { white-space: nowrap; }

.passages { margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-lg); background: var(--color-surface); border: 1px solid var(--color-line); }
.passages h2 { font-size: var(--text-lg); }
.passages__text { font-size: var(--text-sm); color: var(--color-ink-soft); }

/* Provenance: the listing as the source gave it, the hash, our copy. Folded on a phone. */
.provenance { margin: 0 0 var(--space-4); border: 1px solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface); }
.provenance > summary { padding: var(--space-2) var(--space-5); cursor: pointer; font-weight: var(--weight-semibold); }
.provenance > summary .label { margin-left: var(--space-2); }
.provenance__body { padding: 0 var(--space-5) var(--space-4); }
.provenance__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); margin: 0; font-size: var(--text-sm); }
@media (min-width: 40rem) { .provenance__list { grid-template-columns: 11rem minmax(0, 1fr); gap: var(--space-2) var(--space-4); } }
@media (min-width: 64rem) { .provenance__list { grid-template-columns: 8rem minmax(0, 1fr) 8rem minmax(0, 1fr); } }
.provenance__list dt { color: var(--color-ink-muted); font-weight: var(--weight-regular); }
.provenance__list dd { margin: 0; max-width: none; }
.provenance code { word-break: break-all; color: var(--color-ink); }

.neighbours { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); margin: var(--space-4) 0 var(--space-2); }
.neighbour { display: block; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-line); border-radius: var(--radius); background: var(--color-surface); color: var(--color-ink); text-decoration: none; min-width: 0; }
.neighbour:hover { border-color: var(--color-accent); color: var(--color-ink); text-decoration: none; }
.neighbour--next { text-align: right; grid-column: 2; }
.neighbour__number { display: block; font-family: var(--font-serif); font-size: var(--text-lg); font-weight: var(--weight-semibold); font-variant-numeric: tabular-nums lining-nums; }
.neighbour__what { display: block; font-size: var(--text-xs); color: var(--color-ink-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.same-day { margin: 0; font-size: var(--text-sm); }

/* --- the text view ------------------------------------------------------------------------ */
.disclaimer { margin: 0 0 var(--space-3); padding: var(--space-3) var(--space-4); border-left: 4px solid var(--color-accent); background: var(--color-surface-alt); border-radius: var(--radius); font-size: var(--text-sm); }
.disclaimer p { margin: 0; max-width: none; }
.text-page { margin: 0 0 var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface); }
.text-page__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-1) var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--color-line); }
.text-page__no { font-family: var(--font-serif); font-weight: var(--weight-semibold); font-variant-numeric: tabular-nums lining-nums; }
.text-page__source { font-size: var(--text-xs); color: var(--color-ink-muted); }
.text-page__contents, .text-page__mask { flex: 1 1 100%; font-size: var(--text-xs); color: var(--color-ink-muted); }
.text-page__body {
  margin: 0;
  padding: var(--space-4);
  max-width: calc(var(--measure) + 2 * var(--space-4));
  font: var(--text-sm) / 1.6 var(--font-sans);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.text-page__note { margin: 0; padding: var(--space-3) var(--space-4); font-size: var(--text-sm); color: var(--color-ink-muted); }
details.text-page > summary { list-style: none; cursor: pointer; }
details.text-page > summary::-webkit-details-marker { display: none; }
details.text-page:not([open]) > summary { border-bottom: 0; }