.radar {
  padding: 120px 0;
  background: linear-gradient(180deg, #060616, #090923);
}

.radar-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: end;
  margin-bottom: 42px;
}

.radar h2 {
  margin: 0;
  font-size: clamp(42px, 5.6vw, 76px);
  line-height: .94;
  letter-spacing: -.055em;
}

.radar-copy {
  color: var(--muted);
  font-size: 16px;
  line-height: 1.65;
}

.radar-copy strong { color: #fff; }

.radar-note {
  padding-left: 14px;
  border-left: 2px solid var(--pink);
  color: #9691ab;
  font-size: 12px;
}

.stoch-panel {
  margin-top: 0;
  padding: 30px;
  border: 1px solid rgba(108,99,255,.22);
  border-radius: 18px;
  background: radial-gradient(circle at 90% 0%, rgba(255,47,179,.15), transparent 30%), radial-gradient(circle at 5% 100%, rgba(57,198,255,.09), transparent 32%), #08081d;
  box-shadow: 0 28px 90px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.035);
}
.stoch-head { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.stoch-kicker { color:var(--blue); font-size:10px; font-weight:900; letter-spacing:.18em; }
.stoch-head h3 { margin:8px 0 0; font-size:25px; letter-spacing:.04em; }
.stoch-head h3 em { color:var(--pink); font-style:normal; font-size:12px; letter-spacing:.16em; }
.stoch-state { display:flex; align-items:center; gap:9px; min-width:160px; justify-content:center; padding:12px 16px; border:1px solid rgba(57,198,255,.24); border-radius:999px; background:rgba(7,12,34,.68); font-size:11px; font-weight:900; letter-spacing:.13em; }
.stoch-state i { width:8px; height:8px; border-radius:50%; background:var(--blue); box-shadow:0 0 14px var(--blue); }
.stoch-state.overbought i { background:var(--pink); box-shadow:0 0 14px var(--pink); }
.stoch-state.oversold i { background:var(--lime); box-shadow:0 0 14px var(--lime); }
.stoch-chart-wrap { position:relative; height:260px; border:1px solid rgba(71,85,105,.5); border-radius:12px; background:#040711; box-shadow:inset 0 0 55px rgba(2,6,23,.9), 0 18px 40px rgba(0,0,0,.22); overflow:hidden; }
#stochCanvas { display:block; width:100%; height:100%; cursor:grab; touch-action:none; user-select:none; }
#stochCanvas.dragging { cursor:grabbing; }
.chart-overlay { position:absolute; z-index:2; top:13px; left:18px; display:flex; gap:15px; pointer-events:none; color:#657089; font:800 9px Arial; letter-spacing:.09em; }
.chart-overlay b { color:#c8d2e4; font-weight:800; }
.chart-nav { position:absolute; z-index:3; top:10px; right:13px; display:flex; overflow:hidden; border:1px solid rgba(71,85,105,.46); border-radius:7px; background:rgba(3,7,18,.8); backdrop-filter:blur(8px); }
.chart-nav button { min-width:31px; height:27px; padding:0 9px; border:0; border-right:1px solid rgba(71,85,105,.4); background:transparent; color:#94a3b8; font:900 11px Arial; cursor:pointer; }
.chart-nav button:last-child { border-right:0; color:var(--blue); font-size:8px; letter-spacing:.11em; }
.chart-nav button:hover { color:#fff; background:rgba(57,198,255,.12); }
.chart-help { display:flex; gap:20px; padding:10px 4px 0; color:#5e6579; font:800 8px Arial; letter-spacing:.12em; }
.stoch-legend { display:flex; align-items:center; gap:22px; padding-top:15px; color:#9792aa; font-size:9px; font-weight:800; letter-spacing:.1em; }
.stoch-legend span:before { content:""; display:inline-block; width:20px; height:2px; margin:0 7px 3px 0; }
.stoch-legend p { margin:0 0 0 auto; text-align:right; font-weight:400; letter-spacing:0; }
.signal-meta { display:grid; grid-template-columns:1fr auto auto; gap:24px; align-items:center; margin:24px 0 14px; padding:14px 17px; border:1px solid rgba(71,85,105,.38); border-radius:9px; background:rgba(3,7,18,.48); font-size:10px; letter-spacing:.13em; }
.market-controls { display:grid; grid-template-columns:auto minmax(220px,1fr) auto; gap:14px; align-items:center; margin-top:24px; }
.market-controls label { color:#8f8aa6; font-size:9px; font-weight:900; letter-spacing:.16em; }
.symbol-control { display:flex; }
.symbol-control input { width:100%; min-width:0; padding:13px 14px; border:1px solid var(--line); border-right:0; border-radius:8px 0 0 8px; outline:0; background:#050913; color:#fff; font:800 12px Arial; letter-spacing:.12em; text-transform:uppercase; }
.symbol-control input:focus { border-color:rgba(57,198,255,.6); box-shadow:0 0 18px rgba(57,198,255,.08); }
.symbol-control button,.timeframe-control button { border:1px solid var(--line); background:#08081d; color:#a8a3bc; font:900 10px Arial; letter-spacing:.11em; cursor:pointer; }
.symbol-control button { padding:0 18px; border-radius:0 8px 8px 0; color:var(--blue); }
.timeframe-control { display:flex; }
.timeframe-control button { min-width:48px; padding:13px 10px; border-left:0; }
.timeframe-control button:first-child { border-left:1px solid var(--line); border-radius:8px 0 0 8px; }
.timeframe-control button:last-child { border-radius:0 8px 8px 0; }
.timeframe-control button.active { color:#fff; border-color:var(--pink); background:rgba(255,47,179,.14); box-shadow:inset 0 -2px var(--pink); }
.signal-meta span,.signal-meta time { color:#8f8aa6; }
.signal-meta strong { color:#fff; }
.signal-only .stoch-chart-wrap { height:440px; }
.stoch-legend .long-key:before { background:var(--lime); box-shadow:0 0 8px var(--lime); }
.stoch-legend .short-key:before { background:var(--pink); box-shadow:0 0 8px var(--pink); }
.stoch-legend .bsl-key:before { height:1px; background:#fb7185; box-shadow:none; }
.stoch-legend .ssl-key:before { height:1px; background:#2dd4bf; box-shadow:none; }

@media (max-width: 800px) {
  .radar { padding: 90px 0; }
  .radar-head { grid-template-columns: 1fr; gap: 25px; }
  .stoch-panel { padding:18px 14px; }
  .stoch-head { align-items:flex-start; flex-direction:column; }
  .stoch-state { width:100%; }
  .stoch-chart-wrap { height:360px; }
  .signal-only .stoch-chart-wrap { height:clamp(360px, 100vw, 420px); }
  .signal-meta { grid-template-columns:1fr; gap:8px; }
  .market-controls { grid-template-columns:1fr; gap:9px; }
  .timeframe-control button { flex:1; }
  .stoch-legend { align-items:flex-start; flex-wrap:wrap; gap:12px; }
  .stoch-legend p { width:100%; margin:0; text-align:left; line-height:1.5; }
  .chart-overlay { top:49px; left:12px; right:12px; gap:10px; font-size:8px; }
  .chart-nav { top:10px; right:10px; }
  .chart-help { flex-wrap:wrap; gap:8px 14px; }
}

@media (max-width: 420px) {
  .radar { padding: 76px 0; }
  .stoch-panel { padding:15px 10px; border-radius:14px; }
  .stoch-head h3 { font-size:21px; }
  .stoch-kicker { font-size:8px; letter-spacing:.13em; }
  .market-controls { margin-top:18px; }
  .signal-meta { gap:7px; margin-top:18px; padding:12px; }
  .chart-overlay { gap:7px; font-size:7px; letter-spacing:.05em; }
  .chart-nav button { min-width:34px; height:30px; }
  .chart-help { font-size:7px; line-height:1.45; }
}