/* Inline view and independent popup own separate state; orientation expands inline only. */
#klineSvg .kline-major-axis{font-weight:650;fill:#e5edf5}
#klineSvg .kline-grid-line{stroke:#273448;opacity:.45}
#klineSvg .kline-major-grid{stroke:#29384a;opacity:.65}
#klineSvg .kline-pane-heading text{fill:#92a5b9;font-size:10px;font-weight:500}
#klineSvg .kline-time-border{stroke:#263448;stroke-width:1;opacity:.7;vector-effect:non-scaling-stroke}
#klineWindow .kline-indicators button:focus-visible,#klineWindow .kline-periods button:focus-visible{outline:2px solid #59baff;outline-offset:2px}
#inlineKlineHost{padding:10px 8px 0;min-width:0;background:#080f17}
#klineWindow{position:relative;inset:auto;z-index:1;width:100%;height:auto;background:none}
#klineWindow .kline-shell{position:relative;top:auto;left:auto;right:auto;transform:none;width:100%;min-width:0;max-width:none;height:clamp(480px,65vh,800px);max-height:none;margin:0;resize:none;box-sizing:border-box}
#klineWindow .kline-titlebar{cursor:default;touch-action:auto}
#klineWindow .kline-title small{font-size:10px}
#klineWindow .kline-window-actions{gap:6px}
#klineWindow .kline-window-actions button[aria-pressed=true]{border-color:#f4b83f;color:#f4b83f}
#klineWindow .kline-canvas-wrap{min-height:220px;touch-action:none;overscroll-behavior:contain;user-select:none}
#klineWindow .kline-canvas-wrap svg{width:100%;height:100%;display:block}
#klineWindow #klineRangeRow,#klineWindow .kline-footer,#klineWindow .kline-resize-corner{display:none!important}
#klineWindow:not(.kline-expanded) [data-kline-action=close],#klineWindow:not(.kline-expanded) [data-kline-action=center]{display:none}
#klineWindow.kline-expanded{position:fixed;inset:0;z-index:50;width:100vw;height:100dvh;background:#020711d9;display:grid;place-items:center;padding:12px;box-sizing:border-box}
#klineWindow.kline-expanded .kline-shell{width:100%;height:100%;min-height:0;max-height:none;box-shadow:0 16px 70px #0009}
#klineWindow.kline-expanded.kline-portrait .kline-shell{width:min(600px,100%)}
#klineWindow.kline-portrait:not(.kline-expanded) .kline-shell{height:clamp(600px,78vh,900px)}
.auth-locked #inlineKlineHost .kline-quote-strip{filter:blur(8px);user-select:none}
.auth-locked #inlineKlineHost .kline-tools,.auth-locked #inlineKlineHost .kline-periods,.auth-locked #inlineKlineHost .kline-indicators{pointer-events:none}
body.kline-expanded-open{overflow:hidden}
/* Geometry is supplied per render: stay against the canvas bottom in inline,
   expanded, rotated and standalone views, below the price-axis labels. */
#klineWindow .kline-corner-controls{position:absolute;right:10px;bottom:var(--kline-controls-bottom,0px);z-index:5;display:flex;gap:5px;padding:4px;background:#0e1b28e8;border:1px solid #294456;border-radius:8px}
#klineWindow .kline-corner-controls button{display:grid;place-items:center;width:32px;height:32px;padding:5px;border:1px solid #314b62;border-radius:6px;background:#132337;color:#9ec3d4;cursor:pointer}
#klineWindow .kline-corner-controls button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
/* Same-size square controls, with A immediately left of orientation in every view. */
#klineWindow .kline-corner-controls.kline-window-actions button[data-kline-action=auto-price],#klineWindow .kline-corner-controls.kline-window-actions button[data-kline-action=orientation][aria-pressed]{box-sizing:border-box;position:static;flex:0 0 32px;width:32px;height:32px;min-width:32px;min-height:32px;max-width:32px;max-height:32px;aspect-ratio:1;border-radius:4px;padding:5px;box-shadow:none;animation:none;transition:none}
#klineWindow .kline-corner-controls button[data-kline-action=auto-price]{order:-1;display:grid;place-items:center;padding:0;background:#111d2a;color:#a8c2d8;border:1px solid #344e65;font:700 12px/1 system-ui,sans-serif}
#klineWindow .kline-corner-controls.kline-window-actions button[data-kline-action=orientation][aria-pressed] svg{width:20px;height:20px}
#klineWindow .kline-corner-controls button[data-kline-action=auto-price][aria-pressed=false]{color:#f4b83f;border-color:#b58132;background:#272116}
#klineWindow .kline-corner-controls button[data-kline-action=auto-price]:hover{color:#edf6ff;border-color:#59baff}
#klineWindow .kline-corner-controls button[data-kline-action=auto-price]:focus-visible{outline:2px solid #59baff;outline-offset:2px}
#klineCanvasWrap[data-price-mode=manual]{cursor:grab}
#klineCanvasWrap.panning,#klineCanvasWrap[data-gesture-mode=pan]{cursor:grabbing}
#klineCanvasWrap[data-gesture-mode=price]{cursor:ns-resize}
#klineCanvasWrap[data-gesture-mode=time]{cursor:ew-resize}
#klineSvg .kline-price-axis-hit,#klineSvg .kline-time-axis-hit{fill:transparent;stroke:none;pointer-events:all}
#klineSvg .kline-price-axis-hit{cursor:ns-resize}
#klineSvg .kline-time-axis-hit{cursor:ew-resize}
@media(prefers-reduced-motion:reduce){#klineWindow .kline-corner-controls button[data-kline-action=auto-price],#klineSvg .kline-price-axis-hit,#klineSvg .kline-time-axis-hit{animation:none!important;transition:none!important}}
.standalone-kline-dialog{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:18px;background:#020711d9}.standalone-kline-shell{width:min(1500px,100%);height:min(900px,94dvh);display:flex;flex-direction:column;overflow:hidden;border:1px solid #314b62;border-radius:10px;background:#08131e;box-shadow:0 24px 90px #0009}.standalone-kline-shell>header{display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid #26384b;color:#dcecf8}.standalone-kline-shell>header small{font-size:11px;color:#819fb6}.standalone-kline-shell>header button{margin-left:auto;background:#152437;color:#dcecf8;border:1px solid #304a63;border-radius:5px;width:32px;height:30px;cursor:pointer}.standalone-frame-host{flex:1;min-height:0}.standalone-frame-host iframe{width:100%;height:100%;border:0}.standalone-chart-open{overflow:hidden}.standalone-chart{margin:0;overflow:hidden}.standalone-chart> :not(#inlineKlineHost):not(.svg-sprite):not(script):not(link){display:none!important}.standalone-chart #inlineKlineHost{height:100dvh;padding:0}.standalone-chart #klineWindow .kline-shell{height:100dvh;min-height:0;border-radius:0;border:0}.standalone-chart #klineWindow #klineRangeRow{display:grid!important;min-height:34px}.standalone-chart #klineWindow .kline-footer{display:flex!important;min-height:28px}.standalone-chart #klineWindow .kline-titlebar{display:flex!important;cursor:default}.standalone-chart #klineWindow .kline-corner-controls{bottom:var(--kline-controls-bottom,0px)}.standalone-chart #klineWindow .kline-quote-strip{display:flex!important}.standalone-chart #klineWindow .kline-canvas-wrap{min-height:140px}
.standalone-chart #klineWindow #klineRangeRow{display:block!important;padding:6px 10px}.standalone-chart #klineHistoryRange{display:grid;grid-template-columns:32px minmax(0,1fr) 66px auto;align-items:center;gap:10px;width:100%}.standalone-chart #klineRange{width:100%;min-width:0}.standalone-chart #klineViewportStatus{white-space:nowrap}.standalone-kline-shell{resize:both;min-width:min(680px,100%);min-height:min(400px,90dvh)}.standalone-kline-shell>header{cursor:move;touch-action:none;user-select:none}
@media(max-width:820px){.standalone-kline-dialog{padding:4px}.standalone-kline-shell{width:100%;height:96dvh;min-width:0;resize:none}.standalone-kline-shell>header small{display:none}.standalone-kline-shell>header{cursor:default}.standalone-chart #klineHistoryRange{grid-template-columns:32px minmax(0,1fr) 66px}.standalone-chart #klineViewportStatus{display:none}}
@media(max-width:820px){
  #inlineKlineHost{padding:8px 4px 0}
  #klineWindow .kline-shell{height:72dvh;min-height:480px;border-radius:8px}
  #klineWindow .kline-titlebar{flex-wrap:wrap;gap:6px;padding:8px}
  #klineWindow .kline-title small{display:none}
  #klineWindow .kline-window-actions button{min-height:34px;padding:5px}
  #klineWindow .kline-toolbar{flex-wrap:wrap;gap:6px;padding:6px}
  #klineWindow .kline-periods{gap:4px;max-width:100%;overflow:auto;flex-shrink:0}
  #klineWindow .kline-periods button{padding:7px;font-size:11px;min-height:32px}
  #klineWindow .kline-indicators{overflow-x:auto;flex-wrap:nowrap;flex-shrink:0;padding:6px;gap:5px}
  #klineWindow .kline-indicators button{flex:none;font-size:10px;padding:5px 7px}
  #klineWindow .kline-source-state{display:none}
  #klineWindow .kline-quote-strip{flex-wrap:wrap;font-size:10px;gap:7px;padding:8px}
  #klineWindow.kline-expanded{padding:4px}
}
@media(orientation:portrait) and (max-width:820px){
  #klineWindow.kline-expanded.kline-landscape .kline-shell{position:absolute;top:50%;left:50%;width:calc(100dvh - 8px);height:calc(100dvw - 8px);min-height:0;transform:translate(-50%,-50%) rotate(90deg)}
  #klineWindow.kline-expanded.kline-landscape .kline-titlebar{flex-wrap:nowrap;padding:5px 8px}
  #klineWindow.kline-expanded.kline-landscape .kline-toolbar{flex-wrap:nowrap;padding:4px}
  #klineWindow.kline-expanded.kline-landscape .kline-canvas-wrap{min-height:0}
}
/* Physical phone landscape can exceed the portrait 820px breakpoint. Keep
   every plot/axis control inside its actual short viewport, not a 520px shell. */
@media(orientation:landscape) and (max-height:600px){
  #klineWindow.kline-expanded{padding:4px}
  #klineWindow.kline-expanded .kline-shell{min-height:0}
  #klineWindow.kline-expanded .kline-canvas-wrap{min-height:160px}
  #klineWindow.kline-expanded .kline-toolbar{flex-wrap:nowrap;min-height:0;padding:4px}
  #klineWindow.kline-expanded .kline-periods,#klineWindow.kline-expanded .kline-indicators{overflow-x:auto;flex-wrap:nowrap;flex-shrink:0}
}
/* The selected candle's information belongs to the plot's upper-left corner. */
.kline-tooltip{box-sizing:border-box;max-width:calc(100% - 24px);overflow-wrap:anywhere}
@media(max-width:820px){.kline-tooltip{min-width:0;width:max-content;padding:6px 8px;font-size:10px;line-height:1.5}.kline-tooltip b{font-size:11px}.kline-tooltip span{margin-right:6px}}
