/*
 * Standalone brief pages also load styles.css (app shell), which locks:
 *   html, body { height: 100%; } and body { overflow: hidden; }
 * brief.css is only linked from brief routes, so reset document scroll
 * unconditionally — including older D1-stored HTML that lacks brief-html /
 * brief-body classes (those were added in v1.4.89 but never backfilled).
 */
html,
body {
  height: auto !important;
  min-height: 100vh;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto;
}

.brief-page .brief-article {
  display: grid;
  gap: 22px;
}

.brief-hero h1 {
  margin: 0.35rem 0 0.75rem;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.15;
}

.brief-lead {
  font-size: 1.08rem;
  color: var(--text);
  max-width: 72ch;
}

.brief-meta {
  color: var(--muted);
  font-size: 0.92rem;
}

.brief-glance {
  margin: 14px 0 0;
  padding: 12px 14px 12px 1.4rem;
  list-style: disc;
  border: 1px solid var(--border-soft, rgba(140, 133, 173, 0.18));
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--text);
}

.brief-glance li + li {
  margin-top: 6px;
}

.brief-glance strong {
  color: var(--cyan, #40faec);
}

.brief-section h2 {
  margin: 0 0 14px;
  font-size: 1.15rem;
}

.brief-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.brief-table th,
.brief-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
  word-break: break-word;
}

.brief-table th {
  color: var(--muted);
  font-weight: 600;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.brief-up { color: var(--up); }
.brief-down { color: var(--down); }

.brief-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.brief-list {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--text);
}

.brief-list li {
  margin-bottom: 0.45rem;
}

.brief-sector-chart {
  inline-size: 100%;
  max-inline-size: none;
  block-size: auto;
  margin-block-start: 8px;
  background: rgba(255, 255, 255, 0.02);
  border-radius: var(--r-md);
  border: 1px solid var(--border-soft);
}

.brief-sources p {
  margin: 0 0 0.65rem;
  color: var(--muted);
  font-size: 0.92rem;
}

.brief-disclaimer {
  font-size: 0.85rem !important;
}

.brief-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 8px;
}

.brief-powered {
  color: var(--muted);
  font-size: 0.9rem;
}

.brief-powered strong {
  color: var(--cyan);
}

.brief-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  margin-top: 8px;
}

.brief-sector-chart--horizontal {
  max-inline-size: 100%;
  min-block-size: 0;
}

.brief-sector-chart-wrap {
  container: brief-sector / inline-size;
  margin-block-start: 12px;
}

.brief-sector-chart__caption {
  margin: 0 0 6px;
  font-size: 0.82rem;
  color: var(--muted);
}

.brief-sector-chart--grid {
  display: grid;
  gap: 8px;
  padding: 12px 14px 14px;
}

.brief-sector-row {
  display: grid;
  grid-template-columns: minmax(8rem, 1.4fr) minmax(7.5rem, 2.2fr) 5.2rem 4.8rem;
  grid-template-areas: "name track chg adv";
  gap: 10px 12px;
  align-items: center;
  min-block-size: 28px;
}

.brief-sector-row > * {
  min-inline-size: 0;
}

.brief-sector-row--head {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  min-block-size: 0;
}

.brief-sector-row--head > :nth-child(1) { grid-area: name; }
.brief-sector-row--head > :nth-child(2) { grid-area: track; }
.brief-sector-row--head > :nth-child(3) { grid-area: chg; }
.brief-sector-row--head > :nth-child(4) { grid-area: adv; }

.brief-sector-row__name {
  grid-area: name;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  white-space: normal;
  line-height: 1.25;
  font-size: 0.88rem;
}

.brief-sector-row__track {
  grid-area: track;
  position: relative;
  block-size: 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  overflow: clip;
}

.brief-sector-row__zero {
  position: absolute;
  inset-inline-start: 50%;
  inset-block: 0;
  inline-size: 1px;
  background: rgba(255, 255, 255, 0.22);
}

.brief-sector-row__bar {
  position: absolute;
  inset-block-start: 2px;
  block-size: 8px;
  border-radius: 999px;
  max-inline-size: 48%;
}

.brief-sector-row__bar--up {
  inset-inline-start: 50%;
  background: var(--up, #33ffb8);
}

.brief-sector-row__bar--down {
  inset-inline-end: 50%;
  background: var(--down, #ff4773);
}

.brief-sector-row__chg {
  grid-area: chg;
}

.brief-sector-row__adv {
  grid-area: adv;
  color: var(--muted);
}

.brief-sector-row__chg,
.brief-sector-row__adv {
  font-variant-numeric: tabular-nums;
  font-size: 0.82rem;
  white-space: nowrap;
  text-align: end;
}

.brief-time-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: safe center;
  gap: 8px;
  margin: 14px 0 4px;
}

.brief-time-nav .is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

.brief-time-nav__jump {
  flex: 1 1 12rem;
  min-inline-size: 10rem;
}

.brief-time-nav__select {
  inline-size: 100%;
  min-block-size: 36px;
  border-radius: 8px;
  border: 1px solid var(--border-soft, rgba(140, 133, 173, 0.22));
  background: rgba(255, 255, 255, 0.04);
  color: inherit;
  font: inherit;
  padding: 6px 10px;
  color-scheme: dark;
}

.brief-time-nav__archive {
  margin-inline-start: auto;
  font-size: 0.82rem;
  color: var(--cyan, #40faec);
  text-decoration: none;
}

.brief-time-nav__archive:hover {
  text-decoration: underline;
}

.brief-news-cell {
  max-inline-size: 28rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.brief-archive-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.brief-archive-list a {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
}

.brief-archive-list a:hover {
  border-color: rgba(64, 250, 236, 0.35);
}

.brief-archive-list span {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.visually-hidden {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.brief-vs-yesterday__empty,
.brief-vs-yesterday__none {
  color: var(--muted);
  font-size: 0.92rem;
}

.brief-embed__code {
  margin: 10px 0;
  padding: 12px 14px;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  font-size: 0.78rem;
  overflow-x: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--muted);
}

.brief-embed__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-block-start: 10px;
}

.brief-news-list {
  margin: 0;
  padding-inline-start: 1.1rem;
  color: var(--text);
}

.brief-news-list li {
  margin-block-end: 0.65rem;
  line-height: 1.45;
}

.brief-news-list time {
  color: var(--muted);
  font-size: 0.88rem;
}

.brief-news-list a,
.brief-table a {
  color: var(--cyan);
  text-decoration: none;
}

.brief-news-list a:hover,
.brief-table a:hover {
  text-decoration: underline;
}

.brief-table small {
  color: var(--muted);
  font-size: 0.82rem;
}

@container brief-sector (inline-size < 640px) {
  .brief-sector-row,
  .brief-sector-row--head {
    grid-template-columns: minmax(0, 1fr) max-content max-content;
    grid-template-areas:
      "name chg adv"
      "track track track";
    gap: 6px 10px;
  }

  .brief-sector-row--head {
    display: none;
  }

  .brief-sector-row__name {
    font-size: 0.82rem;
  }
}

@media (max-width: 720px) {
  .brief-table:not(.brief-table--stack) {
    display: block;
    overflow-x: auto;
  }

  .brief-table--stack {
    display: block;
    overflow-x: visible;
  }

  .brief-table--stack thead {
    display: none;
  }

  .brief-table--stack tbody,
  .brief-table--stack tr,
  .brief-table--stack td {
    display: block;
    inline-size: 100%;
  }

  .brief-table--stack tr {
    padding: 12px 0;
    border-block-end: 1px solid var(--border-soft);
  }

  .brief-table--stack td {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr);
    gap: 8px;
    padding: 4px 0;
    border: 0;
  }

  .brief-table--stack td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .brief-time-nav {
    flex-direction: column;
    align-items: stretch;
  }

  .brief-time-nav__archive {
    margin-inline-start: 0;
  }
}