/* One top bar: pager beside the menu button, reading tools before the page actions */
.main-site-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  flex-shrink: 0;
  color: var(--ink);
  font: 500 12px/1 var(--paper-sans);
  text-decoration: underline;
  text-underline-offset: 4px;
  white-space: nowrap;
}
.main-site-link:hover { color: var(--paper-accent); }
@media (max-width: 1200px) {
  .topbar.has-edition-tools { flex-wrap: wrap; height: auto; }
  .main-site-link { flex-basis: 100%; border-bottom: 1px solid var(--line); }
}
@media print { .main-site-link { display: none; } }
.topbar.has-edition-tools {
  justify-content: flex-start;
  gap: 18px;
}
.has-edition-tools .breadcrumb {
  display: none;
}
.has-edition-tools .topbar-leading {
  gap: 14px;
}
.edition-pager,
.edition-side {
  font: 500 12px/1 var(--paper-sans);
  color: var(--ink);
}
.edition-side {
  margin-left: auto;
}
.edition-pager button,
.edition-side button,
.edition-side select,
.edition-side input {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  border-radius: 0;
  cursor: pointer;
}
.edition-pager button:disabled {
  color: var(--faint);
  opacity: 0.45;
  cursor: default;
}
.edition-pager {
  display: flex;
  align-items: stretch;
}
.edition-pager > * + * {
  border-left: 1px solid var(--line);
}
.edition-step,
.edition-date {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 14px;
  letter-spacing: 0.04em;
  transition: color 0.15s;
}
.edition-pager > :first-child {
  padding-left: 0;
}
.edition-arrow {
  font-family: var(--paper-serif);
  font-size: 14px;
  transition: transform 0.15s;
}
.edition-step:not(:disabled):hover {
  color: var(--paper-accent);
}
.edition-step:not(:disabled):hover .edition-arrow:first-child {
  transform: translateX(-2px);
}
.edition-step:not(:disabled):hover .edition-arrow:last-child {
  transform: translateX(2px);
}
.edition-date {
  font: 600 15px/1 var(--paper-serif);
  letter-spacing: 0.02em;
}
.edition-weekday {
  font: 500 12px/1 var(--paper-sans);
  color: var(--muted);
  letter-spacing: 0.08em;
}
.edition-caret {
  font: 400 11px/1 var(--paper-sans);
  color: var(--muted);
  transform: translateY(-1px);
}
.edition-date:hover .edition-caret {
  color: var(--paper-accent);
}
.edition-side {
  display: flex;
  align-items: center;
  gap: 18px;
}
.edition-link {
  flex: none;
  white-space: nowrap;
  min-height: 32px;
  padding: 0;
  letter-spacing: 0.08em;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 5px;
  transition: text-decoration-color 0.15s;
}
.edition-link:hover {
  text-decoration-color: currentColor;
}
.edition-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 230px;
  height: 30px;
  padding: 0 4px 0 2px;
  border-bottom: 1px solid var(--rule);
  color: var(--muted);
  transition: border-color 0.15s;
}
.edition-search:focus-within {
  border-bottom-color: var(--paper-accent);
  color: var(--ink);
}
.edition-search svg {
  flex: none;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
}
.edition-search input {
  flex: 1;
  width: 0; /* grow from zero: an input's intrinsic width would otherwise push the row wider */
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  outline: none;
  background: none;
  font: 500 12.5px/1 var(--paper-sans);
  color: var(--ink);
}
.edition-search input::placeholder {
  color: var(--muted);
}
.edition-search input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
.edition-search kbd {
  flex: none;
  padding: 2px 5px;
  border: 1px solid var(--line);
  border-radius: 3px;
  font: 500 10px/1.2 var(--paper-sans);
  color: var(--muted);
  background: var(--surface);
}
.edition-search:focus-within kbd {
  visibility: hidden;
}
.search-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 60;
  width: min(520px, calc(100vw - 32px));
  max-height: min(62vh, 560px);
  overflow: auto;
  border: 1px solid var(--rule);
  background: var(--surface);
  box-shadow: 0 18px 50px rgb(0 0 0 / 0.16);
}
.search-popover[hidden] {
  display: none;
}
.search-status {
  position: sticky;
  top: 0;
  margin: 0;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  font: 600 12px/1.4 var(--paper-sans);
  letter-spacing: 0.12em;
  color: var(--muted);
}
.search-option {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 2px 12px;
  padding: 11px 16px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}
.search-option:last-child {
  border-bottom: 0;
}
.search-option[aria-selected="true"] {
  background: var(--wash);
  box-shadow: inset 3px 0 var(--paper-accent);
}
.search-date {
  grid-row: span 2;
  padding-top: 2px;
  font: 600 12px/1.4 var(--paper-sans);
  font-variant-numeric: tabular-nums;
  color: var(--paper-accent);
}
.search-option strong {
  font: 600 14.5px/1.45 var(--paper-serif);
  color: var(--ink);
}
.search-option small {
  font: 400 12px/1.6 var(--paper-sans);
  color: var(--muted);
  overflow-wrap: anywhere;
}
.search-option mark {
  background: none;
  color: var(--ink);
  font-weight: 700;
  box-shadow: inset 0 -0.45em color-mix(in srgb, var(--paper-accent) 22%, transparent);
}
.edition-theme {
  flex: none;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--muted);
  cursor: pointer;
}
.edition-theme-icon {
  font-size: 13px;
}
.edition-theme select {
  appearance: none;
  -webkit-appearance: none;
  padding: 0 14px 0 0;
  min-height: 32px;
  background: linear-gradient(45deg, transparent 50%, currentColor 50%) right 4px center / 4px 4px no-repeat,
    linear-gradient(-45deg, transparent 50%, currentColor 50%) right 0 center / 4px 4px no-repeat;
}
.edition-theme:hover {
  color: var(--ink);
}
.edition-pager :focus-visible,
.edition-side :focus-visible,
.report-highlights :focus-visible {
  outline: 2px solid var(--paper-accent);
  outline-offset: 3px;
}

.edition-filter[aria-expanded="true"],
.edition-filter.is-active {
  color: var(--paper-accent);
  text-decoration-color: currentColor;
}
.report-highlights[hidden] {
  display: none;
}

/* Highlight chips: small capsules; tier chips take their tier colour; pressed fills solid */
.report-highlights {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 12px 0 14px;
  border-bottom: 1px solid var(--line);
}
.report-highlights-label {
  margin-right: 6px;
  font: 600 12px/1 var(--paper-sans);
  letter-spacing: 0.16em;
  color: var(--muted);
}
.report-highlights button[data-label] {
  --chip: var(--ink);
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border: 1px solid color-mix(in srgb, var(--chip) 35%, transparent);
  border-radius: 999px;
  background: transparent;
  color: var(--chip);
  font: 600 12px/1 var(--paper-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.report-highlights button[data-label="T1"] { --chip: var(--tier-1); }
.report-highlights button[data-label="T2"] { --chip: var(--tier-2); }
.report-highlights button[data-label="T3"] { --chip: var(--tier-3); }
.report-highlights button[data-label="T4"] { --chip: var(--tier-4); }
.report-highlights button[data-label="NEW"],
.report-highlights button[data-label="P1"] { --chip: var(--paper-accent); }
.report-highlights button[data-label]:hover {
  border-color: var(--chip);
}
.report-highlights button[aria-pressed="true"] {
  background: var(--chip);
  border-color: var(--chip);
  color: var(--surface);
}
.report-clear {
  margin-left: 4px;
  padding: 0 4px;
  min-height: 24px;
  border: 0;
  background: none;
  font: 500 12px/1 var(--paper-sans);
  color: var(--paper-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}
.report-clear:disabled {
  visibility: hidden;
}

/* In-text controls keep their quiet outlined look */
.source-trigger,
.action-copy {
  font: 12px var(--paper-sans);
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 0;
  padding: 6px 9px;
  min-height: 32px;
  cursor: pointer;
}
.report-match {
  box-shadow: -3px 0 var(--paper-accent);
  background: var(--wash);
  outline-offset: 8px;
}
.reader-outline {
  position: absolute;
  right: 0;
  width: 190px;
  padding: 12px;
  border-block: 1px solid var(--line);
  font: 12px var(--paper-sans);
  color: var(--muted);
}
.reader-stage {
  position: relative;
}
.reader-outline summary {
  cursor: pointer;
  font-weight: 600;
  line-height: 1.6;
}
.reader-outline nav {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  max-height: 65vh;
  overflow: auto;
}
.reader-outline a {
  color: var(--muted);
  text-decoration: none;
  line-height: 1.5;
  padding: 3px;
}
.reader-outline a[aria-current] {
  color: var(--paper-accent);
  border-left: 2px solid currentColor;
}
@media (min-width: 1250px) {
  /* The stage is far wider than the 38-character text column, so the outline floats at the
     stage's own right edge; a negative margin pushed it off-screen (up to 250px of overflow). */
  .reader-outline {
    position: sticky;
    top: calc(var(--topbar-h, 44px) + 20px);
    float: right;
    margin-right: 0;
    z-index: 2;
  }
}
@media (max-width: 1249px) {
  .reader-outline {
    position: relative;
    width: auto;
    max-width: 720px;
    margin: 0 auto 24px;
    float: none;
  }
  .reader-outline nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Full edition: about 38 CJK characters per line at 17px */
.brief-content.full-edition {
  max-width: calc(17px * 38);
}
.full-edition-divider {
  margin-top: 60px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.full-edition p,
.full-edition li {
  line-height: 1.95;
}
/* Sections open with more space than the stories inside them; anchors clear the real top bar. */
.full-edition > h2 {
  margin: 56px 0 16px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  scroll-margin-top: calc(var(--topbar-h, 44px) + 16px);
}
.full-edition > h3 {
  margin: 32px 0 12px;
  scroll-margin-top: calc(var(--topbar-h, 44px) + 16px);
}
.paper-heading-marks {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 6px;
}
.paper-heading-marks .paper-triage {
  margin-left: 0;
}
/* The source list is reference material: smaller, tighter, with a hanging indent. */
.full-edition li.source-entry {
  margin: 6px 0;
  padding-left: 0.2em;
  font-size: 14px;
  line-height: 1.6;
}
.full-edition li.source-entry a {
  overflow-wrap: anywhere;
}
/* Editor's judgment: the sans voice of the UI, distinct from the serif reporting. */
.full-edition blockquote.judgment {
  font: 400 16px/1.75 var(--paper-sans);
}
.app-shell .reading-progress,
.app-shell.is-reading-mode .reading-progress {
  top: var(--topbar-h, 44px);
}
.source-trigger {
  font-size: 12px;
  min-height: 26px;
  padding: 3px 5px;
  margin-left: 4px;
  color: var(--muted);
}
.source-preview {
  position: fixed;
  inset: auto;
  top: 18vh;
  left: 50%;
  transform: translateX(-50%);
  width: min(440px, calc(100vw - 32px));
  max-height: 70vh;
  overflow: auto;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--rule);
  padding: 20px;
  box-shadow: 0 12px 40px #0003;
  font: 14px/1.6 var(--paper-sans);
  z-index: 60;
}
.source-preview p {
  color: var(--muted);
  margin: 8px 0;
}
.source-preview a {
  color: var(--ink);
}
.source-preview button {
  display: block;
  margin-top: 16px;
}
.watch-context {
  display: block;
  margin-top: 6px;
  font: 12px var(--paper-sans);
  color: var(--muted);
}
.action-copy {
  display: block;
  margin-top: 12px;
}
.numeric-emphasis {
  font-variant-numeric: tabular-nums;
  text-decoration: underline;
  text-decoration-color: var(--paper-accent);
  text-underline-offset: 4px;
}
.chart-trend-secondary {
  fill: #75869a;
}
.paper-trend a:hover rect,
.paper-trend a:focus rect {
  stroke: var(--ink);
  stroke-width: 1;
}
.paper-tier,
.paper-triage,
.paper-triage[data-label="new"],
.paper-triage[data-label^="p"] {
  color: var(--muted);
  border-color: var(--line);
}
.paper-triage[data-label="p1"] {
  color: var(--paper-accent);
  border-color: currentColor;
}
.paper-illustration img {
  filter: none;
  border: 1px solid var(--line);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e5dccb;
  --muted: #b7ac98;
  --faint: #ab9f8b;
  --line: #544b3e;
  --rule: #c7baa4;
  --surface: #211f1a;
  --wash: #2d2a23;
  --paper-accent: #df9c80;
  --tier-1: #96b19b;
  --tier-2: #94a8be;
  --tier-3: #a79d8a;
  --tier-4: #b1a087;
}
[data-theme="dark"] .sidebar {
  background: var(--wash);
  border-color: var(--line);
}
[data-theme="dark"] .full-edition blockquote.judgment,
[data-theme="dark"] .full-edition pre,
[data-theme="dark"] .newspaper-frontpage code {
  background: var(--wash);
}
[data-theme="dark"] .paper-box {
  border-color: var(--line);
}
[data-theme="dark"] .quiet-button,
[data-theme="dark"] .primary-button,
[data-theme="dark"] .icon-button {
  border-color: var(--line);
}
[data-theme="dark"] .source-entry,
[data-theme="dark"] .citation {
  background: transparent;
  color: var(--muted);
}
@media (max-width: 900px) {
  .full-edition > h2 {
    font-size: 24px;
    margin-top: 44px;
  }
  .full-edition > h3 {
    font-size: 20px;
    margin-top: 28px;
  }
  .topbar.has-edition-tools {
    flex-wrap: wrap;
    height: auto;
    min-height: 44px;
    gap: 0 10px;
    padding-block: 2px 6px;
  }
  .has-edition-tools .topbar-leading {
    gap: 4px;
    min-height: 44px;
  }
  .edition-pager > * + * {
    border-left: 0;
  }
  .edition-step span:not(.edition-arrow) {
    display: none;
  }
  .edition-step,
  .edition-date {
    min-height: 44px;
    padding: 0 8px;
  }
  .edition-side {
    order: 3;
    flex: 1 1 100%;
    gap: 14px;
    margin-left: 0;
  }
  .edition-side {
    min-width: 0;
  }
  .edition-search {
    flex: 1;
    width: auto;
    min-width: 0;
    height: 38px;
  }
  .edition-search input {
    font-size: 16px;
  }
  .edition-search kbd {
    display: none;
  }
  .search-popover {
    position: fixed;
    left: 16px;
    right: 16px;
    width: auto;
    max-height: 60vh;
  }
  .edition-link,
  .edition-theme select {
    min-height: 44px;
  }
  .reader-outline nav {
    grid-template-columns: 1fr;
  }
  .source-trigger {
    min-height: 32px;
  }
  .report-highlights button[data-label] {
    height: 30px;
  }
}
@media print {
  :root[data-theme] {
    --surface: #fff;
    --wash: #fff;
    --ink: #000;
    --muted: #333;
    --line: #bbb;
    --rule: #000;
    color-scheme: light;
  }
  .edition-side,
  .search-popover,
  .report-highlights,
  .reader-outline,
  .source-trigger,
  .source-preview,
  .action-copy {
    display: none !important;
  }
  .report-match {
    box-shadow: none;
    background: none;
  }
  .brief-content.full-edition {
    max-width: none;
  }
  .full-edition p,
  .full-edition li {
    line-height: 1.6;
  }
}
.action-scenario {
  display: inline-block;
  margin-top: 8px;
  color: var(--muted);
  font: 12px var(--paper-sans);
  border-bottom: 1px solid var(--line);
}
@media print {
  .action-scenario {
    display: none;
  }
}

/* Fallback panel when the Popover API is unavailable */
.source-preview[hidden]{display:none}

/* A manual theme overrides OS-scheme rules elsewhere (share dialog, judgment accent) */
:root[data-theme="light"]{--judgment:#7a4fd6}
:root[data-theme="dark"]{--judgment:#b69cff}
[data-theme="light"] .share-dialog{--share-bg:#fff;--share-soft:#f7f7f7;--share-line:#e7e7e7;--share-ink:#171717;--share-muted:#626262}
[data-theme="dark"] .share-dialog{--share-bg:#171717;--share-soft:#202020;--share-line:#363636;--share-ink:#eee;--share-muted:#b0b0b0}
/* Matching is explicit in the front page and original text; all reports stay visible. */
/* Pressed chips are filled (above) and also carry a check, so the state never relies on colour alone. */
.report-highlights button[data-label][aria-pressed="true"]::before {
  content: "✓";
  margin-right: 4px;
  font-weight: 700;
}
.report-results {
  flex-basis: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 18px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}
.report-results[hidden] {
  display: none;
}
.report-results a {
  color: var(--ink);
  font: 13px/1.5 var(--paper-serif);
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}
.report-front-match {
  outline: 2px solid var(--rule);
  outline-offset: 7px;
  background: var(--wash);
}
.report-match-label {
  display: block;
  width: max-content;
  margin: 0 0 9px;
  padding: 3px 6px;
  border: 1px solid var(--rule);
  color: var(--ink);
  background: var(--surface);
  font: 600 12px/1.4 var(--paper-sans);
  letter-spacing: 0.04em;
}
.full-edition .report-match-label {
  margin-top: 8px;
}
.report-match {
  box-shadow: -4px 0 var(--rule);
}
@media (max-width: 900px) {
  .report-results {
    grid-template-columns: 1fr;
  }
  .report-front-match {
    outline-offset: 4px;
  }
}
@media print {
  .report-match-label {
    display: none !important;
  }
  .report-front-match {
    outline: none;
    background: none;
  }
}

@media screen {
  .full-edition > h1,
  .full-edition > p.edition-cutoff {
    display: none;
  }
}

/* The citation link already previews on hover; its keyboard twin stays out of sight until focused. */
.source-trigger:not(:focus-visible) {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.source-trigger:focus-visible {
  min-height: 0;
  margin-left: 4px;
  padding: 1px 6px;
  font-size: 12px;
}
/* Touch users need a discoverable preview action; the adjacent S link still opens the source. */
@media (hover: none), (pointer: coarse) {
  .source-trigger:not(:focus-visible) { position:static;width:auto;height:auto;overflow:visible;clip:auto;clip-path:none;white-space:normal;padding:6px 8px;margin-left:4px; }
  .source-trigger { min-width:44px;min-height:44px; }
}

/* Legend for triage marks (the brief no longer defines them in every issue). */
.report-legend {
  flex-basis: 100%;
  margin: 4px 0 0;
  font: 400 12px/1.6 var(--paper-sans);
  color: var(--muted);
}