:root{
      --bg:#070b14;
      --panel:#0e1626;
      --muted:#9aa9c9;
      --text:#eef3ff;
      --line:rgba(255,255,255,.08);

      --brand:#4fd1c5;
      --brand-2:#60a5fa;
      --good:#22c55e;
      --warn:#f59e0b;
      --bad:#ef4444;
    }
    *{box-sizing:border-box}
    body{
      margin:0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
      background: radial-gradient(1200px 500px at 10% -10%, rgba(79,209,197,.18), transparent 60%),
                  radial-gradient(900px 500px at 110% 10%, rgba(96,165,250,.14), transparent 60%),
                  var(--bg);
      color:var(--text);
    }
    .wrap{max-width:1180px;margin:0 auto;padding:24px 16px 52px}
    .brand-header{
      display:flex;align-items:center;justify-content:space-between;
      margin-bottom:18px;padding:14px 16px;border-radius:18px;
      background:linear-gradient(135deg, rgba(79,209,197,.18), rgba(96,165,250,.18));
      border:1px solid rgba(255,255,255,.10);
    }
    .brand-left{display:flex;gap:14px;align-items:center}
    .logo-slot{
      width:52px;height:52px;border-radius:14px;
      background:linear-gradient(135deg, var(--brand), var(--brand-2));
      display:flex;align-items:center;justify-content:center;
      font-weight:900;color:#081018;font-size:12px; user-select:none;
    }
    .brand-title{font-size:18px;font-weight:900;letter-spacing:.3px}
    .brand-sub{font-size:12px;color:var(--muted)}
    .pill{
      display:inline-flex;align-items:center;gap:8px;
      padding:6px 10px;border-radius:999px;
      background:rgba(79,209,197,.18);
      border:1px solid rgba(79,209,197,.35);
      color:#dffaf6;font-size:12px;
    }

    h1{margin:14px 0 0;font-size:26px}
    .sub{margin:6px 0 0;color:var(--muted);max-width:1040px;line-height:1.4}

    .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;margin-top:18px}
    @media (max-width:980px){.grid{grid-template-columns:1fr}}

    .card{
      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
      border:1px solid var(--line);
      border-radius:18px;
      padding:16px;
      box-shadow:0 20px 60px rgba(0,0,0,.25);
    }
    .card h2{margin:0 0 12px;font-size:16px;color:#dbe7ff}

    label{display:block;font-size:12px;color:var(--muted);margin:0 0 6px}
    select, input[type="number"], input[type="search"]{
      width:100%;
      background:rgba(11,18,32,.8);
      color:var(--text);
      border:1px solid var(--line);
      border-radius:12px;
      padding:11px 12px;
      outline:none;
    }
    select:focus, input:focus{border-color:rgba(79,209,197,.55);box-shadow:0 0 0 4px rgba(79,209,197,.12)}

    .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    @media (max-width:680px){.row{grid-template-columns:1fr}}

    .hint{font-size:12px;color:var(--muted);line-height:1.35;margin-top:8px}

    button{
      cursor:pointer;border:none;padding:10px 12px;border-radius:12px;
      background:rgba(79,209,197,.16);color:var(--text);
      border:1px solid rgba(79,209,197,.28);font-weight:900;
    }
    button:hover{filter:brightness(1.06)}
    .danger{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.28)}

    .kvs{display:grid;gap:8px;margin-top:10px}
    .kv{
      display:flex;justify-content:space-between;gap:10px;
      padding:10px 12px;border-radius:14px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.03);
      font-size:13px;
    }
    .big{font-size:32px;font-weight:1000;margin:8px 0 2px}
    .status{
      padding:10px 12px;border-radius:14px;border:1px solid var(--line);
      background:rgba(255,255,255,.03); font-weight:900;
    }
    .ok{color:var(--good);border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.08)}
    .risk{color:var(--warn);border-color:rgba(245,158,11,.25);background:rgba(245,158,11,.08)}
    .dead{color:var(--bad);border-color:rgba(239,68,68,.25);background:rgba(239,68,68,.08)}

    table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:10px}
    th{text-align:left;font-size:12px;color:var(--muted);font-weight:800;padding:0 8px}
    td{padding:10px 8px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
    td:first-child{border-top-left-radius:14px;border-bottom-left-radius:14px}
    td:last-child{border-top-right-radius:14px;border-bottom-right-radius:14px}
    .tag{display:inline-block;padding:3px 8px;border-radius:999px;font-size:12px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
    .tba{color:rgba(255,255,255,.7)}
    .right{text-align:right}
    .small{font-size:12px;color:var(--muted)}
    .mono{font-variant-numeric: tabular-nums;}
    .toggle{
      display:flex;gap:10px;align-items:center;
      padding:10px 12px;border-radius:12px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.03);
    }
    input[type="checkbox"]{width:18px;height:18px;}