/* Presentation shared by the screens adopted in the second visual pass.
   Finance retains its original scoped implementation. Reuse its scale. */
:root {
  --ui-mono: var(--finance-font-mono);
  --ui-small: var(--finance-text-sm);
  --ui-base: var(--finance-text-base);
  --ui-title: var(--finance-text-lg);
  --ui-metric: var(--finance-text-xl);
  --ui-unit: var(--finance-space-1);
  --ui-gap: var(--finance-space-2);
  --ui-inset: var(--finance-space-3);
  --ui-space: var(--finance-space-4);
  --ui-section: var(--finance-space-8);
  --ui-control: var(--finance-control-size);
  --ui-reading: var(--finance-reading-width);
  --ui-line-height: var(--finance-line-height);
}
:root .polished-screen { min-width: 0; font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen :is(h2, h3, h4, p) { overflow-wrap: anywhere; }
:root .polished-screen :is(b, strong) { font-weight: 600; }
:root .polished-screen .page-intro { gap: var(--ui-space); margin-bottom: var(--ui-section); }
:root .polished-screen .page-intro h2 { font-size: var(--ui-metric); font-weight: 600; letter-spacing: -.02em; line-height: 1.1; margin-bottom: var(--ui-gap); }
:root .polished-screen .page-intro p { max-width: var(--ui-reading); font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen .eyebrow { color: var(--muted); font-size: var(--ui-small); font-weight: 500; letter-spacing: .06em; margin-bottom: var(--ui-gap); }
:root .polished-screen .grid { gap: var(--ui-space); }
:root .polished-screen .section-gap { margin-top: var(--ui-space); }
:root .polished-screen .card { background: var(--panel); border-color: var(--line); border-radius: var(--radius); padding: var(--ui-space); box-shadow: none; }
:root .polished-screen .card-header { gap: var(--ui-space); margin-bottom: var(--ui-space); flex-wrap: wrap; }
:root .polished-screen :is(.card-header h3, .card > h3, .catalog-card h3, .program-card h3, .notice-card h3) { margin-top: 0; font-size: var(--ui-title); font-weight: 600; line-height: 1.1; letter-spacing: -.02em; }
:root .polished-screen :is(.card-header p, .catalog-card p, .program-card p, .instrument-guide p) { color: var(--muted); font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen .card-header p { margin-top: var(--ui-gap); }
:root .polished-screen .stat-card { min-height: var(--finance-stat-height); }
:root .polished-screen .stat-icon { display: none; }
:root .polished-screen .stat-card .label { font-size: var(--ui-base); font-weight: 500; color: var(--muted); text-transform: none; letter-spacing: normal; }
:root .polished-screen .stat-card .value { margin-top: var(--ui-inset); font: 600 var(--ui-metric)/1.1 var(--ui-mono); letter-spacing: -.02em; font-variant-numeric: tabular-nums; text-align: right; overflow-wrap: anywhere; }
:root .polished-screen .stat-card .hint { margin-top: var(--ui-inset); font-size: var(--ui-small); font-weight: 400; color: var(--muted); line-height: var(--ui-line-height); font-variant-numeric: tabular-nums; }
:root .polished-screen .toolbar { gap: var(--ui-space); margin-bottom: var(--ui-space); }
:root .polished-screen :is(.toolbar-left, .toolbar-right, .split-line, .button-pair) { gap: var(--ui-gap); min-width: 0; flex-wrap: wrap; }
:root .polished-screen :is(.tab-row, .period-row) { display: flex; flex-wrap: wrap; max-width: 100%; width: fit-content; gap: var(--ui-unit); padding: var(--ui-unit); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
:root .polished-screen .tab-row { margin-bottom: var(--ui-space); }
:root .polished-screen :is(.tab-button, .period-row button) { min-width: var(--ui-control); min-height: var(--ui-control); padding: var(--ui-gap) var(--ui-inset); color: var(--muted); background: transparent; border-radius: var(--radius); font-size: var(--ui-base); font-weight: 500; line-height: var(--ui-line-height); white-space: normal; text-align: center; transition: none; }
:root .polished-screen :is(.tab-button, .period-row button):hover { background: var(--panel-2); color: var(--text); }
:root .polished-screen :is(.tab-button.active, .period-row button.active) { background: var(--panel-3); color: var(--text); box-shadow: inset 0 -2px var(--orange); }
:root .polished-screen .button.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--ui-gap); min-height: var(--ui-control); padding: var(--ui-gap) var(--ui-space); border-color: var(--line); border-radius: var(--radius); background: var(--panel-2); color: var(--text); font-size: var(--ui-base); font-weight: 500; line-height: var(--ui-line-height); white-space: normal; text-align: center; text-decoration: none; transition: none; }
:root .polished-screen .button.button:hover { background: var(--panel-3); border-color: var(--orange); }
:root .polished-screen .button.danger { color: var(--red); background: var(--panel); }
:root .polished-screen .button.danger:hover { background: var(--panel-2); }
:root .polished-screen .link-button { min-height: var(--ui-control); min-width: var(--ui-control); padding: var(--ui-gap); border-radius: var(--radius); color: var(--orange-2); font-size: var(--ui-small); font-weight: 500; line-height: var(--ui-line-height); }
:root .polished-screen .link-button:hover { background: var(--panel-2); }
:root .polished-screen :is(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--orange); outline-offset: var(--ui-unit); box-shadow: none; }
:root .polished-screen .field { gap: var(--ui-gap); }
:root .polished-screen :is(.field label, .field-label, .chart-control-label) { color: var(--muted); font-size: var(--ui-base); font-weight: 500; }
:root .polished-screen .chart-control-label { flex-wrap: wrap; gap: var(--ui-gap); }
:root .polished-screen :is(.field input, .field select, .field textarea, .search-input, .catalog-filter, .chart-control-label select, .setting-row select) { max-width: 100%; min-height: var(--ui-control); padding: var(--ui-gap) var(--ui-inset); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); color: var(--text); font-size: var(--ui-base); font-weight: 400; line-height: var(--ui-line-height); box-shadow: none; }
:root .polished-screen :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
:root .polished-screen :is(input, select, textarea):disabled { color: var(--muted); background: var(--panel-2); }
:root .polished-screen .field-help { color: var(--muted); font-size: var(--ui-small); line-height: var(--ui-line-height); }
:root .polished-screen .notice-banner { margin-bottom: var(--ui-space); padding: var(--ui-space); border-color: var(--line); border-radius: var(--radius); background: var(--panel-2); color: var(--text); font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen .notice-banner b { color: var(--text); }
:root .polished-screen .badge { max-width: 100%; padding: var(--ui-unit) var(--ui-gap); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel-2); color: var(--muted); font-size: var(--ui-small); font-weight: 500; line-height: var(--ui-line-height); overflow-wrap: anywhere; }
:root .polished-screen .badge.orange { color: var(--orange-2); }
:root .polished-screen .detail-list { gap: var(--ui-gap); margin-top: var(--ui-space); }
:root .polished-screen .detail-row { gap: var(--ui-space); color: var(--muted); border-color: var(--line); padding-bottom: var(--ui-gap); font-size: var(--ui-base); line-height: var(--ui-line-height); align-items: baseline; }
:root .polished-screen .detail-row > * { min-width: 0; overflow-wrap: anywhere; }
:root .polished-screen .detail-row b { color: var(--text); font-weight: 500; font-variant-numeric: tabular-nums; }
:root .polished-screen .detail-big { font: 600 var(--ui-metric)/1.1 var(--ui-mono); font-variant-numeric: tabular-nums; text-align: right; margin: var(--ui-space) 0 var(--ui-gap); }
:root .polished-screen .table-wrap { overflow: auto; max-height: var(--finance-table-height); border-color: var(--line); border-radius: var(--radius); }
:root .polished-screen table { background: var(--panel); }
:root .polished-screen :is(th, td) { padding: var(--ui-gap) var(--ui-inset); border-color: var(--line); color: var(--text); font-size: var(--ui-base); font-weight: 400; line-height: var(--ui-line-height); vertical-align: middle; }
:root .polished-screen th { position: sticky; top: 0; z-index: 1; background: var(--panel-2); color: var(--muted); font-size: var(--ui-small); font-weight: 500; letter-spacing: normal; text-transform: none; }
:root .polished-screen tbody tr:hover { background: var(--panel-2); }
:root .polished-screen td small { font-size: var(--ui-small); }
:root .polished-screen .screen-row-actions { display: flex; align-items: center; flex-wrap: nowrap; gap: var(--ui-unit); }
:root .polished-screen .screen-number { font-family: var(--ui-mono); font-variant-numeric: tabular-nums; }
:root .polished-screen .screen-amount { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
:root .polished-screen .screen-amount:not(th) { font-family: var(--ui-mono); }
:root .polished-screen td.screen-amount { font-family: var(--ui-mono); font-weight: 500; }
:root .polished-screen .screen-date { font-variant-numeric: tabular-nums; white-space: nowrap; }
:root .polished-screen .screen-meta { color: var(--muted); font-size: var(--ui-small); font-weight: 400; line-height: var(--ui-line-height); }
:root .polished-screen .screen-reading { max-width: var(--ui-reading); font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen .screen-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:root .polished-screen .empty-state { padding: var(--ui-section) var(--ui-space); border-color: var(--line); border-radius: var(--radius); background: var(--panel-2); color: var(--muted); }
:root .polished-screen .empty-state .empty-symbol { display: none; }
:root .polished-screen .empty-state b { margin-bottom: var(--ui-gap); color: var(--text); font-size: var(--ui-title); font-weight: 600; line-height: 1.1; }
:root .polished-screen .empty-state p { max-width: var(--ui-reading); margin-bottom: var(--ui-space); font-size: var(--ui-base); line-height: var(--ui-line-height); }
:root .polished-screen .positive { color: var(--green); }
:root .polished-screen .negative { color: var(--red); }
@media (max-width: 1100px) {
  :root .polished-screen .grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  :root .polished-screen .page-intro { margin-bottom: var(--ui-space); }
  :root .polished-screen .grid.three { grid-template-columns: minmax(0, 1fr); }
  :root .polished-screen .grid.stats { grid-template-columns: minmax(0, 1fr); }
  :root .polished-screen .card.stat-card { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: var(--ui-gap); }
  :root .polished-screen .stat-card .value { margin: 0; font-size: var(--ui-title); }
  :root .polished-screen .stat-card .hint { grid-column: 1 / -1; margin: 0; }
  :root .polished-screen .toolbar { align-items: stretch; }
  :root .polished-screen :is(.toolbar-left, .toolbar-right) { width: 100%; }
  :root .polished-screen :is(.tab-row, .period-row) { width: 100%; }
  :root .polished-screen :is(.tab-button, .period-row button) { flex: 1 1 auto; }
  :root .polished-screen .detail-row { gap: var(--ui-gap); }
}