/* NatGas Central · ngc-dashboard.css (workstream D): the members' Daily Reports page (/dailyreports/, page key "dashboard") and the
   report proxy's empty-state pages (/view-report/ with no file, page key "report").
   Port of the approved prototype's proto/css/pages/dashboard.css (round 5, 2 Oct 2026), class names unchanged (prefix db-), with the
   real-site translations of BUILD_SPEC §1.15: one server-rendered page for every width, so
     - the hub is one CSS grid whose areas place the latest card, the EIA and degree-day cards, the phone lines, the archive and the ONE
       Discord card (#discord): desktop = side column (EIA, degree days, Discord) beside the latest card; tablet = the two cards side by
       side under it, Discord after the archive; phones = the compact lines, the archive, Discord;
     - the archive is one table (desktop: 6 columns; tablet: the publish time under the date, the PDF icon button) plus the phone list;
     - the prototype-only pieces (the dashed "Prototype only" notes, the new-code markers, the US Letter proposal under the PDF files)
       are gone.
   The report bar and footer of the empty-state pages are the generated report's (B2's report.css rp-bar / rp-foot rules, copied for
   these PHP pages only, under .rp--empty). Tokens only: no hard-coded colours. */

.db { position: relative; }

/* ---------- head + plan line (only when the member has to act) ---------- */
.db-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px 32px; margin-bottom: 24px; }
.db-head__plan { padding-bottom: 6px; }
.db-notice { margin-bottom: 24px; }

.db-u { margin-left: 4px; font-size: 12px; font-weight: 400; color: var(--t3); letter-spacing: 0; }
.db-sub { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; line-height: 1.3; color: var(--t3); white-space: nowrap; }

/* a run of facts separated by '·' that never leaves the dot at either end of a line (dots() in inc/ngc-reports.php) */
.db-dots { display: block; min-width: 0; clip-path: inset(-24px -24px -24px -2px); }
.db-dots__in { display: flex; flex-wrap: wrap; align-items: baseline; margin-left: -16px; }
.db-dots__f { position: relative; min-width: 0; padding-left: 16px; }
.db-dots__f::before { content: "\00B7"; position: absolute; top: 0; left: 6px; font-weight: 400; color: var(--t3); }
.db-dots--end { clip-path: inset(-24px -2px -24px -24px); }
.db-dots--end .db-dots__in { justify-content: flex-end; margin-left: 0; margin-right: -16px; }
.db-dots--end .db-dots__f { padding-left: 0; padding-right: 16px; }
.db-dots--end .db-dots__f::before { content: none; }
.db-dots--end .db-dots__f:not(:last-child)::after { content: "\00B7"; position: absolute; top: 0; right: 6px; font-weight: 400; color: var(--t3); }

/* ---------- the hub: one grid for every width (BUILD_SPEC §1.15) ---------- */
.db-hub { display: grid; gap: 24px; align-items: start;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  grid-template-rows: auto auto auto 1fr auto;
  grid-template-areas: "main eia" "main dd" "main discord" "main ." "arch arch"; }
.db-hub__main { grid-area: main; min-width: 0; }
.db-hub > .db-eia { grid-area: eia; min-width: 0; }
.db-hub > .db-dd { grid-area: dd; min-width: 0; }
.db-hub > .db-lines { grid-area: lines; min-width: 0; }
.db-hub > .db-arch { grid-area: arch; min-width: 0; }
.db-hub > .db-discord { grid-area: discord; min-width: 0; }

/* ---------- latest report card ---------- */
.db-latest__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 20px; padding: 18px 22px; border-bottom: 1px solid var(--hair); }
.db-latest__id { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; min-width: 0; }
.db-latest__date { font-size: 21px; font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.db-latest__pub { font-size: 14px; color: var(--t3); font-variant-numeric: tabular-nums; }
.db-latest__act { display: flex; align-items: center; gap: 10px; }
/* the buttons, and under them the quiet "How to read a report" link, right-aligned beside the date */
.db-latest__acts { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.db-latest__head { container: db-head / inline-size; }
@media (min-width: 700px) {
  @container db-head (max-width: 759px) {
    .db-latest__acts { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 18px; }
  }
}
/* the Read report arrow is the phone button's (the prototype's touch button) */
.db-latest__read > svg { display: none; }
.db-howread { gap: 6px; min-height: 28px; font-size: 13px; font-weight: 500; color: var(--t2); }
.db-howread svg { color: var(--t3); }
.db-howread:hover { color: var(--accent-hover); }
.db-howread:hover svg { color: currentColor; }
.db-latest__sec { padding: 20px 22px 22px; border-top: 1px solid var(--hair); min-width: 0; }
.db-latest__head + .db-latest__sec { border-top: 0; }
.db-latest__sec > .n-overline { margin-bottom: 10px; }
/* the outlook: the summary, then the calls (phones: the calls first, then the summary under its own heading; one instance each) */
.db-latest__out { display: flex; flex-direction: column; min-width: 0; }
.db-latest__sumbox { order: 1; }
.db-latest__out > .db-latest__ow { order: 2; }
.db-latest__sum { margin: 0 0 16px; max-width: 72ch; font-family: var(--serif); font-size: 16px; line-height: 1.6; color: var(--reading); text-wrap: pretty; }
.db--pw .db-latest__sum { font-family: var(--sans); font-size: 14px; color: var(--t3); }
.db-latest__sec--calls .n-calls__row { min-height: 56px; }
/* the outlook widget sizes itself by this block's width (container query inside core's .n-ow), so it must be a plain block */
.db-latest__ow { display: block; min-width: 0; }
/* the reports list carries no figures for this report (a v1-shaped index): one quiet true line in place of the calls */
.db-latest__nov2 { order: 2; margin: 0; max-width: 72ch; font-size: 14px; line-height: 1.55; color: var(--t2); }

/* Outlook widget in the Latest card: the card's own width bands. Meter: core's four columns need 774 px, so between 700 and 780 they
   are tightened (gaps 20, minimums 660 px) instead of running the change column past the card. */
@container n-ow (width > 700px) and (width < 780px) {
  .db-latest__ow .n-owm__head, .db-latest__ow .n-owm__row { grid-template-columns: minmax(140px, 1.05fr) minmax(180px, 2fr) minmax(130px, 1fr) minmax(150px, 1.2fr); column-gap: 20px; }
}
.db-latest__ow .n-owc__svg--wide { max-width: 720px; }
@container n-ow (max-width: 639px) {
  .db-latest__ow .n-owc__svg--wide { display: none; }
  .db-latest__ow .n-owc__svg--narrow { display: block; max-width: 440px; }
}
@container n-ow (width >= 700px) and (width < 940px) {
  .db-latest__ow .n-owc__wrap { grid-template-columns: minmax(0, 440px) minmax(240px, 1fr); column-gap: 32px; }
  .db-latest__ow .n-owc__list { margin-top: 0; }
  .db-latest__ow .n-owc__svg--wide { display: none; }
  .db-latest__ow .n-owc__svg--narrow { display: block; }
}
@container n-ow (max-width: 440px) {
  .db-latest__ow .n-owc__svg--narrow .n-owc-ax, .db-latest__ow .n-owc__svg--narrow .n-owc-xp { font-size: 12.5px; }
}
/* nothing moved since the last report: the dotted line lies under today's, so the legend doesn't offer it */
.db-latest__ow--still .n-owc__legend > span + span { display: none; }
/* the change line: "More bearish +15" then "· was 47, a lean" as one unbreakable piece (db-chg__tail). Where the change sits in a
   narrow column (Meter's four columns, Dial, the table from 700 px) the tail is its own line, without the dot. */
.db-latest__ow .n-owd__txt .db-chg__tail, .db-latest__ow .n-calls__chg .db-chg__tail { display: block; }
.db-latest__ow .n-owd__txt .db-chg__sep, .db-latest__ow .n-calls__chg .db-chg__sep { display: none; }
@container n-ow (width > 700px) {
  .db-latest__ow .n-owm__chg .db-chg__tail { display: block; }
  .db-latest__ow .n-owm__chg .db-chg__sep { display: none; }
}
@media (max-width: 699px) {
  .db-latest__ow .n-calls__chg .db-chg__tail { display: inline; }
  .db-latest__ow .n-calls__chg .db-chg__sep { display: inline; }
}
.db-latest__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 10px 22px; border-top: 1px solid var(--hair); font-size: 14px; }
.db-latest__jumps { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 10px; min-width: 0; }
.db-latest__jumps > .n-t3 { margin-right: 2px; }
.db-jump { display: inline-flex; align-items: center; min-height: 36px; font-weight: 500; color: var(--accent); }
.db-jump:hover { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 3px; }
.db-jump__sep { color: var(--t3); }

/* key figures: a hairline grid */
.db-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; background: var(--hair-soft); border: 1px solid var(--hair-soft); border-radius: var(--r-sm); overflow: hidden; }
.db-fig { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 12px 14px 13px; background: var(--surface); }
.db-fig__k { font-size: 12px; line-height: 1.35; color: var(--t3); }
.db-fig__v { font-size: 21px; font-weight: 500; line-height: 1.2; color: var(--t1); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.db-fig__s { font-size: 12px; line-height: 1.4; color: var(--t2); font-variant-numeric: tabular-nums; }
.db-fig__s .n-c { font-weight: 500; }
.db-fig__b { color: var(--t3); }
.db-figs__legend { margin-top: 10px; }
.db-fig__k .db-dots__f::before { color: var(--t3); }
.db-figs__fn { margin-top: 10px; max-width: 88ch; font-size: 13px; line-height: 1.5; color: var(--t2); }
.db-figs__fn strong { font-weight: 600; color: var(--t1); }
.db-roll { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 12px 14px; background: var(--raised); border: 1px solid var(--hair); border-radius: var(--r-sm); font-size: 14px; line-height: 1.55; color: var(--t2); }
.db-roll svg { flex: none; margin-top: 3px; color: var(--t2); }
.db-roll strong { color: var(--t1); font-weight: 600; }

/* ---------- side cards (EIA, degree days) ---------- */
.db-card__head { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 20px; border-bottom: 1px solid var(--hair); }
.db-card__head svg { color: var(--t2); }
.db-card__title { font-size: 16px; font-weight: 600; line-height: 1.3; }
.db-card__body { display: flex; flex-direction: column; gap: 12px; padding: 18px 20px 20px; min-width: 0; }
.db-card__foot { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 20px 14px; border-top: 1px solid var(--hair); font-size: 13px; line-height: 1.5; color: var(--t3); }
.db-card__foot .n-link { min-height: 32px; font-size: 14px; }

.db-eia__when { font-size: 16px; line-height: 1.35; }
.db-eia__k { font-weight: 500; color: var(--t2); }
.db-eia__t { font-weight: 600; color: var(--t1); font-variant-numeric: tabular-nums; }
.db-eia__in { align-self: center; padding: 1px 7px; border-radius: var(--r-xs); background: var(--accent-quiet); color: var(--accent); font-size: 12px; font-weight: 500; }
.db-eia__wk { margin-top: -8px; font-size: 13px; color: var(--t3); font-variant-numeric: tabular-nums; }
.db-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin: 2px 0 0; border-top: 1px solid var(--hair-soft); border-bottom: 1px solid var(--hair-soft); }
.db-pair__c { display: flex; flex-direction: column; gap: 2px; padding: 12px 0 13px; min-width: 0; }
.db-pair__c + .db-pair__c { padding-left: 16px; border-left: 1px solid var(--hair-soft); }
.db-pair__k { font-size: 13px; color: var(--t2); }
.db-pair__v { font-size: 30px; font-weight: 500; line-height: 1.15; color: var(--t1); font-variant-numeric: tabular-nums; letter-spacing: -0.015em; }
.db-pair__v .db-u { font-size: 13px; }
.db-eia__soon { display: block; padding-top: 4px; font-size: 13px; font-weight: 400; line-height: 1.45; color: var(--t2); letter-spacing: 0; }
.db-eia__line { font-size: 13px; line-height: 1.55; color: var(--t2); }
.db-eia__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; font-size: 13px; line-height: 1.45; color: var(--t2); }
.db-eia__rv { color: var(--t1); font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.db-eia__rk { min-width: 0; }
.db-eia__rs { grid-column: 1 / -1; text-align: right; font-size: 12px; color: var(--t3); font-variant-numeric: tabular-nums; }
.db-eia__tr { color: var(--t3); }

.db-dd__win { margin-top: -4px; font-size: 13px; line-height: 1.5; color: var(--t2); }
.db-dd__unit { margin-top: -8px; font-size: 13px; line-height: 1.5; color: var(--t2); }
.db-dd__kv .n-kv__k { flex: none; white-space: nowrap; }
.db-dd__kv .n-kv__v { font-weight: 600; }
.db-dd__kv .n-kv__sub { font-weight: 400; }
.db-dd__kv .n-kv__sub > span { display: block; }
.db-dd__kv .n-kv__sub > span:first-child { color: var(--t2); }
.db-dd__key { margin-top: -4px; font-size: 12px; line-height: 1.5; color: var(--t3); }
.db-dd__status { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.5; color: var(--t2); }
.db-dd__status svg { flex: none; margin-top: 2px; color: var(--t3); }
.db-dd__status strong { color: var(--t1); font-weight: 600; }
.db-dd__status--late svg { color: var(--warn); }
.db-dd__runs { border-top: 1px solid var(--hair-soft); }
.db-dd__runs > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; font-size: 13px; font-weight: 500; color: var(--t2); cursor: pointer; list-style: none; }
.db-dd__runs > summary::-webkit-details-marker { display: none; }
.db-dd__runs > summary:hover { color: var(--accent); }
.db-dd__runs > summary .n-acc__chev { transition: transform .15s; }
.db-dd__runs[open] > summary .n-acc__chev { transform: rotate(180deg); }
.db-dd__list { list-style: none; margin: 0 0 4px; padding: 0; }
.db-dd__list li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--hair-soft); font-size: 13px; color: var(--t2); }
.db-dd__list li:last-child { border-bottom: 0; }
.db-dd__list li > span:first-child { color: var(--t1); white-space: nowrap; }
.db-dd__list li > span:last-child { text-align: right; }
.db-dd__late > span:last-child { color: var(--warn); }

/* ---------- phone: EIA + degree days as two compact rows ---------- */
.db-lines { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r); min-width: 0; }
.db-line { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 14px 14px 14px 16px; color: var(--t2); font-size: 14px; line-height: 1.45; font-variant-numeric: tabular-nums; }
.db-line + .db-line { border-top: 1px solid var(--hair); }
.db-line:hover { color: var(--t2); background: var(--raised); }
.db-line > svg:first-child { margin-top: 1px; color: var(--t2); }
.db-line > svg:last-child { align-self: center; color: var(--t3); }
.db-line__txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.db-line__1 { color: var(--t1); }
.db-line strong { font-weight: 600; }
.db-line strong:not(.n-c) { color: var(--t1); }
.db-line__3 { font-size: 12px; color: var(--t3); }
.db-line__late { color: var(--warn); }
.db-line__vs { display: block; margin-top: 3px; font-size: 13px; line-height: 1.5; color: var(--t2); }
.db-line__1 .db-line__vs { margin-top: 4px; }
.db-line__vs--lead { font-size: 14px; color: var(--t1); }
.db-line__dd + .db-line__dd { margin-top: -1px; }
.db-line .db-line__vs strong { font-weight: 600; }

/* ---------- archive ---------- */
.db-arch { margin-top: 32px; }
#db-arch-t { scroll-margin-top: 16px; }
.db-arch__head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; margin-bottom: 14px; }
.db-arch__legend { margin: -4px 0 10px; }
.db-tapewrap { background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r); }
.db-tape thead th { height: 44px; padding-top: 6px; padding-bottom: 6px; vertical-align: bottom; }
.db-tape thead .n-sub { display: block; font-size: 11px; font-weight: 400; color: var(--t3); }
.db-th-h { display: block; font-size: 11px; font-weight: 400; color: var(--t3); letter-spacing: 0.01em; }
.db-th-key { display: block; margin-top: 3px; font-size: 11px; font-weight: 400; color: var(--t3); letter-spacing: 0.01em; }
.db-ckey { display: inline; }
.db-ckey__i { display: inline-flex; align-items: center; gap: 4px; margin-right: 6px; white-space: nowrap; }
.db-ckey__i:nth-child(3) { margin-right: 0; }
.db-ckey__i .n-glyph { flex: none; }
.db-ckey__n { white-space: nowrap; }
.db-tape tbody th, .db-tape tbody td { height: 52px; padding-top: 6px; padding-bottom: 6px; line-height: 1.35; }
.db-tape tr.n-table__group th { height: 32px; padding-top: 0; padding-bottom: 0; }
.db-tape tbody tr:last-child th, .db-tape tbody tr:last-child td { border-bottom: 0; }
.db-date { color: var(--t1); font-weight: 600; }
a.db-date:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.db-tape th .n-chip, .db-mrow__date .n-chip { margin-left: 6px; vertical-align: 1px; }
.db-front { font-variant-numeric: tabular-nums; }
.db-calls { display: inline-flex; align-items: center; gap: 14px; font-variant-numeric: tabular-nums; color: var(--t1); }
.db-calls__c { display: inline-flex; align-items: center; gap: 6px; min-width: 34px; }
.db-calls--none { color: var(--t3); }
.db-acts { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; }
.db-gap th, .db-gap td { color: var(--t3); }
.db-gap th { font-weight: 500; }
.db-gap__t { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--t2); white-space: normal; }
.db-gap__t svg { flex: none; color: var(--t3); }
.db-date__pub { color: var(--t2); font-weight: 400; }
.db-date__pub .db-sub { display: inline; margin-left: 6px; }
/* desktop: six fixed columns (the "Calls" header on one line, the key under it) */
@media (min-width: 1100px) {
  .db-tape { min-width: 900px; table-layout: fixed; }
  .db-tape .db-c-date { width: 17%; }
  .db-tape .db-c-pub { width: 12%; }
  .db-tape .db-c-front { width: 16%; }
  .db-tape .db-c-stor { width: 14%; }
  .db-tape .db-c-calls { width: 22%; }
  .db-tape .db-c-act { width: 18%; }
  .db-tape .db-col-calls { padding-left: 36px; }
  .db-tape .db-col-calls .db-th-h { display: inline; margin-left: 8px; }
}
/* tablet: five columns, the publish time under the date, the PDF icon button (the date is the way in) */
@media (max-width: 1099px) {
  .db-tape { min-width: 600px; table-layout: auto; }
  .db-tape .db-date { color: var(--accent); }
  .db-tape .db-acts .n-iconbtn { width: 40px; height: 40px; }
  .db-tape .db-col-calls { padding-left: 14px; }
  .db-tape thead th { white-space: normal; }
  .db-tape th, .db-tape td { padding-left: 10px; padding-right: 10px; }
  .db-tape .db-calls { gap: 10px; }
  .db-tape .db-acts { gap: 6px; }
  .db-tape .db-sub { white-space: normal; }
}
.db-arch__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; margin-top: 16px; }
.db-arch__note { display: flex; align-items: flex-start; gap: 8px; margin-left: auto; font-size: 13px; line-height: 1.5; color: var(--t3); max-width: 640px; }
.db-arch__note svg { flex: none; margin-top: 2px; }
/* "Show all 30": the older rows are in the page, hidden until asked for (ngc-dashboard.js) */
.db-arch [hidden].db-x { display: none !important; }

/* phone list */
.db-mkey { margin-bottom: 8px; font-size: 12px; line-height: 1.45; color: var(--t3); }
.db-mkey__calls { display: block; margin-top: 3px; }
.db-mlist { list-style: none; margin: 0; padding: 0; background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r); overflow: hidden; }
.db-mrow__group { padding: 7px 14px; background: var(--raised); border-bottom: 1px solid var(--hair-soft); font-size: 12px; font-weight: 500; color: var(--t2); }
.db-mrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px; padding-right: 8px; border-bottom: 1px solid var(--hair-soft); }
.db-mlist > li:last-child { border-bottom: 0; }
.db-mrow__main { display: flex; flex-direction: column; gap: 6px; width: 100%; min-width: 0; min-height: 64px; padding: 11px 4px 11px 14px; background: transparent; border: 0; text-align: left; color: var(--t2); font-size: 13px; }
.db-mrow__main:hover { color: var(--t2); background: var(--raised); }
.db-mrow__l1 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.db-mrow__date { display: inline-flex; align-items: center; font-size: 15px; font-weight: 600; color: var(--t1); }
.db-mrow__pub { font-size: 13px; color: var(--t2); text-align: right; font-variant-numeric: tabular-nums; }
.db-mrow__pub .db-sub { display: inline; margin-left: 6px; }
.db-mrow__l2 { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 14px; font-variant-numeric: tabular-nums; }
.db-mrow__fig { color: var(--t1); }
.db-mrow__fig .db-sub { display: inline; margin-left: 6px; }
.db-mrow .db-calls { gap: 10px; margin-left: auto; }
.db-mrow--gap { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px 14px; }
.db-mrow--gap .db-mrow__date { color: var(--t3); font-weight: 500; }
.db-mrow__gap { font-size: 13px; line-height: 1.45; color: var(--t2); }

/* ---------- Discord card: one button; one line after the first click (remembered, localStorage.ngc_discord_card) ---------- */
.db-discord { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 16px 32px; padding: 22px 24px; background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r); scroll-margin-top: 24px; }
.db-discord__main { display: flex; flex-direction: column; gap: 8px; flex: 1 1 480px; min-width: 0; }
.db-discord__h { display: flex; align-items: center; gap: 10px; }
.db-discord svg { color: var(--t2); }
.db-discord__title { font-size: 18px; font-weight: 600; line-height: 1.3; }
.db-discord__more-box { display: flex; flex-direction: column; gap: 8px; }
.db-discord__what { max-width: 720px; font-size: 15px; line-height: 1.6; color: var(--t2); }
.db-discord__how { max-width: 720px; font-size: 13px; line-height: 1.55; color: var(--t3); }
.db-discord__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.db-discord .db-discord__acts svg { color: currentColor; }
.db-discord__sub { display: none; flex: 1 1 240px; min-width: 0; font-size: 13px; color: var(--t3); }
.db-discord__ic2 { display: none; }
.db-discord__more[hidden] { display: none; }
/* collapsed (after the first "Open Discord"): icon · title · the email line · the button as a quiet link + "Show details" */
.db-discord--min { align-items: center; gap: 6px 12px; padding: 10px 20px; }
.db-discord--min .db-discord__main { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.db-discord--min .db-discord__title { font-size: 15px; }
.db-discord--min .db-discord__sub { display: block; }
.db-discord--min:not(.db-discord--open) .db-discord__more-box { display: none; }
.db-discord--min.db-discord--open .db-discord__more-box { flex-basis: 100%; }
.db-discord--min .db-discord__open { height: auto; min-height: 36px; padding: 0; background: transparent; border-color: transparent; color: var(--accent); }
.db-discord--min .db-discord__open:hover { color: var(--accent-hover); background: transparent; }
.db-discord--min .db-discord__ic1 { display: none; }
.db-discord--min .db-discord__ic2 { display: inline-block; }

/* ---------- the paywall frame (no figures; the dialog sits over it) ----------
   Blurred and dimmed as in the prototype (proto core.js mountPage wraps a paywalled page in .n-paywalled; components.css
   .n-paywalled values). The frame holds no member content (no figures, no run tables, no invite), so this blurs an empty
   skeleton, never real content (BUILD_SPEC §1.11). It also keeps the edge-cached frame's printed dates from reading as facts
   next to the dialog's own "Latest report" line. The dialog is printed outside <main>, so it stays sharp. */
.db--pw { filter: blur(6px); opacity: 0.55; pointer-events: none; user-select: none; -webkit-user-select: none; }
.db--pw .db-figs .db-fig__v, .db--pw .db-pair__v { color: var(--t3); }
@media print { .db--pw { filter: none; } }

/* ---------- desktop ≥ 1100: the Discord card as the third card of the side column ---------- */
@media (min-width: 1100px) {
  .db-hub > .db-discord { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 20px 20px; }
  .db-hub > .db-discord .db-discord__main { flex: none; gap: 8px; }
  .db-hub > .db-discord .db-discord__title { font-size: 16px; }
  .db-hub > .db-discord .db-discord__what { font-size: 14px; line-height: 1.55; }
  .db-hub > .db-discord .db-discord__how { font-size: 12px; }
  .db-hub > .db-discord .db-discord__acts { gap: 4px 16px; }
  .db-hub > .db-discord.db-discord--min { gap: 4px 10px; padding: 14px 20px 8px; }
  .db-hub > .db-discord.db-discord--min .db-discord__main { flex-direction: column; align-items: flex-start; gap: 4px; }
}

/* ---------- tablet 700–1099 ---------- */
@media (max-width: 1099px) {
  .db-hub { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none;
    grid-template-areas: "main main" "eia dd" "arch arch" "discord discord"; }
  .db-arch { margin-top: 24px; }
  .db-hub > .db-discord { margin-top: 8px; }
  .db-arch__foot { flex-direction: column; align-items: flex-start; gap: 14px; }
  .db-arch__note { margin-left: 0; }
}

/* tablets held by touch (700–1099 px, coarse pointer): 44 px tap areas for the date (the way in), the PDF buttons, the Jump to links and
   the Discord buttons (the date's negative margin keeps the row height) */
@media (min-width: 700px) and (max-width: 1099px) and (pointer: coarse) {
  .db-tape .db-date { display: inline-flex; align-items: center; min-height: 44px; margin: -12px 0; }
  .db-tape .db-acts .n-iconbtn { width: 44px; height: 44px; margin: -2px 0; }
  .db-jump, .db-discord .n-btn { min-height: 44px; }
}

/* ---------- phone ≤ 699 ---------- */
@media (max-width: 699px) {
  .db-hub { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 16px;
    grid-template-areas: "main" "lines" "arch" "discord"; }
  .db-head { flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 16px; }
  .db-head__plan { padding-bottom: 0; }
  .db-notice { margin-bottom: 16px; }
  .db-latest__head { padding: 14px 16px 16px; gap: 12px; }
  .db-latest__id { gap: 4px 10px; }
  .db-latest__date { font-size: 19px; }
  .db-latest__pub { flex-basis: 100%; font-size: 13px; }
  .db-latest__acts { width: 100%; align-items: stretch; gap: 4px; }
  .db-latest__act { width: 100%; }
  .db-latest__read { flex: 1 1 auto; justify-content: center; }
  .db-latest__read > svg { display: inline-block; }
  .db-howread { align-self: flex-start; min-height: 44px; font-size: 14px; }
  .db-latest__sec { padding: 16px; }
  .db-latest__sumbox { order: 3; }
  .db-latest__sumk { margin-top: 16px; font-size: 12px; color: var(--t3); }
  .db-latest__sum { font-size: 15px; margin: 4px 0 0; }
  .db-figs { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .db-fig { padding: 10px 12px 11px; }
  .db-fig__v { font-size: 19px; }
  .db-fig--front .db-fig__basis { display: block; }
  .db-fig__k .n-term::after, .db-fig__b .n-term::after, .db-figs__fn .n-term::after { inset: -12px -6px; }
  .db-latest__foot { flex-direction: column; align-items: flex-start; padding: 6px 16px 10px; }
  .db-latest__jumps { gap: 0 20px; }
  .db-latest__jumps > .n-t3 { flex-basis: 100%; padding-top: 8px; }
  .db-jump__sep { display: none; }
  .db-jump { min-height: 44px; }
  .db-arch { margin-top: 20px; }
  .db-arch__head { margin-bottom: 10px; }
  .db-arch__foot { flex-direction: column; align-items: stretch; gap: 14px; }
  .db-arch__foot .db-more { width: 100%; }
  .db-arch__note { margin-left: 0; }
  .db-mrow__pdf.n-iconbtn { width: 44px; height: 44px; }
  /* a re-sent report: "updated …" under the publish time, so the first line never runs under the PDF button at 360 */
  .db-mrow__l1 { align-items: flex-start; }
  .db-mrow__pub .db-sub { display: block; margin: 1px 0 0; }
  .db-hub > .db-discord { margin-top: 8px; padding: 16px; gap: 14px; }
  .db-discord__main { flex-basis: 100%; }
  .db-discord__acts { width: 100%; }
  .db-discord:not(.db-discord--min) .db-discord__open { flex: 1 1 auto; justify-content: center; }
  .db-discord--min { padding: 12px 14px 4px 16px; }
  .db-discord--min .db-discord__acts { gap: 0 20px; }
  .db-discord--min .db-discord__open, .db-discord__more { min-height: 44px; }
}

/* ---------- print: the page as a list (chrome hidden by the shared print rules) ---------- */
@media print {
  .db-pdfbtn, .db-more, .db-discord, .db-latest__acts, .db-lines { display: none !important; }
  .db-arch [hidden].db-x { display: table-row !important; }
  .db-mlist [hidden].db-x { display: grid !important; }
  .db-latest, .db-card, .db-tapewrap { break-inside: avoid; }
}

/* ======================= the report proxy's empty states (page key "report") =======================
   The generated report's bar and footer (B2's ngc_web/static/report.css: rp-bar, rp-brand, rp-foot), for the PHP pages that stand
   in for a report: "No report at this address", "This report has been archived", "… isn't published yet". */
.rp--empty { --rp-bar-h: 56px; background: var(--ground); color: var(--t1); min-height: 100vh; display: flex; flex-direction: column; }
html[data-page="report"] { scroll-padding-top: 72px; }
.rp--empty .rp-bar { position: sticky; top: var(--pin-h, 0px); z-index: 16; background: var(--ground); border-bottom: 1px solid var(--hair); padding-top: env(safe-area-inset-top, 0px); }
.rp--empty .rp-bar__in { height: var(--rp-bar-h); display: flex; align-items: center; gap: 14px; }
.rp--empty .rp-brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px; margin: -10px; color: var(--t1); font-size: 16px; font-weight: 600; letter-spacing: -0.005em; white-space: nowrap; flex: none; border-radius: var(--r-sm); }
.rp--empty .rp-brand:hover { color: var(--t1); }
.rp--empty .rp-bar__vr { width: 1px; height: 20px; background: var(--line); flex: none; }
.rp--empty .rp-bar__doc { font-size: 14px; color: var(--t2); white-space: nowrap; }
.rp--empty .rp-bar__date { font-size: 14px; font-weight: 600; color: var(--t1); white-space: nowrap; font-variant-numeric: tabular-nums; margin-left: 6px; }
.rp--empty .rp-bar__right { margin-left: auto; display: flex; align-items: center; gap: 8px; flex: none; }
.rp--empty .rp-bar__icon.n-iconbtn { width: 36px; height: 36px; }
.rp--empty .rp-all.n-btn { color: var(--accent); }
.rp--empty .rp-all.n-btn:hover { color: var(--accent-hover); }
.rp--empty .rp-emptybody { padding-top: 56px; padding-bottom: 88px; flex: 1 0 auto; outline: none; }
.rp--empty .rp-foot { margin-top: auto; border-top: 1px solid var(--hair); background: var(--ground); padding: 32px 0 40px; }
.rp--empty .rp-foot__links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding: 0 0 24px; font-size: 14px; }
.rp--empty .rp-foot__links .n-link { display: inline-flex; align-items: center; gap: 4px; }
.rp--empty .rp-foot__btn { display: inline-flex; align-items: center; gap: 8px; padding: 0; background: none; border: 0; font-size: 14px; font-weight: 500; color: var(--accent); min-height: 32px; }
.rp--empty .rp-foot__btn:hover { color: var(--accent-hover); }
.rp--empty .rp-foot__bottom { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid var(--hair-soft); }
.rp--empty .rp-foot__brand { display: flex; flex-direction: column; gap: 8px; }
.rp--empty .rp-foot__tag { font-size: 13px; color: var(--t3); }
.rp--empty .rp-foot__legal { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--t3); text-align: right; }
.rp--empty .rp-foot__lnav { display: flex; gap: 16px; justify-content: flex-end; margin-top: 4px; }
.rp--empty .rp-foot__lnav a { color: var(--t2); }
.rp--empty .rp-foot__lnav a:hover { color: var(--t1); }
@media (max-width: 1099px) {
  .rp--empty .rp-bar__vr, .rp--empty .rp-bar__doc { display: none; }
  .rp--empty .rp-all.n-btn > span { display: none; }
  .rp--empty .rp-all.n-btn { padding: 0 10px; }
}
@media (max-width: 899px) { .rp--empty .rp-brand__name { display: none; } }
@media (max-width: 699px) {
  .rp--empty .rp-bar__in { gap: 4px; }
  .rp--empty .rp-brand { margin: -10px 0 -10px -10px; }
  .rp--empty .rp-bar__right { margin-left: 0; gap: 8px; }
  .rp--empty .rp-bar__icon.n-iconbtn { width: 44px; height: 44px; }
  .rp--empty .rp-bar__date { margin: 0 auto; font-size: 15px; }
  .rp--empty .rp-bar__right--end { margin-left: auto; }
  .rp--empty .rp-foot { padding: 24px 0 calc(32px + env(safe-area-inset-bottom, 0px)); }
  .rp--empty .rp-foot__links { flex-direction: column; align-items: flex-start; gap: 0; padding: 0 0 12px; }
  .rp--empty .rp-foot__links > * { min-height: 44px; display: inline-flex; align-items: center; }
  .rp--empty .rp-foot__legal { text-align: left; }
  .rp--empty .rp-foot__lnav { justify-content: flex-start; }
  .rp--empty .rp-foot__lnav a { min-height: 44px; display: inline-flex; align-items: center; }
}
@media (min-width: 700px) and (max-width: 1099px) and (pointer: coarse) {
  .rp--empty .rp-bar .n-btn--sm { height: 44px; min-width: 44px; justify-content: center; }
  .rp--empty .rp-bar__icon.n-iconbtn { width: 44px; height: 44px; }
}
@media print {
  .rp--empty .rp-bar, .rp--empty .rp-foot__links { display: none !important; }
}