*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg: #07070f;--surface: #0d0d1a;--surface2: #12122a;--border: rgba(42, 46, 80, .35);--text: #c8cad8;--text-dim: #6a6e85;--accent: #00e5ff;--accent2: #7c4dff;--green: #00d4aa;--red: #ff4976;--orange: #ffab40;--radius: 10px;--font: "Inter", system-ui, sans-serif;--mono: "JetBrains Mono", monospace}html{font-size:14px}body{background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;overflow-x:hidden}::selection{background:#00e5ff33}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.app{max-width:1400px;margin:0 auto;padding:16px 20px}.header{display:flex;justify-content:space-between;align-items:center;padding:12px 0 20px;border-bottom:1px solid var(--border);margin-bottom:16px}.header-left{display:flex;align-items:center;gap:12px}.logo{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#00e5ff0f;border-radius:10px;border:1px solid rgba(0,229,255,.15)}h1{font-size:1.35rem;font-weight:600;letter-spacing:-.02em;color:#e8eaf0}h1 span{font-weight:300;color:var(--accent);margin-left:6px}.loader{display:flex;gap:4px;align-items:center}.loader-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 1.2s ease-in-out infinite}.loader-dot:nth-child(2){animation-delay:.2s}.loader-dot:nth-child(3){animation-delay:.4s}@keyframes pulse{0%,to{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}.controls{display:flex;flex-wrap:wrap;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.control-group{display:flex;flex-direction:column;gap:5px}.control-group label{font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.btn-group{display:flex;gap:3px}.btn-group button{padding:6px 12px;border:1px solid var(--border);background:transparent;color:var(--text-dim);border-radius:6px;cursor:pointer;font-size:.82rem;font-family:var(--font);font-weight:500;transition:all .15s ease}.btn-group button:hover{border-color:var(--accent);color:var(--text)}.btn-group button.active{background:#00e5ff1f;border-color:var(--accent);color:var(--accent);box-shadow:0 0 12px #00e5ff1a}.range-group .range-inputs{display:flex;align-items:center;gap:6px}.range-inputs input{width:110px;padding:6px 10px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:var(--mono);font-size:.82rem;outline:none;transition:border-color .15s}.range-inputs input:focus{border-color:var(--accent)}.range-inputs input::placeholder{color:var(--text-dim)}.range-sep{color:var(--text-dim);font-weight:300}.auto-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:transparent;color:var(--accent);border-radius:6px;cursor:pointer;font-size:1.1rem;transition:all .15s}.auto-btn:hover{background:#00e5ff1a;border-color:var(--accent)}.chart-wrapper{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:16px}.chart-label,.chart-sublabel{display:flex;align-items:center;gap:14px;padding:8px 14px;font-size:.75rem;font-weight:500;color:var(--text-dim);border-bottom:1px solid var(--border)}.chart-sublabel{border-top:1px solid var(--border);border-bottom:none}.chart-sublabel-hint{font-weight:400;font-size:.7rem;opacity:.6}.chart-label-candle{color:var(--green)}.chart-label-oi{color:var(--orange)}.chart-label-range{color:var(--accent)}.chart-label-band{color:#7c4dff;font-weight:600}.chart-label-sep{color:var(--border);margin:0 2px}.session-tag{font-size:.7rem;font-weight:600;letter-spacing:.03em}.session-tag.asia{color:#ff6b6b}.session-tag.eu{color:#4ecdc4}.session-tag.ny{color:#45b7d1}.chart-main{width:100%;position:relative}.chart-oi-panel{width:100%;position:relative;border-top:1px solid var(--border)}.threshold-group{flex:1;min-width:300px}.threshold-group label strong{color:var(--accent);font-family:var(--mono)}.threshold-slider{display:flex;flex-direction:column;gap:2px}.threshold-slider input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));outline:none;cursor:pointer}.threshold-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);border:2px solid var(--bg);box-shadow:0 0 6px #00e5ff66;cursor:pointer}.threshold-ticks{display:flex;justify-content:space-between;font-size:.65rem;color:var(--text-dim);font-family:var(--mono)}.error-banner{padding:10px 16px;background:#ff49761a;border:1px solid rgba(255,73,118,.3);border-radius:var(--radius);color:var(--red);font-size:.85rem;margin-bottom:16px}.stats-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:16px}.stat-card{padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;gap:4px;transition:border-color .2s}.stat-card:hover{border-color:#c8cad833}.stat-card.accent{border-color:#00e5ff40;background:#00e5ff08}.stat-card.green{border-color:#00d4aa33}.stat-card.red{border-color:#ff497633}.stat-label{font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim)}.stat-value{font-size:1.15rem;font-weight:600;font-family:var(--mono);color:var(--text)}.stat-value small{font-size:.7rem;font-weight:400;color:var(--text-dim);margin-left:3px}.footer{text-align:center;padding:16px 0;font-size:.72rem;color:var(--text-dim);border-top:1px solid var(--border)}@media (max-width:768px){.controls{flex-direction:column;gap:10px}.stats-panel{grid-template-columns:repeat(2,1fr)}.range-inputs input{width:80px}}