.native-index-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: #070d13; border-bottom: 1px solid #303b42; }
.native-index-strip .native-index-ticker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(52px, .65fr); align-items: center; gap: 5px 16px; margin: 0; padding: 12px 20px; min-width: 0; overflow: hidden; border: 0; border-right: 1px solid #2d383f; border-radius: 0; color: #dce6ed; background: transparent; text-align: left; cursor: pointer; font: 17px/1.4 "Stork Chinese Kai", "Stork Chinese Kai Fallback", system-ui, sans-serif; }
.native-index-ticker b, .native-index-ticker strong, .native-index-ticker span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.native-index-ticker strong { text-align: right; font: 700 23px/1.2 "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; }
.native-index-ticker small { grid-column: 1 / -1; font-size: 13px; color: #8d9dac; }
.native-index-ticker:hover { background: #19212b; }
.native-index-dialog { box-sizing: border-box; width: min(1100px, calc(100vw - 32px)); max-height: 90dvh; padding: 26px; background: #090e14; color: #dae4ed; border: 1px solid #596546; border-radius: 14px; font: 17px/1.5 "Stork Chinese Kai", "Stork Chinese Kai Fallback", system-ui, sans-serif; }
.native-index-dialog::backdrop { background: #000b; backdrop-filter: blur(3px); }
.native-index-dialog > header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 22px; }
.native-index-dialog > header small { font-size: 13px; color: #e4d45a; letter-spacing: 3px; }
.native-index-dialog h2 { margin: 6px 0 0; font-size: 28px; }
.native-index-dialog button { padding: 8px 16px; color: #dce6ed; background: #172433; border: 1px solid #485568; border-radius: 6px; cursor: pointer; font-size: 17px; }
.native-index-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.native-index-card { padding: 22px; background: linear-gradient(150deg, #182532, #0c151e); border: 1px solid #364553; border-radius: 10px; cursor: pointer; }
.native-index-card:hover { border-color: #e1d04f; background: linear-gradient(150deg, #1c2b38, #0e1923); }
.native-index-card:focus { outline: 1px solid #e1d04f; }
.native-index-card-link { display: block; margin-top: 12px; color: #e1d04f; font-size: 14px; font-weight: 700; text-align: right; }
.native-index-card h3 { margin: 0; font-size: 24px; }
.native-index-card small { font: 14px "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; color: #96a9ba; }
.native-index-card .native-index-price { display: block; margin-top: 25px; font: 700 clamp(26px, 3vw, 36px) "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; letter-spacing: -1px; }
.native-index-card p { font: 19px "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; }
.native-index-card dl { display: grid; grid-template-columns: auto 1fr; gap: 14px; border-top: 1px solid #354454; padding-top: 20px; margin-top: 20px; }
.native-index-card dt { color: #93a6bb; }
.native-index-card dd { margin: 0; text-align: right; font-family: "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; }
.native-index-card footer { border-top: 1px solid #354454; padding-top: 14px; font-size: 13px; color: #9daec0; white-space: pre-line; }
.native-index-note { font-size: 14px; color: #8fa0b2; margin: 22px 0 0; }
.native-index-strip .index-up, .native-index-dialog .index-up { color: #ff526c; }
.native-index-strip .index-down, .native-index-dialog .index-down { color: #36d9a0; }
.native-index-strip .index-flat, .native-index-dialog .index-flat { color: #c7d2df; }
html:has(.index-daily-dialog[open]), body:has(.index-daily-dialog[open]) { overflow: hidden; overscroll-behavior: none; }
.index-daily-dialog { box-sizing: border-box; width: calc(100vw - 16px); height: calc(100dvh - 16px); max-width: none; max-height: none; overflow: hidden; padding: 0; border: 1px solid #353535; border-radius: 6px; background: #020202; color: #dedede; font: 17px/1.35 "Stork Chinese Kai", "Stork Chinese Kai Fallback", system-ui, sans-serif; }
.index-daily-dialog[open] { display: flex; flex-direction: column; }
.index-daily-dialog::backdrop { background: #000d; }
.index-daily-head { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; min-height: 75px; padding: 8px 12px; border-bottom: 1px solid #383838; background: #0b0b0b; }
.index-daily-identity, .index-daily-head-actions, .index-daily-tabs, .index-daily-toolbar, .index-daily-ma-buttons, .index-daily-controls { display: flex; align-items: center; gap: 6px; }
.index-daily-identity { min-width: 0; max-width: 100%; gap: 14px; }
.index-daily-identity > div { min-width: 0; }
.index-daily-dialog .stock-chart-symbol { min-width: 132px; height: 54px; padding: 0 10px; border: 1px solid #69602c; border-radius: 5px; color: #e5d85f; background: #18170e; font: 700 22px "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; }
.index-daily-identity h2 { margin: 0 0 4px; color: #f4f4f4; font-size: 28px; white-space: nowrap; }
.index-daily-identity small { display: block; color: #9b9b9b; font-size: 14px; white-space: normal; }
.index-daily-head-actions { flex-wrap: nowrap; min-width: 0; }
.index-daily-dialog button, .index-daily-dialog select { padding: 6px 10px; border: 1px solid #373737; border-radius: 5px; background: #070707; color: #aeb9c7; cursor: pointer; font: inherit; white-space: nowrap; }
.index-daily-dialog button:hover:not(:disabled) { border-color: #c6b944; color: #e5d85f; }
.index-daily-dialog button:focus-visible, .index-daily-dialog select:focus-visible { outline: 2px solid #e5d85f; outline-offset: 2px; }
.index-daily-dialog button:disabled { opacity: .4; cursor: default; }
.index-daily-tabs { flex-wrap: wrap; min-width: 0; }
.index-daily-tabs button.active, .index-daily-period[aria-pressed="true"] { border-color: #d0bf42; color: #e5d85f; background: #24210d; }
.index-daily-periods { display: flex; align-items: center; gap: 2px; }
.index-daily-period { display: grid; place-items: center; height: 37px; padding: 0 10px; font-size: 18px; font-weight: 700; white-space: nowrap; }
.index-daily-head-actions [data-close] { min-width: 38px; height: 38px; padding: 0; font-size: 25px; line-height: 1; }
.index-daily-workspace { display: grid; grid-template-columns: clamp(112px, 10vw, 145px) minmax(0, 1fr); flex: 1 1 0; min-height: 0; overflow: hidden; }
.index-daily-reading { min-height: 0; overflow: hidden; border-right: 1px solid #323232; background: #050505; }
.index-daily-reading dl { display: grid; grid-template-rows: repeat(8, minmax(0, 1fr)); height: 100%; max-height: 520px; margin: 0; }
.index-daily-reading dl > div { display: grid; align-content: center; gap: clamp(0px, .6dvh, 5px); min-height: 0; box-sizing: border-box; padding: clamp(1px, 1dvh, 8px) 6px; border-bottom: 1px solid #333; }
.index-daily-reading dt { color: #b4b8bc; font-size: clamp(9px, 1.9dvh, 15px); }
.index-daily-reading dd { margin: 0; color: #f2f2f2; font: 700 clamp(10px, 2.3dvh, 18px) "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; text-align: right; white-space: nowrap; }
.index-daily-reading dd.up { color: #ff4058; } .index-daily-reading dd.down { color: #00cde8; }
.index-daily-reading dd.volume { color: #e5d85f; }
.index-daily-plot { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: #020202; }
.index-daily-toolbar { flex: 0 0 auto; gap: 7px; min-height: 0; flex-wrap: wrap; padding: 3px 8px; border-bottom: 1px solid #303030; background: #0a0a0a; white-space: nowrap; }
.index-daily-toolbar > strong { color: #b1bac6; font-size: 18px; }
.index-daily-ma-buttons { flex-wrap: wrap; min-width: 0; }
.index-daily-ma-buttons button { font: 17px "Stork Chinese Kai", "Stork Chinese Kai Fallback", ui-monospace, monospace; }
.index-daily-ma-buttons button[aria-pressed="true"] { border-color: #b5a93e; color: #e5d85f; }
.index-daily-controls { flex-wrap: wrap; margin-left: auto; }
.index-daily-controls label { color: #a6b2be; }
.index-daily-controls select { margin-left: 3px; }
.index-daily-chart { position: relative; flex: 1 1 0; min-height: 0; overflow: hidden; padding: 0 2px; background: #020202; }
.index-daily-chart canvas, .index-daily-navigator canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.index-daily-chart canvas:focus-visible { outline: 1px solid #69602c; outline-offset: -1px; }
.index-daily-status { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: #c8d3df; background: #020202; }
.index-daily-status[hidden] { display: none; }
.index-daily-navigator { position: relative; flex: 0 0 clamp(26px, 6dvh, 50px); height: clamp(26px, 6dvh, 50px); overflow: hidden; border-top: 1px solid #363636; background: #020202; cursor: crosshair; touch-action: none; user-select: none; }
.index-daily-nav-selection { position: absolute; top: 0; bottom: 0; display: grid; grid-template-columns: 8px minmax(0, 1fr) 8px; min-width: 18px; box-sizing: border-box; border: 1px solid rgba(84, 211, 203, .78); background: rgba(84, 211, 203, .07); cursor: grab; }
.index-daily-navigator.dragging .index-daily-nav-selection { cursor: grabbing; }
.index-daily-dialog .index-daily-nav-selection button { width: 8px; height: 100%; padding: 0; border: 0; border-radius: 0; background: rgba(84, 211, 203, .8); cursor: ew-resize; }
.index-daily-dialog .index-daily-nav-selection button:hover:not(:disabled) { border: 0; background: #76e3db; }
@media (max-width: 1000px) { .index-daily-head { flex-wrap: wrap; } .index-daily-head-actions { width: 100%; justify-content: flex-end; flex-wrap: wrap; } .index-daily-dialog .stock-chart-symbol { min-width: 100px; height: 43px; font-size: 17px; } .index-daily-identity h2 { font-size: 24px; } }
@media (max-width: 650px) { .index-daily-dialog { width: 100vw; height: 100dvh; border-radius: 0; } .index-daily-head { padding: 5px; } .index-daily-identity { gap: 7px; } .index-daily-head-actions { justify-content: flex-start; gap: 4px; } .index-daily-dialog button, .index-daily-dialog select { padding: 4px 6px; font-size: 13px; } .index-daily-workspace { grid-template-columns: 100px minmax(0, 1fr); } .index-daily-reading dl > div { padding: 2px 4px; } .index-daily-reading dt { font-size: clamp(9px, 1.9dvh, 12px); } .index-daily-reading dd { font-size: clamp(10px, 2.3dvh, 12px); } .index-daily-toolbar { gap: 3px 5px; padding: 3px 5px; } .index-daily-ma-buttons { gap: 3px; } .index-daily-ma-buttons button { font-size: 13px; } .index-daily-navigator { flex-basis: 30px; height: 30px; } }
@media (max-width: 850px) {
  .native-index-strip .native-index-ticker { grid-template-columns: 1fr auto; gap: 6px; padding: 12px; font-size: 15px; }
  .native-index-ticker strong { font-size: 20px; }
  .native-index-ticker small { font-size: 12px; }
  .native-index-details { grid-template-columns: 1fr; }
  .native-index-card .native-index-price { margin-top: 10px; }
}
@media (max-width: 540px) { .native-index-strip { grid-template-columns: 1fr; } }

@media (max-height: 540px) { .index-daily-head { min-height: 0; gap: 3px 8px; padding: 4px 8px; } .index-daily-identity h2 { font-size: 20px; margin: 0; } .index-daily-identity small { font-size: 11px; } .index-daily-dialog .stock-chart-symbol { min-width: 94px; height: 34px; font-size: 16px; } .index-daily-dialog button, .index-daily-dialog select { padding: 3px 6px; font-size: 12px; } .index-daily-period, .index-daily-head-actions [data-close] { height: 29px; } .index-daily-toolbar > strong { font-size: 13px; } .index-daily-ma-buttons button { font-size: 12px; } .index-daily-reading dl > div { gap: 0; padding: 1px 4px; } }