/* Scoped variables and base container */
.sp-switchboard {
  --panel:#6c6d69; --bezel:#222; --rocker:#383a3b; --text:#eaeaea; --accent:#e4433c; --shadow:rgba(0,0,0,.45); --ok:limegreen; --err:#e4433c; --muted:#a0a0a0;
  color: var(--text);
  font-family: system-ui, Segoe UI, Arial, Helvetica, sans-serif;
}
.sp-switchboard *, .sp-switchboard *::before, .sp-switchboard *::after { box-sizing: border-box; }

/* Panel */
.sp-switchboard .panel{position:relative;background:var(--panel);border-radius:20px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.06),0 20px 50px var(--shadow);width:min(920px,95vw);padding:28px;margin:24px auto}
.sp-switchboard .topbar{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px}
.sp-switchboard .topbar .brand{display:flex;gap:10px;align-items:center}
.sp-switchboard .brand .dot{width:10px;height:10px;border-radius:50%;background:#777;box-shadow:0 0 0 2px #111 inset}
.sp-switchboard .brand .dot.live{background:var(--ok);box-shadow:0 0 10px var(--ok)}
.sp-switchboard .brand small{opacity:.7}
.sp-switchboard .tools{display:flex;gap:6px;flex-wrap:wrap}
.sp-switchboard .btn{background:#3a3b39;border:1px solid #30312f;color:#fff;border-radius:8px;padding:6px 10px;cursor:pointer}
.sp-switchboard .btn[disabled]{opacity:.5;cursor:not-allowed}
.sp-switchboard .btn.warn{background:#7a2b2b;border-color:#642020}
.sp-switchboard .btn.ghost{background:#2a2b29}

/* Status lights */
.sp-switchboard .status-lights{display:flex;justify-content:center;gap:20px;margin:6px 0 8px}
.sp-switchboard .status-lights .light{width:30px;height:30px;border-radius:50%;background:#222;box-shadow:inset 0 0 6px #000}
.sp-switchboard .status-lights .light.red.on{background:#e22;box-shadow:0 0 12px #e22}
.sp-switchboard .status-lights .light.green.on{background:var(--ok);box-shadow:0 0 12px var(--ok)}
.sp-switchboard #mission-status{text-align:center;margin:4px 0 14px;font-weight:700}
.sp-switchboard #mission-status[hidden]{display:none}
.sp-switchboard #mission-status.ok{color:var(--ok)}
.sp-switchboard #mission-status.err{color:var(--err)}

/* Grid */
.sp-switchboard .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 34px}
.sp-switchboard .section-title{grid-column:1/-1;margin:6px 4px -6px;opacity:.8;font-size:14px}

/* Rocker Switch */
.sp-switchboard .rocker-wrap{position:relative;height:140px;display:flex;align-items:center;justify-content:center}
.sp-switchboard .state-badge{position:absolute;right:-10px;top:50%;transform:translateY(-50%);background:#1e1f1d;border:1px solid #333;padding:2px 8px;border-radius:8px;font-size:12px;opacity:.95;white-space:nowrap;pointer-events:none}
.sp-switchboard .rocker{width:96px;height:136px;position:relative;cursor:pointer;padding:8px;border-radius:10px;background:#101010;box-shadow:0 6px 14px var(--shadow)}
.sp-switchboard .rocker .frame{position:absolute;inset:8px;background:#0f0f0f;border-radius:6px;box-shadow:inset 0 0 0 2px #000,inset 0 12px 18px rgba(255,255,255,.06),inset 0 -8px 18px rgba(0,0,0,.6)}
.sp-switchboard .rocker .label{position:absolute;left:50%;transform:translateX(-50%);font-weight:700;letter-spacing:.5px;font-size:14px;color:#e9e9e9;text-shadow:0 1px 0 #000;user-select:none;pointer-events:none;opacity:.45;transition:opacity .15s}
.sp-switchboard .rocker .label.on{top:12px}
.sp-switchboard .rocker .label.off{bottom:12px}
.sp-switchboard .rocker.is-on .label.on{opacity:1}
.sp-switchboard .rocker:not(.is-on) .label.off{opacity:1}
.sp-switchboard .rocker .lever{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:86px;border-radius:8px;background:linear-gradient(#5a5c5d,#2f3132);box-shadow:inset 0 10px 12px rgba(255,255,255,.08),inset 0 -12px 16px rgba(0,0,0,.55),0 6px 10px var(--shadow);transition:transform .18s ease,background .18s ease}
.sp-switchboard .rocker:not(.is-on) .lever{transform:translate(-50%,-30%)}
.sp-switchboard .rocker.is-on .lever{transform:translate(-50%,-70%);background:linear-gradient(#7c7f80,#3a3c3d)}
.sp-switchboard .rocker .plate{position:absolute;inset:-6px;border-radius:12px;background:#151515;box-shadow:0 6px 14px var(--shadow)}
.sp-switchboard .rocker .plate::before,.sp-switchboard .rocker .plate::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:72%;height:2px;background:#000;opacity:.55}
.sp-switchboard .rocker .plate::before{top:34px}
.sp-switchboard .rocker .plate::after{bottom:34px}

/* Rotary Knob */
.sp-switchboard .knob-wrap{height:126px;display:flex;align-items:center;justify-content:center}
.sp-switchboard .dial{position:relative;width:96px;height:96px;border-radius:50%;background:#171717;box-shadow:inset 0 0 0 2px #000,0 10px 18px var(--shadow)}
.sp-switchboard .ticks{position:absolute;inset:-14px;pointer-events:none}
.sp-switchboard .ticks i{position:absolute;left:50%;top:20%;width:2px;height:10px;background:#111;transform-origin:0 42px;opacity:.85;box-shadow:0 1px 0 rgba(255,255,255,.08)}
.sp-switchboard .knob{position:absolute;inset:8px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#2c2c2c,#131313 60%);box-shadow:inset 0 12px 18px rgba(255,255,255,.08),inset 0 -16px 20px rgba(0,0,0,.7);display:grid;place-items:center;cursor:grab;transition:box-shadow .15s}
.sp-switchboard .knob:active{cursor:grabbing;box-shadow:inset 0 10px 14px rgba(255,255,255,.06),inset 0 -16px 18px rgba(0,0,0,.8)}
.sp-switchboard .pointer{width:6px;height:18px;border-radius:3px;background:#dcdcdc;box-shadow:0 1px 0 #000;transform-origin:50% 40px;transform:rotate(-135deg) translateY(-16px)}
.sp-switchboard .value{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:12px;opacity:.9;user-select:none}

/* Responsive */
@media (max-width:700px){.sp-switchboard .grid{grid-template-columns:repeat(3,1fr);gap:22px}}
@media (max-width:520px){.sp-switchboard .grid{grid-template-columns:repeat(2,1fr);gap:18px}}

/* ADMIN UI */
.sp-switchboard #admin-hotspot{position:absolute;top:8px;right:8px;width:24px;height:24px;opacity:0;z-index:10}
.sp-switchboard #admin-panel[hidden]{display:none}
.sp-switchboard #admin-panel{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);z-index:999;font-size:14px}
.sp-switchboard .admin-card{width:min(980px,92vw);max-height:86vh;overflow:auto;background:#1e1f1d;color:#eee;border-radius:12px;padding:16px 16px 12px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.sp-switchboard .admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.sp-switchboard .admin-header button{background:#444;color:#fff;border:0;padding:6px 10px;border-radius:8px;cursor:pointer}
.sp-switchboard .admin-body p{margin:.4rem 0}
.sp-switchboard .admin-group{border:1px solid #333;border-radius:8px;padding:10px 12px;margin:12px 0}
.sp-switchboard .admin-group legend{padding:0 6px;opacity:.85}
.sp-switchboard .admin-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(150px,1fr))}
.sp-switchboard .admin-grid label{display:block;background:#2a2b29;padding:8px;border-radius:8px}
/* Global admin inputs styling as requested */
.sp-switchboard .admin-grid input[type=date],
.sp-switchboard .admin-grid input[type=email],
.sp-switchboard .admin-grid input[type=number],
.sp-switchboard .admin-grid input[type=password],
.sp-switchboard .admin-grid input[type=search],
.sp-switchboard .admin-grid input[type=tel],
.sp-switchboard .admin-grid input[type=text],
.sp-switchboard .admin-grid input[type=url],
.sp-switchboard .admin-grid select,
.sp-switchboard .admin-grid textarea{
  border:1px solid #666;
  border-radius:3px;
  padding:.5rem .5rem;
  transition: all .3s;
  width:100%;
}
.sp-switchboard .admin-grid .range-row{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:nowrap}
.sp-switchboard .admin-grid .range-row input[type="number"]{flex:1;min-width:0;text-align:center}
.sp-switchboard .admin-actions{display:flex;gap:10px;align-items:center;margin:10px 0 6px;flex-wrap:wrap}
.sp-switchboard #rule-name{flex:1;min-width:160px;padding:6px 8px;border-radius:8px;border:1px solid #333;background:#2b2c2a;color:#fff}
.sp-switchboard #rule-save,.sp-switchboard #rules-clear,.sp-switchboard #rules-export,.sp-switchboard #rules-import{background:#5b5c5a;color:#fff;border:0;padding:8px 12px;border-radius:8px;cursor:pointer}
.sp-switchboard #rules-list{margin:.4rem 0 0 1rem}
.sp-switchboard #rules-list li{margin:.25rem 0}
.sp-switchboard .admin-hint{opacity:.75;font-size:12px;margin:-4px 0 6px}
.sp-switchboard .muted{color:var(--muted)}
.sp-switchboard .kvs{font:12px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;background:#2b2c2a;border:1px solid #333;border-radius:8px;padding:6px 8px}