:root { font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; color: #222c36; background: #f1f4f6; letter-spacing: 0; }
* { box-sizing: border-box; }
body { margin: 0; }
button, input { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.topbar { height: 64px; padding: 0 8px; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #fff; border-bottom: 1px solid #e5eaec; }
.brand { display: flex; align-items: center; gap: 10px; white-space: nowrap; font-weight: 750; font-size: 17px; }
.brand-mark { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 6px; background: #142f3b; color: #bfe9d9; font-size: 25px; line-height: 1; }
.brand-sub { font-size: 12px; color: #8b969c; font-weight: 500; border-left: 1px solid #d5dcdf; padding-left: 10px; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.market-state { padding: 5px 9px; border-radius: 4px; background: #edf1f2; font-size: 11px; color: #58666c; white-space: nowrap; }
.market-state.live { background: #e9f5ef; color: #16805d; }
.data-time { font-size: 12px; color: #7b888d; white-space: nowrap; }
.icon-button { width: 31px; height: 31px; border: 1px solid #dbe1e3; border-radius: 5px; color: #4a5b62; background: #fff; font-size: 20px; line-height: 1; display: grid; place-items: center; }
.icon-button:hover { background: #f1f6f5; }
.icon-button.active { color: #167b65; background: #e9f5ef; border-color: #b7ddcf; }
.shell { width: 100%; max-width: none; margin: 0; padding: 8px 8px 24px; }
.dashboard-layout { display: grid; grid-template-columns: minmax(230px, .24fr) minmax(0, 1fr) minmax(280px, .3fr); column-gap: 14px; row-gap: 8px; align-items: start; }
.overview { grid-column: 1 / -1; grid-row: 1; display: grid; gap: 10px; min-width: 0; }
.left-rail { grid-column: 1; grid-row: 2; }
.main-content { grid-column: 2; grid-row: 2; }
.right-rail { grid-column: 3; grid-row: 2; }
.main-content, .outer-rail { min-width: 0; }
.outer-rail { align-self: stretch; }
.outer-rail .panel { position: static; min-height: 0; }
.left-rail { display: grid; align-content: start; gap: 12px; }
.left-rail .tech-row { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px 0; gap: 9px 7px; }
.left-rail .tech-row .row-title { grid-column: 1 / -1; }
.left-rail .tech-row .metric.third { display: block; }
.left-rail .tech-row .inline-label { grid-column: 2; }
.preference-status { min-height: 14px; margin: 4px 0 0; color: #718188; font-size: 10px; line-height: 1.4; }
.preference-status.error { color: #b34e3c; }
.right-rail { display: grid; align-content: start; gap: 12px; }
.right-rail .panel { position: static; min-height: 0; }
.outer-rail .panel-header { margin-bottom: 12px; }
.rail-caption { color: #93a0a5; font-size: 10px; line-height: 1.5; margin-bottom: 10px; }
.headline { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.eyebrow, .section-kicker { margin: 0 0 7px; font-size: 10px; font-weight: 800; letter-spacing: .12em; color: #758990; }
h1, h2, p { margin-top: 0; }
h1 { margin: 0; font-size: 25px; font-weight: 750; }
h2 { margin: 0; font-size: 16px; font-weight: 750; }
.refresh-setting { display: flex; align-items: center; gap: 9px; color: #65747b; font-size: 12px; white-space: nowrap; padding-bottom: 3px; }
.switch { position: relative; width: 32px; height: 18px; }
.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.switch span { display: block; width: 32px; height: 18px; background: #c8d1d4; border-radius: 12px; }
.switch span:before { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: transform .2s; }
.switch input:checked + span { background: #187963; }
.switch input:checked + span:before { transform: translateX(14px); }
.error-banner { background: #fff1ed; color: #a94d36; border: 1px solid #f2cbbc; border-radius: 5px; padding: 11px 13px; margin-bottom: 14px; font-size: 12px; }
.indices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.index-tile { min-height: 66px; min-width: 0; background: #fff; border: 1px solid #e3e9eb; border-radius: 6px; padding: 6px 11px; }
.index-tile .name { display: flex; justify-content: space-between; gap: 5px; font-size: 11px; color: #63727a; margin-bottom: 3px; white-space: nowrap; overflow: hidden; }
.index-tile .name small { color: #9aa7aa; font-size: 9px; }
.index-tile .value { font-size: 19px; line-height: 1.1; font-weight: 750; font-variant-numeric: tabular-nums; white-space: nowrap; }
.index-tile .bottom { display: flex; justify-content: space-between; align-items: baseline; gap: 5px; margin-top: 4px; font-size: 10px; font-variant-numeric: tabular-nums; }
.index-tile .from-june { font-size: 9px; color: #8b989e; white-space: nowrap; }
.up { color: #d44840 !important; } .down { color: #1b986c !important; } .flat { color: #607077 !important; }
.skeleton { animation: pulse 1.5s infinite alternate; }
@keyframes pulse { from { background: #f9fbfb; } to { background: #edf2f2; } }
.signal-flow-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(310px, .95fr); gap: 12px; align-items: stretch; margin-bottom: 10px; }
.signal-strip { display: flex; align-items: center; gap: 18px; padding: 12px 18px; background: #fff; border: 1px solid #dde7e6; border-left: 4px solid #6eaa98; border-radius: 5px; min-width: 0; min-height: 130px; }
.signal-strip.strong { border-left-color: #cd7551; background: #fffdfb; }
.signal-strip.watch { border-left-color: #d6a04a; }
.signal-icon { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #d4e6df; border-radius: 50%; font-size: 30px; color: #528b76; }
.signal-main { flex: 1; min-width: 0; }
.signal-main h2 { font-size: 20px; margin: 1px 0 5px; }
.signal-main p { margin: 0; color: #6e7d84; font-size: 12px; line-height: 1.5; }
.signal-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.signal-side small { color: #95a1a6; white-space: nowrap; font-size: 10px; }
.turnover-panel { min-width: 0; background: #fff; border: 1px solid #e3e9eb; border-radius: 5px; padding: 10px 16px 8px; }
.turnover-heading { display: flex; align-items: end; justify-content: space-between; gap: 8px; }
.turnover-heading .section-kicker { margin-bottom: 4px; }
.turnover-heading h2 { font-size: 15px; white-space: nowrap; }
.turnover-heading strong { font-size: 17px; font-variant-numeric: tabular-nums; white-space: nowrap; color: #263d43; }
.turnover-bars { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; height: 72px; margin-top: 6px; }
.turnover-day { display: flex; flex-direction: column; align-items: center; justify-content: end; min-width: 0; font-variant-numeric: tabular-nums; }
.turnover-value { color: #54666b; font-size: 9px; white-space: nowrap; }
.turnover-track { display: flex; align-items: end; width: 100%; height: 44px; margin: 3px 0 4px; background: #f1f5f5; }
.turnover-fill { display: block; width: 100%; background: #87b8aa; }
.turnover-fill.latest { background: #1b806c; }
.turnover-day time { color: #89999e; font-size: 9px; white-space: nowrap; }
.turnover-source { margin: 4px 0 0; color: #96a2a5; font-size: 9px; line-height: 1.4; }
.turnover-empty { grid-column: 1 / -1; display: grid; place-items: center; color: #96a2a5; font-size: 11px; }
.panic-strip { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 13px 18px; margin-bottom: 12px; background: #fff; border: 1px solid #e3e9eb; border-left: 4px solid #a8b8bd; border-radius: 5px; }
.panic-strip .section-kicker { margin-bottom: 3px; }
.panic-strip h2 { font-size: 14px; white-space: nowrap; }
.panic-strip p:not(.section-kicker) { margin: 0; color: #687980; font-size: 11px; line-height: 1.5; }
.panic-strip.watch { border-left-color: #d6a04a; background: #fffdf7; }
.panic-strip.high { border-left-color: #c65448; background: #fff9f8; }
.panic-badge { padding: 5px 8px; border-radius: 4px; background: #edf1f2; color: #607077; font-size: 10px; white-space: nowrap; }
.panic-strip.watch .panic-badge { background: #fff0d6; color: #986517; }
.panic-strip.high .panic-badge { background: #ffe4dd; color: #b3483b; }
.status-pill { border-radius: 4px; padding: 6px 8px; font-size: 11px; white-space: nowrap; }
.status-pill.neutral { background: #eef1f2; color: #617077; }
.status-pill.watch { background: #fff0d6; color: #9a691d; }
.status-pill.strong { background: #ffe9df; color: #b25535; }
.workspace { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(310px, .95fr); gap: 12px; align-items: start; }
.primary-column, .side-column { display: grid; gap: 12px; min-width: 0; }
.panel, .decision-panel { background: #fff; border: 1px solid #e3e9eb; border-radius: 6px; }
.panel { padding: 21px 22px; }
.panel-header { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 19px; }
.panel-caption { color: #93a0a5; font-size: 10px; text-align: right; }
.chart-panel { padding-bottom: 17px; }
.chart-panel .panel-header { display: grid; justify-content: stretch; gap: 10px; }
#chart-tabs { width: 100%; overflow-x: auto; scrollbar-width: thin; }
#chart-tabs button { flex: none; }
.chart-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.tabs { display: flex; border: 1px solid #e1e7e8; border-radius: 5px; padding: 2px; background: #f6f8f8; gap: 1px; }
.tabs button { border: 0; background: transparent; color: #74838a; border-radius: 3px; padding: 6px 9px; font-size: 11px; white-space: nowrap; }
.tabs button.active { background: #fff; color: #1b5a51; box-shadow: 0 1px 4px #dce5e3; font-weight: 700; }
.tabs.compact button { padding: 6px 7px; }
.chart-summary { display: flex; align-items: baseline; gap: 12px; font-variant-numeric: tabular-nums; margin-bottom: 11px; }
.chart-summary strong { font-size: 26px; font-weight: 750; }
.chart-summary span { font-size: 12px; }
.period-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-height: 180px; }
.period-chart { min-width: 0; min-height: 146px; padding: 10px 0 8px; border-top: 1px solid #dce5e6; }
.period-chart + .period-chart { border-left: 1px solid #dce5e6; padding-left: 10px; }
.period-chart-heading, .period-chart-dates { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.period-chart-heading b { font-size: 12px; color: #33434a; }
.period-chart-heading strong { font-size: 12px; font-variant-numeric: tabular-nums; }
.period-chart canvas { display: block; width: 100%; height: 120px; margin: 8px 0 4px; }
.period-chart-dates { color: #9aa7aa; font-size: 9px; font-variant-numeric: tabular-nums; }
.period-chart-note { display: block; margin-top: 3px; color: #9aa7aa; font-size: 9px; }
.period-chart-unavailable, .chart-empty { display: grid; place-items: center; min-height: 110px; color: #95a1a6; font-size: 12px; }
.chart-empty { grid-column: 1 / -1; }
.tech-list, .etf-list, .watch-list { display: grid; }
.tech-row, .etf-row, .watch-row { display: grid; align-items: center; border-top: 1px solid #edf1f1; min-height: 65px; gap: 8px; }
.tech-row:first-child, .etf-row:first-child, .watch-row:first-child { border-top: 0; }
.tech-row { grid-template-columns: minmax(115px, 1.2fr) repeat(3, minmax(68px, .75fr)) minmax(85px, .8fr); }
.etf-row { grid-template-columns: minmax(120px, 1.3fr) repeat(3, minmax(65px, .75fr)) minmax(75px, .7fr); }
.left-rail .etf-row { grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: 0; padding: 15px 0; gap: 9px 7px; }
.left-rail .etf-row .row-title { grid-column: 1 / -1; }
.left-rail .etf-row .metric.third { grid-column: 1; }
.left-rail .etf-row .inline-label { grid-column: 2; align-self: end; }
.row-title { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.row-title b { font-size: 12px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row-title small { font-size: 10px; color: #a0abb0; }
.metric { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-variant-numeric: tabular-nums; }
.metric small { font-size: 10px; color: #9aa6aa; white-space: nowrap; }
.inline-label { font-size: 11px; color: #53656a; justify-self: end; text-align: right; }
.inline-label.good { color: #167b65; }
.inline-label.warn { color: #ab682a; }
.method-note { margin: 15px 0 0; font-size: 10px; line-height: 1.6; color: #9aa7aa; }
.list-placeholder { padding: 20px 0; font-size: 12px; color: #9aa7aa; }
.decision-panel { padding: 23px 22px; background: #fff; color: #222c36; border-color: #e3e9eb; }
.decision-panel .section-kicker { color: #758990; }
.decision-panel h2 { color: #222c36; }
.decision-state { font-size: 21px; font-weight: 750; margin-top: 23px; color: #33434a; }
.decision-state.add { color: #167b65; } .decision-state.reduce { color: #b34e3c; } .decision-state.invalid { color: #a56e26; }
.decision-detail { font-size: 12px; line-height: 1.6; color: #6e7d84; margin: 8px 0 20px; }
.conditions { display: grid; gap: 10px; border-top: 1px solid #edf1f1; padding: 17px 0; }
.condition { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 11px; }
.condition span { color: #617179; }
.condition b { font-size: 11px; font-weight: 650; white-space: nowrap; color: #607077; }
.condition b.good { color: #167b65; }
.condition b.bad { color: #b96646; }
.budget-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 17px; border-top: 1px solid #edf1f1; }
.budget-inputs label { display: grid; gap: 6px; font-size: 10px; color: #617179; }
.budget-inputs label span { display: flex; align-items: center; gap: 5px; }
.budget-inputs input { width: 72px; height: 32px; border: 1px solid #d6e0e2; background: #fff; color: #222c36; border-radius: 4px; padding: 0 7px; font-size: 13px; }
.tranche { display: grid; gap: 4px; margin-top: 16px; padding-top: 14px; border-top: 1px solid #edf1f1; font-size: 12px; line-height: 1.5; color: #42525a; }
.tranche strong { font-size: 16px; font-weight: 750; color: #263d43; }
.tranche span { color: #728188; }
.decision-panel .method-note { color: #9aa7aa; }
.sector-panel .panel-header { margin-bottom: 10px; }
.sector-rotation { margin: 0 0 13px; color: #66777d; font-size: 11px; line-height: 1.55; }
.sector-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 12px 0; border-top: 1px solid #edf1f1; }
.sector-columns small, .sector-focus small { display: block; margin-bottom: 8px; color: #8b9a9f; font-size: 10px; }
.sector-list { display: grid; gap: 7px; }
.sector-row { display: flex; justify-content: space-between; gap: 5px; min-width: 0; font-size: 11px; font-variant-numeric: tabular-nums; }
.sector-row span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sector-row b { flex: none; font-weight: 650; white-space: nowrap; }
.sector-focus { padding-top: 13px; border-top: 1px solid #edf1f1; }
.sector-focus b { display: block; font-size: 12px; color: #25383f; }
.sector-focus p { margin: 6px 0 0; color: #697b81; font-size: 11px; line-height: 1.55; }
.sector-panel .method-note { margin-top: 13px; }
.scenarios { display: grid; gap: 15px; }
.scenario { border-left: 2px solid #ccd9dc; padding-left: 12px; }
.scenario.positive { border-color: #4eab90; } .scenario.negative { border-color: #ce8069; }
.scenario b { display: block; font-size: 11px; margin-bottom: 4px; }
.scenario p { margin: 0; color: #7b8c92; line-height: 1.55; font-size: 11px; }
.watch-form { display: flex; gap: 7px; margin-bottom: 8px; }
.watch-form input { min-width: 0; flex: 1; height: 34px; border: 1px solid #dbe4e5; border-radius: 4px; padding: 0 9px; font-size: 11px; }
.watch-form button { border: 0; background: #1b6a60; color: #fff; border-radius: 4px; font-size: 11px; padding: 0 12px; white-space: nowrap; }
.watch-search { position: relative; }
.watch-suggestions { position: absolute; top: 37px; left: 0; right: 0; z-index: 10; max-height: 250px; overflow-y: auto; background: #fff; border: 1px solid #cad8d8; border-radius: 4px; box-shadow: 0 8px 20px rgba(28, 51, 57, .13); }
.watch-suggestions button { display: flex; justify-content: space-between; align-items: center; gap: 7px; width: 100%; min-height: 37px; padding: 7px 9px; border: 0; border-top: 1px solid #edf1f1; background: #fff; text-align: left; color: #33434a; font-size: 11px; }
.watch-suggestions button:first-child { border-top: 0; }
.watch-suggestions button:hover, .watch-suggestions button.active { background: #edf6f3; }
.watch-suggestions button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.watch-suggestions button small { flex: none; color: #8b999e; font-size: 10px; white-space: nowrap; }
.watch-feedback { margin: 0 0 8px; color: #167b65; font-size: 10px; line-height: 1.4; }
.watch-feedback:empty { display: none; }
.watch-feedback.error { color: #b45a43; }
.watch-row { grid-template-columns: minmax(0, 1fr) auto auto; min-height: 44px; font-size: 11px; }
.watch-row { grid-template-columns: minmax(0, 1fr) auto; min-height: 0; padding: 11px 0; }
.watch-row .watch-price { grid-column: 1 / -1; grid-row: 2; }
.watch-row button { grid-column: 2; grid-row: 1; }
.watch-row b { font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.watch-row .watch-price { font-variant-numeric: tabular-nums; white-space: nowrap; }
.watch-row button { background: transparent; border: 0; color: #a7b1b5; font-size: 17px; padding: 1px 4px; }
.watch-advice { grid-column: 1 / -1; min-width: 0; font-size: 10px; line-height: 1.5; color: #687e83; overflow-wrap: anywhere; }
.watch-advice strong { color: #52696e; font-weight: 650; }
.watch-advice.buy strong { color: #167b65; }
.watch-advice.sell strong, .watch-advice.reduce strong { color: #b34e3c; }
.watch-advice p { margin: 3px 0; }
.watch-advice small { color: #8c9b9f; font-size: 9px; }
.paper-panel { padding: 20px 16px; }
.paper-panel .panel-header { margin-bottom: 10px; }
.paper-mode { flex: none; color: #a45438; background: #fff0e7; border-radius: 4px; padding: 4px 7px; font-size: 10px; }
.paper-equity { font-size: 22px; font-weight: 750; color: #24383f; font-variant-numeric: tabular-nums; white-space: nowrap; }
.paper-stats { display: grid; gap: 6px; margin-top: 10px; color: #718188; font-size: 10px; }
.paper-stats span { display: flex; justify-content: space-between; gap: 8px; }
.paper-stats b { font-weight: 700; color: #2c4148; font-variant-numeric: tabular-nums; white-space: nowrap; }
.paper-status { margin-top: 13px; padding: 8px 9px; background: #eff5f2; color: #3d6759; border-radius: 4px; font-size: 10px; line-height: 1.4; }
.paper-time { margin-top: 5px; color: #9aa7aa; text-align: right; font-size: 9px; }
.paper-section { border-top: 1px solid #edf1f1; padding-top: 12px; margin-top: 13px; }
.paper-section-title { color: #7b8b90; font-size: 10px; font-weight: 700; margin-bottom: 8px; }
.paper-list { display: grid; gap: 9px; min-width: 0; }
.paper-row { display: grid; gap: 3px; min-width: 0; font-size: 10px; line-height: 1.4; color: #6c7c82; }
.paper-row b { color: #263c43; font-size: 11px; font-weight: 700; }
.paper-row small { font-size: 9px; font-weight: 500; color: #9aa6aa; }
.paper-row .stock-name { color: #1756b3; font-size: 14px; font-weight: 750; overflow-wrap: anywhere; line-height: 1.5; }
.watch-row b { color: #1756b3; }
.paper-risk-detail { margin-top: 7px; font-size: 10px; line-height: 1.5; color: #6d7e84; overflow-wrap: anywhere; }
.research-facts { display: grid; gap: 4px; padding-top: 8px; border-top: 1px solid #e7edef; margin-top: 5px; font-size: 10px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.candidate-verdict { font-weight: 650; color: #26715d; line-height: 1.5; overflow-wrap: anywhere; }
.candidate-verdict.blocked { color: #a45232; }
.entry-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 8px; margin: 6px 0; font-size: 10px; line-height: 1.5; }
.entry-checks span { overflow-wrap: anywhere; }
.entry-checks .passed { color: #26715d; }
.entry-checks .blocked { color: #a45232; }
.research-detail { font-size: 10px; margin-top: 6px; line-height: 1.6; }
.research-detail summary { cursor: pointer; color: #1756b3; min-height: 25px; }
.research-detail p { margin: 7px 0; overflow-wrap: anywhere; }
.research-detail p span { display: block; color: #9b563d; }
.research-detail a { color: #1756b3; text-decoration: underline; text-underline-offset: 2px; }
.breadth-panel { padding: 15px 0 13px; margin: 0 0 16px; border-top: 1px solid #dce5e8; border-bottom: 1px solid #dce5e8; min-width: 0; }
.breadth-heading { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin-bottom: 12px; }
.breadth-heading h2 { font-size: 14px; }
.breadth-heading > span { font-size: 10px; color: #788a90; }
.breadth-days { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; }
.breadth-day { min-width: 0; min-height: 52px; font-variant-numeric: tabular-nums; }
.breadth-day time { font-size: 10px; color: #819198; }
.breadth-pair { display: flex; gap: 2px; align-items: baseline; margin: 6px 0; white-space: nowrap; font-size: 11px; }
.breadth-pair > span { color: #a2adb1; }
.breadth-pair b { font-weight: 650; }
.breadth-meter { height: 3px; background: #26866e; overflow: hidden; }
.breadth-meter i { display: block; height: 100%; background: #de5f55; }
.breadth-day.missing .breadth-meter { background: #dce5e8; }
.breadth-day.missing .breadth-pair b { color: #95a2a7; }
.breadth-day.today time { color: #1756b3; font-weight: 700; }
.breadth-note, .breadth-empty { color: #85969b; font-size: 10px; margin: 9px 0 0; line-height: 1.5; }
.breadth-empty { grid-column: 1 / -1; }
@media (max-width: 1400px) { .breadth-days { grid-template-columns: repeat(5, minmax(0, 1fr)); row-gap: 10px; } .breadth-pair { font-size: 12px; } }
.paper-empty { color: #a0abae; font-size: 10px; line-height: 1.4; }
.paper-news-item { color: #566e75; font-size: 10px; line-height: 1.45; text-decoration: none; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; border-top: 1px solid #edf1f1; padding-top: 8px; }
.paper-news-item:first-child { border-top: 0; padding-top: 0; }
.paper-news-item small { display: block; color: #9ba8ac; font-size: 9px; margin-bottom: 2px; }
.paper-news-item:hover { color: #136d63; }
footer { color: #9aa7aa; font-size: 10px; line-height: 1.7; padding: 25px 2px 4px; display: flex; justify-content: space-between; gap: 15px; }
@media (max-width: 1250px) { .dashboard-layout { grid-template-columns: minmax(190px, .22fr) minmax(0, 1fr) minmax(240px, .28fr); } .indices { grid-template-columns: repeat(4, minmax(0, 1fr)); } .workspace { grid-template-columns: 1fr; } .chart-controls { justify-content: start; } .chart-panel .panel-header { display: block; } .chart-controls { margin-top: 15px; } }
@media (max-width: 1000px) { .dashboard-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); } .main-content { grid-column: 1 / -1; grid-row: 2; } .left-rail { grid-column: 1; grid-row: 3; } .right-rail { grid-column: 2; grid-row: 3; } .outer-rail .panel { position: static; min-height: 0; } .workspace { grid-template-columns: minmax(0, 1.5fr) minmax(310px, .95fr); } }
@media (max-width: 780px) { .shell { padding: 22px 14px; } .topbar { padding: 0 14px; } .dashboard-layout { grid-template-columns: 1fr; } .main-content, .left-rail, .right-rail { grid-column: 1; } .main-content { grid-row: 2; } .left-rail { grid-row: 3; } .right-rail { grid-row: 4; } .workspace { grid-template-columns: 1fr; } .brand-sub, .data-time { display: none; } .indices { grid-template-columns: repeat(2, minmax(0, 1fr)); } .signal-strip { align-items: flex-start; gap: 11px; padding: 15px; } .signal-icon { width: 31px; height: 31px; font-size: 22px; } .signal-main h2 { font-size: 17px; } .signal-side small { display: none; } .decision-panel { padding: 19px; } }
@media (max-width: 520px) { h1 { font-size: 20px; } .headline { align-items: flex-start; } .refresh-setting { font-size: 0; margin-top: 24px; } .top-actions { gap: 5px; } .market-state { font-size: 10px; } .index-tile { padding: 10px; } .index-tile .value { font-size: 17px; } .index-tile .bottom { font-size: 10px; } .panel { padding: 17px 14px; } .signal-strip { flex-wrap: wrap; } .signal-side { width: 100%; margin-left: 42px; align-items: flex-start; } .tech-row { grid-template-columns: minmax(90px, 1.1fr) repeat(2, minmax(55px, .7fr)) minmax(55px, .6fr); } .tech-row .metric.third { display: none; } .chart-controls { gap: 7px; } .tabs button { padding: 6px 7px; font-size: 10px; } .period-chart-grid { grid-template-columns: 1fr; } .period-chart + .period-chart { border-left: 0; padding-left: 0; } .period-chart canvas { height: 115px; } .period-chart { min-height: 150px; } .period-chart-dates { font-size: 8px; } .panic-strip { grid-template-columns: 1fr auto; } .panic-strip p:not(.section-kicker) { grid-column: 1 / -1; grid-row: 2; } footer { display: block; } }
.chart-panel .panel-header { display: grid; }
@media (max-width: 1250px) and (min-width: 1001px) { .signal-flow-row { grid-template-columns: 1fr; } }
@media (max-width: 780px) { .signal-flow-row { grid-template-columns: 1fr; } }
@media (max-width: 650px) { .signal-flow-row { grid-template-columns: 1fr; } .signal-strip { min-height: 150px; } .turnover-heading h2 { font-size: 14px; } }
@media (max-width: 780px) { .shell { padding-top: 8px; } .index-tile { padding-top: 6px; padding-bottom: 6px; } .signal-strip { min-height: 0; padding-top: 12px; padding-bottom: 12px; } }

/* Larger text and compact data rows keep the overview readable. */
body { font-size: 14px; }
.volume-note { margin-top: 5px; font-size: 12px; color: #718188; line-height: 1.4; }
.volume-note summary { cursor: pointer; }
h2 { font-size: 17px; }
.topbar { height: 48px; }
.shell { padding-top: 4px; }
.section-kicker { font-size: 11px; letter-spacing: 0; margin-bottom: 4px; }
.panel-caption, .rail-caption, .method-note, .data-time, .market-state { font-size: 12px; }
.row-title b, .metric, .sector-row, .watch-row, .paper-row b, .scenario b { font-size: 14px; }
.row-title small, .metric small, .inline-label, .sector-rotation, .sector-columns small, .sector-focus small,
.paper-stats, .paper-status, .paper-risk-detail, .paper-row, .paper-empty, .paper-section-title, .paper-news-item,
.watch-advice, .watch-feedback, .watch-form input, .watch-form button, .research-facts, .research-detail,
.entry-checks, .condition, .condition b, .budget-inputs label, .decision-detail, .scenario p, .sector-focus p,
.tabs button, .period-chart-dates, .period-chart-note, .preference-status { font-size: 13px; }
.paper-time, .paper-row small, .paper-news-item small, .watch-advice small { font-size: 12px; }
.paper-row .stock-name { font-size: 15px; }
.watch-form input, .watch-form button, .budget-inputs input { min-height: 34px; }
.watch-row b { white-space: normal; overflow-wrap: anywhere; }
.panel-header, .turnover-heading { min-width: 0; }
.signal-strip { min-height: 0; padding: 8px 12px; gap: 10px; }
.signal-main h2 { font-size: 18px; }
.signal-main p { font-size: 13px; margin: 4px 0 0; }
.signal-icon { display: none; }
.signal-side small { display: none; }
.turnover-panel { padding: 8px 10px; }
.turnover-heading h2 { font-size: 15px; }
.turnover-heading strong { font-size: 18px; white-space: nowrap; }
.turnover-bars { height: auto; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px 7px; margin-top: 5px; }
.turnover-day { display: grid; grid-template-columns: 1fr; justify-items: center; gap: 0; line-height: 1.2; }
.turnover-track { display: none; }
.turnover-day time { grid-row: 1; font-size: 12px; }
.turnover-value { font-size: 13px; }
.turnover-source { display: none; }
.index-tile { min-height: 0; padding: 6px 9px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 8px; border-radius: 4px; }
.index-tile .name { font-size: 13px; margin: 0; }
.index-tile .name small { display: none; }
.index-tile .value { font-size: 20px; text-align: right; }
.index-tile .bottom { grid-column: 1 / -1; font-size: 13px; margin-top: 3px; }
.index-tile .from-june { font-size: 12px; }
.left-rail .tech-row, .left-rail .etf-row { padding: 8px 0; gap: 6px; }
.method-note { margin-top: 8px; line-height: 1.45; }
.decision-panel { padding: 12px; }
.decision-state { margin-top: 10px; font-size: 22px; }
.decision-detail { margin: 5px 0 10px; line-height: 1.45; }
.conditions { padding: 8px 0; gap: 6px; }
.condition { align-items: start; gap: 8px; }
.condition span { min-width: 0; }
.budget-inputs { padding-top: 8px; gap: 8px; }
.tranche { margin-top: 8px; padding-top: 8px; font-size: 13px; }
.breadth-heading h2 { font-size: 14px; }
.breadth-heading > span, .breadth-day time, .breadth-note { font-size: 12px; }
.breadth-pair { font-size: 13px; }
.panic-strip { padding: 7px 10px; gap: 10px; }
.panic-strip h2 { font-size: 15px; }
.panic-strip p:not(.section-kicker) { font-size: 12px; }
.panic-badge, .status-pill { font-size: 12px; padding: 4px 6px; }

@media (min-width: 1180px) {
  .shell { padding: 4px 8px 0; }
  .dashboard-layout { height: calc(100dvh - 76px); grid-template-columns: clamp(270px, 16vw, 320px) minmax(0, 1fr) clamp(360px, 30vw, 560px); grid-template-rows: auto minmax(0, 1fr); gap: 6px 10px; }
  .overview { gap: 4px; }
  .indices { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .error-banner { max-height: 34px; overflow: auto; padding: 5px 8px; font-size: 12px; }
  .section-kicker { display: none; }
  .main-content, .outer-rail, .workspace, .primary-column, .side-column { min-height: 0; height: 100%; }
  .outer-rail { align-self: stretch; }
  .left-rail { grid-template-rows: minmax(0, .49fr) minmax(0, .51fr); gap: 8px; }
  .outer-rail .panel { overflow: auto; padding: 12px; scrollbar-width: thin; }
  .outer-rail .panel-header { margin-bottom: 7px; }
  .left-rail .rail-caption { display: none; }
  .left-rail .row-title { flex-direction: row; align-items: baseline; gap: 5px; }
  .left-rail .etf-row { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 5px 0; gap: 4px; }
  .left-rail .etf-row .row-title { grid-column: 1 / 3; }
  .left-rail .etf-row .inline-label { grid-column: 3; grid-row: 1; font-size: 12px; white-space: nowrap; }
  .left-rail .etf-row .metric { gap: 0; }
  .left-rail .etf-row .metric.third { grid-column: 3; display: flex; flex-direction: column; gap: 0; }
  .left-rail .etf-row .row-title b { font-size: 14px; }
  .left-rail .etf-row .row-title small { font-size: 12px; }
  .left-rail .tech-row { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 5px 0; gap: 4px; }
  .left-rail .tech-row .row-title { grid-column: 1 / 3; }
  .left-rail .tech-row .inline-label { grid-column: 3; grid-row: 1; font-size: 12px; white-space: nowrap; }
  .left-rail .tech-row .metric, .left-rail .tech-row .metric.third { display: flex; gap: 0; }
  .left-rail .tech-row .row-title b { font-size: 14px; }
  .left-rail .tech-row .row-title small { font-size: 12px; }
  .main-content { display: grid; grid-template-rows: 98px 44px 84px minmax(0, 1fr); gap: 6px; }
  .signal-flow-row { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 8px; min-height: 0; }
  .signal-strip { position: relative; display: block; padding: 9px 10px; overflow: auto; }
  .signal-main { min-width: 0; padding-right: 0; }
  .signal-main h2 { margin: 0 62px 0 0; font-size: 17px; }
  .signal-main p { line-height: 1.4; font-size: 12px; }
  .signal-side { position: absolute; right: 8px; top: 8px; width: auto; margin: 0; }
  .turnover-panel { min-height: 0; }
  .turnover-heading { gap: 4px; }
  .turnover-heading h2 { font-size: 14px; }
  .turnover-bars { gap: 3px 5px; }
  .panic-strip { margin: 0; min-height: 0; overflow: auto; grid-template-columns: auto minmax(0, 1fr) auto; }
  .panic-strip p:not(.section-kicker) { margin: 0; line-height: 1.35; }
  .breadth-panel { margin: 0; padding: 5px 0; overflow: auto; }
  .breadth-heading { margin-bottom: 3px; }
  .breadth-days { grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 5px; }
  .breadth-day { min-height: 0; }
  .breadth-pair { font-size: 12px; margin: 2px 0; gap: 1px; }
  .breadth-day time { font-size: 12px; }
  .breadth-note { margin: 3px 0 0; font-size: 11px; }
  .workspace { grid-template-columns: minmax(240px, .85fr) minmax(0, 1fr); gap: 8px; }
  .primary-column { grid-column: 2; grid-row: 1; grid-template-rows: minmax(150px, .58fr) minmax(120px, .42fr); gap: 8px; }
  .primary-column > .panel { overflow: auto; min-height: 0; padding: 10px; scrollbar-width: thin; }
  .side-column { grid-column: 1; grid-row: 1; display: block; overflow: auto; scrollbar-width: thin; }
  .side-column > section { margin-bottom: 8px; }
  .side-column .panel { padding: 12px; }
  .chart-panel .panel-header { margin-bottom: 6px; gap: 5px; }
  .chart-summary { margin-bottom: 3px; }
  .chart-summary strong { font-size: 21px; }
  .tabs button { padding: 4px 6px; font-size: 12px; }
  .period-chart-grid { min-height: 0; gap: 8px; }
  .period-chart { min-height: 0; padding-top: 5px; }
  .period-chart canvas { height: 95px; margin: 4px 0; }
  .period-chart-heading { flex-wrap: wrap; gap: 2px; }
  .period-chart-heading b, .period-chart-heading strong, .period-chart-dates { font-size: 12px; }
  .period-chart-note { font-size: 11px; }
  .right-rail { grid-template-rows: minmax(0, 1fr); }
  .right-rail .paper-panel { height: 100%; }
  .paper-panel .paper-equity { font-size: 24px; }
  .paper-stats { margin-top: 8px; gap: 5px; }
  .paper-section { margin-top: 9px; padding-top: 9px; }
  .paper-status { margin-top: 9px; }
  footer { padding: 4px 0 0; height: 22px; font-size: 11px; overflow: hidden; line-height: 1.4; }
}

@media (min-width: 1180px) and (max-height: 800px) {
  .period-chart canvas { height: 65px; }
  .period-chart-note { margin-top: 0; }
}

@media (min-width: 1180px) and (max-width: 1400px) {
  .main-content { grid-template-rows: 98px 44px 112px minmax(0, 1fr); }
  .breadth-days { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
  .primary-column { grid-template-rows: minmax(120px, .52fr) minmax(110px, .48fr); }
}

@media (max-width: 1179px) {
  .signal-flow-row { grid-template-columns: 1fr; gap: 7px; }
  .signal-strip { min-height: 0; }
  .signal-main p { font-size: 13px; }
  .turnover-bars { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .breadth-days { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .shell { padding: 4px 8px 12px; }
  .breadth-days { grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); }
  .topbar { padding: 0 8px; }
  .brand { font-size: 17px; gap: 6px; }
  .index-tile .name { font-size: 12px; }
  .index-tile .value { font-size: 18px; }
  .index-tile .from-june { display: none; }
  .turnover-bars { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .breadth-pair { font-size: 13px; }
  .signal-side { width: auto; margin: 0; }
  .signal-strip { flex-wrap: nowrap; }
  .signal-main { min-width: 0; }
  .budget-inputs input { font-size: 16px; }
  .panel, .decision-panel { padding: 13px; }
}

.chart-title-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; min-width: 0; }
.chart-panel .panic-strip { display: block; margin: 0; padding: 0; border: 0; background: transparent; flex: 1; min-width: 150px; overflow: visible; }
.chart-panel .panic-strip summary { cursor: pointer; color: #596e74; font-size: 13px; line-height: 1.6; }
.chart-panel .panic-strip.watch summary { color: #9a691d; }
.chart-panel .panic-strip.high summary { color: #b3483b; }
.chart-panel .panic-badge { margin-left: 5px; padding: 2px 5px; font-size: 12px; }
.chart-panel .panic-strip p { margin: 4px 0 0; font-size: 12px; overflow-wrap: anywhere; }
.period-chart-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.period-chart + .period-chart { border-left: 0; padding-left: 0; }
.period-chart { min-height: 0; padding: 6px 0; }
.period-chart canvas { height: 95px; }
.period-chart-heading small { min-width: 0; font-size: 12px; color: #718188; }
.period-chart-dates { font-size: 12px; }
.period-chart-unavailable { min-height: 70px; }
.turnover-panel { overflow-x: auto; }
.turnover-heading h2 { margin: 0; }
.turnover-chart { position: relative; min-width: 320px; height: 94px; margin-top: 5px; }
#turnover-line { position: absolute; left: 0; top: 19px; width: 100%; height: 56px; pointer-events: none; }
.turnover-chart .turnover-bars { display: grid; height: 94px; margin: 0; gap: 0; }
.turnover-chart .turnover-day { display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 0; line-height: 18px; }
.turnover-chart .turnover-value { font-size: 13px; color: #365b53; }
.turnover-chart .turnover-day time { font-size: 12px; grid-row: auto; }
.turnover-chart .turnover-day.today .turnover-value, .turnover-chart .turnover-day.today time { color: #167b65; font-weight: 700; }

@media (min-width: 1180px) {
  .workspace { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-column { grid-template-rows: repeat(2, minmax(0, 1fr)); }
  .main-content { grid-template-rows: 142px 84px minmax(0, 1fr); }
  .signal-flow-row { grid-template-columns: minmax(150px, .4fr) minmax(0, 1fr); }
  .signal-main h2 { margin: 0 0 5px; padding-top: 24px; }
  .signal-main p { font-size: 12px; }
  .period-chart-grid { grid-template-columns: minmax(0, 1fr); }
  .period-chart canvas { height: 82px; }
  .period-chart + .period-chart { border-left: 0; padding-left: 0; }
  .chart-panel .panel-header { display: grid; gap: 6px; }
  .chart-panel .panic-strip { margin: 0; padding: 0; }
}
@media (min-width: 1180px) and (max-width: 1400px) {
  .main-content { grid-template-rows: 142px 112px minmax(0, 1fr); }
}

/* Distinguish panel boundaries, section headings and supporting paragraphs. */
.panel, .decision-panel, .turnover-panel, .index-tile { border-color: #dce4e8; }
.panel-header { padding-bottom: 8px; border-bottom: 0; }
.panel-header h2, .decision-panel h2 { color: #172f3b; }
.decision-panel > h2 { padding-bottom: 8px; border-bottom: 0; }
.decision-detail, .paper-row, .paper-risk-detail, .watch-advice,
.scenario p, .sector-summary, .signal-main p { color: #465d68; line-height: 1.65; }
.decision-detail { margin-bottom: 12px; }
.conditions, .budget-inputs, .tranche, .sector-columns, .sector-focus,
.breadth-panel, .period-chart { border-color: #e3e9ed; }
.condition { padding: 2px 0; }
.tech-row, .etf-row, .watch-row { border-color: #e5ebee; }
.watch-row { padding-top: 12px; padding-bottom: 12px; row-gap: 6px; }
.watch-advice { padding-top: 6px; border-top: 0; }
.watch-advice strong { display: block; margin-bottom: 5px; }
.watch-advice p { margin: 5px 0; }
.watch-advice small, .paper-time, .paper-row small,
.paper-news-item small, .research-detail { color: #60747e; }
.paper-section { margin-top: 14px; padding-top: 0; border-top: 1px solid #e3e9ed; }
.paper-section-title { margin: 0 0 10px; padding: 7px 8px; background: #f6f8f9; color: #294553; font-size: 14px; font-weight: 750; line-height: 1.4; }
.paper-row { gap: 5px; }
.paper-row + .paper-row { margin-top: 12px; padding-top: 12px; border-top: 1px solid #e5ebee; }
.research-facts { margin-top: 8px; padding-top: 10px; border-color: #e5ebee; gap: 6px; color: #465d68; }
.research-detail { margin-top: 8px; line-height: 1.65; }
.research-detail summary { padding: 4px 0; }
.research-detail p { margin: 9px 0; }
.research-detail p + p { padding-top: 8px; border-top: 0; }
.research-detail p span { display: block; margin-top: 5px; }
.candidate-verdict { margin: 4px 0; line-height: 1.65; }
.entry-checks { padding: 7px 0; border-top: 0; border-bottom: 0; }
.paper-news-item { border-color: #e5ebee; padding-top: 10px; line-height: 1.65; }
.scenario + .scenario { margin-top: 10px; padding-top: 8px; }
.period-chart-heading b { color: #294553; }
.breadth-heading > span, .breadth-day time, .breadth-note,
.metric small, .row-title small, .turnover-day time { color: #60747e; }

.left-rail .breadth-panel { margin: 0; }
.left-rail .breadth-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-bottom: 8px; }
.left-rail .breadth-days { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.left-rail .breadth-day { display: grid; grid-template-columns: 62px minmax(0, 1fr); align-items: center; min-height: 25px; padding: 4px 0; border-bottom: 1px solid #edf1f3; }
.left-rail .breadth-day:last-child { border-bottom: 0; }
.left-rail .breadth-pair { justify-content: flex-end; gap: 3px; margin: 0; font-size: 13px; }
.left-rail .breadth-meter { display: none; }
.left-rail .breadth-note { margin-top: 8px; line-height: 1.5; }
.stock-chart-link { color: inherit; text-decoration: underline; text-decoration-color: #bdcde2; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.stock-chart-link:hover { color: #1756b3; text-decoration-color: currentColor; }
.stock-chart-link:focus-visible { outline: 2px solid #5689bd; outline-offset: 3px; border-radius: 2px; }
.stock-chart-dialog { width: min(1080px, calc(100vw - 32px)); height: min(740px, calc(100dvh - 40px)); max-width: none; max-height: none; padding: 18px; border: 1px solid #dce4e8; border-radius: 8px; background: #fff; color: #222c36; }
.stock-chart-dialog[open] { display: flex; flex-direction: column; gap: 12px; }
.stock-chart-dialog::backdrop { background: rgba(27,40,47,.35); }
.stock-chart-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.stock-chart-header h2 { font-size: 20px; line-height: 1.4; overflow-wrap: anywhere; }
#stock-chart-code { font-size: 12px; color: #71838c; }
.stock-chart-actions { display: flex; gap: 8px; flex: none; }
.stock-chart-tabs { width: fit-content; flex: none; }
.stock-chart-tabs button { min-width: 58px; min-height: 32px; font-size: 14px; }
.stock-chart-legend { min-height: 42px; font-size: 13px; line-height: 1.6; color: #465d68; overflow-wrap: anywhere; }
.stock-chart-surface { position: relative; flex: 1; min-height: 120px; }
#stock-chart-canvas { position: absolute; inset: 0; }
#stock-chart-message { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(255,255,255,.93); padding: 16px; text-align: center; font-size: 14px; color: #60747e; }
#stock-chart-message[hidden] { display: none; }
.stock-chart-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 11px; line-height: 1.5; color: #71838c; }
.stock-chart-footer a { color: #71838c; }
#turnover-status { color: #8a6d36; font-size: 11px; font-weight: 500; }
.company-events { display: grid; gap: 4px; min-width: 0; line-height: 1.55; overflow-wrap: anywhere; }
.allocation-plan { font-size: 14px; line-height: 1.65; color: #35596a; overflow-wrap: anywhere; margin: 5px 0; }
.allocation-plan small { display: block; color: #71838c; font-size: 12px; }
@media (min-width: 781px) {
  .indices { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.watch-row > .company-events, .advice-change { grid-column: 1 / -1; }
.company-events > span, .advice-change { color: #536975; font-size: 13px; }
.watch-advice.clear { color: #a72c35; background: #fff2f2; }
@media (max-width: 520px) {
  .stock-chart-dialog { width: calc(100vw - 12px); height: calc(100dvh - 24px); padding: 12px; }
  .stock-chart-dialog[open] { gap: 8px; }
  .stock-chart-legend { min-height: 64px; }
}
@media (min-width: 1180px) {
  .left-rail { grid-template-rows: minmax(0, 1.2fr) minmax(0, 1.3fr) minmax(0, .9fr); }
  .main-content { grid-template-rows: 142px minmax(0, 1fr); }
  .primary-column { grid-template-rows: minmax(0, 1fr); }
}
.decision-panel[hidden] { display: none; }
.watch-panel[hidden], .paper-list[hidden] { display: none; }
.strategy-panel { min-width: 0; }
.strategy-panel .panel-header { flex-wrap: wrap; }
.strategy-panel .tabs { flex: none; }
.strategy-panel .paper-row { padding: 8px 0; }
.strategy-switches { display: flex; flex-wrap: wrap; gap: 5px 14px; padding: 0 0 10px; border-bottom: 1px solid #e5ebee; color: #526872; font-size: 11px; }
.strategy-switches label { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.strategy-switches small { flex-basis: 100%; color: #617d74; }
.t-plan { display: grid; gap: 2px; padding: 6px 8px; border-left: 2px solid #4f9a83; background: #eef5f2; font-size: 11px; line-height: 1.45; color: #3b5d56; }
.t-plan b { font-size: 11px; }
.paper-panel .panel-header h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.paper-position-hint { font-size: 13px; font-weight: 500; color: #617b83; }
.paper-account-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 10px 0 2px; }
#paper-capital-form { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 13px; }
#paper-capital { width: 132px; min-width: 0; padding: 5px 7px; border: 1px solid #cfdae0; border-radius: 4px; font-size: 13px; }
.paper-account-controls button { padding: 5px 10px; border: 1px solid #d7e2e7; border-radius: 4px; background: #f8fbfc; color: #355969; cursor: pointer; }
.paper-account-controls button:disabled { opacity: .5; cursor: default; }
#paper-reset { color: #a63838; border-color: #e5caca; }
.paper-account-feedback { min-height: 18px; margin: 2px 0 0; color: #536975; font-size: 12px; }
.watch-holding, .watch-tools { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 5px 10px; min-width: 0; }
.watch-holding { flex-direction: column; font-size: 13px; line-height: 1.5; color: #536975; }
.watch-tools button { font-size: 13px; padding: 5px 12px; border: 1px solid #d7e2e7; border-radius: 4px; color: #355969; background: #f8fbfc; }
.watch-tools button:disabled { opacity: .4; cursor: default; }
.watch-trade-dialog { width: min(440px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 18px; border: 1px solid #d7e2e7; border-radius: 6px; color: #284653; }
.watch-trade-dialog::backdrop { background: rgba(20, 35, 43, .35); }
.watch-trade-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.watch-trade-header h2 { font-size: 17px; margin: 0; overflow-wrap: anywhere; }
.watch-trade-dialog p { font-size: 13px; line-height: 1.6; }
.watch-trade-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.watch-trade-fields label { display: grid; gap: 6px; min-width: 0; font-size: 13px; }
.watch-trade-fields input { width: 100%; min-width: 0; padding: 7px; border: 1px solid #cfdae0; border-radius: 4px; color: #284653; font-size: 14px; }
.watch-trade-error { color: #b03d3d; }
.watch-trade-submit { width: 100%; padding: 9px; border: 0; border-radius: 4px; background: #1b6a60; color: white; font-size: 14px; }
.watch-trade-submit:disabled { opacity: .5; }
@media (max-width: 400px) { .watch-trade-fields { grid-template-columns: minmax(0, 1fr); } }
.watch-heading { flex-wrap: wrap; gap: 8px 12px; }
#watch-budget-form { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 13px; }
#watch-budget { width: 112px; min-width: 0; padding: 5px 7px; border: 1px solid #cfdae0; border-radius: 4px; font-size: 13px; }
#watch-budget-form button { padding: 5px 9px; border: 1px solid #d7e2e7; border-radius: 4px; background: #f8fbfc; color: #355969; }
.watch-budget-status { margin: 4px 0 8px; font-size: 12px; color: #536975; line-height: 1.5; }