/* Scoped feature styles: extends the existing institutional dashboard language. */
.feature-page { min-width: 0; }
.feature-heading { align-items: flex-end; padding-bottom: .75rem; border-bottom: 1px solid var(--line); }
.feature-date { color: var(--subtle); font-size: .75rem; }
.feature-block { margin-top: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.feature-block-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: .7rem; }
.feature-block-heading h3, .conditions-block h3, .preset-panel h3 { font-size: 1rem; font-weight: 600; }
.commodity-table-wrap { margin-bottom: 1rem; border: 1px solid var(--line); border-radius: var(--radius); }
.commodity-table { min-width: 1120px; }
.commodity-table .commodity-name-cell { width: 250px; }
.commodity-name-cell strong, .commodity-name-cell > a { display: block; color: #dfe2df; font-size: .8125rem; font-weight: 600; text-decoration: none; }
.observation-kind { display: inline-block; margin-top: .22rem; color: #8fb7e8; font-size: .6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: .045em; }
.indicator-feature-link { color: #b9d6fb; font-weight: 600; text-decoration: none; }
.indicator-feature-link:hover { text-decoration: underline; }
.commodity-table .up { color: var(--green); }
.commodity-table .down { color: var(--orange); }
.commodity-table .conditional { color: var(--muted); }
.conditions-block { margin-top: 0; background: #10151b; }
.conditions-block p:last-child { margin-top: .4rem; color: #b4bac0; font-size: .875rem; line-height: 1.65; }
.transmission-workbench .segmented-control { margin: 0 0 .85rem; }
.transmission-workbench .segmented-control button[aria-pressed="true"] { color: #e8edf5; border-color: #466991; background: #1a2635; }
.transmission-chain { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 1px; margin: 0; padding: 1px; list-style: none; background: var(--line); overflow-x: auto; }
.chain-step { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: .55rem; min-height: 150px; padding: .75rem; background: #111419; }
.chain-index { color: #626a74; font-family: monospace; font-size: .6875rem; }
.chain-copy { min-width: 0; }
.chain-title { display: flex; align-items: flex-start; justify-content: space-between; gap: .4rem; }
.chain-title strong { color: #e0e3e0; font-size: .8125rem; font-weight: 600; line-height: 1.35; }
.chain-copy p { margin-top: .45rem; color: #8f969e; font-size: .75rem; line-height: 1.5; }
.effect { flex: 0 0 auto; display: inline-grid; place-items: center; width: 23px; height: 23px; border: 1px solid var(--line); border-radius: 3px; font-family: monospace; font-weight: 700; }
.effect-up { color: var(--green); background: #102019; }
.effect-down { color: var(--orange); background: #201a10; }
.effect-conditional { color: #a5bfe0; background: #121b25; }
.hsc-transmission { margin-top: .9rem; padding-top: .85rem; border-top: 1px solid var(--line); }
.hsc-transmission > h3 { margin-bottom: .7rem; font-size: .9375rem; }
.hsc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; background: var(--line-soft); }
.hsc-item { padding: .7rem .8rem; background: #101318; }
.hsc-item dt { color: #7faee9; font-size: .6875rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.hsc-item dd { margin: .25rem 0 0; color: #b8bdc2; font-size: .8125rem; line-height: 1.55; }
.twi-component { scroll-margin-top: 1rem; }
.twi-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.twi-path { padding: .8rem; border: 1px solid var(--line); background: #101318; }
.twi-path h4 { margin-bottom: .55rem; color: #dfe2df; font-size: .875rem; }
.twi-path ol { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; counter-reset: twi; }
.twi-path li { position: relative; padding: .35rem .5rem .35rem 2rem; border-left: 2px solid #375777; color: #aeb4ba; font-size: .8125rem; counter-increment: twi; }
.twi-path li::before { content: counter(twi, decimal-leading-zero); position: absolute; left: .45rem; color: #657484; font-family: monospace; font-size: .6875rem; }
.twi-path.lower li { border-left-color: #7a6038; }
.twi-interaction { margin-top: .7rem; padding: .75rem .85rem; border: 1px solid #344355; background: #121923; }
.twi-interaction strong { color: #d9e8fb; font-size: .8125rem; }
.twi-interaction p { margin-top: .3rem; color: #aeb8c4; font-size: .8125rem; line-height: 1.55; }

.research-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.research-field { display: grid; gap: .3rem; color: #858d96; font-size: .75rem; font-weight: 600; }
.research-field-wide { grid-column: 1 / -1; }
.research-field textarea, .research-field input, .research-field select { width: 100%; min-height: 38px; padding: .58rem .65rem; border: 1px solid #353c45; border-radius: 4px; background: #0f1216; color: #e0e2df; font: inherit; }
.research-field textarea { min-height: 86px; resize: vertical; line-height: 1.5; }
.country-stack { display: grid; gap: .4rem; }
.primary-action, .preset-buttons button { min-height: 36px; padding: .45rem .7rem; border: 1px solid #37414d; border-radius: 4px; background: #141920; color: #c4c9cf; font: inherit; font-size: .75rem; cursor: pointer; }
.primary-action { border-color: #4c78a9; background: #1a2b3f; color: #e9f2ff; }
.primary-action:hover, .preset-buttons button:hover { border-color: #6494ca; color: #fff; }
.research-action { align-self: end; }
.research-examples { margin-top: .7rem; padding: .75rem; border: 1px solid var(--line-soft); background: #0f1216; }
.preset-buttons { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .55rem; }
.preset-buttons button { background: #11161c; }
.suggestion-label { color: #858d96; font-size: .75rem; font-weight: 600; }
.research-boundary { margin: .7rem 0; color: #747c85; font-size: .75rem; }
.research-result { min-height: 180px; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); scroll-margin-top: 1rem; }
.research-result-heading { margin-bottom: .55rem; }
.research-result-heading h3 { color: #e2e5e2; font-size: 1rem; font-weight: 600; }
.direct-answer, .research-analysis-block > p, .essay-output { color: #bbc0c5; font-size: .875rem; line-height: 1.7; }
.research-table-wrap { margin: .9rem 0; border: 1px solid var(--line); }
.research-table { min-width: 900px; }
.research-indicator { width: 220px; }
.research-indicator strong, .trend-note, .result-cross-link { display: block; }
.research-indicator strong { color: #dfe2df; font-size: .8125rem; }
.trend-note { margin-top: .25rem; color: #8c949d; font-size: .6875rem; font-weight: 500; }
.trend-improving { color: var(--green); }
.trend-deteriorating { color: var(--orange); }
.trend-mixed, .trend-uncertain, .trend-stable { color: #9eabc0; }
.result-cross-link { margin-top: .35rem; color: #8cbaf2; font-size: .6875rem; text-decoration: none; }
.research-analysis-block { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--line-soft); }
.mechanism-chain { padding: .7rem .8rem; border-left: 2px solid #4c78a9; background: #10151b; color: #c6d6e8 !important; font-family: "SFMono-Regular", Consolas, monospace; font-size: .8125rem !important; }
.essay-output { padding: .8rem; border-left: 2px solid #4c78a9; background: #10151b; }
.quick-judgement { margin-top: .75rem; color: #aeb5bc; font-size: .8125rem; line-height: 1.6; }
.research-sources { margin-top: .8rem; padding-top: .7rem; border-top: 1px solid var(--line-soft); }
.research-sources ul { display: grid; gap: .35rem; margin: .4rem 0 0; padding: 0; list-style: none; }
.research-sources li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .35rem 1rem; color: #767e87; font-size: .75rem; }
.research-footnote { margin-top: .9rem; padding-top: .7rem; border-top: 1px solid var(--line-soft); color: #747c85; font-size: .75rem; }
.ask-ai-link { display: inline-block; margin-top: .8rem; color: #9cc8ff; font-size: .75rem; font-weight: 600; text-decoration: none; }
.ask-ai-link:hover { text-decoration: underline; }

/* External-sector historical workbench */
.external-controls { display: grid; grid-template-columns: minmax(210px, .7fr) minmax(280px, 1.3fr) minmax(220px, .7fr); gap: .75rem; align-items: end; padding: 1rem; border: 1px solid var(--line); background: var(--panel); }
.external-controls select, .external-date-fields input, .causal-period-controls select { width: 100%; min-height: 38px; padding: .55rem .65rem; border: 1px solid #353c45; border-radius: 4px; background: #0f1216; color: #e0e2df; font: inherit; }
.external-toggle-stack { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.external-toggle { display: flex; align-items: center; gap: .5rem; min-height: 38px; padding: .5rem .65rem; border: 1px solid #353c45; background: #0f1216; color: #b8bec5; font-size: .75rem; font-weight: 600; }
.external-toggle input { accent-color: #6d9dd3; }
.external-range-bar { display: flex; align-items: end; justify-content: space-between; gap: .75rem; margin-top: .7rem; }
.external-range-bar .segmented-control { margin: 0; }
.external-date-fields, .causal-period-controls { display: flex; gap: .55rem; }
.external-date-fields .research-field, .causal-period-controls .research-field { min-width: 145px; }
.external-workspace { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .75fr); gap: .75rem; margin-top: .75rem; align-items: start; }
.external-main, .external-chart-card { min-width: 0; }
.external-chart-card, .why-panel { border: 1px solid var(--line); background: var(--panel); }
.external-chart-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: .9rem 1rem .7rem; border-bottom: 1px solid var(--line-soft); }
.external-chart-heading h3 { color: #e0e4e8; font-size: 1rem; font-weight: 600; }
.external-chart-heading .chart-definition { max-width: 760px; margin-top: .3rem; color: #858d96; font-size: .75rem; line-height: 1.5; }
.external-latest { display: grid; grid-template-columns: repeat(3, minmax(105px, 1fr)); gap: 1px; flex: 0 0 auto; margin: 0; background: var(--line-soft); }
.external-latest .kpi-row { min-width: 110px; padding: .5rem .6rem; background: #0f1318; }
.external-latest dt { color: #77818b; font-size: .625rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.external-latest dd { margin: .16rem 0 0; color: #e0e5eb; font-family: "SFMono-Regular", Consolas, monospace; font-size: .75rem; }
.external-latest .kpi-detail { display: block; margin-top: .12rem; color: #6f7882; font-size: .625rem; }
.external-chart { position: relative; min-height: 360px; overflow: hidden; }
.external-chart svg { display: block; width: 100%; min-width: 650px; height: auto; }
.external-gridline { stroke: #20262d; stroke-width: 1; }
.external-zero { stroke: #56606b; stroke-width: 1.2; }
.external-axis { fill: #737d87; font-family: "SFMono-Regular", Consolas, monospace; font-size: 11px; }
.external-line { fill: none; stroke: #7ba7d9; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.external-point { fill: #111820; stroke: #7ba7d9; stroke-width: 2; cursor: pointer; outline: none; }
.external-point:hover, .external-point:focus { fill: #9cc8ff; stroke: #e5f2ff; }
.external-point.is-selected { fill: #dcecff; stroke: #4f80b6; stroke-width: 3; }
.external-point.is-turning:not(.is-selected) { fill: #d1b36d; stroke: #211d15; }
.external-selected-guide { stroke: #7ba7d9; stroke-width: 1; stroke-dasharray: 2 4; opacity: .55; pointer-events: none; }
.external-selected-halo { fill: #78aee529; stroke: #9cc8ff; stroke-width: 1; pointer-events: none; }
.external-event-line { stroke: #8f7a4d; stroke-width: 1; stroke-dasharray: 2 6; opacity: .32; }
.external-event-dot { fill: #b99a58; stroke: #17130d; stroke-width: 1.5; cursor: pointer; opacity: .85; }
.external-event-dot:hover, g:focus .external-event-dot { fill: #e1c173; stroke: #f0dca8; }
.external-chart-tooltip { position: absolute; z-index: 4; display: grid; gap: .15rem; transform: translateX(-50%); width: 230px; padding: .65rem .7rem; border: 1px solid #466991; background: #0b1016; box-shadow: 0 8px 24px #0008; color: #bec7d0; font-size: .6875rem; pointer-events: none; }
.external-chart-tooltip strong { color: #e6eef8; font-size: .75rem; }
.external-chart-tooltip b { color: #9cc8ff; font-family: "SFMono-Regular", Consolas, monospace; font-size: .8125rem; }
.external-chart-meta { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem .8rem; border-top: 1px solid var(--line-soft); }
.external-point-status { color: #737c86; font-size: .6875rem; text-align: right; }
.external-data-details { border-top: 1px solid var(--line-soft); }
.external-data-details > summary { padding: .7rem .8rem; color: #9aa5b0; font-size: .75rem; cursor: pointer; }
.external-data-details .timeline-table-scroll { max-height: 360px; overflow: auto; }
.why-panel { position: sticky; top: .75rem; max-height: calc(100vh - 1.5rem); overflow: auto; padding: .9rem; }
.why-panel h3 { margin-top: .2rem; color: #e1e5e8; font-size: 1rem; }
.why-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: .7rem 0; background: var(--line-soft); }
.why-summary .metadata-item { padding: .55rem; background: #0e1216; }
.why-summary dt { color: #6f7a85; font-size: .625rem; text-transform: uppercase; }
.why-summary dd { margin: .2rem 0 0; color: #d5dbe0; font-family: "SFMono-Regular", Consolas, monospace; font-size: .6875rem; }
.why-summary .metadata-detail { display: block; color: #69727c; font-size: .625rem; }
.why-block { padding: .75rem 0; border-top: 1px solid var(--line-soft); }
.why-block h4 { margin-bottom: .5rem; color: #8fb7e8; font-size: .6875rem; letter-spacing: .055em; text-transform: uppercase; }
.accounting-list { display: grid; gap: 1px; margin: 0; background: var(--line-soft); }
.accounting-list > div { display: flex; justify-content: space-between; gap: .75rem; padding: .45rem .5rem; background: #0e1216; }
.accounting-list dt { color: #aeb5bc; font-size: .7rem; }
.accounting-list dd { margin: 0; color: #cdd4db; font-family: "SFMono-Regular", Consolas, monospace; font-size: .6875rem; }
.accounting-list dd.positive { color: var(--green); }
.accounting-list dd.negative { color: var(--orange); }
.why-explanation, .why-offset, .unattached-cause { margin-top: .55rem; color: #929aa3; font-size: .75rem; line-height: 1.55; }
.unattached-cause { padding: .65rem; border-left: 2px solid #505760; background: #101318; }
.why-list { display: grid; gap: .3rem; margin: .4rem 0 0; padding-left: 1.1rem; color: #adb4bb; font-size: .75rem; line-height: 1.5; }
.why-event + .why-event { margin-top: .75rem; padding-top: .7rem; border-top: 1px solid var(--line-soft); }
.why-event > strong { color: #d9dfe5; font-size: .75rem; }
.cause-number { display: block; margin-bottom: .2rem; color: #6e7f91; font-family: "SFMono-Regular", Consolas, monospace; font-size: .625rem; letter-spacing: .04em; }
.evidence-chain h5, .supporting-heading { margin: .65rem 0 .35rem; color: #7f8a95; font-size: .625rem; letter-spacing: .05em; text-transform: uppercase; }
.supporting-metrics { display: grid; gap: 1px; margin: 0; background: var(--line-soft); }
.supporting-metric-row { display: grid; grid-template-columns: minmax(105px, .8fr) minmax(150px, 1.3fr) auto; gap: .25rem .55rem; align-items: baseline; padding: .5rem; background: #0e1216; }
.supporting-metric-row dt { color: #bac1c8; font-size: .6875rem; }
.supporting-metric-row dd { margin: 0; color: #d6dde3; font-family: "SFMono-Regular", Consolas, monospace; font-size: .65rem; }
.supporting-metric-row .metric-change { color: #9cb0c4; font-family: "SFMono-Regular", Consolas, monospace; font-size: .625rem; white-space: nowrap; }
.supporting-metric-row .metric-change.is-up { color: #a8c8e8; }
.supporting-metric-row .metric-change.is-down { color: #d4b47a; }
.supporting-metric-row small { grid-column: 2 / -1; color: #646f7a; font-size: .585rem; line-height: 1.35; }
.why-chain { display: grid; gap: .2rem; margin-top: .55rem; padding: .6rem; border-left: 2px solid #4c78a9; background: #10151b; color: #becde0; font-size: .72rem; line-height: 1.45; }
.why-chain .chain-arrow { color: #658bb6; }
.why-sources ul { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.why-sources a { color: #9cc8ff; font-size: .7rem; text-decoration: none; }
.why-sources a:hover { text-decoration: underline; }
.external-quarter-section h3 { font-size: 1rem; }
.external-quarter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: .7rem 0 0; background: var(--line-soft); }
.external-quarter-item { padding: .65rem; background: #0f1318; }
.external-quarter-item dt { color: #77818c; font-size: .6875rem; }
.external-quarter-item dd { margin: .2rem 0 0; color: #e0e5ea; font-family: "SFMono-Regular", Consolas, monospace; font-size: .75rem; }
.quarter-carry-note { display: block; margin-top: .2rem; color: #666f79; font-size: .625rem; }
.external-quarter-why { margin-top: .7rem; padding: .7rem .8rem; border-left: 2px solid #4c78a9; background: #10151b; }
.external-quarter-why strong { color: #d8e6f5; font-size: .75rem; }
.external-quarter-why p { margin-top: .25rem; color: #aeb8c3; font-size: .75rem; line-height: 1.55; }
.causal-period-controls { align-items: end; }
.causal-view { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 1px; background: var(--line); overflow-x: auto; }
.causal-node { min-width: 155px; min-height: 160px; padding: .7rem; background: #101318; }
.causal-step { color: #5f6c79; font-family: "SFMono-Regular", Consolas, monospace; font-size: .625rem; }
.causal-node h4 { margin-top: .3rem; color: #d8dde2; font-size: .78rem; }
.causal-node p { white-space: pre-line; margin-top: .45rem; color: #919aa3; font-size: .6875rem; line-height: 1.48; }
.causal-node:not(:nth-last-child(2))::after { content: "→"; float: right; margin-top: .35rem; color: #52749a; }
.causal-caveat { grid-column: 1 / -1; margin: 0; padding: .7rem .8rem; background: #0c1014; color: #747d86; font-size: .6875rem; line-height: 1.5; }
.hsc-history-panel[hidden] { display: none; }
.history-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.history-card { padding: .8rem; border: 1px solid var(--line); background: #0f1318; }
.history-date { color: #718093; font-family: "SFMono-Regular", Consolas, monospace; font-size: .65rem; }
.history-card h4 { margin-top: .25rem; color: #dce1e5; font-size: .85rem; }
.history-card h5 { margin-top: .7rem; color: #86aeda; font-size: .65rem; letter-spacing: .05em; text-transform: uppercase; }
.history-card > p:not(.history-date):not(.history-source) { margin-top: .35rem; color: #9fa7af; font-size: .72rem; line-height: 1.55; }
.history-stats { display: grid; gap: 1px; margin-top: .6rem; background: var(--line-soft); }
.history-stats .metadata-item { padding: .45rem .5rem; background: #0b0f13; }
.history-stats dt { color: #68727c; font-size: .625rem; text-transform: uppercase; }
.history-stats dd { margin: .18rem 0 0; color: #bfc7ce; font-size: .7rem; }
.history-sentence { padding: .55rem; border-left: 2px solid #4c78a9; background: #10151b; }
.history-source { margin-top: .65rem; }
.history-source a { color: #8fbff5; font-size: .6875rem; text-decoration: none; }
.external-methodology { margin-top: 1rem; }

@media (max-width: 1100px) {
  .research-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .transmission-chain { grid-template-columns: repeat(5, minmax(210px, 1fr)); }
  .external-workspace { grid-template-columns: minmax(0, 1fr); }
  .why-panel { position: static; max-height: none; }
  .external-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .external-toggle-stack { grid-column: 1 / -1; }
  .external-quarter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .feature-heading, .feature-block-heading { align-items: flex-start; flex-direction: column; }
  .hsc-grid, .twi-columns, .research-form { grid-template-columns: minmax(0, 1fr); }
  .research-field-wide { grid-column: auto; }
  .external-controls, .history-grid { grid-template-columns: minmax(0, 1fr); }
  .external-toggle-stack, .why-summary { grid-template-columns: minmax(0, 1fr); }
  .external-range-bar, .external-chart-heading, .external-chart-meta { align-items: stretch; flex-direction: column; }
  .external-latest { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .external-chart { overflow-x: auto; }
  .external-quarter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .external-date-fields, .causal-period-controls { width: 100%; }
  .external-date-fields .research-field, .causal-period-controls .research-field { min-width: 0; flex: 1; }
  .supporting-metric-row { grid-template-columns: minmax(0, 1fr) auto; }
  .supporting-metric-row dd { grid-column: 1 / -1; }
  .supporting-metric-row small { grid-column: 1 / -1; }
}
