/* One navigation grid shared by the workbench, discussion, product and account pages. */
html{scrollbar-gutter:stable;overflow-y:scroll}
.site-header{font-family:"Segoe UI Variable","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
.site-header .brand-mark span{font-size:20px;font-weight:750}
.site-header .shell.header-inner{display:grid;grid-template-columns:1fr auto 1fr;width:calc(100% - 60px);max-width:1580px;min-height:72px;gap:24px;margin-inline:auto;padding-inline:0}
.site-header .brand-mark{justify-self:start;min-width:0;display:flex;align-items:center;gap:12px;text-decoration:none;color:#302821;font-size:20px;font-weight:750}
.site-header .brand-mark img{width:36px;height:36px;border-radius:11px}
.site-header .main-nav{position:static;left:auto;transform:none;grid-column:2;grid-row:1;display:flex;justify-content:center;align-items:center;gap:30px;margin:0;white-space:nowrap;order:0;width:auto;min-height:72px;color:#705a49;font-size:13px}
.site-header .main-nav a{font-size:13px;color:#705a49;font-weight:600;text-decoration:none;padding:23px 0;border-bottom:2px solid transparent;line-height:24px}
.site-header .main-nav a:hover,.site-header .main-nav a.is-active{color:#aa4f30;border-bottom-color:#e88460}
.site-header .header-cta{grid-column:3;grid-row:1;justify-self:end;white-space:nowrap;font-size:12px;padding:11px 18px;border:1px solid #d9b79a;border-radius:99px;background:#fff8ed;color:#594334;text-decoration:none}
/* The news has its own row. Watchlist and international markets now share the chart's height. */
#view-overview>.overview-grid{grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:16px;align-items:stretch}
.overview-grid>.chart-surface{height:490px;min-height:0}
.overview-grid .chart,.overview-grid .chart.is-candles{height:248px}
.chart-surface .chart-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#d5e6d9;font-size:13px}
.market-side{height:490px;grid-template-columns:minmax(225px,.88fr) minmax(285px,1.12fr);grid-template-rows:minmax(0,1fr);gap:16px;align-items:stretch}
.market-side>.watch-surface,.market-side .rail-global{height:490px;grid-row:1;max-height:none;padding:18px 16px}
.market-side>.watch-surface{display:flex;flex-direction:column}
.market-side .watch-surface #overview-watch-list{max-height:none;flex:1;min-height:0;overflow-y:auto}
.market-side .watch-surface .watch-row{height:48px;min-height:48px;column-gap:6px}
.watch-surface .watch-row .name{font-size:13px}.watch-surface .watch-row strong{font-size:13px}.watch-surface .watch-row .positive,.watch-surface .watch-row .negative{font-size:12px}
.watch-surface .list-heading{font-size:12px}.watch-surface .surface-top h2{font-size:20px}
.watch-surface{container-type:inline-size;container-name:watchbox}
.watch-surface .watch-row>span:first-child{min-width:0}.watch-surface .watch-row>span:first-child strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.market-side .watch-surface .watch-row,.market-side .watch-surface .list-heading{grid-template-columns:var(--watch-name-width,56px) var(--watch-price-width,58px) 40px var(--watch-change-width,50px);justify-content:space-between;column-gap:10px;padding-inline:0;align-items:center}
.market-side .watch-surface .watch-row .value,.market-side .watch-surface .watch-row .percent{white-space:nowrap;font-variant-numeric:tabular-nums}
@container watchbox (max-width:240px){.market-side .watch-surface .watch-row,.market-side .watch-surface .list-heading{grid-template-columns:var(--watch-name-width,56px) var(--watch-price-width,58px) var(--watch-change-width,50px);column-gap:10px}.market-side .watch-surface .watch-row>span:nth-child(3),.market-side .watch-surface .list-heading>span:nth-child(3){display:none}}
@container watchbox (max-width:240px){.watch-surface .watch-row,.watch-surface .list-heading{grid-template-columns:minmax(0,1fr) 62px 58px;gap:6px}.watch-surface .watch-row>span:nth-child(3),.watch-surface .list-heading>span:nth-child(3){display:none}.watch-surface .watch-row .value,.watch-surface .watch-row .percent{font-size:12px}}
.market-side .rail-global{display:flex;flex-direction:column}
.rail-head h2{font-size:20px}.rail-head>span{font-size:11px;white-space:normal;text-align:right}
.market-side .rail-global .global-grid{flex:1;gap:9px;grid-template-rows:repeat(3,minmax(0,1fr));align-content:stretch}
.market-side .rail-global .global-card{height:auto;padding:12px 10px;display:flex;flex-direction:column;justify-content:center;gap:7px}
.rail-global .global-card-heading{height:auto;min-height:15px;flex-wrap:wrap;white-space:normal;overflow:visible;gap:5px}
.rail-global .global-card-heading>span:first-child{font-size:11px;flex:1 0 100%;white-space:normal}
.rail-global .global-session{margin-left:0;font-size:9px;align-self:flex-start}
.rail-global .global-quote-line{gap:4px 6px;margin:0}.rail-global .global-quote-line strong{font-size:18px}.rail-global .global-quote-line>b,.rail-global .gold-cny-inline{font-size:11px}
.rail-global .global-note{white-space:normal;font-size:10px;line-height:1.5;margin-top:10px;color:#675342}
.workbench-news{order:2;margin-top:16px;padding:20px 22px;border-radius:19px;min-width:0}
.workbench-news .rail-head{margin-bottom:10px}
.workbench-news .news-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.workbench-news .news-toolbar>span{display:block;color:#ceded0;font-size:12px}
.workbench-news .news-filters button{font-size:12px;padding:7px 13px}
.workbench-news .news-live-status{font-size:11px;margin:0 0 10px;color:#c1d3c5}
.workbench-news .news-grid{height:316px;min-height:0;flex:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-auto-rows:minmax(98px,auto);align-content:start;gap:10px;padding-right:7px;scrollbar-width:thin}
.workbench-news .news-card{min-height:98px;padding:12px 14px;border-radius:11px;gap:5px}
.workbench-news .news-card .news-time{margin:0 0 5px;font-size:11px;color:#ffd3a6}
.workbench-news .news-card h3{font-size:15px;line-height:1.5;max-height:3em;-webkit-line-clamp:2}
.market-stage{height:auto;min-height:332px}
.stage-market{grid-template-rows:auto auto 88px minmax(134px,1fr);gap:9px}
.stage-market .stage-label,.stage-label{font-size:11px}.stage-market>h2{font-size:20px}
.stage-market .indices-grid{height:88px}.stage-market .index-card h3{font-size:12px}.stage-market .index-card strong{font-size:20px}.stage-market .index-card .change{font-size:11px}
.stage-market .pulse-card h3{font-size:12px}.stage-market .pulse-note,.stage-market .turnover-delta{font-size:11px;line-height:1.45}.stage-market .turnover-split,.stage-market .pulse-pair span{font-size:11px}
.stage-sentiment .limit-numbers span{font-size:12px}.stage-sentiment .limit-numbers strong{font-size:30px}.stage-sentiment .pulse-note{font-size:11px}
.chart-surface .focus-tools{gap:8px}.chart-surface .search-box input{font-size:13px}.chart-surface .price-line strong{font-size:32px}.chart-surface .chart-controls button{font-size:12px}
.chart-surface .chart-hint{font-size:11px}.chart-surface .stat-item span{font-size:11px}.chart-surface .stat-item strong{font-size:14px}
/* Match the client's compact header while retaining both breadth indicators. */
.pd-toolbar .pd-float-name{font-size:10px;flex:none}.pd-toolbar .pd-breadth{font-size:8px;gap:7px;justify-content:space-between;white-space:nowrap}.pd-breadth .up{color:#ffb48c}.pd-breadth .down{color:#80d9b8}
#product-demo .pd-chart .avg-line{stroke:#f6c969;stroke-width:2.4;fill:none}
@media(min-width:1181px){.market-stage{grid-template-columns:minmax(0,1.13fr) minmax(0,1.28fr) minmax(0,.86fr)}.stage-sentiment{grid-column:auto}.stage-sentiment .limit-numbers{grid-template-columns:repeat(2,minmax(0,1fr))}#view-overview>.overview-grid{grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr)}.market-side{height:490px;grid-template-columns:minmax(225px,.88fr) minmax(285px,1.12fr)}.market-side>.watch-surface,.market-side .rail-global{height:490px}}
@media(max-width:1180px) and (min-width:801px){#view-overview>.overview-grid{grid-template-columns:1fr}.market-side{height:350px;grid-template-columns:minmax(260px,.8fr) minmax(360px,1.2fr)}.market-side>.watch-surface,.market-side .rail-global{height:350px}.market-stage{grid-template-columns:1fr 1fr}.stage-sentiment{grid-column:1/-1}.stage-sentiment .limit-numbers{grid-template-columns:repeat(4,minmax(0,1fr))}.workbench-news .news-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:800px){.site-header .shell.header-inner,body:has(.market-stage) .site-header .shell.header-inner{width:calc(100% - 28px);grid-template-columns:1fr auto;gap:0 10px;min-height:64px}.site-header .brand-mark{font-size:18px}.site-header .brand-mark img{width:30px;height:30px}.site-header .header-cta{grid-column:2;grid-row:1;font-size:11px;padding:8px 12px}.site-header .main-nav{grid-column:1/-1;grid-row:2;min-height:42px;gap:28px;order:0}.site-header .main-nav a{font-size:12px;padding:7px 0;line-height:24px}.market-stage{grid-template-columns:1fr;min-height:0}.stage-sentiment{grid-column:auto}.stage-market{min-height:330px}#view-overview>.overview-grid{grid-template-columns:1fr}.overview-grid>.chart-surface{height:auto;min-height:480px}.market-side{height:auto;grid-template-columns:1fr;grid-template-rows:auto;gap:14px}.market-side>.watch-surface{height:auto;max-height:420px;grid-column:1;grid-row:auto}.market-side .watch-surface #overview-watch-list{max-height:290px;flex:auto}.market-side .rail-global{height:auto;min-height:375px;grid-column:1;grid-row:auto}.market-side .rail-global .global-grid{grid-template-rows:repeat(3,minmax(88px,1fr))}.workbench-news{padding:18px 14px}.workbench-news .news-grid{height:420px;grid-template-columns:1fr!important;grid-auto-rows:minmax(98px,auto)}.workbench-news .news-card h3{font-size:15px}.workbench-news .news-toolbar>span{display:none}}
/* Source timestamps remain visible on touch screens as well as desktops. */
.chart-surface #quote-freshness { color:#c2d9ce; font-size:12px; margin:-3px 0 12px; line-height:1.5; }
.rail-global .global-card > .global-data-time { display:block; color:#4c6258; font-size:10px; margin-top:5px; line-height:1.4; }
.product-demo-desktop .pd-data-time { position:absolute; left:16px; bottom:12px; z-index:8; color:#f4f4e7; background:rgba(20,41,34,.88); border-radius:8px; padding:5px 9px; font-size:11px; pointer-events:none; max-width:70%; }
