body.modal-open{overflow:hidden}
dialog.detail{width:min(960px,calc(100% - 24px));max-width:960px;max-height:92dvh;margin:auto;padding:0 20px 24px;overflow-y:auto;overscroll-behavior:contain}
dialog.detail::backdrop{background:rgba(12,20,34,.65)}
.modal-top{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;background:white;padding:10px 0;border-bottom:1px solid #e6eaf0;color:#718096;font-size:13px}
.modal-top button,.zoom-tools button{min-width:44px;min-height:44px;border:1px solid #dce2ea;border-radius:10px;background:#f4f6f8;color:#101827;font-size:18px;cursor:pointer}
.zoom-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.zoom-tools #zoomReset{font-size:13px;padding:0 12px}
#visibleCandles,.gesture-hint{font-size:12px;color:#718096;line-height:1.6}.gesture-hint{margin:10px 0}#chartError{color:#c9263b}
#detail .chart-box{height:42dvh;min-height:260px;max-height:540px}#candleChart{touch-action:none}
.history-range{font-size:11px;color:#718096;display:flex;gap:5px;align-items:center}.history-range select{min-height:40px}
.stock-values .streak-value{color:#101827;font-weight:700}
@media(max-width:600px){dialog.detail{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;padding:env(safe-area-inset-top) 12px max(20px,env(safe-area-inset-bottom))}.chart-controls{flex-wrap:wrap}.stock-card{gap:6px;padding:11px}.stock-main strong{font-size:15px}.stock-values small{font-size:11px}}
