html[data-full-clone="candidate"] #strike-summary-rail[hidden] { display: flex !important; }
html[data-full-clone="candidate"] .gf-force-hidden { display: none !important; }
html[data-full-clone="candidate"] #gex-bars-view.gf-force-hidden,
html[data-full-clone="candidate"] #gex-ohlc-view.gf-force-hidden,
html[data-full-clone="candidate"] #gex-term-container.gf-force-hidden,
html[data-full-clone="candidate"] #gex-heatmap-view.gf-force-hidden,
html[data-full-clone="candidate"] #gex-markers-container.gf-force-hidden,
html[data-full-clone="candidate"] .strike-markers-section.gf-force-hidden,
html[data-full-clone="candidate"] .slider-section-container.gf-force-hidden { display: none !important; }

/* Plotly normally injects these positioning rules from its runtime. The
   captured dashboard already contains all three SVG layers; stack them as
   Plotly does so annotations and hover/shape overlays sit on the data layer. */
html[data-full-clone="candidate"] #gexByStrikeChart .svg-container {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden;
}
html[data-full-clone="candidate"] #gexByStrikeChart .plot-container {
  position: relative;
  width: 100%;
  height: 100%;
}
html[data-full-clone="candidate"] #gexByStrikeChart svg.main-svg {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
}
html[data-full-clone="candidate"] #gexByStrikeChart > .skeleton { display: none !important; }
html[data-full-clone="candidate"] #modeToggleCheckbox:checked + .mode-switch-track { background: #4b9e50 !important; }

html[data-full-clone="candidate"] #gex-ohlc-chart,
html[data-full-clone="candidate"] #gex-term-plot,
html[data-full-clone="candidate"] #gf-local-chart { line-height: 0; }
html[data-full-clone="candidate"] #gf-local-chart { min-height: 0; }
html[data-full-clone="candidate"][data-gf-category="history"] #gex-heatmap-view,
html[data-full-clone="candidate"][data-gf-category="history"] #heatmap-image-wrapper,
html[data-full-clone="candidate"][data-gf-category="history"] #heatmap-image-area,
html[data-full-clone="candidate"][data-gf-category="history"] #heatmap-loading {
  height: 752px !important;
  min-height: 752px !important;
}

/* The source capture already contains all Plotly SVG layers. Keep them live and
   responsive instead of replacing the chart with a raster screenshot. */
html[data-full-clone="candidate"] #gex-chart {
  position: relative;
  height: 512px !important;
  overflow: hidden;
}
html[data-full-clone="candidate"] #gex-chart .plot-container,
html[data-full-clone="candidate"] #gex-chart .svg-container {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden;
}
html[data-full-clone="candidate"] #gex-chart svg.main-svg {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  transform: scaleX(var(--gf-chart-zoom, 1));
  transform-origin: center center;
  transition: transform .18s ease;
}
html[data-full-clone="candidate"] #gex-chart .gf-snapshot-svg {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(var(--gf-chart-zoom, 1));
  transform-origin: center center;
  transition: transform .18s ease;
}
.gf-abs-line { fill: none; stroke: #8f3ee8; stroke-width: 2.2; }
.gf-put-line { fill: none; stroke: #d72c86; stroke-width: 1.8; }
.gf-metric-caption { font: 600 12px system-ui, sans-serif; fill: var(--bs-secondary-color, #66707a); }
.marker-price { white-space: nowrap; }
html[data-full-clone="candidate"] #gex-chart .modebar-container {
  z-index: 5;
}

.gf-chart-tooltip {
  position: absolute;
  z-index: 20;
  pointer-events: none;
  min-width: 118px;
  padding: 7px 9px;
  border: 1px solid #cfd5dd;
  border-radius: 7px;
  background: color-mix(in srgb, var(--bs-body-bg, #fff) 94%, transparent);
  color: var(--bs-body-color, #212529);
  box-shadow: 0 5px 18px #0002;
  font: 11px/1.45 system-ui, sans-serif;
}
.gf-chart-tooltip[hidden] { display: none; }
.gf-chart-hover-line {
  position: absolute;
  z-index: 19;
  top: 10px;
  bottom: 30px;
  width: 1px;
  border-left: 1px dashed color-mix(in srgb, var(--bs-body-color, #212529) 62%, transparent);
  pointer-events: none;
}
.gf-chart-hover-line[hidden] { display: none; }
html[data-full-clone="candidate"] #gexByStrikeChart { cursor: crosshair; touch-action: none; }
html[data-full-clone="candidate"] #gexByStrikeChart.gf-chart-dragging { cursor: grabbing; }
html[data-full-clone="candidate"] #gexByStrikeChart .cartesianlayer,
html[data-full-clone="candidate"] #gexByStrikeChart .layer-below,
html[data-full-clone="candidate"] #gexByStrikeChart .infolayer { transition: transform .12s ease-out; }

.gf-history-heatmap {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 590px;
}
.dashboard-heatmap-image > svg {
  display: block;
  width: 100%;
  min-height: 260px;
  border-radius: 6px;
}

html[data-bs-theme="dark"][data-full-clone="candidate"] #gex-chart .gf-snapshot-svg > rect:first-child,
html[data-bs-theme="dark"][data-full-clone="candidate"] .gf-history-heatmap > rect:first-child,
html[data-bs-theme="dark"][data-full-clone="candidate"] .dashboard-heatmap-image > svg > rect:first-child {
  fill: #0a0e11 !important;
}
html[data-bs-theme="dark"][data-full-clone="candidate"] #gex-chart .bglayer rect,
html[data-bs-theme="dark"][data-full-clone="candidate"] #gexByStrikeChart .bglayer rect {
  fill: #0a0e11 !important;
}
html[data-bs-theme="dark"][data-full-clone="candidate"] #gex-chart svg.main-svg:first-of-type,
html[data-bs-theme="dark"][data-full-clone="candidate"] #gexByStrikeChart svg.main-svg:first-of-type {
  background: #0a0e11 !important;
}
html[data-bs-theme="dark"][data-full-clone="candidate"] .gf-snapshot-svg text[fill="#58616b"],
html[data-bs-theme="dark"][data-full-clone="candidate"] .gf-axis-labels {
  fill: #adb5bd !important;
}

.gf-modal-open { overflow: hidden; }
.gex-ctx-modal.is-open { display: block; }

.gf-window-label {
  align-self: center; padding: 0 8px; font-size: 10px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--bs-secondary-color, #6c757d);
}
.gf-subnav-divider { width: 1px; height: 28px; align-self: center; background: var(--bs-border-color, #dee2e6); margin: 0 5px; }
.gex-live-toggle { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; padding: 0 8px; }
.gex-live-toggle input { position: absolute; opacity: 0; }
.gex-live-toggle span { width: 34px; height: 20px; border-radius: 999px; background: #adb5bd; position: relative; transition: .18s; }
.gex-live-toggle span::after { content: ""; position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #fff; left: 2px; top: 2px; box-shadow: 0 1px 3px #0003; transition: .18s; }
.gex-live-toggle input:checked + span { background: #2ea44f; }
.gex-live-toggle input:checked + span::after { transform: translateX(14px); }
.gex-live-toggle b { font-size: 13px; font-weight: 600; }
.gf-inline-impact { display: inline-flex; align-items: center; gap: 3px; padding: 3px 5px; border: 1px solid var(--bs-border-color,#dee2e6); border-radius: 7px; }
.gf-inline-impact small { padding: 0 7px; color: var(--bs-secondary-color,#6c757d); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.gf-inline-impact .gf-segment { min-height: 28px; padding: 3px 10px; }

.gf-local-chart { width: 100%; min-height: 540px; }
.gf-local-chart-title { padding: 8px 10px 4px; display: flex; flex-direction: column; line-height: 1.25; }
.gf-local-chart-title b { font-size: 13px; }
.gf-local-chart-title small { font-size: 10px; color: var(--bs-secondary-color, #6c757d); }
.gf-local-chart-canvas { height: 505px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 9px; overflow: hidden; background: var(--bs-body-bg, #fff); }
.gf-local-chart-canvas svg { display: block; width: 100%; height: 100%; }
.gf-local-chart-canvas svg {
  transform: scaleX(var(--gf-chart-zoom, 1));
  transform-origin: center center;
  transition: transform .18s ease;
}
@media (min-width: 768px) {
  html[data-gf-subview="monte-carlo"] .gf-local-chart { min-height: 748px; }
  html[data-gf-subview="monte-carlo"] .gf-local-chart-canvas { height: 710px; }
}
.gf-grid line { stroke: #dce0e5; stroke-width: 1; opacity: .8; }
.gf-axis-labels { font: 12px system-ui, sans-serif; fill: #66707a; }
.gf-zero { stroke: #343a40; stroke-width: 1.2; stroke-dasharray: 3 3; }
.gf-spot { stroke: #212529; stroke-width: 1.2; stroke-dasharray: 3 3; }
.gf-pos { fill: #3eaf70; opacity: .75; }
.gf-neg { fill: #dc5966; opacity: .65; }
.gf-term-positive { fill: #5a9e4b; opacity: .17; }
.gf-term-line-pos { fill: none; stroke: #3f8434; stroke-width: 2; }
.gf-term-line-neg { fill: none; stroke: #c62f49; stroke-width: 2; }
.gf-forecast-line { fill: none; stroke: #1934df; stroke-width: 2.5; }
.gf-forecast-positive { fill: #79a7ec; opacity: .25; }
.gf-forecast-negative { fill: #f1b95f; opacity: .22; }
.gf-level-band { fill: #a98be8; opacity: .12; }
.gf-candle line { stroke-width: 1.5; }
.gf-candle rect { stroke-width: 1; }
.gf-candle.up line,.gf-candle.up rect { stroke: #2ca86b; fill: #50bd84; }
.gf-candle.down line,.gf-candle.down rect { stroke: #d74355; fill: #e56373; }
.gf-chart-markers text { fill: #fff; font: bold 11px system-ui; paint-order: stroke; stroke-width: 8px; stroke-linejoin: round; stroke: #7c3aed; }
.gf-mc-paths polyline { fill: none; stroke: #7453d6; stroke-width: 1; opacity: .22; }
.gf-evidence-chart .gf-evidence-bg { fill: var(--bs-body-bg, #fff); }
.gf-evidence-chart .gf-evidence-grid line { stroke: var(--bs-border-color, #d9dde3); stroke-width: 1; opacity: .68; }
.gf-evidence-chart .gf-axis-text { fill: var(--bs-secondary-color, #68717c); font-family: system-ui, sans-serif; }
.gf-evidence-chart .gf-watermark { fill: var(--bs-secondary-color, #68717c); opacity: .09; font: 34px system-ui, sans-serif; }
html[data-bs-theme="dark"] .gf-evidence-chart .gf-evidence-bg { fill: #0a0e11; }
html[data-bs-theme="dark"] .gf-evidence-chart .gf-evidence-grid line { stroke: #303740; }
html[data-bs-theme="dark"] .gf-evidence-chart .gf-axis-text { fill: #9aa4b1; }
.gf-bars-fixed .gf-candles rect { transform-box: fill-box; transform-origin: center; transform: scaleX(.58); }
.strike-markers-section.gf-markers-overlay { transform: translateY(-72px); box-shadow: 0 10px 28px #0002; position: relative; z-index: 4; }
.strike-markers-section.gf-forecast-markers .marker-item:not(.volatility):not(.regime):not(.stability) { display: none !important; }
#heatmap-image-area[data-palette="viridis"] { filter: hue-rotate(55deg) saturate(1.2); }
#heatmap-image-area[data-palette="diverging"] { filter: hue-rotate(-22deg) saturate(1.12); }
#heatmap-image-area:not(.gf-history-normalized) { opacity: .72; }

#heatmap-loading { min-height: 520px; display: flex !important; flex-direction: column; gap: 12px; align-items: center; justify-content: center; }
.gf-history-spinner { width: 2rem; height: 2rem; border-width: .22rem; }

#gex-chart { position: relative; }
.gf-btc-snapshot-overlay { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.gf-btc-abs-grid line { stroke: #e2e6ea; stroke-width: .65; }
.gf-btc-abs-line { fill: none; stroke: #7b2ff7; stroke-width: 1.35; }
.gf-btc-abs-fill { fill: #7b2ff7; fill-opacity: .24; stroke: none; }
.gf-btc-put-line { fill: none; stroke: #d14f86; stroke-width: 1.05; }
.gf-btc-put-fill { fill: #d14f86; fill-opacity: .16; stroke: none; }
.gf-btc-axes line { stroke: #69727d; stroke-width: .65; }
.gf-btc-axes text { fill: #495057; font: 10px system-ui, sans-serif; }
html[data-bs-theme="dark"] .gf-btc-abs-grid line { stroke: #303740; }
html[data-bs-theme="dark"] .gf-btc-axes line { stroke: #68717c; }
html[data-bs-theme="dark"] .gf-btc-axes text { fill: #9aa4b1; }

.gex-controls-popover.is-open { min-width: 310px; padding: 16px; }
.gex-controls-sheet.is-open { display: block; }
.gf-control-row { display: flex; align-items: center; gap: 8px; margin: 12px 0; }
.gf-control-row > span:first-child { margin-right: auto; font-size: 12px; color: var(--bs-secondary-color); }
.gf-segment { border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); color: var(--bs-body-color); border-radius: 6px; padding: 4px 9px; font-size: 12px; }
.gf-segment.active { border-color: #7167e8; background: #eeecff; color: #5147c8; }

.reach-prob-panel.is-open { position: fixed; z-index: 1085; right: 78px; top: 126px; width: 390px; max-height: calc(100vh - 150px); overflow: auto; display: block; padding: 18px; border: 1px solid var(--bs-border-color); border-radius: 12px; background: var(--bs-body-bg); box-shadow: 0 18px 50px #0003; }

.gf-help-entry { border-bottom: 1px solid var(--bs-border-color, #dee2e6); }
.gf-help-entry-title { width: 100%; display: flex; align-items: center; justify-content: space-between; border: 0; background: transparent; color: inherit; text-align: left; padding: 13px 4px; font-weight: 600; }
.gf-help-entry p { padding: 0 4px 14px; margin: 0; color: var(--bs-secondary-color); font-size: 13px; line-height: 1.55; }
.help-tour-cta { border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); color: inherit; border-radius: 9px; padding: 9px; display: flex; align-items: center; gap: 8px; text-align: left; }
.help-tour-cta span:nth-child(2) { display: flex; flex-direction: column; }
.help-tour-cta small { color: var(--bs-secondary-color); }
.help-tour-cta span:last-child { margin-left: auto; }
.changelog-release p { color: var(--bs-secondary-color); font-size: 13px; }

.gf-local-message { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; }
.gf-local-message[hidden] { display: none; }
.gf-local-message-backdrop { position: absolute; inset: 0; background: #0007; }
.gf-local-message section { position: relative; width: min(430px, calc(100vw - 32px)); background: var(--bs-body-bg, #fff); color: var(--bs-body-color, #212529); border-radius: 14px; box-shadow: 0 24px 80px #0006; padding: 26px; }
.gf-local-message-close { position: absolute; top: 9px; right: 12px; border: 0; background: transparent; color: inherit; font-size: 25px; }

.gf-tour-overlay { position: fixed; inset: 0; z-index: 3000; pointer-events: none; }
.gf-tour-overlay[hidden] { display: none; }
.gf-tour-shade { position: absolute; inset: 0; background: rgba(0,0,0,.58); }
.gf-tour-focus { position: fixed; border: 0; border-radius: 7px; box-shadow: 0 0 0 9999px rgba(0,0,0,.58); background: transparent; transition: .16s; }
.gf-tour-focus[hidden], .gf-tour-shade[hidden] { display: none; }
.gf-tour-card { position: fixed; z-index: 2; pointer-events: auto; width: min(340px, calc(100vw - 32px)); padding: 15px; border-radius: 5px; background: #fff; color: #2d2d2d; box-shadow: 0 1px 10px #0006; font-family: "Helvetica Neue", Inter, system-ui, sans-serif; }
.gf-tour-arrow { position: absolute; width: 0; height: 0; border: 7px solid transparent; }
.gf-tour-card[data-arrow="none"] .gf-tour-arrow { display: none; }
.gf-tour-card[data-arrow="top"] .gf-tour-arrow { display: block; top: -14px; left: 24px; border-bottom-color: #fff; }
.gf-tour-card[data-arrow="bottom"] .gf-tour-arrow { display: block; bottom: -14px; left: 24px; border-top-color: #fff; }
.gf-tour-card[data-arrow="right"] .gf-tour-arrow { display: block; right: -14px; top: 24px; border-left-color: #fff; }
.gf-tour-card[data-arrow="left"] .gf-tour-arrow { display: block; left: -14px; top: 24px; border-right-color: #fff; }
.gf-tour-card small { color: #727272; font-size: 13px; font-weight: 400; }
.gf-tour-card h4 { margin: 0; padding-right: 24px; font-size: 17px; line-height: 1.5; font-weight: 700; }
.gf-tour-card p { margin: 5px 0 0; color: #2d2d2d; font-size: 14px; line-height: 1.5; }
.gf-tour-card footer { display: flex; align-items: center; justify-content: space-between; margin-top: 15px; }
.gf-tour-actions { display: flex; gap: 4px; }
.gf-tour-actions .btn { padding: 6px 15px; border-radius: 5px; font-size: 12px; line-height: 1.3; }
.gf-tour-actions .btn-primary { background: #6f61df; border-color: #6f61df; }
.gf-tour-close { position: absolute; top: 0; right: 0; width: 32px; height: 28px; padding: 0; border: 0; background: #6f61df; color: #fff; font-size: 18px; line-height: 28px; }

.gf-breakdown-bars { display: flex; gap: 4px; align-items: end; height: 55px; }
.gf-breakdown-bars i { flex: 1; background: #6f61df; border-radius: 3px 3px 0 0; height: 35%; }
.gf-breakdown-bars i:nth-child(2) { height: 85%; }
.gf-breakdown-bars i:nth-child(3) { height: 55%; }

.gf-tm-track { position: relative; display: block; height: 5px; margin: 11px 4px; border-radius: 99px; background: #d9dde4; }
.gf-tm-track::before { content: ''; position: absolute; inset: 0 36% 0 0; border-radius: inherit; background: #6f61df; }
.gf-tm-track i { position: absolute; left: 64%; top: 50%; width: 16px; height: 16px; border: 2px solid #6f61df; border-radius: 50%; background: var(--bs-body-bg, #fff); transform: translate(-50%, -50%); transition: left .18s ease; }

@media (max-width: 767px) {
  .gf-local-chart, .gf-local-chart-canvas { min-height: 460px; height: 460px; }
  html[data-full-clone="candidate"] #gex-ohlc-view,
  html[data-full-clone="candidate"] #gex-ohlc-chart {
    height: 565px !important;
    min-height: 565px !important;
    overflow: hidden !important;
  }
  html[data-full-clone="candidate"] #gex-ohlc-view { flex: 0 0 565px !important; }
  html[data-full-clone="candidate"] .chart-section:has(#gex-ohlc-view:not(.gf-force-hidden)) {
    flex: 0 0 565px !important;
    height: 565px !important;
    min-height: 565px !important;
  }
  html[data-full-clone="candidate"] .strike-markers-section:not(.gf-force-hidden) {
    flex: 0 0 106px !important;
    height: 106px !important;
    overflow: hidden !important;
  }
  html[data-full-clone="candidate"] #gexByStrikeChart {
    height: 340px !important;
    overflow: hidden !important;
  }
  html[data-full-clone="candidate"] #modeToggle { display: none !important; }
  .reach-prob-panel.is-open { inset: auto 8px 8px; width: auto; max-height: 76vh; }
  .gf-tour-card { left: 16px !important; right: 16px; top: auto !important; bottom: 16px; }
}
.gf-data-unavailable {
  opacity: .42;
  filter: grayscale(.7);
}

.gf-unavailable-chart {
  display: block;
  width: 100%;
  height: 100%;
}

.gf-dashboard-unavailable {
  min-height: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 18px;
  color: var(--bs-secondary-color, #6c757d);
  text-align: center;
}
.gf-dashboard-unavailable strong { color: var(--bs-body-color, #212529); font-size: 13px; }
.gf-dashboard-unavailable span { max-width: 420px; font-size: 11px; line-height: 1.4; }
.gf-dashboard-unavailable-compact { min-height: 105px; padding: 10px; }