/* Selected palette 01: 品牌红 · 经典红白. Load after every existing stylesheet.
   Color overrides only: typography and page/module layouts remain source-owned.
   Financial up/down colors, heatmap fills and data-state colors are not redefined. */
:root {
  --theme-brand: #C4211C;
  --theme-brand-hover: #A91C18;
  --theme-brand-soft: #FAECEA;
  --theme-canvas: #F7F6F5;
  --theme-panel: #FFFFFF;
  --theme-ink: #2B292A;
  --theme-muted: #7E7473;
  --theme-line: #E9DEDC;
  --theme-band: #F8EBE9;
  --theme-band-ink: #6D302E;
  --theme-card: #FFF7F5;
  --theme-card-ink: #3F2827;
  --theme-gold: #B99267;
  --theme-chart: #8E5650;
  --theme-chart-fill: #F9E9E6;
}

/* Shared contract for the existing workspace and the incoming institution module.
   Scoped aliases also override module-local legacy defaults when this file is last. */
:root, .institutional-portfolio {
  --brand: var(--theme-brand);
  --accent: var(--theme-brand);
  --brand-hover: var(--theme-brand-hover);
  --accent-hover: var(--theme-brand-hover);
  --brand-soft: var(--theme-brand-soft);
  --accent-soft: var(--theme-brand-soft);
  --bg: var(--theme-canvas);
  --canvas: var(--theme-canvas);
  --panel: var(--theme-panel);
  --paper: var(--theme-panel);
  --surface: var(--theme-panel);
  --ink: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --soft: var(--theme-brand-soft);
  --band: var(--theme-band);
  --band-ink: var(--theme-band-ink);
  --card-bg: var(--theme-card);
  --card-ink: var(--theme-card-ink);
  --gold: var(--theme-gold);
  --chart: var(--theme-chart);
  --chart-fill: var(--theme-chart-fill);
  --header: var(--theme-panel);
  --header-ink: var(--theme-card-ink);
  --summary: var(--theme-brand);
  --summary-ink: #FFFFFF;
  --navy: var(--theme-ink);
  --navy-2: var(--theme-brand);
  --blue: var(--theme-brand);
  --shadow: 0 3px 14px #2B292A04;
}

html, body { background: var(--canvas); color: var(--ink); }
.institutional-portfolio { color: var(--ink); }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, summary:focus-visible { outline-color: #C4211C66; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }

/* Header dimensions/typography are owned by platform-shell.css and its markup. */
.site-header { background: var(--header); border-bottom-color: var(--line); box-shadow: 0 3px 14px #29293406; }
.site-header .brand { color: var(--header-ink); }
.site-header .brand strong, .site-header .brand small { color: var(--header-ink); }
.site-header .report-logo { background: #FFFFFF; }
.site-header .platform-name { color: var(--header-ink); border-left-color: var(--line); }
.nav-link { color: var(--header-ink); }
.nav-link.active, .nav-link:hover { color: var(--accent); background: var(--accent-soft); border-color: var(--line); }
.nav-count { background: var(--accent-soft); color: var(--accent); }
.brand-divider { color: var(--line); }

/* Controls and neutral text. Status badges and signed values keep their styles. */
.button { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.button:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.button-outline { background: var(--panel); color: var(--accent); border-color: var(--line); }
.button-outline:hover { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.text-button, .text-button:hover, .calculation-details summary, .update-notes summary { color: var(--accent); }
.segmented { background: var(--panel); border-color: var(--line); }
.segmented button { color: var(--muted); }
.segmented button:hover { color: var(--accent); }
.segmented button.active { background: var(--accent); color: #FFFFFF; }
.category-filters button { color: var(--muted); }
.category-filters button:hover, .category-filters button.active { background: var(--accent-soft); color: var(--accent); border-color: var(--line); }
.search-box, .chart-toolbar select, .weight-input { border-color: var(--line); background: var(--panel); }
.search-box input, .chart-toolbar select, .weight-input { color: var(--ink); }
.search-box svg { stroke: var(--muted); }
.search-box input::placeholder { color: var(--muted); }
.icon-button, .table-star, .row-details { color: var(--muted); }
.icon-button:hover, .row-details:hover { color: var(--accent); background: var(--accent-soft); }
.icon-button.is-starred, .table-star.is-starred { color: var(--gold); }
.page-meta strong, .page-meta #updatedAt, .page-subtitle, .local-label,
.subtle-label, .metric-symbol, .unit-inline, .source-label, .date-label,
.category-label, .metric-selector-label, .stat-label, .stat-bottom,
.stat-value small, .chart-summary .unit, .chart-summary .chart-date,
.heading-count, .watchlist-actions, .empty-state p, .empty-chart p,
.empty-chart-symbol, .table-empty { color: var(--muted); }
.empty-state strong, .empty-chart strong, .metric-name-button { color: var(--ink); }
.metric-name-button:hover { color: var(--accent); }

/* Dashboard panels reproduce the selected screenshot's large color areas. */
.panel { background: var(--panel); border-color: var(--line); }
.panel-heading { background: var(--band); border-color: var(--line); }
.panel-heading h2, .panel-heading h3, .panel-heading .subtle-label,
.panel-heading .text-button { color: var(--band-ink); }
.observations-panel .panel-heading, .representative-panel .panel-heading { border-color: var(--line); }
.observation { background: var(--accent-soft); border-color: var(--line); }
.observation h3 { color: var(--ink); }
.observation p { color: var(--muted); }
.dashboard-widget.observations-panel { background: var(--summary); border-color: var(--summary); }
.dashboard-widget.observations-panel .panel-heading { background: transparent; border-color: #FFFFFF26; }
.dashboard-widget.observations-panel .panel-heading h3,
.dashboard-widget.observations-panel .subtle-label,
.dashboard-widget.observations-panel .observation h3,
.dashboard-widget.observations-panel .observation p { color: var(--summary-ink); }
.dashboard-widget.observations-panel .observation { background: transparent; }
.panel-bottom-note { background: var(--canvas); border-color: var(--line); color: var(--muted); }
.stat-card, button.stat-card { background: var(--card-bg); border-color: var(--line); border-top-color: var(--accent); }
button.stat-card:hover { border-color: var(--accent); }
button.stat-card.active { background: var(--accent-soft); border-color: var(--accent); }
.stat-card .stat-name, .stat-card .stat-value { color: var(--card-ink); }
.data-table thead, .data-table th { background: var(--accent-soft); color: var(--ink); border-color: var(--line); }
.data-table td { border-color: var(--line); }
.data-table tbody tr:nth-child(even) { background: var(--canvas); }
.data-table tbody tr:hover, .data-table tbody tr.is-selected { background: var(--accent-soft); }

/* Watchlist: do not override .wl-up/.wl-down or heatmap cell inline colors. */
.wl-tools input { background: var(--panel); color: var(--ink); border-color: var(--line); }
.wl-table button, .wl-table th button span, .wl-name small,
.wl-table td:first-child, .wl-table td.numeric small, .wl-date,
.wl-flat, .wl-empty { color: var(--muted); }
.wl-table th button, .wl-name strong { color: var(--ink); }
.wl-empty a { color: var(--accent); }
.wl-candidates button { background: var(--card-bg); border-color: var(--line); color: var(--ink); }
.wl-candidates button:hover { background: var(--accent-soft); border-color: var(--accent); }
.wl-candidates small { color: var(--muted); }
.wl-spark polyline, .sparkline path[stroke="#6489a7"] { stroke: var(--chart); }

/* Quote chart controls and only the explicitly neutral price-series colors.
   Candlestick/volume rect and line colors must remain untouched. */
.quote-range button, .quote-zoom button { color: var(--muted); }
.quote-range button.active { background: var(--accent-soft); color: var(--accent); }
.quote-zoom button { border-color: var(--line); }
.quote-caption, .quote-chart-kind, .quote-detail-header a:last-child,
.quote-detail-identity span, .quote-detail-meta, .quote-detail-error { color: var(--muted); }
.quote-axis, .chart-axis { fill: var(--muted); }
.quote-gridline, .chart-grid { stroke: var(--line); }
.quote-crosshair line { stroke: var(--muted); }
.quote-tooltip { background: #FFFFFFF5; border-color: var(--line); color: var(--ink); box-shadow: 0 4px 14px #2B292A17; }
.quote-empty { color: var(--muted); background: repeating-linear-gradient(0deg, transparent, transparent 59px, var(--canvas) 60px); }
.quote-detail-brand, .quote-detail-values strong { color: var(--ink); }
.quote-svg path[stroke="#205a8f"] { stroke: var(--chart); }
.quote-svg path[fill="#eaf1f9"] { fill: var(--chart-fill); }
.quote-svg circle[fill="#205a8f"], .chart-area circle[fill="#16496f"] { fill: var(--chart); }
.chart-path { stroke: var(--chart); }
.chart-area stop[stop-color="#377cab"] { stop-color: var(--chart); }
.chart-footnote { color: var(--muted); border-color: var(--line); }

/* Layout editing colors, without changing move/resize geometry. */
.layout-add[open] summary { background: var(--accent-soft); color: var(--accent); }
.layout-menu { background: var(--panel); border-color: var(--line); box-shadow: 0 10px 30px #2B292A18; }
.layout-menu button:hover:not(:disabled) { background: var(--accent-soft); color: var(--accent); }
.layout-menu button:disabled { color: var(--muted); }
.flex-dashboard.is-editing > .dashboard-widget { outline-color: #C4211C66; }
.flex-dashboard.is-editing .widget-edit-controls { background: var(--panel); border-color: var(--line); box-shadow: 0 2px 5px #2B292A0C; }
.widget-edit-controls button { color: var(--muted); }
.widget-edit-controls button:hover { background: var(--accent-soft); color: var(--accent); }
.flex-dashboard.is-editing .widget-resize { background: linear-gradient(135deg, transparent 42%, #B9807C 43%, #B9807C 48%, transparent 49%, transparent 61%, #B9807C 62%, #B9807C 67%, transparent 68%); }
.flex-dashboard .dashboard-widget.is-manipulating { outline-color: var(--accent); box-shadow: 0 8px 25px #2B292A20; }

/* Existing auxiliary/portfolio surfaces keep their established layout. */
.portfolio-intro, .weight-summary, .field-hint { background: var(--accent-soft); border-color: var(--line); }
.portfolio-intro strong, .analysis-method strong, .weight-summary strong,
.boundary-grid strong, .site-footer strong, .update-notes-body strong { color: var(--ink); }
.portfolio-intro p, .weight-summary span, .field-hint, .portfolio-stat span,
.portfolio-stat small, .analysis-method, .calculation-details p,
.boundary-grid p, .site-footer, .update-notes summary span,
.update-notes-body { color: var(--muted); }
.portfolio-stat-grid { background: var(--card-bg); border-color: var(--line); }
.analysis-method, .site-footer, .drawer-metadata div { border-color: var(--line); }
.drawer-backdrop { background: #2B292A45; }
.detail-drawer { background: var(--panel); border-color: var(--line); box-shadow: -8px 0 35px #2B292A12; }
.drawer-symbol, .drawer-value small, .drawer-metadata dt,
.drawer-description { color: var(--muted); }
.drawer-metadata dd { color: var(--ink); }
.toast { background: var(--ink); color: #FFFFFF; }

/* Optional conventional controls inside the new institution module.
   :where keeps module-owned component rules stronger; no sidebar/layout is added. */
.institutional-portfolio :where(.btn) { color: var(--ink); background: var(--panel); border-color: var(--line); }
.institutional-portfolio :where(.btn.primary, .button-primary) { color: #FFFFFF; background: var(--brand); border-color: var(--brand); }
.institutional-portfolio :where(.main-tab.active) { color: var(--brand); border-color: var(--brand); }
.institutional-portfolio :where(.stat, .stat-card) { background: var(--card-bg); border-color: var(--line); }
.institutional-portfolio :where(.panel-head) { background: var(--band); color: var(--band-ink); }

/* Institution overview and fixed-income KPIs use the selected pale-red surfaces. */
.institutional-portfolio .ip-stat,
.institutional-portfolio .ip-fi-kpi { background: var(--card-bg); }
.institutional-portfolio .ip-table th,
.institutional-portfolio .ip-fi-tablewrap th { background: var(--band); color: var(--band-ink); }

