.panel-page { padding: 2rem 0 5rem; }
.panel-top {
  display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; flex-wrap: wrap;
  margin-bottom: 1.4rem;
}
.panel-top h1 { margin: 0; font-family: var(--display); font-size: clamp(1.6rem, 3vw, 2.2rem); }
.panel-grid {
  display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 1rem; margin-bottom: 1rem;
}
.stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; }
.stat-box {
  background: linear-gradient(180deg, rgba(28,19,16,.95), rgba(14,10,8,.95));
  border: 1px solid var(--line); border-radius: 16px; padding: 1rem 1.05rem;
}
.stat-box .tag { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.stat-box .val { margin-top: 0.45rem; font-size: 1.25rem; font-weight: 800; }
.stat-box .val.orange { color: var(--orange-2); }
.stat-box .val.green { color: #86efac; }
.hwid-box code {
  display: block; margin: 0.75rem 0; padding: 0.85rem; border-radius: 12px;
  background: #0b0807; border: 1px solid var(--line); color: var(--info); font-size: 0.82rem; word-break: break-all;
}
.usage-list { display: grid; gap: 0.65rem; }
.usage-row {
  display: grid; grid-template-columns: 1fr auto; gap: 0.6rem; align-items: center;
  padding: 0.7rem 0.8rem; border-radius: 12px; border: 1px solid rgba(255,255,255,.05); background: rgba(255,255,255,.02);
}
.usage-bar {
  height: 6px; border-radius: 999px; background: rgba(255,255,255,.06); overflow: hidden; margin-top: 0.35rem;
}
.usage-bar > i { display: block; height: 100%; background: linear-gradient(90deg, var(--ember), var(--orange-2)); border-radius: inherit; }
.admin-tool-card {
  border: 1px solid rgba(168,85,247,.35); background:
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.18), transparent 45%),
    linear-gradient(180deg, #1a1220, #120c14);
}
.admin-tool-card h3 { margin: 0.3rem 0 0.45rem; }
.server-admin-list { display: grid; gap: 0.55rem; margin-top: 0.8rem; }
.server-admin-row {
  display: flex; justify-content: space-between; align-items: center; gap: 0.7rem;
  padding: 0.7rem 0.8rem; border-radius: 12px; border: 1px solid var(--line); background: rgba(0,0,0,.2);
}
.toggle {
  appearance: none; width: 46px; height: 26px; border-radius: 999px; border: 0; cursor: pointer;
  background: #3f2a24; position: relative; transition: .2s;
}
.toggle::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%;
  background: #d6d3d1; transition: .2s;
}
.toggle.on { background: rgba(34,197,94,.35); }
.toggle.on::after { left: 23px; background: #86efac; }
.server-modal {
  position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 1rem;
}
.server-modal[hidden] { display: none !important; }
.server-modal-backdrop {
  position: absolute; inset: 0; background: rgba(4, 2, 6, .72); backdrop-filter: blur(6px);
}
.server-modal-panel {
  position: relative; z-index: 1; width: min(480px, 100%); max-height: min(86vh, 720px);
  overflow: auto; padding: 1.15rem 1.2rem 1.25rem; border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.server-modal-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem; margin-bottom: .85rem;
}
@media (max-width: 900px) {
  .panel-grid, .stat-grid { grid-template-columns: 1fr; }
}