.sc-chart-container{width:100%;max-width:100%;margin:0 auto;background-color:#fff;border-radius:0;box-shadow:0 2px 5px rgb(0 0 0 / .1);transition:background-color 0.3s ease,color 0.3s ease,box-shadow 0.3s ease;position:relative;height:100%;box-sizing:border-box;overflow:hidden}.sc-chart-container.dark-mode{background-color:#27262f!important;color:#e0e0e0}.sc-chart-container.fullscreen{position:fixed;top:0;left:0;width:100%;max-width:100%;height:100vh;margin:0;border-radius:0;z-index:9999;overflow:hidden;padding:0;box-sizing:border-box}.sc-chart-container.fullscreen .sc-price-chart{height:calc(100vh - 10px)!important;max-height:100vh!important}.sc-price-chart-container{position:relative;height:100%;width:100%;overflow:hidden}.sc-price-chart{width:100%;height:100%;margin-bottom:5px;border:1px solid #7d7994;cursor:default;position:relative;transition:border-color 0.3s ease;max-width:100%;box-sizing:border-box}.sc-chart-container.dark-mode .sc-price-chart{border-color:#444}.sc-vertical-scale-area{position:absolute;top:30px;bottom:30px;right:0;width:60px;cursor:ns-resize;z-index:10}.sc-chart-controls-overlay{position:absolute;top:10px;left:10px;display:flex;gap:8px;z-index:20;opacity:1}.sc-overlay-button{background:none;border:none;color:#fff;font-size:16px;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color 0.2s;background-color:rgb(255 255 255 / .1)}.sc-chart-container:not(.dark-mode) .sc-overlay-button{color:#333;background-color:rgb(0 0 0 / .1)}.sc-overlay-button:hover{background-color:rgb(255 255 255 / .2)}.sc-chart-container:not(.dark-mode) .sc-overlay-button:hover{background-color:rgb(0 0 0 / .2)}.sc-overlay-button.active{background-color:rgb(106 142 245 / .4);color:#fff}.sc-chart-container:not(.dark-mode) .sc-overlay-button.active{background-color:rgb(106 142 245 / .4);color:#fff}.sc-price-chart.dragging{cursor:grabbing!important}.sc-chart-container.dark-mode .sc-overlay-button svg path:not([fill="none"]){fill:#fff}.sc-chart-container.dark-mode .sc-chart-type-button svg path{stroke:#fff;fill:none}.sc-chart-container.dark-mode .sc-text-tool-button svg text{fill:#fff}.sc-chart-container:not(.dark-mode) .sc-text-tool-button svg text{fill:#333}
/* Ensure outline-only icons use stroke instead of fill */
.sc-chart-container.dark-mode .sc-drawing-tools-button svg path,
.sc-chart-container.dark-mode .sc-drawing-tools-button svg circle,
.sc-chart-container.dark-mode .sc-camera-button svg path,
.sc-chart-container.dark-mode .sc-camera-button svg circle {
    stroke: #fff !important;
    fill: none !important;
}

.sc-chart-container:not(.dark-mode) .sc-drawing-tools-button svg path,
.sc-chart-container:not(.dark-mode) .sc-drawing-tools-button svg circle,
.sc-chart-container:not(.dark-mode) .sc-camera-button svg path,
.sc-chart-container:not(.dark-mode) .sc-camera-button svg circle {
    stroke: #333 !important;
    fill: none !important;
}.sc-dark-mode-button.active{background-color:rgb(255 255 255 / .1)!important}.sc-chart-container:not(.dark-mode) .sc-dark-mode-button.active{background-color:rgb(0 0 0 / .1);color:#333}@media (max-width:576px){.sc-chart-container{border-radius:0}.sc-chart-controls-overlay{gap:4px;top:5px;left:5px}.sc-overlay-button{width:28px;height:28px;font-size:14px}.sc-vertical-scale-area{width:40px}#chart1,#chart2{margin-bottom:30px;height:300px}}@media (min-width:577px) and (max-width:768px){.sc-chart-container{padding:8px}.sc-overlay-button{width:30px;height:30px}.sc-vertical-scale-area{width:50px}#chart1,#chart2{height:350px}}@media (min-width:769px) and (max-width:992px){.sc-vertical-scale-area{width:55px}}@media (hover:none){.sc-overlay-button{padding:0}.sc-vertical-scale-area{width:70px}}.sc-price-chart:after{content:"";position:absolute;bottom:0;right:0;width:calc(100% - 1px);height:1px;background-color:#ddd;pointer-events:none}.sc-price-chart:before{content:"";position:absolute;top:0;right:0;width:1px;height:100%;background-color:#ddd;pointer-events:none}.sc-chart-container.dark-mode .sc-price-chart:after,.sc-chart-container.dark-mode .sc-price-chart:before{background-color:#444}.sc-chart-container.fullscreen{position:fixed;top:0;left:0;width:100vw!important;height:100vh!important;max-width:100vw!important;margin:0;border-radius:0;z-index:9999;overflow:hidden;padding:0;box-sizing:border-box}.sc-chart-container.fullscreen .sc-price-chart{width:100%!important;height:100%!important;max-height:100vh!important;box-sizing:border-box}.sc-ohlcv-values-display .label-open,.sc-ohlcv-values-display .label-high,.sc-ohlcv-values-display .label-low,.sc-ohlcv-values-display .label-close,.sc-ohlcv-values-display .label-volume{font-family:'Open Sans',Arial,sans-serif;font-weight:500}@media (hover:none),(pointer:coarse){.sc-ohlcv-values-display{display:none!important}.sc-ticker-info-display{font-size:12px!important;gap:5px!important}}.sc-chart-container:not(.dark-mode) .sc-ticker-symbol{color:#333!important}.sc-chart-container:not(.dark-mode) .sc-company-name{color:#777!important}.sc-chart-container:not(.dark-mode) .sc-current-price{color:#333!important}.sc-price-chart.line-drawing-mode{cursor:crosshair!important}.sc-price-chart.text-annotation-mode{cursor:text!important}.sc-indicators-dropdown{position:absolute;top:50px;left:10px;width:680px;max-width:calc(100vw - 40px);background-color:rgba(12, 12, 18, 0.98);border-radius:2px;box-shadow:0 4px 20px rgb(0 0 0 / .6);z-index:100;display:none;font-family:'Open Sans',Arial,sans-serif;font-size:13px;color:#e0e0e0;border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(10px)}.sc-chart-container:not(.dark-mode) .sc-indicators-dropdown{background-color:rgb(250 250 250 / .95);color:#333;box-shadow:0 4px 15px rgb(0 0 0 / .2);border:1px solid rgb(200 200 200 / .5)}.sc-dropdown-header{padding:12px 15px;font-weight:700;border-bottom:1px solid rgba(255, 255, 255, 0.1);font-size:14px}.sc-chart-container:not(.dark-mode) .sc-dropdown-header{border-bottom:1px solid rgb(200 200 200 / .5)}.sc-dropdown-content{padding:10px 15px;overflow-y:auto}.sc-indicator-group{margin-bottom:15px}.sc-indicator-group-title{font-size:12px;font-weight:600;color:#999;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.sc-chart-container:not(.dark-mode) .sc-indicator-group-title{color:#777}.sc-indicator-toggle{display:flex;align-items:center;padding:6px 0;cursor:pointer;font-size:13px}.sc-indicator-toggle input[type="checkbox"]{margin-right:8px}.sc-indicator-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin:0 10px 0 6px}.sc-indicator-name{flex:1}.sc-indicators-dropdown.active{display:block}.sc-indicator-toggle input[type="checkbox"]{appearance:none;-webkit-appearance:none;width:16px;height:16px;border-radius:3px;background-color:rgb(50 50 50 / .5);border:1px solid rgb(100 100 100 / .5);position:relative;cursor:pointer;outline:none}.sc-chart-container:not(.dark-mode) .sc-indicator-toggle input[type="checkbox"]{background-color:rgb(240 240 240 / .8);border:1px solid rgb(180 180 180 / .8)}.sc-indicator-toggle input[type="checkbox"]:checked{background-color:#4285f4;border-color:#4285f4}.sc-indicator-toggle input[type="checkbox"]:checked::after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.sc-chart-container:not(.dark-mode) .sc-indicator-toggle input[type="checkbox"]:checked::after{border:solid #333;border-width:0 2px 2px 0}.sc-dropdown-content{padding:10px 15px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgb(120 120 120 / .5) rgb(30 30 30 / .2)}.sc-dropdown-content::-webkit-scrollbar{width:6px}.sc-dropdown-content::-webkit-scrollbar-track{background:rgb(30 30 30 / .2);border-radius:3px}.sc-dropdown-content::-webkit-scrollbar-thumb{background:rgb(120 120 120 / .5);border-radius:3px}.sc-dropdown-content::-webkit-scrollbar-thumb:hover{background:rgb(150 150 150 / .7)}.sc-chart-container:not(.dark-mode) .sc-dropdown-content{scrollbar-color:rgb(150 150 150 / .5) rgb(200 200 200 / .2)}.sc-chart-container:not(.dark-mode) .sc-dropdown-content::-webkit-scrollbar-track{background:rgb(200 200 200 / .2)}.sc-chart-container:not(.dark-mode) .sc-dropdown-content::-webkit-scrollbar-thumb{background:rgb(150 150 150 / .5)}.sc-chart-container:not(.dark-mode) .sc-dropdown-content::-webkit-scrollbar-thumb:hover{background:rgb(120 120 120 / .7)}.sc-dropdown-content{padding:10px 15px;overflow-y:auto}.sc-chart-container.fullscreen .sc-dropdown-content{max-height:70vh}.sc-chart-container.fullscreen .sc-indicators-dropdown{max-height:90vh;overflow-y:auto;top:60px}.sc-timeframe-dropdown{position:absolute;top:50px;left:10px;width:150px;background-color:rgba(12, 12, 18, 0.98);border-radius:2px;box-shadow:0 4px 20px rgb(0 0 0 / .6);z-index:100;display:none;font-family:'Open Sans',Arial,sans-serif;font-size:13px;color:#e0e0e0;border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(10px)}.sc-chart-container:not(.dark-mode) .sc-timeframe-dropdown{background-color:rgb(250 250 250 / .95);color:#333;box-shadow:0 4px 15px rgb(0 0 0 / .2);border:1px solid rgb(200 200 200 / .5)}.sc-timeframe-dropdown.active{display:block}.sc-timeframe-option{padding:8px 15px;cursor:pointer;transition:background-color 0.2s;margin-bottom:5px}.sc-timeframe-option:hover{background-color:rgb(100 100 100 / .3)}.sc-chart-container:not(.dark-mode) .sc-timeframe-option:hover{background-color:rgb(200 200 200 / .3)}.sc-timeframe-option.selected{font-weight:700;background-color:rgb(106 142 245 / .2)}.sc-chart-container textarea.sc-text-annotation-input{position:absolute;z-index:100;border:1px solid #888;padding:5px;font-family:Arial,sans-serif;font-size:12px;min-width:50px;min-height:20px;resize:none;overflow:hidden;box-shadow:0 2px 5px rgb(0 0 0 / .2);border-radius:3px}.sc-chart-container.dark-mode textarea.sc-text-annotation-input{background-color:rgb(40 40 40 / .9);color:#e0e0e0;border-color:#555}.sc-chart-container:not(.dark-mode) textarea.sc-text-annotation-input{background-color:rgb(255 255 255 / .9);color:#333;border-color:#ccc}

/* Moving Average Add Controls */
.sc-add-indicator-section {
    margin-top: 12px;
    padding: 8px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.sc-chart-container:not(.dark-mode) .sc-add-indicator-section {
    border-top: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-add-ma-controls {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 5px;
}

.sc-ma-type-select {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 12px;
    padding: 4px 6px;
    background-color: rgba(50, 50, 50, 0.5);
    border: 1px solid rgba(100, 100, 100, 0.5);
    border-radius: 3px;
    color: #e0e0e0;
    outline: none;
    cursor: pointer;
    flex: 0 0 auto;
    min-width: 50px;
}

.sc-chart-container:not(.dark-mode) .sc-ma-type-select {
    background-color: rgba(240, 240, 240, 0.8);
    border: 1px solid rgba(180, 180, 180, 0.8);
    color: #333;
}

.sc-ma-type-select:focus {
    border-color: #4285f4;
    background-color: rgba(66, 133, 244, 0.1);
}

.sc-chart-container:not(.dark-mode) .sc-ma-type-select:focus {
    background-color: rgba(66, 133, 244, 0.05);
}

.sc-ma-type-select option {
    background-color: rgba(30, 30, 30, 0.95);
    color: #e0e0e0;
    padding: 4px 6px;
}

.sc-chart-container:not(.dark-mode) .sc-ma-type-select option {
    background-color: rgba(250, 250, 250, 0.95);
    color: #333;
}

.sc-ma-period-input {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 12px;
    padding: 4px 6px;
    background-color: rgba(50, 50, 50, 0.5);
    border: 1px solid rgba(100, 100, 100, 0.5);
    border-radius: 3px;
    color: #e0e0e0;
    outline: none;
    width: 60px;
    text-align: center;
}

.sc-chart-container:not(.dark-mode) .sc-ma-period-input {
    background-color: rgba(240, 240, 240, 0.8);
    border: 1px solid rgba(180, 180, 180, 0.8);
    color: #333;
}

.sc-ma-period-input:focus {
    border-color: #4285f4;
    background-color: rgba(66, 133, 244, 0.1);
}

.sc-chart-container:not(.dark-mode) .sc-ma-period-input:focus {
    background-color: rgba(66, 133, 244, 0.05);
}

.sc-ma-period-input::placeholder {
    color: rgba(224, 224, 224, 0.6);
    font-size: 11px;
}

.sc-chart-container:not(.dark-mode) .sc-ma-period-input::placeholder {
    color: rgba(51, 51, 51, 0.6);
}

.sc-add-ma-button {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 8px;
    background-color: #4285f4;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    outline: none;
    flex: 0 0 auto;
}

.sc-add-ma-button:hover {
    background-color: #3367d6;
    transform: translateY(-1px);
}

.sc-add-ma-button:active {
    transform: translateY(0);
    background-color: #2851a3;
}

.sc-remove-ma-button {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 6px;
    background-color: rgba(220, 53, 69, 0.8);
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    outline: none;
}

.sc-remove-ma-button:hover {
    background-color: rgba(220, 53, 69, 1);
    transform: scale(1.05);
}

.sc-remove-ma-button:active {
    transform: scale(0.95);
}

/* Text Settings Panel */
.sc-text-settings-panel {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 200px;
    background-color: rgba(12, 12, 18, 0.98);
    border-radius: 2px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
    z-index: 100;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 12px;
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 10px;
}

.sc-chart-container:not(.dark-mode) .sc-text-settings-panel {
    background-color: rgba(250, 250, 250, 0.95);
    color: #333;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-text-controls {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 8px;
}

.sc-text-controls label {
    min-width: 40px;
    font-size: 11px;
    font-weight: 600;
}

.sc-font-size-slider {
    flex: 1;
    height: 4px;
    background: rgba(100, 100, 100, 0.3);
    border-radius: 2px;
    outline: none;
}

.sc-font-size-display {
    font-size: 10px;
    min-width: 30px;
    text-align: right;
}

.sc-font-family-select {
    flex: 1;
    font-size: 11px;
    padding: 2px 4px;
    background-color: rgba(50, 50, 50, 0.5);
    border: 1px solid rgba(100, 100, 100, 0.5);
    border-radius: 3px;
    color: #e0e0e0;
    outline: none;
}

.sc-chart-container:not(.dark-mode) .sc-font-family-select {
    background-color: rgba(240, 240, 240, 0.8);
    border: 1px solid rgba(180, 180, 180, 0.8);
    color: #333;
}

.sc-text-color-picker {
    width: 30px;
    height: 20px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.sc-text-bold-button {
    font-weight: bold;
    font-size: 12px;
    padding: 4px 8px;
    background-color: rgba(100, 100, 100, 0.3);
    border: 1px solid rgba(150, 150, 150, 0.5);
    border-radius: 3px;
    color: #e0e0e0;
    cursor: pointer;
    min-width: 30px;
}

.sc-text-bold-button.active {
    background-color: #4285f4;
    border-color: #4285f4;
}

.sc-text-apply-button {
    font-size: 10px;
    padding: 4px 6px;
    background-color: #4285f4;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    flex: 1;
}

.sc-text-apply-button:hover {
    background-color: #3367d6;
}

.sc-chart-container:not(.dark-mode) .sc-text-bold-button {
    background-color: rgba(200, 200, 200, 0.3);
    color: #333;
}

.sc-chart-container:not(.dark-mode) .sc-text-bold-button.active {
    background-color: #4285f4;
    color: white;
}

/* Emoticon Panel */
.sc-emoticon-panel {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 320px;
    background-color: rgba(12, 12, 18, 0.98);
    border-radius: 2px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
    z-index: 100;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 12px;
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 12px;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
}

.sc-chart-container:not(.dark-mode) .sc-emoticon-panel {
    background-color: rgba(250, 250, 250, 0.95);
    color: #333;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-emoticon-header {
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 10px;
    text-align: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 8px;
}

.sc-chart-container:not(.dark-mode) .sc-emoticon-header {
    border-bottom: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-emoticon-category {
    margin-bottom: 15px;
}

.sc-category-title {
    font-size: 11px;
    font-weight: 600;
    color: #999;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.sc-chart-container:not(.dark-mode) .sc-category-title {
    color: #777;
}

.sc-emoticon-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
    margin-bottom: 10px;
}

.sc-emoticon-option {
    font-size: 20px;
    padding: 6px;
    text-align: center;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.2s, transform 0.1s;
    user-select: none;
    min-width: 0;
}

.sc-emoticon-option:hover {
    background-color: rgba(100, 100, 100, 0.3);
    transform: scale(1.1);
}

.sc-chart-container:not(.dark-mode) .sc-emoticon-option:hover {
    background-color: rgba(200, 200, 200, 0.3);
}

.sc-emoticon-option.selected {
    background-color: #4285f4;
    color: white;
}

.sc-emoticon-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(70, 70, 70, 0.5);
}

.sc-chart-container:not(.dark-mode) .sc-emoticon-controls {
    border-top: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-emoticon-controls label {
    font-size: 11px;
    font-weight: 600;
    min-width: 35px;
}

.sc-emoticon-size-slider {
    flex: 1;
    height: 4px;
    background: rgba(100, 100, 100, 0.3);
    border-radius: 2px;
    outline: none;
}

.sc-emoticon-size-display {
    font-size: 10px;
    min-width: 35px;
    text-align: right;
}

/* Drawing Tools Panel */
.sc-drawing-tools-panel {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 240px;
    background-color: rgba(12, 12, 18, 0.98);
    border-radius: 2px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
    z-index: 100;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 12px;
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 12px;
    display: none;
}

.sc-chart-container:not(.dark-mode) .sc-drawing-tools-panel {
    background-color: rgba(250, 250, 250, 0.95);
    color: #333;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-drawing-tools-header {
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 12px;
    text-align: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 8px;
}

.sc-chart-container:not(.dark-mode) .sc-drawing-tools-header {
    border-bottom: 1px solid rgba(200, 200, 200, 0.5);
}

.sc-drawing-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

/* Undo + Clear all: a compact row of their own under the tools. */
.sc-drawing-tool-option[data-action] {
    flex-direction: row;
    justify-content: center;
    gap: 6px;
    padding: 7px 8px;
    font-size: 12px;
}
.sc-drawing-tool-option[data-action] svg {
    width: 16px;
    height: 16px;
    margin: 0;
}
.sc-drawing-tool-undo {
    grid-column: 1;
}

.sc-drawing-tool-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 8px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
    background-color: rgba(50, 50, 50, 0.3);
}

.sc-chart-container:not(.dark-mode) .sc-drawing-tool-option {
    background-color: rgba(200, 200, 200, 0.2);
}

.sc-drawing-tool-option:hover {
    background-color: rgba(100, 100, 100, 0.4);
    transform: translateY(-1px);
}

.sc-chart-container:not(.dark-mode) .sc-drawing-tool-option:hover {
    background-color: rgba(150, 150, 150, 0.3);
}

.sc-drawing-tool-option.selected {
    background-color: rgba(66, 133, 244, 0.3);
    border-color: #4285f4;
}

.sc-drawing-tool-option svg {
    width: 20px;
    height: 20px;
    margin-bottom: 4px;
}

.sc-drawing-tool-option span {
    font-size: 10px;
    font-weight: 600;
    text-align: center;
}

/* Three-column indicator dropdown layout */
.sc-indicators-dropdown .sc-dropdown-content {
    column-count: 3;
    column-gap: 15px;
    max-height: none;
    overflow-y: visible;
    overflow-x: visible;
}

.sc-indicators-dropdown .sc-indicator-group {
    break-inside: avoid;
    margin-bottom: 12px;
    display: inline-block;
    width: 100%;
}

/* Responsive - fewer columns on smaller screens */
@media (max-width: 800px) {
    .sc-indicators-dropdown {
        width: calc(100vw - 40px) !important;
    }
    .sc-indicators-dropdown .sc-dropdown-content {
        column-count: 2;
    }
}

@media (max-width: 500px) {
    .sc-indicators-dropdown .sc-dropdown-content {
        column-count: 1;
    }
}

/* ============================================================
   Pattern detection callout - pinned beside the pattern candles.
   Separate from .chart-notification, which stays the general
   top-centre toast (pause, copy-to-clipboard, errors).
   ============================================================ */
/* "A+" bubble: amber ring and warm glow, with a notch on the side facing the
   pattern. sc-pc-left = card sits left of the pattern (notch on its right
   edge), sc-pc-right = the mirror. --sc-pc-ny is the notch's top offset,
   set by _positionPatternCallout() so it keeps pointing at the bracket
   when the card is clamped against the chart edge. */
.sc-pattern-callout {
    --sc-pc-bg: #171A20;
    --sc-pc-ring: rgba(245, 177, 74, 0.6);
    --sc-pc-ny: 16px;
    --sc-pc-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 0 0 4px rgba(245, 177, 74, 0.08), 0 0 32px -6px rgba(245, 177, 74, 0.35), 0 24px 64px -16px rgba(0, 0, 0, 0.8);
    position: absolute;
    z-index: 41;
    width: max-content;
    min-width: 196px;
    box-sizing: border-box;
    padding: 11px 12px 5px;
    white-space: nowrap;
    pointer-events: none;
    background: radial-gradient(120% 70% at 0% 0%, rgba(245, 177, 74, 0.13), transparent 60%), var(--sc-pc-bg);
    border: 1px solid var(--sc-pc-ring);
    border-radius: 8px;
    font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    box-shadow: var(--sc-pc-shadow);
    animation: scPatternCalloutIn 320ms cubic-bezier(.4, 0, .2, 1) .25s both,
               scPatternCalloutRing 2.4s cubic-bezier(.4, 0, .2, 1) .65s 2;
}

.sc-pattern-callout::after {
    content: "";
    position: absolute;
    top: var(--sc-pc-ny);
    width: 12px;
    height: 12px;
    background: var(--sc-pc-bg);
    transform: rotate(45deg);
}

.sc-pattern-callout.sc-pc-left::after {
    right: -7px;
    border-top: 1px solid var(--sc-pc-ring);
    border-right: 1px solid var(--sc-pc-ring);
    border-top-right-radius: 2px;
    clip-path: polygon(-6px -2px, calc(100% + 2px) -2px, calc(100% + 2px) calc(100% + 2px), calc(100% - 2px) calc(100% + 2px));
}

/* Mirrored notch sits inside the top-left glow, so its fill carries a
   matching amber tint instead of the bare card colour. */
.sc-pattern-callout.sc-pc-right::after {
    left: -7px;
    background: #292623;
    border-bottom: 1px solid var(--sc-pc-ring);
    border-left: 1px solid var(--sc-pc-ring);
    border-bottom-left-radius: 2px;
    clip-path: polygon(calc(100% + 6px) calc(100% + 2px), -2px calc(100% + 2px), -2px -2px, 2px -2px);
}

@keyframes scPatternCalloutIn {
    from { opacity: 0; transform: translateX(var(--sc-pc-from, -6px)); }
    to { opacity: 1; transform: none; }
}

.sc-pattern-callout.sc-pc-right { --sc-pc-from: 6px; }

@keyframes scPatternCalloutRing {
    0%, 100% { box-shadow: var(--sc-pc-shadow); }
    40% { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 0 0 7px rgba(245, 177, 74, 0.14), 0 0 40px -4px rgba(245, 177, 74, 0.5), 0 24px 64px -16px rgba(0, 0, 0, 0.8); }
}

.sc-pattern-callout.sc-pc-out {
    animation: scPatternCalloutOut .4s ease forwards;
}

@keyframes scPatternCalloutOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

.sc-pattern-callout .sc-pc-kicker {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #F5B14A;
}

.sc-pattern-callout .sc-pc-name {
    margin: 5px 0 6px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.012em;
    color: #fff;
}

.sc-pattern-callout .sc-pc-meta {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: #8D96A6;
}

.sc-pattern-callout .sc-pc-meta b {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    height: 18px;
    padding: 0 6px;
    border-radius: 3px;
    font-weight: 600;
    color: var(--sc-pc-accent);
    background: var(--sc-pc-tint);
    box-shadow: inset 0 0 0 1px var(--sc-pc-line);
}

.sc-pattern-callout .sc-pc-dot { color: #6A7382; }

.sc-pattern-callout hr {
    margin: 10px -12px 5px;
    border: 0;
    border-top: 1px solid rgba(245, 177, 74, 0.18);
}

.sc-pattern-callout .sc-pc-settings {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    height: 24px;
    padding: 0 8px;
    border: 0;
    border-radius: 5px;
    background: none;
    color: #8D96A6;
    font: 500 11px/1 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    cursor: pointer;
    pointer-events: auto;
    transition: background 140ms cubic-bezier(.4, 0, .2, 1), color 140ms cubic-bezier(.4, 0, .2, 1);
}

.sc-pattern-callout .sc-pc-settings:hover {
    background: rgba(245, 177, 74, 0.16);
    color: #F5B14A;
}

.sc-pattern-callout .sc-pc-settings:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 2px rgba(62, 162, 242, 0.42);
}

.sc-pattern-callout .sc-pc-settings svg {
    width: 13px;
    height: 13px;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sc-pattern-callout.sc-pc-bearish { --sc-pc-accent: #FF6E7A; --sc-pc-tint: rgba(255, 110, 122, 0.16); --sc-pc-line: rgba(255, 110, 122, 0.42); }
.sc-pattern-callout.sc-pc-bullish { --sc-pc-accent: #3ED69B; --sc-pc-tint: rgba(62, 214, 155, 0.16); --sc-pc-line: rgba(62, 214, 155, 0.42); }

@media (prefers-reduced-motion: reduce) {
    .sc-pattern-callout { animation: scPatternCalloutIn .01ms both; }
}

/* ── chart style menu ──
   The chart-type control used to be a two-state toggle button. With candles,
   hollow candles, bars and line it is a dropdown, built on the same pattern as
   .sc-timeframe-dropdown so it inherits the overlay's look and click-away. */
.sc-charttype-dropdown {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 150px;
    z-index: 100;
    display: none;
    border: 1px solid rgb(255 255 255 / .1);
    border-radius: 2px;
    background-color: rgb(12 12 18 / .98);
    box-shadow: 0 4px 20px rgb(0 0 0 / .6);
    backdrop-filter: blur(10px);
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 13px;
    color: #e0e0e0;
}

.sc-charttype-dropdown.active { display: block; }

/* No .sc-dropdown-content override here on purpose. The timeframe menu wraps
   its rows in the same element and keeps its 10px/15px inset, so anything that
   zeroes it makes this menu sit flush where that one is padded. Both panels
   are: content inset 10/15, then the row metrics below. */

/* Row metrics are .sc-timeframe-option's, so the two menus that open from
   adjacent toolbar buttons have the same type size, row height and rhythm. */
.sc-charttype-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    margin-bottom: 5px;
    cursor: pointer;
    transition: background-color .2s;
}

.sc-charttype-option:hover { background-color: rgb(100 100 100 / .3); }
.sc-charttype-option.selected { font-weight: 700; background-color: rgb(106 142 245 / .2); }

/* The row icons are the same SVGs as the button, just smaller. */
.sc-charttype-option svg { width: 18px; height: 18px; flex: none; }

/* Light mode mirrors .sc-timeframe-dropdown's light treatment. */
.sc-chart-container:not(.dark-mode) .sc-charttype-dropdown {
    background-color: rgb(250 250 250 / .95);
    color: #333;
    border: 1px solid rgb(200 200 200 / .5);
    box-shadow: 0 4px 15px rgb(0 0 0 / .2);
}

.sc-chart-container:not(.dark-mode) .sc-charttype-option:hover {
    background-color: rgb(200 200 200 / .3);
}

/* Keep chart graphics visible but quieter behind the ticker and indicator readouts. */
.sc-ticker-logo{display:block;align-self:center;flex:none;width:21px;height:21px;box-sizing:border-box;border:1px solid rgb(255 255 255 / .18);border-radius:var(--s8-r-sm,4px);background:rgb(255 255 255 / .08);object-fit:cover}
.sc-ticker-logo[hidden]{display:none}
.sc-chart-container:not(.dark-mode) .sc-ticker-logo{border-color:rgb(0 0 0 / .18);background:rgb(0 0 0 / .05)}
@media(max-width:576px){.sc-ticker-logo{width:18px;height:18px}}
/* Each readout row gets its own backdrop sized to that row, stacked flush into one
   stepped panel. The backdrop is a see-through tint, so candles behind it stay
   visible but dimmed. Only the panel's outer corners are rounded. */
.sc-chart-info-overlay {
    box-sizing: border-box;
    max-width: calc(100% - 70px);
    margin: -4px 0 0 -5px;
    align-items: flex-start;
    pointer-events: none;
}

.sc-chart-info-overlay > * {
    box-sizing: border-box;
    max-width: 100%;
    margin: 0 !important;
    padding: 3px 9px 3px 5px;
    border-radius: 0 4px 4px 0;
    background: rgb(12 12 16 / .6);
}

.sc-chart-info-overlay > :first-child { border-top-left-radius: 4px; padding-top: 4px; }
.sc-chart-info-overlay > :not(:has(~ :has(*))) { border-bottom-left-radius: 4px; padding-bottom: 4px; }
.sc-chart-info-overlay > :not(:has(*)) { display: none !important; }

.sc-chart-container:not(.dark-mode) .sc-chart-info-overlay > * {
    background: rgb(255 255 255 / .6);
}

/* ---- toolbarLayout: 'side' (top bar for chart settings, left strip for drawing tools) ---- */
.sc-chart-container.sc-layout-side{display:grid;grid-template-columns:44px minmax(0,1fr);grid-template-rows:40px minmax(0,1fr)}
.sc-layout-side .sc-price-chart-container{grid-column:2;grid-row:2;height:100%;min-height:0}
.sc-layout-side .sc-topbar{grid-column:1 / -1;grid-row:1;display:flex;align-items:center;gap:2px;padding:0 6px;border-bottom:1px solid rgb(255 255 255 / .08);min-width:0;overflow-x:auto;scrollbar-width:none}
.sc-layout-side .sc-sidebar{grid-column:1;grid-row:2;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;border-right:1px solid rgb(255 255 255 / .08);overflow-y:auto;scrollbar-width:none}
.sc-layout-side .sc-topbar::-webkit-scrollbar,.sc-layout-side .sc-sidebar::-webkit-scrollbar{display:none}
.sc-layout-side .sc-overlay-button{width:34px;height:34px;flex:none;border-radius:5px;background-color:transparent;color:#b2b5be}
.sc-layout-side .sc-overlay-button svg{width:20px;height:20px}
.sc-layout-side .sc-overlay-button:hover{background-color:rgb(255 255 255 / .08);color:#fff}
.sc-layout-side .sc-overlay-button.active{background-color:rgb(41 98 255 / .18)!important;color:#5b8cff}
.sc-layout-side .sc-bar-text-button{width:auto;padding:0 9px;gap:6px;font:600 13px/1 'Open Sans',Arial,sans-serif;white-space:nowrap}
.sc-layout-side .sc-topbar .sc-bar-sep{width:1px;height:20px;margin:0 4px;background:rgb(255 255 255 / .1);flex:none}
.sc-layout-side .sc-sidebar .sc-bar-sep{height:1px;width:24px;margin:4px 0;background:rgb(255 255 255 / .1);flex:none}
.sc-layout-side .sc-bar-spacer{flex:1}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-topbar{border-bottom-color:rgb(0 0 0 / .1)}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-sidebar{border-right-color:rgb(0 0 0 / .1)}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-overlay-button{color:#4a4d57}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-overlay-button:hover{background-color:rgb(0 0 0 / .06);color:#131722}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-bar-sep{background:rgb(0 0 0 / .12)}
.sc-chart-container.sc-layout-side.fullscreen .sc-price-chart{height:100%!important}
.sc-layout-side .sc-overlay-button.d-none{display:none!important}
.sc-layout-side .sc-fullscreen-logo{left:59px;bottom:38px}

/* ---- Cursor tools menu ---- */
.sc-cursor-button{position:relative}
.sc-cursor-chev{position:absolute;right:1px;top:50%;width:4px;height:4px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-50%) rotate(-45deg);opacity:0;transition:opacity .15s}
.sc-cursor-button:hover .sc-cursor-chev,.sc-cursor-button.open .sc-cursor-chev{opacity:.7}
.sc-cursor-menu{position:absolute;top:4px;left:4px;z-index:100;display:none;min-width:250px;padding:6px;border-radius:8px;background:#1e222d;border:1px solid rgb(255 255 255 / .08);box-shadow:0 8px 28px rgb(0 0 0 / .55);font:500 14px/1.2 'Open Sans',Arial,sans-serif;color:#d1d4dc}
.sc-cursor-menu.active{display:block}
.sc-cursor-option{display:flex;align-items:center;gap:12px;width:100%;padding:8px 10px;border:0;border-radius:6px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.sc-cursor-option svg{width:24px;height:24px;flex:none}
.sc-cursor-option:hover{background:rgb(255 255 255 / .07)}
.sc-cursor-option.selected{background:#2a2e39;color:#fff;font-weight:700}
.sc-cursor-sep{height:1px;margin:6px 4px;background:rgb(255 255 255 / .1)}
.sc-cursor-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 10px;cursor:pointer;user-select:none}
.sc-cursor-toggle input{position:absolute;opacity:0;pointer-events:none}
.sc-cursor-toggle i{position:relative;flex:none;width:36px;height:20px;border-radius:10px;background:#4a4e5a;transition:background .15s}
.sc-cursor-toggle i::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
.sc-cursor-toggle input:checked+i{background:#2962ff}
.sc-cursor-toggle input:checked+i::after{transform:translateX(16px)}
.sc-cursor-toggle input:focus-visible+i{outline:2px solid #5b8cff;outline-offset:2px}
.sc-chart-container:not(.dark-mode) .sc-cursor-menu{background:#fff;border-color:rgb(0 0 0 / .1);box-shadow:0 8px 24px rgb(0 0 0 / .18);color:#131722}
.sc-chart-container:not(.dark-mode) .sc-cursor-option:hover{background:rgb(0 0 0 / .05)}
.sc-chart-container:not(.dark-mode) .sc-cursor-option.selected{background:#2a2e39;color:#fff}
.sc-chart-container:not(.dark-mode) .sc-cursor-sep{background:rgb(0 0 0 / .1)}
.sc-chart-container:not(.dark-mode) .sc-cursor-toggle i{background:#c9ccd3}
.sc-cursor-fx{position:absolute;left:0;top:0;pointer-events:none;z-index:6}
/* Values tooltip (touch long-press) */
.sc-values-tip{position:absolute;z-index:30;display:none;min-width:130px;padding:8px 10px;border-radius:6px;background:rgb(30 34 45 / .96);border:1px solid rgb(255 255 255 / .12);box-shadow:0 6px 18px rgb(0 0 0 / .5);font:12px/1.55 'Open Sans',Arial,sans-serif;color:#d1d4dc;pointer-events:none;font-variant-numeric:tabular-nums}
.sc-values-tip.active{display:block}
.sc-values-tip div{display:flex;justify-content:space-between;gap:14px}
.sc-values-tip span{color:#868993}
.sc-values-tip .sc-values-tip__date{display:block;margin-bottom:3px;font-weight:600;color:#fff}
.sc-values-tip .up{color:#26a69a}.sc-values-tip .down{color:#ef5350}
.sc-chart-container:not(.dark-mode) .sc-values-tip{background:rgb(255 255 255 / .97);border-color:rgb(0 0 0 / .1);color:#131722;box-shadow:0 6px 18px rgb(0 0 0 / .15)}
.sc-chart-container:not(.dark-mode) .sc-values-tip .sc-values-tip__date{color:#131722}

/* ---- Line tools menu ---- */
.sc-lt-button{position:relative}
.sc-lt-button .sc-cursor-chev{opacity:.35}
.sc-lt-button:hover .sc-cursor-chev{opacity:.8}
.sc-lt-menu{min-width:290px;max-height:calc(100% - 8px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .2) transparent}
.sc-chart-container:not(.dark-mode) .sc-lt-menu{scrollbar-color:rgb(0 0 0 / .2) transparent}
.sc-lt-menu .sc-cursor-option svg{width:26px;height:26px}
.sc-lt-menu kbd{margin-left:auto;padding-left:16px;font:12px 'Open Sans',Arial,sans-serif;color:#868993;background:none;border:0;box-shadow:none}
.sc-lt-menu .sc-cursor-option.selected kbd{color:#b2b5be}
.sc-lt-group{padding:10px 10px 6px;font:600 11px 'Open Sans',Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#868993}
.sc-lt-group:not(:first-child){margin-top:4px;border-top:1px solid rgb(255 255 255 / .1)}
.sc-chart-container:not(.dark-mode) .sc-lt-group:not(:first-child){border-top-color:rgb(0 0 0 / .1)}
.sc-lt-active .sc-price-chart{cursor:crosshair!important}
.sc-lt-hover:not(.sc-lt-active) .sc-price-chart{cursor:pointer!important}
.sc-lt-drag .sc-price-chart{cursor:grabbing!important}

/* ---- Emoji picker ---- */
.sc-emoticon-panel.sc-emoji-picker{width:392px;max-width:calc(100vw - 80px);max-height:none;padding:0;overflow:hidden;border-radius:8px;background:#1e222d;border:1px solid rgb(255 255 255 / .08);box-shadow:0 8px 28px rgb(0 0 0 / .55)}
.sc-emoji-tabs{display:flex;border-bottom:1px solid rgb(255 255 255 / .1)}
.sc-emoji-tab{flex:1;height:42px;display:flex;align-items:center;justify-content:center;border:0;border-bottom:2px solid transparent;background:none;color:#b2b5be;cursor:pointer}
.sc-emoji-tab svg{width:22px;height:22px}
.sc-emoji-tab:hover{color:#fff}
.sc-emoji-tab.active{color:#fff;border-bottom-color:#2962ff}
.sc-emoji-body{position:relative;max-height:440px;overflow-y:auto;padding:4px 10px 8px;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .2) transparent}
.sc-emoji-title{padding:12px 4px 6px;font:600 11px 'Open Sans',Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#868993}
.sc-emoji-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:2px}
.sc-emoji{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border:0;border-radius:6px;background:none;cursor:pointer;padding:0;font:24px/1 "Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}
.sc-emoji img{width:26px;height:26px;pointer-events:none}
.sc-emoji:hover{background:rgb(255 255 255 / .08)}
.sc-emoji-empty{grid-column:1 / -1;padding:4px 4px 6px;font:12px 'Open Sans',Arial,sans-serif;color:#868993}
.sc-emoji-picker .sc-emoticon-controls{margin:0;padding:8px 12px;border-top:1px solid rgb(255 255 255 / .1)}
.sc-chart-container:not(.dark-mode) .sc-emoticon-panel.sc-emoji-picker{background:#fff;border-color:rgb(0 0 0 / .1);box-shadow:0 8px 24px rgb(0 0 0 / .18)}
.sc-chart-container:not(.dark-mode) .sc-emoji-tabs,.sc-chart-container:not(.dark-mode) .sc-emoji-picker .sc-emoticon-controls{border-color:rgb(0 0 0 / .1)}
.sc-chart-container:not(.dark-mode) .sc-emoji-tab{color:#6a6d78}
.sc-chart-container:not(.dark-mode) .sc-emoji-tab:hover,.sc-chart-container:not(.dark-mode) .sc-emoji-tab.active{color:#131722}
.sc-chart-container:not(.dark-mode) .sc-emoji:hover{background:rgb(0 0 0 / .06)}
.sc-chart-container:not(.dark-mode) .sc-emoji-body{scrollbar-color:rgb(0 0 0 / .2) transparent}

/* ---- Emoji scale/rotate handles ---- */
.sc-emo-nwse .sc-price-chart{cursor:nwse-resize!important}
.sc-emo-nesw .sc-price-chart{cursor:nesw-resize!important}
.sc-emo-rotate .sc-price-chart{cursor:grab!important}
/* Size is set by dragging the handles now, so the picker's slider is gone. */
.sc-emoji-picker .sc-emoticon-controls{display:none}

/* ---- Text and notes: inline editor + floating toolbar ---- */
.sc-nt-editor{position:absolute;z-index:40;margin:0;padding:0;border:0;outline:0;background:transparent;resize:none;overflow:hidden;white-space:pre;box-shadow:none;min-width:8px}
.sc-nt-toolbar{position:absolute;z-index:45;display:none;align-items:center;gap:2px;padding:4px;border-radius:6px;background:#1e222d;border:1px solid rgb(255 255 255 / .1);box-shadow:0 6px 20px rgb(0 0 0 / .5);font:500 13px 'Open Sans',Arial,sans-serif;color:#d1d4dc;white-space:nowrap}
.sc-nt-toolbar.active{display:flex}
.sc-nt-toolbar button{height:30px;min-width:30px;padding:0 7px;border:0;border-radius:4px;background:none;color:inherit;font:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sc-nt-toolbar button svg{width:18px;height:18px}
.sc-nt-toolbar button:hover{background:rgb(255 255 255 / .08)}
.sc-nt-toolbar button.on{background:rgb(41 98 255 / .25);color:#fff}
.sc-nt-toolbar select{height:30px;padding:0 4px;border:0;border-radius:4px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.sc-nt-toolbar select option{background:#1e222d;color:#d1d4dc}
.sc-nt-toolbar select:hover{background:rgb(255 255 255 / .08)}
.sc-nt-swatch{position:relative;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;cursor:pointer}
.sc-nt-swatch:hover{background:rgb(255 255 255 / .08)}
.sc-nt-swatch input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0}
.sc-nt-a{font-weight:700;font-size:15px;line-height:1;padding-bottom:2px;border-bottom:3px solid var(--c)}
.sc-nt-fill{width:16px;height:16px;border-radius:3px;background:var(--c);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .25)}
.sc-nt-sep{width:1px;height:20px;margin:0 3px;background:rgb(255 255 255 / .12)}
.sc-chart-container:not(.dark-mode) .sc-nt-toolbar{background:#fff;border-color:rgb(0 0 0 / .1);box-shadow:0 6px 18px rgb(0 0 0 / .15);color:#131722}
.sc-chart-container:not(.dark-mode) .sc-nt-toolbar button:hover,.sc-chart-container:not(.dark-mode) .sc-nt-swatch:hover,.sc-chart-container:not(.dark-mode) .sc-nt-toolbar select:hover{background:rgb(0 0 0 / .06)}
.sc-chart-container:not(.dark-mode) .sc-nt-toolbar select option{background:#fff;color:#131722}
.sc-chart-container:not(.dark-mode) .sc-nt-sep{background:rgb(0 0 0 / .12)}

/* ---- s8 logo, bottom-left of the price pane ---- */
.sc-chart-logo{position:absolute;z-index:7;display:block;width:30px;height:30px;border-radius:7px;opacity:.92;transition:opacity .15s}
.sc-chart-logo:hover{opacity:1}
.sc-chart-logo img{display:block;width:100%;height:100%}
.sc-has-logo .sc-fullscreen-logo{display:none!important}

/* ---- Magnet ---- */
.sc-magnet-menu{min-width:250px}
.sc-magnet-tip{max-width:240px;padding:8px 10px 6px;font:12px/1.45 "Open Sans",Arial,sans-serif;color:#868993;white-space:normal}

/* ---- Remove menu ---- */
.sc-remove-menu{min-width:280px}
.sc-remove-menu .sc-cursor-option:disabled{opacity:.4;cursor:default;background:none}

/* ---- Zoom in (box zoom) ---- */
.sc-zoom-out-button[hidden]{display:none!important}
.sc-zoom-active .sc-price-chart{cursor:crosshair!important}
.sc-zoom-box{position:absolute;display:none;pointer-events:none;z-index:5;background:rgb(41 98 255 / .15);border:1px solid rgb(41 98 255 / .6)}
.sc-zoom-box.active{display:block}

/* ---- Drawing toolbar (shares .sc-nt-toolbar) ---- */
.sc-ds-line{width:18px;height:3px;border-radius:2px;background:var(--c)}
.sc-nt-toolbar [data-a="nofill"]{font-size:12px}


/* ---- Tool strip moved outside the chart (window.S8_CHART_TOOLBAR_HOST) ---- */
.sc-chart-container.sc-layout-side.sc-side-external{grid-template-columns:minmax(0,1fr)}
.sc-layout-side.sc-side-external .sc-price-chart-container{grid-column:1}
.sc-ext-strip{display:flex;flex:none;width:44px;min-height:0}
.sc-ext-strip .sc-sidebar{width:44px;flex:1;min-height:0}
.sc-menu-floating{position:fixed!important;overflow-y:auto}
/* Top row and strip use the chart's own background (the canvas paints #000 / #fff), not the box's gray. */
.sc-chart-container.sc-layout-side.dark-mode .sc-topbar,.sc-chart-container.sc-layout-side.dark-mode .sc-sidebar{background:#000}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-topbar,.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-sidebar{background:#fff}
/* Top row matches the strip: grey by default, much lighter on hover, chart-type lines follow the text colour. */
.sc-chart-container.sc-layout-side .sc-topbar .sc-overlay-button{color:#b2b5be}
.sc-chart-container.sc-layout-side .sc-topbar .sc-overlay-button:hover{color:#fff}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-topbar .sc-overlay-button{color:#4a4d57}
.sc-chart-container.sc-layout-side:not(.dark-mode) .sc-topbar .sc-overlay-button:hover{color:#131722}
.sc-chart-container.sc-layout-side.dark-mode .sc-chart-type-button svg path{stroke:currentColor}
.sc-chart-container.sc-layout-side .sc-chart-type-button svg{width:18px;height:18px}