.ss-root {
  min-height: 100%;
  padding: 28px;
  color: #e8edf7;
  background:
    radial-gradient(circle at top left, rgba(64, 110, 255, 0.18), transparent 32rem),
    radial-gradient(circle at bottom right, rgba(41, 197, 155, 0.10), transparent 28rem),
    #070a12;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.ss-root * { box-sizing: border-box; }
.ss-hero, .ss-toolbar, .ss-main, .ss-tabs, .ss-lens, .ss-schedule { max-width: 1500px; margin-left: auto; margin-right: auto; }
.ss-hero {
  display: flex; justify-content: space-between; gap: 24px; align-items: stretch;
  padding: 26px; border: 1px solid rgba(130, 150, 190, .18); border-radius: 28px;
  background: linear-gradient(135deg, rgba(18, 24, 38, .96), rgba(10, 13, 22, .92));
  box-shadow: 0 30px 90px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04);
}
.ss-kicker { color: #7b8aa8; text-transform: uppercase; letter-spacing: .16em; font-size: 11px; font-weight: 800; }
.ss-hero h1, .ss-toolbar h1 { margin: 4px 0 8px; letter-spacing: -0.05em; }
.ss-hero h1 { font-size: 48px; line-height: .95; }
.ss-hero p, .ss-toolbar p { margin: 0; color: #9ba8bd; max-width: 780px; }
.ss-status-card {
  min-width: 230px; display: grid; grid-template-columns: 1fr auto; gap: 8px 16px;
  align-content: center; padding: 18px; border-radius: 22px; background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
}
.ss-status-card span { color: #7e8ca4; } .ss-status-card b { color: #fff; }
.ss-tabs { display: flex; gap: 10px; padding: 18px 0 12px; overflow-x: auto; }
.ss-tab {
  appearance: none; border: 1px solid rgba(130,150,190,.17); color: #aeb9cc; background: rgba(13,18,29,.78);
  border-radius: 16px; padding: 12px 14px; min-width: 150px; text-align: left; cursor: pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.ss-tab:hover { transform: translateY(-1px); border-color: rgba(130,150,190,.35); }
.ss-tab.active { background: linear-gradient(180deg, rgba(36,55,91,.92), rgba(14,20,33,.92)); color: #fff; border-color: rgba(118,151,255,.55); }
.ss-tab.removed { opacity: .45; }
.ss-tab-title { display: block; font-weight: 800; font-size: 13px; }
.ss-tab-count { display: inline-flex; margin-top: 8px; min-width: 26px; height: 22px; align-items: center; justify-content: center; padding: 0 8px; border-radius: 999px; background: rgba(255,255,255,.07); color: #d8def0; font-size: 12px; }
.ss-toolbar {
  margin-top: 8px; display: flex; justify-content: space-between; align-items: center; gap: 18px;
  padding: 20px 22px; border-radius: 24px; border: 1px solid rgba(130,150,190,.15); background: rgba(12,16,26,.76);
}
.ss-toolbar h1 { font-size: 30px; }
.ss-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.ss-actions button, .ss-schedule button, .ss-toolbar button {
  border: 1px solid rgba(125,151,255,.35); background: rgba(81,109,255,.16); color: #dfe6ff;
  border-radius: 12px; padding: 10px 12px; font-weight: 750; cursor: pointer;
}
.ss-actions button:hover, .ss-toolbar button:hover { background: rgba(81,109,255,.25); }
.ss-actions button:disabled { opacity: .55; cursor: default; }
.ss-actions .quiet { border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.04); color: #9faabd; }
.ss-lens {
  margin-top: 10px; color: #9eabc0; border-left: 2px solid #6d86ff; padding: 10px 14px;
  background: rgba(255,255,255,.025); border-radius: 0 14px 14px 0;
}
.ss-lens strong { color: #dbe4f8; }
.ss-main { margin-top: 16px; display: grid; grid-template-columns: minmax(0, 1.6fr) 430px; gap: 16px; align-items: start; }
.ss-list, .ss-detail {
  border: 1px solid rgba(130,150,190,.15); border-radius: 24px; background: rgba(9,13,22,.82);
  box-shadow: 0 20px 70px rgba(0,0,0,.24); overflow: hidden;
}
.ss-table-wrap { overflow: auto; }
.ss-table { width: 100%; border-collapse: collapse; min-width: 920px; font-size: 13px; }
.ss-table th {
  position: sticky; top: 0; z-index: 2; color: #8794ad; background: rgba(12,17,29,.98); text-align: right;
  padding: 13px 12px; border-bottom: 1px solid rgba(255,255,255,.08); white-space: nowrap; cursor: pointer;
}
.ss-table th:first-child, .ss-table td:first-child { text-align: left; }
.ss-table td { text-align: right; padding: 13px 12px; border-bottom: 1px solid rgba(255,255,255,.055); color: #cdd7e8; white-space: nowrap; }
.ss-table tr { cursor: pointer; }
.ss-table tbody tr:hover, .ss-table tbody tr.selected { background: rgba(78,105,255,.12); }
.ss-table .ticker strong { color: #fff; letter-spacing: .02em; }
.ss-table .verdict { color: #c2ffe9; font-weight: 750; text-align: left; }
.ss-table .chart { width: 140px; }
.ss-sort { color: #89a1ff; }
.ss-range { position: relative; height: 20px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.075); border: 1px solid rgba(255,255,255,.08); min-width: 108px; }
.ss-range-fill { position: absolute; inset: 0 auto 0 0; border-radius: 999px; background: linear-gradient(90deg, #dd6b6b, #e2b84a 52%, #35d399); opacity: .8; }
.ss-range span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 11px; font-weight: 850; text-shadow: 0 1px 2px #000; }
.ss-detail { padding: 20px; position: sticky; top: 18px; }
.ss-detail.empty { color: #8d99ad; min-height: 200px; display: flex; align-items: center; justify-content: center; }
.ss-detail-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ss-detail h2 { margin: 2px 0 0; font-size: 42px; letter-spacing: -0.06em; }
.ss-pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 6px 10px; color: #cbd7ee; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.09); font-size: 12px; font-weight: 800; white-space: nowrap; }
.ss-pill.good { color: #bdfce7; background: rgba(41,197,155,.13); border-color: rgba(41,197,155,.28); }
.ss-pill.bad { color: #ffd2d2; background: rgba(220,80,80,.13); border-color: rgba(220,80,80,.28); }
.ss-reason { color: #c9d4e7; line-height: 1.45; margin: 12px 0 18px; }
.ss-metrics { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.ss-metrics div { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.045); padding: 11px; border-radius: 14px; }
.ss-metrics span { display: block; color: #7f8ca5; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.ss-metrics b { display: block; margin-top: 3px; color: #fff; font-size: 16px; }
.ss-mini-section { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); }
.ss-mini-section h3 { font-size: 13px; color: #dbe4f8; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 10px; }
.ss-range-labels { display: flex; justify-content: space-between; color: #7f8ca5; font-size: 11px; margin-top: 7px; gap: 8px; }
.ss-signal-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.ss-excerpt { color: #9eaac0; line-height: 1.55; font-size: 13px; max-height: 230px; overflow: auto; }
.ss-empty, .ss-loading, .ss-error { padding: 36px; color: #9aa7bd; }
.ss-error { color: #ffd0d0; background: rgba(120,20,20,.2); border: 1px solid rgba(255,100,100,.25); border-radius: 18px; }
.ss-schedule { position: relative; margin-top: 12px; padding: 16px; border-radius: 18px; background: rgba(20,26,39,.95); border: 1px solid rgba(125,151,255,.28); color: #d9e2f5; }
.ss-schedule pre { white-space: pre-wrap; color: #aebbd3; background: rgba(0,0,0,.22); padding: 12px; border-radius: 12px; overflow: auto; }
.ss-schedule code { color: #b8c6ff; }
.ss-close { position: absolute; right: 12px; top: 10px; width: 28px; height: 28px; padding: 0 !important; }
@media (max-width: 1100px) { .ss-main { grid-template-columns: 1fr; } .ss-detail { position: static; } .ss-hero, .ss-toolbar { flex-direction: column; } }
