.chart-controls{display:flex;align-items:center;gap:8px}.control-group{display:flex;align-items:center}.control-group select{padding:5px 24px 5px 10px;background-color:#2a2a3e;color:#d1d4dc;border:1px solid #3a3a4e;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;outline:none;transition:all .2s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23758696' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}.control-group select:hover{border-color:#4a4a5e;background-color:#323248}.control-group select:focus{border-color:#26a69a;box-shadow:0 0 0 2px #26a69a33}.symbol-select{min-width:130px}.timeframe-select{min-width:70px}@media(max-width:768px){.chart-controls{gap:6px}.control-group select{padding:4px 20px 4px 8px;font-size:11px}.symbol-select{min-width:100px}.timeframe-select{min-width:60px}}@media(max-width:480px){.control-group select{padding:4px 18px 4px 6px;font-size:10px}.symbol-select{min-width:80px}.timeframe-select{min-width:50px}}.connection-status{display:flex;align-items:center;gap:8px;padding:6px 12px;background-color:#2a2a3e;border-radius:4px;font-size:12px;font-weight:500}.status-dot{width:8px;height:8px;border-radius:50%;animation:pulse 2s infinite}.connection-status.connected .status-dot{background-color:#26a69a}.connection-status.connecting .status-dot,.connection-status.reconnecting .status-dot{background-color:#ffa726;animation:blink 1s infinite}.connection-status.disconnected .status-dot{background-color:#ef5350;animation:none}.status-label{color:#d1d4dc}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.drawing-toolbar.floating{position:absolute;display:flex;flex-direction:column;gap:4px;padding:8px;background-color:#16162af2;border:1px solid #2a2a3e;border-radius:8px;box-shadow:0 4px 20px #0006;z-index:100;cursor:move;-webkit-user-select:none;user-select:none}.drawing-toolbar.floating.dragging{opacity:.9;box-shadow:0 8px 30px #00000080}.drawing-toolbar.floating.collapsed{padding:4px 8px}.toolbar-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:4px;border-bottom:1px solid #2a2a3e;margin-bottom:4px}.drawing-toolbar.collapsed .toolbar-header{border-bottom:none;margin-bottom:0;padding-bottom:0}.collapse-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background-color:transparent;color:#758696;border:none;border-radius:4px;font-size:10px;cursor:pointer;transition:all .15s}.tool-buttons{display:flex;flex-direction:column;gap:2px}.tool-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background-color:transparent;color:#758696;border:1px solid transparent;border-radius:6px;font-size:16px;cursor:pointer;transition:all .15s}.tool-btn:hover{background-color:#2a2a3e;color:#d1d4dc}.tool-btn.active{background-color:#26a69a;color:#fff;border-color:#26a69a}.toolbar-divider{width:100%;height:1px;background-color:#2a2a3e;margin:4px 0}.clear-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background-color:transparent;color:#758696;border:1px solid transparent;border-radius:6px;font-size:16px;cursor:pointer;transition:all .15s}.clear-btn:hover{background-color:#ef5350;color:#fff;border-color:#ef5350}.indicator-panel{position:relative}.indicator-toggle{padding:6px 12px;background-color:#2a2a3e;color:#d1d4dc;border:1px solid #3a3a4e;border-radius:4px;font-size:12px;cursor:pointer;transition:all .15s}.indicator-toggle:hover,.indicator-toggle.open{background-color:#3a3a4e;border-color:#4a4a5e}.indicator-dropdown{position:absolute;top:100%;right:0;margin-top:4px;min-width:200px;background-color:#1a1a2e;border:1px solid #2a2a3e;border-radius:6px;box-shadow:0 4px 12px #0000004d;z-index:100;overflow:hidden}.indicator-list{padding:8px 0}.indicator-item{padding:8px 12px;transition:background-color .15s}.indicator-item:hover{background-color:#2a2a3e}.indicator-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:#d1d4dc}.indicator-checkbox input[type=checkbox]{width:16px;height:16px;accent-color:#26a69a;cursor:pointer}.indicator-color{width:12px;height:12px;border-radius:2px}.indicator-name{flex:1}.time-sales{width:200px;flex-shrink:0;background-color:#16162a;border-left:1px solid #2a2a3e;display:flex;flex-direction:column;overflow:hidden}.time-sales-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background-color:#1a1a2e;border-bottom:1px solid #2a2a3e;cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0}.time-sales-header:hover{background-color:#2a2a3e}.header-title{font-size:11px;font-weight:600;color:#d1d4dc;text-transform:uppercase;letter-spacing:.5px}.header-toggle{font-size:14px;color:#758696}.time-sales-labels{display:flex;justify-content:space-between;padding:6px 12px;font-size:10px;color:#758696;text-transform:uppercase;border-bottom:1px solid #2a2a3e;flex-shrink:0}.time-sales-list{flex:1;overflow-y:auto;overflow-x:hidden}.trade-row{display:flex;justify-content:space-between;padding:3px 12px;font-size:11px;font-family:SF Mono,Consolas,monospace;border-bottom:1px solid rgba(42,42,62,.5);transition:background-color .1s}.trade-row:hover{background-color:#2a2a3e80}.trade-row.buy{color:#26a69a}.trade-row.sell{color:#ef5350}.trade-row.neutral{color:#d1d4dc}.trade-time{flex:1;color:#758696}.trade-price{flex:1;text-align:right}.trade-size{flex:.5;text-align:right;color:#758696}.no-trades{padding:16px;text-align:center;color:#758696;font-size:12px}.time-sales-list::-webkit-scrollbar{width:4px}.time-sales-list::-webkit-scrollbar-thumb{background:#3a3a4e;border-radius:2px}@media(max-width:768px){.time-sales{width:160px}.trade-row{font-size:10px;padding:2px 8px}.time-sales-labels{font-size:9px;padding:4px 8px}}@media(max-width:480px){.time-sales{position:absolute;right:0;top:0;bottom:0;width:180px;z-index:50;box-shadow:-4px 0 20px #0000004d}}.bid-ask-panel.floating{position:absolute;display:flex;flex-direction:column;background-color:#16162af2;border:1px solid #2a2a3e;border-radius:8px;box-shadow:0 4px 20px #0006;z-index:100;cursor:move;-webkit-user-select:none;user-select:none;min-width:140px}.bid-ask-panel.floating.dragging{opacity:.9;box-shadow:0 8px 30px #00000080}.bid-ask-panel.floating.collapsed{min-width:auto}.panel-header{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px solid #2a2a3e}.bid-ask-panel.collapsed .panel-header{border-bottom:none}.drag-handle{font-size:12px;color:#758696;letter-spacing:-2px;cursor:move}.panel-title{flex:1;font-size:10px;font-weight:600;color:#758696;text-transform:uppercase;letter-spacing:.5px}.collapse-btn{display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;background-color:transparent;color:#758696;border:none;border-radius:4px;font-size:10px;cursor:pointer;transition:all .15s}.collapse-btn:hover{background-color:#2a2a3e;color:#d1d4dc}.panel-content{padding:8px 10px}.quote-row{display:flex;align-items:center;gap:8px;padding:2px 0}.quote-row .label{font-size:9px;font-weight:600;color:#758696;width:24px}.quote-row .price{font-size:13px;font-weight:600;font-family:SF Mono,Consolas,monospace;flex:1}.quote-row .price.bid{color:#26a69a}.quote-row .price.ask{color:#ef5350}.quote-row .size{font-size:11px;font-family:SF Mono,Consolas,monospace;color:#758696;min-width:30px;text-align:right}.spread-row{display:flex;align-items:center;justify-content:center;gap:6px;padding:4px 0;margin:4px 0;background-color:#2a2a3e80;border-radius:4px}.spread-value{font-size:12px;font-weight:600;font-family:SF Mono,Consolas,monospace;color:#ffa726}.spread-ticks{font-size:10px;color:#758696}.waiting{font-size:11px;color:#758696;text-align:center;padding:8px}@media(max-width:480px){.bid-ask-panel.floating{min-width:120px}.quote-row .price{font-size:12px}.quote-row .size{font-size:10px}}.chart-mode-selector{display:flex;gap:2px;background:#1a1a2e;border-radius:4px;padding:2px;border:1px solid #2a2a3e}.chart-mode-selector .mode-btn{padding:4px 12px;font-size:12px;font-weight:500;color:#8a8a9a;background:transparent;border:none;border-radius:3px;cursor:pointer;transition:all .15s ease}.chart-mode-selector .mode-btn:hover{color:#d1d4dc;background:#2a2a3e}.chart-mode-selector .mode-btn.active{color:#fff;background:#3a3a5e}@media(max-width:768px){.chart-mode-selector .mode-btn{padding:4px 8px;font-size:11px}}.footprint-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}.footprint-overlay.hidden{display:none}.footprint-settings{position:absolute;top:50px;left:50%;transform:translate(-50%);background:#1a1a2efa;border:1px solid #3a3a5e;border-radius:8px;z-index:1000;min-width:360px;max-width:420px;box-shadow:0 8px 32px #00000080;font-size:13px;-webkit-user-select:none;user-select:none}.footprint-settings.dragging{cursor:grabbing;opacity:.95}.settings-header{padding:10px 16px;border-bottom:1px solid #3a3a5e;display:flex;align-items:center;gap:8px;cursor:grab;background:#1e1e3280;border-radius:8px 8px 0 0}.settings-header:active{cursor:grabbing}.settings-header .drag-handle{color:#5a5a7e;font-size:14px;letter-spacing:-2px}.settings-header h3{margin:0;color:#d1d4dc;font-size:14px;font-weight:600;flex:1}.settings-header .close-btn{background:none;border:none;color:#8a8a9e;font-size:20px;cursor:pointer;padding:0 4px;line-height:1;transition:color .2s}.settings-header .close-btn:hover{color:#ef5350}.settings-tabs{display:flex;border-bottom:1px solid #3a3a5e;padding:0 8px;overflow-x:auto}.settings-tabs button{background:none;border:none;color:#8a8a9e;padding:10px 12px;cursor:pointer;font-size:12px;white-space:nowrap;border-bottom:2px solid transparent;transition:all .2s}.settings-tabs button:hover{color:#d1d4dc}.settings-tabs button.active{color:#26a69a;border-bottom-color:#26a69a}.settings-content{padding:16px;max-height:400px;overflow-y:auto}.settings-group{display:flex;flex-direction:column;gap:12px}.setting-row{display:flex;align-items:center;gap:10px;color:#d1d4dc;cursor:pointer}.setting-row input[type=checkbox]{width:16px;height:16px;accent-color:#26a69a;cursor:pointer}.setting-row input[type=range]{flex:1;accent-color:#26a69a;cursor:pointer}.setting-row input[type=number]{width:70px;padding:4px 8px;background:#2a2a3e;border:1px solid #3a3a5e;border-radius:4px;color:#d1d4dc;font-size:12px}.setting-row select{padding:4px 8px;background:#2a2a3e;border:1px solid #3a3a5e;border-radius:4px;color:#d1d4dc;font-size:12px;cursor:pointer}.setting-row .value{min-width:50px;text-align:right;color:#8a8a9e;font-size:12px}.setting-row.color-row{justify-content:space-between}.setting-row input[type=color]{width:40px;height:24px;padding:0;border:1px solid #3a3a5e;border-radius:4px;cursor:pointer;background:transparent}.setting-description{margin:-8px 0 4px 26px;font-size:11px;color:#6a6a8e;line-height:1.4}.setting-divider{height:1px;background:#3a3a5e;margin:8px 0}.settings-content::-webkit-scrollbar{width:6px}.settings-content::-webkit-scrollbar-track{background:#1a1a2e}.settings-content::-webkit-scrollbar-thumb{background:#3a3a5e;border-radius:3px}.settings-content::-webkit-scrollbar-thumb:hover{background:#4a4a6e}.volume-profile{background:#1a1a2eeb;border:1px solid #3a3a5e;border-radius:4px}.delta-bar{width:100%;background:#1a1a2e;border-top:1px solid #2a2a3e;position:relative}.delta-bar canvas{display:block;width:100%;height:100%}.strike-levels-overlay{pointer-events:none}.strike-levels-loading{position:absolute;top:60px;right:70px;background:#1a1a2ee6;border:1px solid #3a3a5e;padding:6px 12px;border-radius:4px;font-size:10px;color:#8a8a9e;z-index:20}.strike-levels-error{position:absolute;top:60px;right:70px;background:#ef53501a;border:1px solid rgba(239,83,80,.3);padding:6px 12px;border-radius:4px;font-size:10px;color:#ef5350;z-index:20;cursor:help}.strike-profile-container{pointer-events:none}.strike-profile{transition:opacity .2s ease}.strike-profile.loading{opacity:.5}.strike-tooltip{background:#16162afa;border:1px solid #3a3a5e;border-radius:6px;padding:10px 12px;min-width:160px;max-width:200px;box-shadow:0 4px 20px #00000080;font-size:11px;color:#d1d4dc;pointer-events:none;animation:tooltipFadeIn .15s ease}@keyframes tooltipFadeIn{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}.strike-tooltip-header{font-weight:600;font-size:12px;color:#e0e0e0;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #3a3a5e;font-family:SF Mono,Consolas,monospace}.strike-tooltip-row{display:flex;justify-content:space-between;align-items:center;padding:2px 0}.strike-tooltip-row .label{color:#8a8a9e;font-size:10px}.strike-tooltip-row .value{font-family:SF Mono,Consolas,monospace;font-weight:500}.strike-tooltip-row.call .value{color:#26a69a}.strike-tooltip-row.put .value{color:#ef5350}.strike-tooltip-row .value.positive{color:#26a69a}.strike-tooltip-row .value.negative{color:#ef5350}.strike-tooltip-divider{height:1px;background:#3a3a5e;margin:6px 0}.strike-tooltip-badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.strike-tooltip-badges .badge{padding:2px 6px;border-radius:3px;font-size:9px;font-weight:600;text-transform:uppercase}.strike-tooltip-badges .badge.max-pain{background:#ffd70033;color:gold;border:1px solid rgba(255,215,0,.3)}.strike-tooltip-badges .badge.call-wall{background:#26a69a33;color:#26a69a;border:1px solid rgba(38,166,154,.3)}.strike-tooltip-badges .badge.put-wall{background:#ef535033;color:#ef5350;border:1px solid rgba(239,83,80,.3)}.strike-tooltip-badges .badge.gamma-flip{background:#9c27b033;color:#9c27b0;border:1px solid rgba(156,39,176,.3)}@media(max-width:768px){.strike-tooltip{font-size:10px;min-width:140px;padding:8px 10px}.strike-tooltip-header{font-size:11px}.strike-tooltip-row .label{font-size:9px}}.strike-settings-panel{position:fixed;width:280px;max-height:80vh;background:#1a1a2efa;border:1px solid #3a3a5e;border-radius:8px;z-index:1000;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px #0009;-webkit-user-select:none;user-select:none;transition:box-shadow .2s}.strike-settings-panel.dragging{box-shadow:0 12px 48px #000c;cursor:grabbing}.strike-settings-header{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#1e1e32e6;border-bottom:1px solid #3a3a5e;font-size:12px;font-weight:600;color:#e0e0e0;cursor:grab}.strike-settings-header:active{cursor:grabbing}.drag-handle{color:#5a5a7e;font-size:14px;letter-spacing:2px}.strike-settings-close{margin-left:auto;background:none;border:none;color:#8a8a9e;font-size:18px;cursor:pointer;padding:0 4px;line-height:1;transition:color .2s}.strike-settings-close:hover{color:#ef5350}.strike-settings-content{overflow-y:auto;padding:8px 0;flex:1}.strike-settings-section{padding:8px 12px;border-bottom:1px solid rgba(58,58,94,.5)}.strike-settings-section:last-of-type{border-bottom:none}.strike-settings-section-title{font-size:10px;font-weight:600;color:#8a8a9e;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.strike-settings-checkbox{display:flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer;font-size:11px;color:silver}.strike-settings-checkbox input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:#26a69a}.strike-settings-checkbox:hover{color:#e0e0e0}.strike-settings-radio-group{display:flex;flex-direction:column;gap:4px}.strike-settings-radio{display:flex;align-items:center;gap:8px;padding:3px 0;cursor:pointer;font-size:11px;color:silver}.strike-settings-radio input[type=radio]{width:12px;height:12px;cursor:pointer;accent-color:#26a69a}.strike-settings-radio:hover{color:#e0e0e0}.strike-settings-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:11px;color:silver}.strike-settings-row label{flex:0 0 70px;color:#8a8a9e}.strike-settings-row select{flex:1;background:#28283ccc;border:1px solid #3a3a5e;border-radius:4px;color:#e0e0e0;padding:4px 8px;font-size:11px;cursor:pointer}.strike-settings-row select:hover{border-color:#26a69a}.strike-settings-row input[type=range]{flex:1;height:4px;cursor:pointer;accent-color:#26a69a}.strike-settings-value{flex:0 0 40px;text-align:right;color:#26a69a;font-size:10px;font-family:monospace}.strike-settings-range-row{display:flex;gap:12px}.strike-settings-range-row label{flex:1;display:flex;flex-direction:column;gap:4px;font-size:10px;color:#8a8a9e}.strike-settings-range-row input[type=number]{width:100%;background:#28283ccc;border:1px solid #3a3a5e;border-radius:4px;color:#e0e0e0;padding:6px 8px;font-size:11px;font-family:monospace}.strike-settings-range-row input[type=number]:focus{outline:none;border-color:#26a69a}.strike-settings-actions{padding:12px;border-top:1px solid #3a3a5e}.strike-settings-reset{width:100%;background:#ef535026;border:1px solid rgba(239,83,80,.3);border-radius:4px;color:#ef5350;padding:8px;font-size:11px;cursor:pointer;transition:all .2s ease}.strike-settings-reset:hover{background:#ef535040;border-color:#ef5350}@media(max-width:768px){.strike-settings-panel{width:260px;max-height:70vh;font-size:10px}.strike-settings-header{padding:8px 10px;font-size:11px}.strike-settings-section{padding:6px 10px}.strike-settings-checkbox,.strike-settings-radio,.strike-settings-row{font-size:10px}}@media(max-width:480px){.strike-settings-panel{width:calc(100vw - 20px);max-width:300px;left:10px!important;right:10px;max-height:60vh}.strike-settings-section-title{font-size:9px}.strike-settings-row label{flex:0 0 60px}}.options-flow-canvas{pointer-events:none}.options-flow-summary-bar{position:absolute;top:4px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:4px 12px;background:#16162af2;border:1px solid #3a3a5e;border-radius:6px;font-size:10px;z-index:50;box-shadow:0 2px 8px #0000004d}.flow-item{display:flex;align-items:center;gap:4px}.flow-item .label{color:#8a8a9e;font-weight:500}.flow-item .value{font-family:SF Mono,Consolas,monospace;font-weight:600;color:#d1d4dc}.flow-item .value.call{color:#26a69a}.flow-item .value.put{color:#ef5350}.flow-item .value.max-pain{color:gold}.flow-item .value.positive{color:#26a69a}.flow-item .value.negative{color:#ef5350}.flow-item .value.bullish{color:#26a69a}.flow-item .value.bearish{color:#ef5350}.flow-divider{width:1px;height:16px;background:#3a3a5e}.pc-ratio{flex-direction:column;align-items:flex-start;gap:2px}.pc-ratio .value{font-size:11px}.pc-gauge{width:40px;height:3px;background:#2a2a3e;border-radius:2px;overflow:hidden}.pc-gauge-fill{height:100%;border-radius:2px;transition:width .3s ease}.delta-oi .value{display:flex;align-items:center;gap:2px}.delta-oi .separator{color:#5a5a7e}.key-level-tooltip{background:#16162afa;border-radius:6px;padding:10px 12px;min-width:160px;box-shadow:0 4px 20px #00000080;font-size:11px;color:#d1d4dc;pointer-events:none;animation:keyLevelFadeIn .15s ease}.key-level-tooltip.max_pain{border:1px solid rgba(255,215,0,.5)}.key-level-tooltip.call_wall{border:1px solid rgba(38,166,154,.5)}.key-level-tooltip.put_wall{border:1px solid rgba(239,83,80,.5)}.key-level-tooltip.gamma_flip{border:1px solid rgba(156,39,176,.5)}@keyframes keyLevelFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.key-level-header{font-weight:600;font-size:11px;margin-bottom:4px}.key-level-tooltip.max_pain .key-level-header{color:gold}.key-level-tooltip.call_wall .key-level-header{color:#26a69a}.key-level-tooltip.put_wall .key-level-header{color:#ef5350}.key-level-tooltip.gamma_flip .key-level-header{color:#9c27b0}.key-level-price{font-family:SF Mono,Consolas,monospace;font-size:14px;font-weight:600;color:#e0e0e0;margin-bottom:6px}.key-level-description{font-size:9px;color:#8a8a9e;line-height:1.4}.expiry-breakdown-panel{position:absolute;bottom:30px;right:70px;background:#16162af2;border:1px solid #3a3a5e;border-radius:6px;padding:8px 10px;min-width:140px;font-size:10px;z-index:40;box-shadow:0 2px 12px #0006}.expiry-header{font-weight:600;font-size:9px;text-transform:uppercase;color:#8a8a9e;letter-spacing:.5px;margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid #3a3a5e}.expiry-row{display:flex;align-items:center;gap:6px;padding:3px 0}.expiry-date{flex:0 0 30px;color:#a0a0b0;font-family:SF Mono,Consolas,monospace;font-size:9px}.expiry-bars{flex:1;display:flex;height:6px;background:#2a2a3e;border-radius:3px;overflow:hidden}.expiry-bars .call-bar{height:100%;background:#26a69a}.expiry-bars .put-bar{height:100%;background:#ef5350}.expiry-oi{flex:0 0 35px;text-align:right;color:#8a8a9e;font-family:SF Mono,Consolas,monospace;font-size:9px}@media(max-width:768px){.options-flow-summary-bar{font-size:9px;gap:4px;padding:3px 8px;max-width:calc(100vw - 20px);flex-wrap:wrap;justify-content:center}.flow-divider{height:12px}.pc-gauge{width:30px}.key-level-tooltip{font-size:10px;min-width:140px;padding:8px 10px}.expiry-breakdown-panel{right:10px;bottom:20px;min-width:120px}}@media(max-width:480px){.options-flow-summary-bar{font-size:8px;gap:3px;padding:2px 6px}.flow-item .label,.pc-ratio{display:none}}.bookmap-liquidity-canvas{pointer-events:none}.bookmap-connect-panel{position:absolute;top:40px;right:70px;background:#16162afa;border:1px solid #3a3a5e;border-radius:6px;padding:12px;min-width:280px;z-index:100;box-shadow:0 4px 20px #00000080}.bookmap-connect-panel h4{margin:0 0 10px;font-size:12px;font-weight:600;color:#e0e0e0}.bookmap-connect-panel input{width:100%;padding:8px 10px;background:#28283ccc;border:1px solid #3a3a5e;border-radius:4px;color:#e0e0e0;font-size:11px;font-family:SF Mono,Consolas,monospace;margin-bottom:10px}.bookmap-connect-panel input:focus{outline:none;border-color:#26a69a}.bookmap-connect-panel input::placeholder{color:#5a5a7e}.bookmap-connect-panel button{width:100%;padding:8px;background:#26a69a33;border:1px solid rgba(38,166,154,.5);border-radius:4px;color:#26a69a;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s}.bookmap-connect-panel button:hover{background:#26a69a4d;border-color:#26a69a}.bookmap-connect-panel button.disconnect{background:#ef535033;border-color:#ef535080;color:#ef5350}.bookmap-connect-panel button.disconnect:hover{background:#ef53504d;border-color:#ef5350}.bookmap-status{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:10px;color:#8a8a9e}.bookmap-status .dot{width:8px;height:8px;border-radius:50%}.bookmap-status .dot.connected{background:#26a69a;box-shadow:0 0 6px #26a69a80}.bookmap-status .dot.connecting{background:#ff9800;animation:pulse 1s infinite}.bookmap-status .dot.disconnected{background:#5a5a7e}.bookmap-status .dot.error{background:#ef5350}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media(max-width:768px){.bookmap-connect-panel{right:10px;min-width:240px;padding:10px}}.chart-wrapper{display:flex;flex-direction:column;height:100%;width:100%;background-color:#1a1a2e;color:#d1d4dc;overflow:hidden}.chart-header{display:flex;align-items:center;gap:12px;padding:8px 12px;background-color:#16162a;border-bottom:1px solid #2a2a3e;flex-wrap:wrap;flex-shrink:0}.chart-title{display:flex;align-items:center;gap:8px}.chart-title .symbol{font-size:16px;font-weight:600;color:#fff}.chart-title .timeframe{font-size:12px;color:#758696;background-color:#2a2a3e;padding:4px 8px;border-radius:4px}.toggle-panel-btn{padding:6px 12px;background-color:#2a2a3e;color:#758696;border:1px solid #3a3a4e;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600;transition:all .2s}.toggle-panel-btn:hover{background-color:#3a3a4e;color:#d1d4dc}.toggle-panel-btn.active{background-color:#26a69a;color:#fff;border-color:#26a69a}.toggle-panel-btn.connected{color:#26a69a;border-color:#26a69a80}.chart-main{display:flex;flex:1;min-height:0;overflow:hidden;position:relative}.chart-container{flex:1;min-width:0;position:relative;min-height:300px}.chart-container.drawing-mode{cursor:crosshair}.chart-container.drawing-mode:after{content:"Click and drag to draw";position:absolute;bottom:80px;left:50%;transform:translate(-50%);padding:6px 12px;background-color:#ffa726e6;color:#1a1a2e;font-size:12px;font-weight:600;border-radius:4px;pointer-events:none;z-index:60;animation:fadeInOut 3s ease-in-out}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}80%{opacity:1}to{opacity:0}}.chart-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:48px;font-weight:700;color:#ffffff0d;pointer-events:none;z-index:1;-webkit-user-select:none;user-select:none;letter-spacing:6px;text-transform:uppercase}.chart-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background-color:#1a1a2ee6;z-index:10}.chart-overlay.error{color:#ef5350}.chart-overlay .error-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;font-size:24px;font-weight:700;background-color:#ef5350;color:#fff;border-radius:50%}.chart-overlay button{padding:8px 24px;background-color:#26a69a;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.chart-overlay button:hover{background-color:#2bbbad}.loading-spinner{width:40px;height:40px;border:3px solid #2a2a3e;border-top-color:#26a69a;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.scroll-to-now-btn{position:absolute;bottom:40px;right:70px;display:flex;align-items:center;gap:4px;padding:8px 12px;background-color:#26a69ae6;color:#fff;border:none;border-radius:20px;cursor:pointer;font-size:12px;font-weight:600;box-shadow:0 2px 10px #0000004d;transition:all .2s;z-index:50}.scroll-to-now-btn:hover{background-color:#26a69a;transform:translate(2px);box-shadow:0 4px 15px #26a69a66}.scroll-to-now-btn .arrow{font-size:14px;transition:transform .2s}.scroll-to-now-btn:hover .arrow{transform:translate(3px)}.scroll-to-now-btn .label{text-transform:uppercase;letter-spacing:.5px}@media(max-width:768px){.chart-header{padding:6px 8px;gap:8px}.chart-title .symbol{font-size:14px}.chart-title .timeframe{font-size:11px;padding:2px 6px}.toggle-panel-btn{padding:4px 8px;font-size:11px}.chart-watermark{font-size:32px;letter-spacing:4px}.scroll-to-now-btn{bottom:30px;right:50px;padding:6px 10px;font-size:11px}}@media(max-width:480px){.chart-header{justify-content:center}.chart-title{width:100%;justify-content:center}}.crosshair-tooltip{display:flex;align-items:center;gap:8px;padding:4px 12px;background-color:#16162af2;border:1px solid #2a2a3e;border-radius:4px;font-size:11px;white-space:nowrap;z-index:50}.crosshair-time{color:#758696;font-family:SF Mono,Consolas,monospace}.crosshair-divider{color:#3a3a4e}.crosshair-item{display:flex;align-items:center;gap:3px}.crosshair-item .label{color:#5a5a7a;font-weight:500;font-size:10px}.crosshair-item .value{font-family:SF Mono,Consolas,monospace;color:#d1d4dc}.crosshair-item .value.up,.crosshair-item .value.high{color:#26a69a}.crosshair-item .value.down,.crosshair-item .value.low{color:#ef5350}.crosshair-item .change{font-family:SF Mono,Consolas,monospace;font-weight:600;padding:1px 4px;border-radius:2px}.crosshair-item .change.up{color:#26a69a;background:#26a69a26}.crosshair-item .change.down{color:#ef5350;background:#ef535026}@media(max-width:768px){.crosshair-tooltip{font-size:10px;gap:4px;padding:3px 8px}.crosshair-item .label{font-size:9px}}@media(max-width:480px){.crosshair-tooltip{flex-wrap:wrap;max-width:200px}}.app{width:100%;height:100vh;background-color:#1a1a2e;overflow:hidden}*{box-sizing:border-box}html,body{margin:0;padding:0;overflow:hidden}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:#1a1a2e;color:#d1d4dc;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}#root{width:100%;height:100%;overflow:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#1a1a2e}::-webkit-scrollbar-thumb{background:#3a3a4e;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#4a4a5e}::selection{background-color:#26a69a4d}