@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #202a36;
  background: #f4f5f7;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --ink: #202a36;
  --muted: #778391;
  --soft: #9aa3ae;
  --line: #e8ebef;
  --green: #16876d;
  --green-bg: #e9f5f0;
  --red: #c05450;
  --red-bg: #fbefed;
  --amber: #a96f1e;
  --amber-bg: #fbf4e8;
  --blue: #5575bc;
  --card: #fff;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
button, input, select { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }
.app-shell { min-height: 100vh; }

.sidebar {
  width: 238px; position: fixed; inset: 0 auto 0 0; z-index: 5; display: flex; flex-direction: column;
  padding: 24px 15px 16px; background: #fbfcfd; border-right: 1px solid #e6e9ee;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 2px 9px 32px; color: var(--ink); text-decoration: none; font: 800 18px 'Manrope', sans-serif; letter-spacing: -.7px; }
.brand-mark { display: grid; width: 30px; height: 30px; place-items: center; color: #fff; border-radius: 9px; background: #243242; font: 800 15px 'Manrope', sans-serif; }
.brand-dot { color: #42a88c; }
.sidebar-label { display: flex; align-items: center; justify-content: space-between; padding: 0 11px; color: #9aa4b0; font-size: 9px; font-weight: 700; letter-spacing: 1.25px; }
.side-link { width: 100%; margin: 9px 0 30px; display: flex; gap: 11px; align-items: center; padding: 11px 12px; text-align: left; border: 0; border-radius: 7px; background: #eaf0f4; color: #273b4c; font-size: 12px; font-weight: 600; }
.side-icon { font-size: 16px; color: #4d6a7d; }
.watch-label { margin-bottom: 12px; }
.icon-button { display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #82909e; cursor: pointer; }
.icon-button.small { width: 21px; height: 21px; border-radius: 5px; font-size: 17px; }
.icon-button.small:hover { background: #eef1f4; }
.watchlist { display: grid; gap: 3px; }
.watch-item { display: flex; align-items: center; gap: 10px; min-height: 39px; padding: 5px 9px; border: 0; border-radius: 6px; background: transparent; text-align: left; font-size: 11px; color: #5d6875; cursor: pointer; }
.watch-item:hover, .watch-item.selected { background: #eff3f5; color: #263744; }
.watch-token { display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid #edf0f2; border-radius: 50%; background: #fff; color: #657282; font-size: 8px; font-weight: 700; }
.watch-arrow { margin-left: auto; color: #9aa3ae; font-size: 17px; }
.watch-empty { padding: 8px 11px; color: #929ca8; font-size: 11px; line-height: 1.5; }
.sidebar-bottom { margin-top: auto; padding: 10px 9px 0; }
.spot-only { display: flex; align-items: center; gap: 9px; padding: 11px 10px; border: 1px solid #e7eee9; border-radius: 7px; background: #f8fbf9; }
.spot-dot { width: 7px; height: 7px; border-radius: 50%; background: #249273; box-shadow: 0 0 0 3px #e0f1ea; }
.spot-only b, .spot-only small { display: block; }
.spot-only b { font-size: 10px; font-weight: 600; }
.spot-only small { margin-top: 3px; color: #83908a; font-size: 9px; }
.sidebar-bottom p { margin: 11px 1px 0; color: #929ba6; font-size: 9px; line-height: 1.6; }

.main-content { max-width: 1680px; margin-left: 238px; padding: 27px 35px 20px; }
.topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 19px; }
.eyebrow { color: #8b96a2; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; }
.crumb { padding: 0 7px; color: #c4cad0; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: 'Manrope', 'DM Sans', sans-serif; color: var(--ink); }
h1 { margin: 6px 0 0; font-size: 22px; font-weight: 700; letter-spacing: -.65px; }
h2 { margin: 4px 0 0; font-size: 15px; font-weight: 700; letter-spacing: -.25px; }
h3 { margin: 4px 0 0; font-size: 13px; font-weight: 700; letter-spacing: -.15px; }
.topbar-actions { display: flex; align-items: center; gap: 17px; }
.mode-switch { display: flex; align-items: center; gap: 7px; color: #7e8995; font-size: 10px; cursor: pointer; }
.mode-switch input { position: absolute; opacity: 0; pointer-events: none; }
.switch-track { position: relative; width: 29px; height: 16px; border-radius: 10px; background: #d4dae0; transition: .18s ease; }
.switch-track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: white; box-shadow: 0 1px 2px #6673; transition: .18s ease; }
.mode-switch input:checked + .switch-track { background: #527894; }
.mode-switch input:checked + .switch-track::after { transform: translateX(13px); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 33px; padding: 0 12px; border: 1px solid transparent; border-radius: 6px; font-size: 10px; font-weight: 600; cursor: pointer; }
.button.secondary { border-color: #e2e6eb; background: white; color: #3c4b5a; box-shadow: 0 1px 1px #18233008; }
.button.secondary:hover { background: #f9fafb; }
.button.primary { border-color: #34495a; background: #34495a; color: white; }
.refresh-icon { font-size: 16px; line-height: 1; }

.panel { border: 1px solid #e8ebef; border-radius: 9px; background: var(--card); box-shadow: 0 2px 8px #24334204; }
.controls { display: grid; grid-template-columns: minmax(180px, 1.15fr) minmax(125px, .68fr) minmax(130px, .7fr) minmax(190px, 1fr); align-items: end; gap: 13px; padding: 12px 14px; margin-bottom: 14px; }
.field { display: grid; gap: 6px; }
.field > span { color: #98a1ac; font-size: 8px; font-weight: 700; letter-spacing: 1px; }
.search-wrap { position: relative; display: flex; align-items: center; height: 34px; border: 1px solid #e7eaee; border-radius: 6px; background: #fff; }
.search-icon { padding-left: 10px; color: #87919c; font-size: 18px; }
.search-wrap input { width: 100%; min-width: 0; border: 0; outline: 0; padding: 0 7px; color: #2b3846; background: transparent; font-size: 11px; font-weight: 600; text-transform: uppercase; }
.favorite-button { width: 34px; height: 32px; border: 0; background: transparent; color: #aab2bb; font-size: 19px; cursor: pointer; }
.favorite-button.is-favorite { color: #cb963e; }
.field select, .ownership-field select { min-width: 0; height: 34px; border: 1px solid #e7eaee; border-radius: 6px; padding: 0 9px; outline: 0; background: #fff; color: #42505e; font-size: 10px; }
.data-status { display: flex; min-height: 34px; align-items: center; gap: 8px; padding-left: 9px; }
.status-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #94a2ad; }
.data-status.ready .status-dot { background: #259270; box-shadow: 0 0 0 3px #e9f5f0; }
.data-status.loading .status-dot { background: #d49b42; box-shadow: 0 0 0 3px #fbf4e8; }
.data-status.error .status-dot { background: #ca625d; box-shadow: 0 0 0 3px #f9e9e7; }
.data-status.partial .status-dot { background: #cb9136; box-shadow: 0 0 0 3px #fbf4e8; }
.data-status b, .data-status small { display: block; }
.data-status b { color: #52606d; font-size: 10px; font-weight: 600; }
.data-status small { max-width: 190px; margin-top: 2px; color: #939ca7; font-size: 8px; }
.error-banner { padding: 10px 13px; margin: -5px 0 14px; border: 1px solid #efd3d0; border-radius: 7px; background: #fff7f6; color: #99524e; font-size: 10px; line-height: 1.5; }
.error-banner.partial { border-color: #efdfbe; background: #fffaf0; color: #916a2e; }

.overview-grid { display: grid; grid-template-columns: minmax(0, 1.57fr) minmax(280px, .83fr); gap: 14px; margin-bottom: 14px; }
.decision-card { min-height: 205px; padding: 16px 18px 11px; }
.section-top { display: flex; justify-content: space-between; align-items: flex-start; }
.decision-card h2 { margin-top: 5px; font-size: 17px; }
.decision-badge { display: inline-flex; align-items: center; min-height: 23px; padding: 0 9px; border-radius: 5px; font-size: 8px; font-weight: 700; letter-spacing: .45px; white-space: nowrap; }
.decision-badge.favorable { background: var(--green-bg); color: var(--green); }
.decision-badge.caution { background: var(--amber-bg); color: var(--amber); }
.decision-badge.unfavorable { background: var(--red-bg); color: var(--red); }
.decision-badge.neutral { background: #eef2f6; color: #6d7e90; }
.decision-main { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 11px 0 12px; }
.decision-title { color: #273544; font: 700 17px 'Manrope', sans-serif; letter-spacing: -.4px; }
.decision-why { max-width: 690px; margin: 5px 0 0; color: #7e8995; font-size: 10px; line-height: 1.55; }
.score-ring { position: relative; flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 62px; height: 62px; border-radius: 50%; background: conic-gradient(#55917b var(--score, 0%), #edf0f2 var(--score, 0%)); }
.score-ring::before { position: absolute; content: ''; width: 51px; height: 51px; border-radius: 50%; background: #fff; }
.score-ring > * { position: relative; }
.score-ring span { color: #2d4050; font: 700 16px 'Manrope', sans-serif; }
.score-ring small { margin-top: 1px; color: #9aa3ad; font-size: 6px; font-weight: 700; letter-spacing: .45px; line-height: 1.2; text-align: center; }
.quick-stats { display: grid; grid-template-columns: repeat(4, 1fr); padding: 10px 0 9px; border-top: 1px solid #eef0f2; }
.quick-stats > div { display: grid; gap: 4px; padding: 0 9px; border-right: 1px solid #edf0f2; }
.quick-stats > div:first-child { padding-left: 0; }
.quick-stats > div:last-child { border: 0; }
.quick-stats span { color: #9aa2ac; font-size: 8px; }
.quick-stats b { color: #4c5967; font-size: 10px; font-weight: 600; }
.positive-text { color: var(--green) !important; }
.negative-text { color: var(--red) !important; }
.neutral-text { color: #6b7886 !important; }
.decision-foot { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; border-top: 1px solid #f0f1f3; color: #a0a8b1; font-size: 8px; }
.text-button { border: 0; background: transparent; color: #58728a; font-size: 9px; cursor: pointer; }
.text-button span { margin-left: 3px; }
.price-card { min-height: 205px; padding: 16px 17px 11px; }
.price-label { display: block; margin-top: 10px; color: #8e98a3; font-size: 9px; }
.live-tag { display: inline-flex; align-items: center; gap: 5px; margin-top: 2px; padding: 5px 7px; border-radius: 4px; background: #f0f6f3; color: #5d8776; font-size: 7px; font-weight: 700; letter-spacing: .55px; }
.live-tag i { width: 5px; height: 5px; border-radius: 50%; background: #289576; }
.price-value { overflow: hidden; margin: 5px 0 3px; color: #243341; font: 700 clamp(22px, 2.1vw, 30px) 'Manrope', sans-serif; letter-spacing: -1px; text-overflow: ellipsis; white-space: nowrap; }
.price-change { display: flex; align-items: center; gap: 7px; }
.change-chip { padding: 3px 6px; border-radius: 4px; background: #f0f2f4; color: #6e7a86; font-size: 9px; font-weight: 600; }
.change-chip.positive { background: var(--green-bg); color: var(--green); }
.change-chip.negative { background: var(--red-bg); color: var(--red); }
.muted { color: #98a1ab; font-size: 9px; }
.price-range { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 12px 0 10px; margin-top: 9px; border-top: 1px solid #eef0f2; }
.price-range > div { display: grid; gap: 4px; }
.price-range span, .price-range b { white-space: nowrap; }
.price-range span { color: #9ba4ae; font-size: 8px; }
.price-range b { color: #53606d; font-size: 9px; font-weight: 600; }
.update-line { display: flex; justify-content: space-between; padding-top: 8px; border-top: 1px solid #f0f1f3; color: #a0a8b1; font-size: 8px; }
.update-line b { color: #788490; font-weight: 500; }

.chart-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(218px, 265px); gap: 14px; margin-bottom: 14px; }
.chart-panel { min-width: 0; padding: 15px 15px 9px; }
.chart-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.chart-heading h2 { margin-top: 4px; }
.chart-heading h2 span { padding: 0 3px; color: #aeb6bf; }
.chart-toggle-list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px 11px; padding-top: 2px; }
.chart-toggle-list label { display: flex; align-items: center; gap: 4px; color: #737f8c; font-size: 8px; white-space: nowrap; cursor: pointer; }
.chart-toggle-list input { width: 10px; height: 10px; margin: 0; accent-color: #5374ac; }
.pro-only { display: none !important; }
.pro-mode .pro-only, .pro-mode .pro-only.visible-pro { display: flex !important; }
.chart-legend { display: flex; gap: 12px; margin: 9px 0 0 3px; color: #89939f; font-size: 8px; }
.chart-legend span { display: flex; align-items: center; gap: 4px; }
.chart-legend i { display: inline-block; width: 9px; height: 3px; border-radius: 3px; }
.legend-up { background: #188c70; }.legend-down { background: #d26462; }.legend-ema20 { background: #4e77d0; }.legend-ema50 { background: #ad7b35; }
.legend-ema200 { background: #915ab3; }.legend-vwap { background: #21899a; }.legend-bollinger { background: #a884b7; }
.canvas-wrap { position: relative; height: 337px; margin-top: 5px; }
#priceChart { display: block; width: 100%; height: 100%; touch-action: pan-y; }
.chart-tooltip { position: absolute; z-index: 2; display: grid; gap: 4px; min-width: 136px; padding: 8px 10px; border: 1px solid #e8ebef; border-radius: 6px; background: #fff; box-shadow: 0 5px 15px #1d2a381a; color: #64717e; font-size: 8px; pointer-events: none; }
.chart-tooltip b { margin-bottom: 1px; color: #354351; font-size: 9px; }
.chart-loading { position: absolute; inset: 0; display: grid; place-items: center; background: #ffffffd9; color: #798592; font-size: 10px; }
.chart-footer { display: flex; justify-content: space-between; color: #a1a9b1; font-size: 8px; }
.levels-column { display: grid; grid-template-rows: 1.1fr .9fr; gap: 14px; }
.levels-card, .entry-card { min-width: 0; padding: 15px 14px 12px; }
.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; }
.help-button { width: 19px; height: 19px; border: 1px solid #e5e9ed; border-radius: 50%; background: white; color: #87939f; font-size: 10px; cursor: help; }
.levels-list { display: grid; gap: 0; margin-top: 10px; }
.level-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 41px; border-top: 1px solid #f0f2f4; }
.level-row > div, .level-value { display: grid; gap: 3px; }
.level-row b { color: #596572; font-size: 9px; font-weight: 600; }
.level-row small { color: #a0a8b1; font-size: 8px; }
.level-row.resistance .level-value b { color: #ae7954; }
.level-row.support .level-value b { color: #4c8e78; }
.level-value { text-align: right; }
.entry-card h3 { margin-bottom: 9px; }
.ownership-field { display: flex; justify-content: space-between; align-items: center; gap: 7px; margin-bottom: 8px; color: #89939e; font-size: 8px; }
.ownership-field select { flex: 1; height: 27px; padding: 0 5px; color: #64717d; font-size: 8px; }
.entry-plan { display: grid; gap: 5px; }
.entry-range { display: grid; gap: 4px; padding: 8px 9px; border: 1px solid #e5efe9; border-radius: 6px; background: #f6fbf8; }
.entry-range span, .plan-row span { color: #909a9f; font-size: 8px; }
.entry-range b { color: #33826a; font: 700 13px 'Manrope', sans-serif; }
.plan-row { display: flex; justify-content: space-between; gap: 8px; padding: 4px 1px; border-bottom: 1px solid #f1f3f4; }
.plan-row b { color: #5b6874; font-size: 8px; font-weight: 600; text-align: right; }
.rr-row { border-bottom: 0; }
.entry-explainer { color: #909ba5; font-size: 8px; line-height: 1.45; }
.entry-note { margin-top: 7px; color: #a4abb2; font-size: 7px; line-height: 1.4; }
.no-plan { display: grid; justify-items: start; gap: 5px; padding: 8px 0 3px; }
.no-plan-icon { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #fbf4e8; color: #aa762b; }
.no-plan b { color: #7b694f; font-size: 9px; }
.no-plan p, .no-plan small { margin: 0; color: #939da6; font-size: 8px; line-height: 1.45; }
.holding-note { padding: 6px 7px; border-radius: 5px; background: #f2f5f8; color: #778492; font-size: 8px; line-height: 1.4; }
.empty-state { padding: 12px 3px; color: #9ca5ae; font-size: 9px; line-height: 1.45; }

.two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.section-panel { min-width: 0; padding: 15px 17px; }
.learn-icon { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid #e7ecef; border-radius: 7px; color: #6a8e82; }
.summary-copy { margin-top: 11px; }
.summary-copy p { margin: 0 0 8px; color: #77838e; font-size: 10px; line-height: 1.6; }
.summary-copy p b { color: #485865; font-weight: 600; }
.wait-for { padding: 9px 10px; border-left: 2px solid #c9a05c; border-radius: 0 5px 5px 0; background: #fbf8f1; }
.wait-for b { color: #78633e; font-size: 9px; }
.wait-for p { margin: 4px 0 0; color: #897f6a; font-size: 9px; line-height: 1.45; }
.conditions { margin-top: 10px; }
.condition-group { padding: 8px 9px; border: 1px solid #e9f0eb; border-radius: 6px; background: #f9fcfa; }
.condition-group > b { color: #4d7d6a; font-size: 9px; font-weight: 600; }
.condition-group ul, .risk-details ul { display: grid; gap: 6px; padding: 0; margin: 8px 0 0; list-style: none; }
.condition-group li { display: flex; gap: 7px; color: #74817d; font-size: 8px; line-height: 1.4; }
.condition-check { color: #3a9b75; font-weight: 700; }
.invalidation-group { margin-top: 7px; border-color: #f1e8de; background: #fdfaf6; }
.invalidation-group > b { color: #a17b50; }
.condition-x { color: #c78662; font-weight: 700; }
.condition-foot { margin: 8px 1px 0; color: #a0a8ae; font-size: 8px; }
.risk-details { margin-top: 9px; border-top: 1px solid #f0f2f4; padding-top: 8px; }
.risk-details summary { color: #66727d; font-size: 9px; font-weight: 600; cursor: pointer; }
.risk-details ul { padding-left: 15px; list-style: disc; }
.risk-details li { color: #85909b; font-size: 8px; line-height: 1.45; }

.mtf-panel { padding: 15px 17px 11px; margin-bottom: 16px; }
.subheading { margin: 5px 0 0; color: #939da7; font-size: 9px; }
.timeframe-pill { padding: 5px 8px; border: 1px solid #e8ebef; border-radius: 5px; color: #788490; font-size: 8px; }
.table-scroll { overflow-x: auto; margin-top: 12px; }
table { width: 100%; min-width: 560px; border-collapse: collapse; text-align: left; }
th { padding: 8px 7px; border-bottom: 1px solid #eaedf0; color: #9ba4ad; font-size: 8px; font-weight: 600; }
td { padding: 8px 7px; border-bottom: 1px solid #f1f3f5; color: #77838e; font-size: 9px; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
td:first-child b, td:first-child small { display: block; }
td:first-child b { color: #495967; font-size: 9px; }
td:first-child small { margin-top: 3px; color: #a1a9b0; font-size: 7px; }
.table-state { display: inline-block; padding: 3px 6px; border-radius: 4px; background: #f0f2f4; color: #788590; font-size: 8px; }
.table-state.bullish { background: #eaf5f0; color: #40866e; }
.table-state.bearish { background: #faeeec; color: #b55f59; }
.mtf-read { margin: 8px 1px 0; color: #919ca6; font-size: 8px; line-height: 1.5; }

.pro-section { display: grid; gap: 12px; margin-bottom: 16px; }
.pro-header { display: flex; justify-content: space-between; align-items: end; padding: 3px 2px; }
.pro-header h2 { margin-top: 5px; font-size: 17px; }
.pro-header > span { color: #96a0aa; font-size: 9px; }
.pro-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 12px; }
.pro-grid .section-panel { padding: 14px 15px; }
.indicator-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
.indicator-item { align-self: start; padding: 8px 9px; border: 1px solid #edf0f2; border-radius: 6px; }
.indicator-item summary { display: flex; justify-content: space-between; align-items: center; gap: 6px; color: #88929c; font-size: 8px; cursor: pointer; list-style: none; }
.indicator-item summary::-webkit-details-marker { display: none; }
.indicator-item summary::after { content: '+'; color: #9aa4ad; font-size: 11px; }
.indicator-item[open] summary::after { content: '−'; }
.indicator-item summary b { color: #596674; font-size: 8px; font-weight: 600; text-align: right; }
.indicator-item p { margin: 8px 0 0; color: #89949e; font-size: 8px; line-height: 1.5; }
.score-breakdown { display: grid; gap: 9px; margin-top: 11px; }
.score-row { display: grid; grid-template-columns: minmax(95px, 1fr) minmax(55px, 1.5fr) 22px; align-items: center; gap: 8px; color: #7d8995; font-size: 8px; }
.score-row > b { color: #596774; font-size: 8px; text-align: right; }
.score-track { overflow: hidden; height: 4px; border-radius: 4px; background: #eef0f2; }
.score-track i { display: block; height: 100%; border-radius: inherit; background: #6a9a86; }
.score-note { margin: 10px 0 0; color: #a0a8af; font-size: 8px; line-height: 1.5; }
.overall-score { display: flex; justify-content: space-between; padding-top: 8px; margin-top: 2px; border-top: 1px solid #eceff1; color: #4e5c69; font-size: 9px; font-weight: 600; }
.overall-score b { color: #3f7d67; font: 700 14px 'Manrope', sans-serif; }
.audit-panel { padding: 14px 15px; }
.audit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin-top: 11px; }
.audit-grid h3 { margin: 0 0 7px; color: #64717c; font-size: 9px; }
.audit-grid ul { display: grid; gap: 5px; padding-left: 14px; margin: 0; color: #82909a; font-size: 8px; line-height: 1.45; }
.audit-conclusion { grid-column: 1 / -1; padding: 9px 10px; border-radius: 5px; background: #f5f7f8; }
.audit-conclusion b { color: #526170; font-size: 9px; }
.audit-conclusion p { margin: 4px 0 0; color: #82909a; font-size: 8px; line-height: 1.45; }
.pro-section > .section-panel > p { margin: 9px 0 0; color: #788590; font-size: 9px; line-height: 1.55; }
.pro-section > .section-panel > p.muted { color: #9aa3ac; }
.app-footer { display: flex; justify-content: space-between; gap: 10px; padding: 4px 1px 0; color: #a3abb4; font-size: 8px; }
.app-footer b { padding: 0 3px; color: #c5cbd1; }

.explain-dialog { width: min(440px, calc(100vw - 30px)); padding: 22px; border: 1px solid #e8ebef; border-radius: 10px; box-shadow: 0 20px 80px #101c2c2e; }
.explain-dialog::backdrop { background: #1e2b3b66; }
.explain-dialog form { position: relative; }
.explain-dialog h2 { margin: 6px 0 13px; font-size: 18px; }
.explain-dialog p { color: #74808b; font-size: 10px; line-height: 1.6; }
.explain-dialog p b { color: #465563; }
.dialog-close { position: absolute; top: -11px; right: -8px; width: 26px; height: 26px; border: 0; border-radius: 50%; background: #f0f2f4; color: #74808b; font-size: 19px; cursor: pointer; }

@media (min-width: 1500px) { .main-content { padding-right: 48px; padding-left: 48px; } }
@media (max-width: 1180px) {
  .main-content { padding-right: 22px; padding-left: 22px; }
  .sidebar { width: 210px; }
  .main-content { margin-left: 210px; }
  .controls { grid-template-columns: minmax(165px, 1fr) 115px 120px minmax(160px, .9fr); }
  .chart-layout { grid-template-columns: minmax(0, 1fr) 225px; }
  .canvas-wrap { height: 310px; }
}
@media (max-width: 920px) {
  .sidebar { width: 64px; align-items: center; padding: 17px 7px 11px; }
  .brand { padding: 0 0 26px; }
  .brand > span:last-child, .sidebar-label, .side-link:not(.active), .watchlist, .sidebar-bottom { display: none; }
  .side-link { justify-content: center; width: 42px; height: 40px; margin: 0 0 16px; padding: 0; font-size: 0; }
  .side-icon { font-size: 16px; }
  .main-content { margin-left: 64px; padding: 22px 19px 18px; }
  .controls { grid-template-columns: minmax(145px, 1fr) minmax(105px, .6fr) minmax(112px, .65fr); }
  .data-status { grid-column: 1 / -1; padding: 3px 2px 0; }
  .overview-grid { grid-template-columns: minmax(0, 1.3fr) minmax(250px, .8fr); }
  .chart-layout { grid-template-columns: minmax(0, 1fr); }
  .levels-column { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
  .levels-card, .entry-card { min-height: 150px; }
  .canvas-wrap { height: 350px; }
}
@media (max-width: 650px) {
  .main-content { padding: 15px 12px 14px; }
  .sidebar { width: 52px; }
  .brand-mark { width: 28px; height: 28px; }
  .main-content { margin-left: 52px; }
  .topbar { align-items: flex-start; margin-bottom: 13px; }
  .eyebrow { font-size: 8px; }
  h1 { font-size: 19px; }
  .topbar-actions { align-items: flex-end; gap: 8px; }
  .mode-switch { gap: 4px; font-size: 8px; }
  .button.secondary { min-height: 30px; padding: 0 8px; font-size: 9px; }
  .controls { grid-template-columns: 1fr 1fr; gap: 9px; padding: 10px; }
  .symbol-field { grid-column: 1 / -1; }
  .data-status { grid-column: 1 / -1; }
  .overview-grid, .two-column { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-bottom: 10px; }
  .decision-card, .price-card { min-height: unset; }
  .decision-card { padding: 13px 13px 10px; }
  .decision-title { font-size: 15px; }
  .decision-why { font-size: 9px; }
  .score-ring { width: 56px; height: 56px; }
  .score-ring::before { width: 46px; height: 46px; }
  .quick-stats { grid-template-columns: repeat(2, 1fr); row-gap: 10px; }
  .quick-stats > div:nth-child(2) { border-right: 0; }
  .quick-stats > div:nth-child(3) { padding-left: 0; }
  .price-card { padding: 13px; }
  .chart-layout { gap: 10px; margin-bottom: 10px; }
  .chart-panel { padding: 12px 9px 8px; }
  .chart-heading { display: block; }
  .chart-toggle-list { justify-content: flex-start; gap: 7px 10px; margin-top: 10px; }
  .chart-legend { margin-left: 1px; gap: 9px; }
  .canvas-wrap { height: 280px; margin-right: -3px; margin-left: -3px; }
  .chart-footer { font-size: 7px; }
  .levels-column { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .levels-card, .entry-card { min-height: unset; padding: 13px; }
  .section-panel, .mtf-panel { padding: 13px; }
  .indicator-grid, .pro-grid, .audit-grid { grid-template-columns: minmax(0, 1fr); }
  .audit-conclusion { grid-column: auto; }
  .pro-header > span { display: none; }
  .app-footer { flex-direction: column; font-size: 7px; }
}