html[data-route="home"] {
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  --view-w:100vw; --view-h:100dvh; --viewport-ratio:1; --raw-h:100dvh;
  --pad:clamp(8px,calc(var(--view-h)*.018),24px);
  --gap:clamp(5px,calc(var(--view-h)*.012),16px);
  --circular-icon-btn-size:clamp(34px,calc(var(--view-h)*.075),50px);
}
[data-route="home"] body {margin:0; overflow:auto}
[data-route="home"][data-orientation="portrait"] body {overflow-x:clip}
[data-route="home"] .viewport-footprint {width:100%; height:max(var(--raw-h),calc(360px * var(--viewport-ratio))); position:relative}
[data-route="home"] .viewport-host {width:var(--view-w); height:max(var(--view-h),360px); transform:scale(var(--viewport-ratio)); transform-origin:top left; position:relative; overflow:clip}
[data-route="home"] .home-layout {height:100%; padding:calc(var(--pad) + var(--safe-top)) calc(var(--pad) + var(--safe-right)) calc(var(--pad) + var(--safe-bottom)) calc(var(--pad) + var(--safe-left)); display:grid; grid-template-columns:minmax(0,1fr); position:relative; isolation:isolate}
[data-route="home"] .information-stage {min-width:0; min-height:0; display:grid; align-items:end; justify-items:center; z-index:1}
[data-route="home"] .fit-footprint {width:100%; max-width:560px; min-width:0}
[data-route="home"] .information-scaler {width:100%; display:grid; grid-template-rows:auto minmax(0,1fr) auto auto auto auto; gap:var(--gap); transform-origin:top left}
[data-route="home"] .information-scaler::before {content:""; grid-row:2}
[data-route="home"] .page,[data-route="home"] .container {display:contents}
[data-route="home"] .market-glass {position:static; min-width:0; padding:clamp(5px,calc(var(--view-h)*.012),12px); border-radius:18px}
[data-route="home"] .market-rail--top {display:grid; gap:5px; margin:0; background:rgba(249,244,236,.8)}
[data-route="home"] .indices {display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); font-size:clamp(14px,calc(var(--view-w)*.028),15px); gap:5px 4px; line-height:1.3}
/* DOM order: b (name), anonymous text grid item (value), small (change). */
[data-route="home"] .indices > span {display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(3,1.3em); grid-column:span 2; text-align:center; min-width:0; white-space:nowrap}
[data-route="home"] :is(#indices, [data-fit-id="indices"]) > span:nth-child(n+4) {grid-column:span 3}
[data-route="home"] .indices b,[data-route="home"] .indices small {font-size:inherit}
[data-route="home"] .indices b {min-width:0; overflow:hidden; text-overflow:ellipsis}
[data-route="home"] .hero-title {display:flex; align-items:center; justify-content:center; margin:0; gap:14px; font-size:clamp(30px,calc(var(--view-h)*.06),58px); line-height:1.1}
[data-route="home"] .stock {display:flex; flex-direction:column; justify-content:center; text-align:center; padding:clamp(8px,calc(var(--view-h)*.016),24px) 12px; min-width:0; border-radius:28px; background:rgba(251,247,240,.84)}
[data-route="home"] .stock h2 {font-size:clamp(18px,calc(var(--view-h)*.034),26px); margin:0; line-height:1.2}
[data-route="home"] .price {font-size:clamp(36px,calc(var(--view-h)*.075),72px); margin:5px 0 2px; line-height:1.05}
[data-route="home"] .after {font-size:clamp(12px,calc(var(--view-h)*.024),18px); margin:0; line-height:1.3}
[data-route="home"] .change {font-size:clamp(16px,calc(var(--view-h)*.032),24px); margin:4px 0 0; line-height:1.2}
[data-route="home"] .time {font-size:clamp(10px,calc(var(--view-h)*.02),14px); margin:5px 0 0; line-height:1.3; overflow-wrap:anywhere}
[data-route="home"] .buttons {display:grid; grid-template-columns:minmax(0,1fr) repeat(2,var(--circular-icon-btn-size)); gap:clamp(6px,calc(var(--view-w)*.018),12px); margin:0; align-items:center}
[data-route="home"] .buttons > a:not(.news-btn) {height:var(--circular-icon-btn-size); padding:0 12px; min-width:0}
[data-route="home"] :is(#portfolioTrigger, [data-fit-id="portfolioTrigger"]) {position:static}
[data-route="home"] .shortcut-cluster {width:var(--circular-icon-btn-size); height:var(--circular-icon-btn-size)}
[data-route="home"] .market-rail--bottom {padding:0; border:0; background:none; box-shadow:none; backdrop-filter:none}
[data-route="home"] :is(#indicesCN, [data-fit-id="indicesCN"]) {display:none} /* Retained data mirror; all CN entries displayed above. */
[data-route="home"] .clocks {display:flex; justify-content:center; gap:20px; font-size:clamp(10px,calc(var(--view-h)*.019),13px); line-height:1.4}
[data-route="home"] .clocks b {font-size:inherit}
/* 定位与层级归此处；背景图/取景/遮罩统归 overrides.v1.css 管理，避免同一元素两处定义。 */
[data-route="home"] .artwork {position:absolute; inset:0 0 auto; width:100%; z-index:0; pointer-events:none}
[data-route="home"][data-orientation="landscape"] .information-scaler {grid-template-rows:auto auto minmax(min-content,1fr) auto auto}
[data-route="home"][data-orientation="landscape"] .information-scaler::before {display:none}
[data-route="home"][data-orientation="landscape"] .home-layout {grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--gap)}
[data-route="home"][data-orientation="landscape"] .information-stage {align-items:stretch; align-content:center}
[data-route="home"][data-orientation="landscape"] .fit-footprint {max-width:680px; align-self:center}
[data-route="home"][data-orientation="landscape"] .artwork {position:static; height:auto; min-width:0; background-position:65% center; border-radius:24px; mask-image:linear-gradient(90deg,transparent,#000 12%)}
[data-route="home"] .portfolio-panel {position:absolute; top:calc(var(--overlay-y,0px) + var(--safe-top) + var(--pad)); left:calc(var(--overlay-x,0px) + var(--pad)); width:min(300px,calc(var(--overlay-w,var(--view-w)) - 2*var(--pad) - var(--safe-right))); max-height:calc(var(--overlay-h,var(--view-h)) - 2*var(--pad) - var(--safe-top) - var(--safe-bottom)); display:none; transform:none}
[data-route="home"] .portfolio-panel.open {display:flex}
[data-route="home"][data-orientation="portrait"] .portfolio-panel {
  /* The CSS viewport shrinks before a queued visualViewport publication.
     Convert it into host units before applying the border-box height limit. */
  --overlay-live-h:min(var(--overlay-h,var(--view-h)),calc(100dvh / var(--viewport-ratio)));
  --overlay-pad:clamp(8px,calc(var(--overlay-live-h)*.018),24px);
  --overlay-usable-h:max(0px,calc(var(--overlay-live-h) - 2*var(--overlay-pad) - var(--safe-top) - var(--safe-bottom)));
  box-sizing:border-box;
  top:calc(var(--overlay-y,0px) + var(--safe-top) + var(--overlay-pad));
  left:calc(var(--overlay-x,0px) + var(--safe-left) + var(--overlay-pad));
  width:min(250px,max(0px,calc(var(--overlay-w,var(--view-w)) - 2*var(--overlay-pad) - var(--safe-left) - var(--safe-right))));
  max-height:min(320px,calc(var(--overlay-usable-h)*.46));
}
/* Keep a shrinking viewport from turning the frozen homepage into a scroll area.
   Clip on both root and body: no scrolling or scrollbar width change on lock.
   The overlay may follow a visual viewport taller than the frozen host. */
html[data-route="home"][data-orientation="portrait"][data-portfolio-open="true"],
[data-route="home"][data-orientation="portrait"][data-portfolio-open="true"] body {overflow:clip}
[data-route="home"][data-orientation="portrait"][data-portfolio-open="true"] .viewport-host {overflow:visible}
[data-route="home"] .portfolio-summary {flex:none}
@media(prefers-reduced-motion:reduce) {
 [data-route="home"] *,[data-route="home"] *::after {animation:none; transition:none}
}