/* v28 — professional split market workspace, scoped to Thị trường only */
#view-markets{padding-top:0}
.market-pro-layout{display:grid;grid-template-columns:minmax(350px,420px) minmax(0,1fr);gap:16px;align-items:start}
.market-browser{min-width:0}
#view-markets .market-head{margin-bottom:10px;align-items:end}
#view-markets .market-head small{display:none}
#view-markets .market-head h1{font:800 1.55rem/1.05 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;margin:0 0 5px}
#view-markets .market-head p{font-size:.78rem;margin:0}
#view-markets .catalog-toolbar{padding:10px;display:grid;gap:10px;border-radius:13px!important}
#view-markets .catalog-tabs{display:flex;gap:6px;overflow:auto;padding-bottom:1px}
#view-markets .catalog-tabs button{height:34px;border-radius:8px;padding:0 10px;font-size:.74rem;font-weight:750;white-space:nowrap}
#view-markets .catalog-tabs button.active{background:#e31e35!important;color:#fff!important;border-color:#e31e35!important;box-shadow:0 5px 14px rgba(227,30,53,.18)}
#view-markets .catalog-search{height:40px;border-radius:9px;padding:0 10px}
#view-markets .catalog-search input{font-size:.78rem}
#view-markets .catalog-status{display:flex;align-items:center;gap:5px;padding:8px 2px 7px;font-size:.72rem}
#view-markets .catalog-status #catalogTotal{margin-left:auto;font-size:.72rem}
#view-markets .catalog-status small{font-size:.62rem;opacity:.7}
#view-markets .catalog-list{padding:0!important;overflow:hidden;border-radius:12px!important}
#view-markets .catalog-row{grid-template-columns:38px minmax(0,1fr) 78px 72px 30px!important;gap:8px!important;padding:9px 10px!important;min-height:67px;border-radius:0!important;border-left:0!important;border-right:0!important}
#view-markets .catalog-row:first-child{border-top:0!important}
#view-markets .market-badge{width:30px;height:24px;align-self:center}
#view-markets .market-flag{width:29px;height:21px;border-radius:6px}
#view-markets .catalog-company{min-width:0}
#view-markets .catalog-company b{font-size:.78rem!important}
#view-markets .catalog-company span{font-size:.67rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
#view-markets .catalog-company small{font-size:.58rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#view-markets .catalog-company:after{display:none!important}
#view-markets .catalog-company .session-badge{display:none!important}
#view-markets .catalog-quote{text-align:right;align-self:center;gap:2px}
#view-markets .catalog-quote>b{font-size:.77rem!important}
#view-markets .catalog-quote>span{font-size:.64rem!important;font-weight:800}
#view-markets .catalog-chart .spark{width:68px;height:30px}
#view-markets [data-add-catalog]{font-size:0!important;width:28px;height:28px;padding:0!important;border:0!important;background:transparent!important;position:relative}
#view-markets [data-add-catalog]:after{content:'☆';font-size:21px;color:#52657a}
#view-markets [data-add-catalog].added:after{content:'★';color:#e31e35}
#view-markets .catalog-row.market-preview-active{background:rgba(227,30,53,.08)!important;box-shadow:inset 3px 0 #e31e35}
.market-preview{position:sticky;top:86px;padding:16px!important;min-height:700px;border-radius:14px!important;overflow:hidden}
.market-preview-empty{min-height:620px;display:grid;place-items:center;align-content:center;text-align:center;gap:8px;color:#708197}
.market-preview-empty span{font-size:3rem;color:#e31e35}.market-preview-empty h2{margin:0}.market-preview-empty p{max-width:360px;margin:0;line-height:1.6}
.market-preview-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.market-preview-id{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center}
.market-preview-id>.market-flag{width:50px;height:38px;border-radius:9px}
.market-preview-id h2{font:800 1.38rem/1 system-ui;margin:0 0 5px}
.market-preview-id p{font-size:.76rem;margin:0;color:#6e8196;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:500px}
.market-preview-id small{font-size:.65rem;color:#6e8196}
.market-preview-watch{height:38px;border-radius:9px;padding:0 12px;font-weight:750;white-space:nowrap}
.market-preview-pricebar{display:flex;align-items:end;gap:10px;margin-bottom:14px}
.market-preview-pricebar strong{font-size:2.15rem;line-height:1;letter-spacing:-.03em}.market-preview-pricebar b{font-size:.82rem;padding-bottom:4px}.market-preview-pricebar .market-preview-time{margin-left:auto;font-size:.67rem;color:#738398;padding-bottom:4px}.market-preview-pricebar .session-badge{padding:5px 8px;border-radius:999px;background:rgba(27,214,154,.10)}
.market-preview-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-bottom:12px}
.market-preview-stats .stat{padding:11px 12px!important;min-height:66px;border-radius:10px!important}
.market-preview-stats .stat small{font-size:.57rem!important}.market-preview-stats .stat b{font-size:.79rem!important;margin-top:5px}
.market-preview-stats .stat.high b{color:#0aa878!important}.market-preview-stats .stat.low b{color:#e21d2f!important}
.market-preview-chartbox,.market-preview-monthbox{border:1px solid var(--border,#26374b);border-radius:12px;padding:12px;margin-top:12px}
.market-preview-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.market-preview-section-head h3{font-size:.86rem;margin:0}.market-preview-section-head small{font-size:.62rem;color:#738398}
.market-preview-ranges{display:flex;gap:3px}.market-preview-ranges button{border:0;background:transparent;border-radius:7px;height:30px;padding:0 10px;font-size:.66rem;font-weight:750;color:#6e8196}.market-preview-ranges button.active{background:#e31e35;color:#fff}
.market-preview-chart{width:100%;height:250px;display:block}.market-preview-chart .grid line{stroke:#dce4ec;stroke-width:1}.market-preview-chart .grid text{fill:#738398;font-size:11px}.market-preview-chart .area{fill:url(#marketPreviewFill)}.market-preview-chart polyline{fill:none;stroke:#e21d2f;stroke-width:2.5;vector-effect:non-scaling-stroke}
.market-preview-months{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}.market-preview-months .month{padding:8px!important;min-height:64px;border-radius:8px!important}.market-preview-months .month small{font-size:.55rem!important}.market-preview-months .month b{font-size:.68rem!important}
html[data-theme="light"] #view-markets .catalog-toolbar,html[data-theme="light"] #view-markets .catalog-list,html[data-theme="light"] .market-preview{background:#fff!important;border-color:#dfe4ea!important}
html[data-theme="light"] #view-markets .catalog-row{border-color:#edf0f3!important}
html[data-theme="light"] #view-markets .catalog-row:hover{background:#f8fafb!important}
html[data-theme="light"] .market-preview-chartbox,html[data-theme="light"] .market-preview-monthbox{background:#fff;border-color:#e1e6eb}
html[data-theme="light"] .market-preview-stats .stat,html[data-theme="light"] .market-preview-months .month{background:#f8fafb!important;border-color:#e4e8ec!important}
html[data-theme="dark"] #view-markets .catalog-row{border-color:#1d2c3e!important}
html[data-theme="dark"] #view-markets .catalog-tabs button.active{background:#b91d31!important;border-color:#d62a40!important}
html[data-theme="dark"] .market-preview-chartbox,html[data-theme="dark"] .market-preview-monthbox{background:#0d1724;border-color:#223247}
html[data-theme="dark"] .market-preview-chart .grid line{stroke:#203147}
@media(max-width:1180px){.market-pro-layout{grid-template-columns:minmax(320px,370px) minmax(0,1fr)}.market-preview-stats{grid-template-columns:repeat(3,1fr)}.market-preview-months{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.market-pro-layout{display:block}.market-preview{display:none!important}#view-markets .market-head small{display:block}#view-markets .market-head h1{font-size:1.8rem}#view-markets .catalog-row{grid-template-columns:40px minmax(0,1fr) 82px 34px!important}#view-markets .catalog-chart{display:none}#view-markets .catalog-toolbar{position:static}.market-browser{width:100%}}

/* v28.1 — semantic colors for monthly performance in Market Pro */
html[data-theme="light"] .market-preview-months .month.up b{
  color:#087f5b!important;
  font-weight:800!important;
}
html[data-theme="light"] .market-preview-months .month.down b{
  color:#d92d3f!important;
  font-weight:800!important;
}
html[data-theme="light"] .market-preview-months .month.flat b{
  color:#52616e!important;
  font-weight:800!important;
}
html[data-theme="dark"] .market-preview-months .month.up b{
  color:#22d49a!important;
  font-weight:800!important;
}
html[data-theme="dark"] .market-preview-months .month.down b{
  color:#ff6575!important;
  font-weight:800!important;
}
html[data-theme="dark"] .market-preview-months .month.flat b{
  color:#9aabbd!important;
  font-weight:800!important;
}
.market-preview-months .month>small:last-child{
  color:var(--muted,#68737d)!important;
  font-weight:700!important;
}
