/* EBSpanel(TM) — Copyright (c) 2026 EBSsystems.co. Proprietary; see LICENSE.
 * Command theme: shared EBS graphite / blue / aqua / fiber-gold palette.
 * Layered over app.css to preserve existing components and route contracts.
 * No remote assets, continuous animation, backdrop filters or extra runtime. */
:root {
  --chassis:#080d13; --bg:#0c121b; --panel:#111b27; --panel-2:#172331; --panel-hover:#1b2c3d;
  --line:#233344; --line-strong:#385066; --text:#e8eef2; --muted:#a0b2c2; --faint:#8a9daf;
  --accent:#58d6da; --accent-strong:#8de9ec; --accent-ink:#062026;
  --ok:#65dfa5; --warn:#f2bc59; --crit:#ff8791; --brand:#f2b33d;
  --ok-lamp:var(--ok); --warn-lamp:var(--warn); --crit-lamp:var(--crit); --accent-lamp:var(--accent);
  --face:linear-gradient(145deg,#182635,#111b27); --face-edge:#2b4054; --face-hi:#ffffff08;
  --radius-s:6px; --radius-m:10px; --radius-l:14px; --top-h:4.6rem; --sb:17rem;
  --font-display:Bahnschrift,"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;
  --mono:"Cascadia Mono",Consolas,"DejaVu Sans Mono",monospace;
  --fiber:#f2b33d; --action:#2377b7; --hero:#101f30; --hero-end:#10242d;
}
:root[data-theme=light] {
  --chassis:#f7fafc; --bg:#eaf0f5; --panel:#ffffff; --panel-2:#f2f6fa; --panel-hover:#e3eef5;
  --line:#d2dde7; --line-strong:#a8baca; --text:#172b3a; --muted:#485f72; --faint:#52697b;
  --accent:#086f79; --accent-strong:#07515d; --accent-ink:#ffffff;
  --ok:#116b42; --warn:#865400; --crit:#b2283c; --brand:#875600;
  --ok-lamp:var(--ok); --warn-lamp:var(--warn); --crit-lamp:var(--crit); --accent-lamp:var(--accent);
  --face:linear-gradient(145deg,#ffffff,#f6f9fc); --face-edge:#cbd9e4; --face-hi:#ffffff;
  --fiber:#946300; --action:#176daa; --hero:#e1edf7; --hero-end:#e2f2f1;
}
html { font-size:14px; }
@media(min-width:2200px){html{font-size:16px}}
@media(min-width:3000px){html{font-size:18px}}
body { background:var(--bg); }
button,input,select,textarea { font-family:var(--font); }
.top { padding:0 1.5rem; gap:1.25rem; background:var(--chassis); }
.top::after { content:""; position:absolute; inset:auto 0 -1px; height:1px; background:linear-gradient(90deg,var(--action),var(--accent) 40%,var(--fiber) 70%,transparent); opacity:.7; pointer-events:none; }
.top .logo img { width:2.3rem; height:2.3rem; }
.top .logo b { font-size:1.4rem; letter-spacing:-.6px; }
.top .host { padding:.32rem .55rem; background:var(--panel); font-size:.76rem; }
.top .host::before { background:var(--accent); box-shadow:none; }
.levels { border-color:var(--line); background:var(--bg); padding:3px; gap:2px; }
.levels button { border:0; height:2rem; border-radius:4px; font-size:.82rem; }
.levels button.on { color:var(--accent); background:var(--panel-hover); box-shadow:none; }
.top .search { max-width:26rem; }
.top .search input { height:2.5rem; border-radius:7px; font-size:.85rem; padding-left:2.25rem; }
.top .search svg { top:.75rem; }
.top .ib { height:2.6rem; border-radius:7px; }
.side { padding:1.4rem .85rem 1rem; background:var(--chassis); gap:.25rem; }
.side .grp { font:500 .7rem/1.6 var(--mono); letter-spacing:.14em; margin:1.3rem 0 .45rem; color:var(--faint); }
.side .grp:first-child { margin-top:0; }
.side a { height:2.75rem; padding:0 1rem; font-size:.91rem; border:1px solid transparent; }
.side a.on { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 23%,var(--line)); background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 13%,var(--chassis)),var(--panel)); }
.side a.on::before { top:.7rem; bottom:.7rem; width:3px; left:-1px; box-shadow:0 0 10px #3fd0d444; }
.side a.on svg { filter:none; }
.side .sysbar { margin-top:2.4rem; padding:.9rem .8rem 0; font-size:.76rem; }
.side .sysbar .tm { font-size:.69rem; line-height:1.6; }
main { padding:2rem 2.3rem 4rem; max-width:none; scroll-margin-top:calc(var(--top-h) + 1rem); }
.ph { margin-bottom:1.5rem; }
.ph h1 { font-size:1.9rem; letter-spacing:-.6px; }
.ph .crumbs { font-size:.8rem; margin-bottom:.55rem; }
.card { padding:1.3rem; background:var(--panel); box-shadow:0 1px 0 #ffffff03 inset; }
.cards:has(>.card.stat:nth-child(2):last-child) { grid-template-columns:repeat(2,minmax(0,1fr)); }
.card h2 { padding-bottom:1rem; margin-bottom:1.15rem; font-size:1rem; font-weight:600; letter-spacing:0; }
.card h2 svg { width:1.15rem; height:1.15rem; fill:none; stroke:currentColor; stroke-width:1.6; }
.btn { height:2.65rem; border-radius:6px; padding:0 1.1rem; font-size:.9rem; }
.btn svg { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.btn:not(.sec):not(.danger):not(.ok):not(.warn) { background:var(--action); border-color:var(--action); color:#fff; box-shadow:0 0 18px #2f8fd820; }
.btn:not(.sec):not(.danger):not(.ok):not(.warn):hover { background:color-mix(in srgb,var(--action) 90%,#000); border-color:var(--action); color:#fff; }
.btn.sm { height:2.3rem; }
.btn.xs { height:1.9rem; padding:0 .6rem; font-size:.77rem; }
.btn.sec { border-color:var(--line); background:var(--panel-2); box-shadow:none; }
.btn:focus-visible,.top .ib:focus-visible,.levels button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
input,select { height:2.6rem; }
/* Long paths and tokens in inline code wrap instead of widening the page on a phone (Move from cPanel). */
code { overflow-wrap:anywhere; }
.tag { padding:.18rem .42rem; border-radius:4px; font:.69rem/1.3 var(--mono); letter-spacing:.02em; }
.tbl th { font:500 .71rem/1.5 var(--mono); letter-spacing:.06em; padding:.85rem 1rem; background:var(--panel-2); }
.tbl td { padding:.9rem 1rem; font-size:.88rem; }
.tbl-wrap { border-radius:7px; }
.kv { gap:.65rem 1rem; font-size:.9rem; }
.kv dd { font-size:.83rem; overflow-wrap:anywhere; }
.tabs a { padding:.75rem 1rem; }
.banner { padding:.9rem 1rem; border-radius:7px; }
.modal { padding:1.5rem 1.6rem 0; }
.modal .actions { margin:1.4rem -1.6rem 0; padding:1rem 1.6rem; }
.jobdot.run { animation:none; }
.login { background:radial-gradient(ellipse at 80% 15%,#2f8fd81f,transparent 55%),radial-gradient(ellipse at 10% 80%,#3fd0d411,transparent 50%),var(--chassis); }
.login .box { width:min(32rem,100%); padding:2.6rem 2.4rem 1.7rem; border-color:var(--line); }
.login .box::before { background:linear-gradient(90deg,var(--action),var(--accent),var(--fiber)); box-shadow:none; }
.login .brandrow { margin-bottom:2rem; }
.login .box h1 { font-size:2.1rem; }
.login .box .by { line-height:1.6; }
.login .foot { margin:1.8rem -2.4rem 0; padding:1rem 2.4rem 0; }
.login .btn.block { height:3rem; }

/* The dashboard uses snapshots only; decoration never implies measured history. */
.command-dashboard { max-width:1500px; margin:0 auto; }
.command-dashboard .ph { align-items:center; }
.command-dashboard .ph h1 { font-size:1.65rem; }
.command-kicker { color:var(--faint); font:500 .69rem/1.6 var(--mono); text-transform:uppercase; letter-spacing:.12em; }
.command-hero { position:relative; display:grid; grid-template-columns:1.35fr 1fr; align-items:center; gap:2rem; min-height:15rem; padding:2rem 2.3rem; margin-bottom:1.5rem; border:1px solid var(--line-strong); border-radius:var(--radius-l); overflow:hidden; background:linear-gradient(110deg,var(--hero) 20%,var(--hero-end)); }
.command-hero::before { content:""; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(#58d6da08 1px,transparent 1px),linear-gradient(90deg,#58d6da08 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(90deg,transparent,#000); }
.command-hero::after { content:""; position:absolute; top:0; left:0; width:42%; height:2px; background:linear-gradient(90deg,var(--action),var(--accent),var(--fiber)); }
.hero-copy,.command-topology { position:relative; }
.hero-copy .command-kicker { color:var(--accent); }
.hero-copy h2 { font:600 clamp(1.8rem,2.6vw,2.7rem)/1.15 var(--font-display); letter-spacing:-1px; margin:.6rem 0 .8rem; }
.hero-copy h2 span { color:var(--accent); }
.hero-copy p { margin:0; color:var(--muted); font-size:.93rem; max-width:36rem; line-height:1.65; }
.hero-meta { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem 1rem; margin-top:1.2rem; font:.72rem/1.5 var(--mono); color:var(--muted); }
.hero-meta time { color:var(--text); }
.command-topology { padding:.4rem .5rem; }
.topology-label { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.75rem; font:.65rem var(--mono); color:var(--muted); letter-spacing:.1em; }
.topology-line { display:grid; grid-template-columns:1fr 3rem 1fr; align-items:center; }
.topology-node { border:1px solid var(--line-strong); border-radius:8px; padding:1rem; background:var(--chassis); box-shadow:0 8px 20px #00000012; min-width:0; }
.topology-node .rack { display:flex; gap:4px; margin-bottom:1rem; }
.topology-node .rack i { height:4px; width:14px; border-radius:1px; background:var(--accent); opacity:.6; }
.topology-node .rack i:last-child { margin-left:auto; width:5px; background:var(--fiber); opacity:1; }
.topology-node b { display:block; font:500 .84rem var(--mono); overflow-wrap:anywhere; }
.topology-node small { display:block; color:var(--muted); margin-top:.45rem; font-size:.74rem; }
.topology-link { height:1px; background:var(--line-strong); position:relative; }
.topology-link::after { content:""; position:absolute; width:5px; height:5px; border:1px solid var(--accent); border-radius:50%; background:var(--chassis); left:calc(50% - 3px); top:-3px; }
.topology-note { margin:.7rem 0 0; color:var(--faint); font:.65rem/1.5 var(--mono); text-align:right; }
.command-totals { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-bottom:1.5rem; }
.command-total { display:grid; grid-template-columns:1fr auto; gap:.5rem; padding:1.3rem; border:1px solid var(--line); border-radius:var(--radius-m); background:var(--face); }
.command-total .label { font-size:.86rem; color:var(--muted); }
.command-total svg { width:1.2rem; height:1.2rem; fill:none; stroke:var(--accent); stroke-width:1.5; grid-column:2; }
.command-total .value { grid-column:1/-1; font:600 2.3rem/1.2 var(--font-display); letter-spacing:-1px; }
.command-total .detail { grid-column:1/-1; font:.73rem/1.5 var(--mono); color:var(--faint); }
.command-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:1.2rem; }
.command-grid>.card { margin:0; }
.command-capacity { grid-column:span 8; }
.command-attention { grid-column:span 4; }
.command-services,.command-pair { grid-column:span 6; }
.command-release,.command-license { grid-column:span 6; }
.command-activity { grid-column:1/-1; }
.section-heading { display:flex; gap:.65rem; align-items:center; }
.section-heading svg { color:var(--accent); }
.section-heading .count { margin-left:.2rem; font:.72rem var(--mono); color:var(--muted); }
.command-heading-note { color:var(--faint); font:.68rem var(--mono); font-weight:400; }
.capacity-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.capacity-label { color:var(--muted); font-size:.81rem; margin-bottom:.8rem; }
.capacity-value { font:600 1.9rem var(--font-display); letter-spacing:-.7px; }
.capacity-value small { font:400 .8rem var(--font); color:var(--muted); margin-left:.35rem; letter-spacing:0; }
.capacity-grid .meter { height:5px; margin:.85rem 0 .6rem; border-radius:4px; }
.capacity-grid .meter i { border-radius:4px; }
.capacity-description { font:.7rem/1.5 var(--mono); color:var(--faint); }
.capacity-footer { margin:1.25rem 0 0; padding-top:1rem; border-top:1px solid var(--line); color:var(--muted); display:flex; flex-wrap:wrap; gap:.6rem 1rem; font:.73rem/1.6 var(--mono); }
.capacity-footer b { color:var(--text); font-weight:500; }
.attention-item { display:flex; gap:.7rem; padding:.65rem 0; align-items:flex-start; }
.attention-item:first-of-type { padding-top:0; }
.attention-item+.attention-item { border-top:1px solid var(--line); }
.attention-symbol { width:1.65rem; height:1.65rem; flex:none; display:grid; place-items:center; color:var(--warn); background:color-mix(in srgb,var(--warn) 10%,transparent); border:1px solid color-mix(in srgb,var(--warn) 30%,var(--line)); border-radius:5px; font:.85rem var(--mono); }
.attention-item b { display:block; font-size:.85rem; font-weight:600; margin-bottom:.25rem; }
.attention-item p { margin:0; font-size:.77rem; line-height:1.6; color:var(--muted); overflow-wrap:anywhere; }
.attention-item a { display:inline-block; font-size:.77rem; margin-top:.4rem; }
.attention-neutral { color:var(--muted); font-size:.85rem; line-height:1.7; }
.service-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 1.4rem; }
.service-row { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.7rem 0; border-bottom:1px solid var(--line); font:.78rem var(--mono); }
.service-state { color:var(--ok); font:400 .68rem var(--font); white-space:nowrap; }
.service-state.off { color:var(--crit); }
.service-state .dot { width:5px; height:5px; box-shadow:none; margin-right:.3rem; }
.command-pair .pair-status { display:flex; gap:.55rem; align-items:center; margin:0 0 1rem; font-size:.84rem; }
.command-pair .kv,.command-release .kv,.command-license .kv { grid-template-columns:1fr 1.1fr; }
.command-pair .pair-note { padding:.8rem 0 0; margin:1rem 0 0; border-top:1px solid var(--line); font-size:.76rem; line-height:1.6; color:var(--faint); }
.command-activity h2 { margin-bottom:.8rem; }
.activity-tools { display:flex; justify-content:space-between; gap:1rem; align-items:center; margin-bottom:1rem; flex-wrap:wrap; }
.activity-tools p { font-size:.77rem; color:var(--faint); margin:0; }
.activity-filters { display:inline-flex; padding:3px; gap:2px; border:1px solid var(--line); background:var(--bg); border-radius:6px; }
.activity-filters button { cursor:pointer; background:transparent; border:0; border-radius:4px; padding:.45rem .7rem; color:var(--muted); font-size:.77rem; }
.activity-filters button[aria-pressed=true] { color:var(--text); background:var(--panel-hover); }
.activity-filters button:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.command-activity td:first-child a { font:.8rem var(--mono); }
.command-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.7rem; margin-top:1.4rem; font:.68rem/1.6 var(--mono); color:var(--faint); }
.command-footer span:first-child { color:var(--muted); }
.skip-link { position:fixed; top:-8rem; left:1rem; z-index:100; padding:.8rem 1rem; background:var(--panel); color:var(--accent); border:2px solid var(--accent); border-radius:6px; }
.skip-link:focus { top:.6rem; }
@media(max-width:1250px) {
  .top { gap:.6rem; padding:0 1rem; }
  .top .host { display:none; }
  :root { --sb:15.5rem; }
  main { padding:1.6rem; }
  .command-hero { padding:1.7rem; gap:1.4rem; }
  .command-capacity,.command-attention { grid-column:span 6; }
  .capacity-grid { grid-template-columns:1fr; gap:1rem; }
  .capacity-unit { display:grid; grid-template-columns:1fr auto; gap:.2rem 1rem; align-items:center; }
  .capacity-label { margin:0; }
  .capacity-value { font-size:1.4rem; }
  .capacity-unit .meter { margin:.35rem 0; grid-column:1/-1; }
  .capacity-description { grid-column:1/-1; }
}
@media(max-width:1050px) {
  .top .search { max-width:20rem; }
  .top .user .tag,.top .user .uname { display:none; }
  .command-hero { grid-template-columns:1fr; }
  .command-topology { display:none; }
}
@media(max-width:900px) {
  :root { --top-h:4rem; --sb:17rem; }
  .top .logo b { font-size:1.2rem; }
  .top .sp { min-width:0; }
  .side .sysbar { margin-top:2rem; }
  main { padding:1.3rem 1rem 3rem; }
  .command-grid { gap:1rem; }
  .command-hero { min-height:0; padding:1.7rem; }
  .hero-copy h2 { font-size:2.25rem; }
  .command-capacity { grid-column:span 8; }
  .command-attention { grid-column:span 4; }
  .command-total { padding:1rem; }
  .command-total .value { font-size:2rem; }
}
@media(max-width:650px) {
  .command-grid>.card { grid-column:1/-1; }
  .command-totals { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; margin-bottom:1rem; }
  .command-hero { margin-bottom:1rem; padding:1.4rem; }
  .hero-copy h2 { font-size:2rem; }
  .hero-copy p { font-size:.87rem; }
  .hero-meta { font-size:.65rem; }
  .command-kicker { font-size:.62rem; }
  .command-dashboard .ph { gap:.85rem; margin-bottom:1.1rem; }
  .command-dashboard .ph h1 { font-size:1.5rem; }
  .command-heading-note { font-size:.62rem; }
  .card { padding:1.1rem; }
  .service-grid { gap:0 1rem; }
  .command-footer { font-size:.64rem; }
  .activity-tools { gap:.7rem; }
}
@media(max-width:380px) {
  .top { padding:0 .4rem; gap:.2rem; }
  .top .ib { padding:0 .45rem; }
  .command-totals .detail { font-size:.65rem; }
  .service-grid { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }