/* CyberCron identity: violet from the supplied original logo, navy machinery. */
:root {
  font-size: 16px;
  --blue: #a625f5;
  --purple: #a625f5;
  --brand: #a625f5;
  --brand-light: #ce9aff;
  --line: #493267;
}
body {
  background-image: radial-gradient(ellipse at 80% 0, #53217a26, transparent 48%);
}
.sidebar {
  background: linear-gradient(160deg, #19162e, #0e1526 75%);
  border-right-color: #342745;
}
.brand { gap: 10px; font-size: 18px; }
.brand img, .login > img {
  object-fit: contain;
  filter: drop-shadow(0 0 10px #a625f52b);
}
.brand img { flex-shrink: 0; }
.brand small { letter-spacing: 0; }
.primary {
  background: linear-gradient(115deg, #7824c6, #a625f5);
  border-color: #b956fa;
  box-shadow: 0 4px 22px #a625f523;
}
.primary:hover { background: #a333ee; border-color: #d89bff; }
nav .selected {
  background: linear-gradient(90deg, #55206b77, #291d4055);
  border-color: #70409a;
  color: #dbb0ff;
  box-shadow: inset 3px 0 #b548ff;
}
nav a:hover { background: #312040; }
.nav-count { border-color: #654080; }
.accent, .eyebrow { color: var(--brand-light); }
.panel {
  border-color: #3b3154;
  background: linear-gradient(125deg, #1a1d36, #111a2e 70%);
}
.panel:before { background: #b75bfa; }
.panel:after {
  content: "";
  position: absolute;
  right: 5px;
  top: 5px;
  width: 12px;
  height: 12px;
  border-top: 1px solid #8c52bb66;
  border-right: 1px solid #8c52bb66;
  pointer-events: none;
}
.panel-title, .core-footer, .next-run { border-color: #3c3052; }
.core-panel {
  background: radial-gradient(ellipse at 20% 60%, #7728b025, transparent 65%), linear-gradient(125deg, #201b38, #111a2e);
}
.ring-main { stroke: #b748ff; filter: drop-shadow(0 0 5px #a625f560); }
.ring-inner { stroke: #755294; }
.core-symbol { color: #c26dff; }
.reactor.waiting .ring-main { stroke: var(--yellow); filter: none; }
.metric.blue strong { color: #cf9aff; }
.metric.purple strong { color: #bd79f6; }
.segments { background: repeating-linear-gradient(90deg, #62427f 0, #62427f 7px, transparent 7px, transparent 10px); }
.quick-grid a { border-color: #49345d; background: #31233f44; }
.quick-grid a:hover { background: #3b2552; }
.quick-grid span { color: #c980ff; }
.next-run strong { color: #d2a2ff; }
a { color: #d0a0ff; }
a:hover { color: #ead4ff; }
.preview code { border-color: #614480; color: #d2a2ff; }
.mobile-nav-close { display: none; }
.sidebar { width: 280px; overflow-y: auto; }
.workspace { margin-left: 280px; }
.panel, .overview, .metrics, .two-column, .form-grid { min-width: 0; }
.overview > *, .metrics > *, .two-column > *, .form-grid > * { min-width: 0; }
.login { max-width: 480px; }
.sidebar-bottom { padding-bottom: 12px; }
.nav-label, .system-chip, .micro, .eyebrow, .metric small, .footer {
  letter-spacing: .4px;
}
.nav-label { gap: 8px; flex-wrap: wrap; }
.sidebar-bottom .system-chip { overflow-wrap: anywhere; }
.core-stats > div, .next-run { flex-wrap: wrap; }
input, select, textarea, label { font-size: 16px; }
label small { font-size: 13px; }
@media (min-width: 801px) and (max-width: 1200px) {
  .sidebar { width: 250px; }
  .workspace { margin-left: 250px; }
}
input:focus, select:focus, textarea:focus { border-color: #bd6cff; box-shadow: 0 0 0 2px #a625f519; }
:focus-visible { outline-color: #c980ff; }
body:has(.login) {
  background-image: linear-gradient(#a625f506 1px, transparent 1px), linear-gradient(90deg, #a625f506 1px, transparent 1px), radial-gradient(ellipse at 50% 40%, #3c1e55, transparent 65%);
}
@media(max-width:800px) {
  .sidebar { visibility: hidden; width: 280px; }
  .workspace { margin-left: 0; }
  .topbar { font-size: 16px; height: auto; min-height: 68px; flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
  .sidebar.open { visibility: visible; }
  .mobile-nav-close { display: block; margin: 10px 12px 18px; font-size: 16px; }
}
@media (max-width: 480px) {
  .core-body { flex-direction: column; }
  .core-stats { width: 100%; max-width: none; }
  .panel-title { flex-wrap: wrap; }
  .page-heading { flex-wrap: wrap; }
}