:root {
  --bg: #0f1117;
  --bg-soft: #181c24;
  --panel: rgba(255,255,255,0.05);
  --panel-strong: #171b23;
  --border: rgba(255,255,255,0.08);
  --text: #f4f6fb;
  --muted: #aab2c5;
  --red: #e11d48;
  --red-dark: #9f1239;
  --green: #2ecc71;
  --yellow: #f5a524;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  background: radial-gradient(circle at top right, rgba(225,29,72,0.18), transparent 35%), var(--bg);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  font-size: 15px;
}
a { text-decoration: none; color: inherit; }
.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}.mb-1{margin-bottom:.25rem}.mb-3{margin-bottom:1rem}.mb-4{margin-bottom:1.5rem}.me-2{margin-right:.5rem}
.d-block{display:block}
.app-shell { display: grid; grid-template-columns: 310px 1fr; gap: 16px; padding: 14px; }
.sidebar, .glass-panel, .product-panel, .service-tab-card { background: linear-gradient(180deg, rgba(24,28,36,0.96), rgba(18,21,28,0.96)); border: 1px solid var(--border); border-radius: 20px; box-shadow: 0 10px 28px rgba(0,0,0,0.2); }
.sidebar { display:flex; flex-direction:column; justify-content:space-between; padding:18px; }
.sticky-sidebar { position: sticky; top: 14px; height: calc(100vh - 28px); overflow: auto; }
.main-content { padding: 4px 4px 0 0; display:flex; }
.main-content-inner { display:flex; flex-direction:column; min-height:calc(100vh - 28px); width:100%; }
.brand-mark { min-height: auto; padding: 4px 0 10px; }
.brand-logo { width:250px; max-width:100%; height:auto; display:block; filter: drop-shadow(0 10px 28px rgba(255,255,255,0.08)); }
.brand-title { font-size: 1.15rem; font-weight: 800; }
.brand-subtitle { color: var(--muted); font-size: 0.92rem; line-height:1.65; }
.sidebar-nav .nav-link { display:flex; align-items:center; gap:12px; color:var(--text); padding:14px 16px; border-radius:16px; font-weight:600; }
.sidebar-nav .nav-link:hover, .sidebar-nav .nav-link.active { background: linear-gradient(135deg, rgba(225,29,72,0.95), rgba(159,18,57,0.95)); box-shadow: 0 10px 30px rgba(225,29,72,0.25); }
.sidebar-profile-mini { border-top:1px solid rgba(255,255,255,0.08); padding-top:18px; }
.sidebar-balance { color: var(--muted); font-size: 0.92rem; }
.sidebar-balance strong { color: var(--text); margin-left: 6px; }
.account-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,0.04); color:var(--text); border:1px solid var(--border); border-radius:14px; padding:12px 14px; font-weight:700; }
.content-head { padding: 6px 2px 0; }
.eyebrow { color:#ff8fa8; text-transform:uppercase; letter-spacing:0.12em; font-size:0.75rem; font-weight:700; }
.page-title, h2, h3 { font-weight:800; }
.page-title { font-size:1.65rem; margin:.35rem 0 0; }
h2 { font-size:1.4rem; margin:0; }
h3 { margin:0; }
.product-panel { padding:22px; border-radius:18px; }
.service-tab-card { padding:28px; border-radius:26px; background:rgba(255,255,255,0.03); }
.glass-panel.p-4 { padding:22px !important; }
.metric-label { color: var(--muted); font-size: 0.84rem; }
.empty-state { padding:26px; border-radius:18px; border:1px dashed rgba(255,255,255,0.14); color:var(--muted); background:rgba(255,255,255,0.02); }
.status-pill { display:inline-flex; align-items:center; justify-content:center; padding:8px 14px; border-radius:999px; font-size:0.84rem; font-weight:700; border:1px solid transparent; }
.status-pill.ok { background: rgba(46,204,113,0.16); color:#7ef2ab; border-color: rgba(46,204,113,0.28); }
.status-pill.warn { background: rgba(245,165,36,0.15); color:#ffd37d; border-color: rgba(245,165,36,0.28); }
.status-pill.muted { background: rgba(255,255,255,0.06); color:#d5d9e4; border-color: rgba(255,255,255,0.08); }
.btn { border-radius:12px; font-weight:700; padding:10px 14px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; border:1px solid transparent; cursor:pointer; }
.btn-danger { background: linear-gradient(135deg, var(--red), var(--red-dark)); color:#fff; }
.btn-danger:hover { background: linear-gradient(135deg, #f32757, #aa143c); }
.btn-outline-light { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); color:#fff; }
.form-control, .form-select, textarea.form-control { width:100%; background:rgba(255,255,255,0.04); border:1px solid var(--border); color:var(--text); border-radius:14px; padding:10px 12px; min-height:44px; }
.form-control:focus, .form-select:focus, textarea.form-control:focus { outline:none; box-shadow: 0 0 0 0.2rem rgba(225,29,72,0.18); border-color: rgba(225,29,72,0.45); }
::placeholder { color: rgba(255,255,255,0.72) !important; opacity: 1; }
.form-select option { background:#171b23; color:#f4f6fb; }
.server-table-shell { display:grid; gap:16px; }
.server-table-head--clean, .server-row-main-clean { grid-template-columns: minmax(0,1.2fr) 170px minmax(0,1fr) 150px 170px; }
.server-table-head { display:grid; gap:18px; padding:0 18px; color:var(--muted); font-size:.84rem; text-transform:uppercase; font-weight:700; }
.server-row-card { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; align-items:center; padding:16px 18px; border-radius:24px; background:rgba(255,255,255,.04); border:1px solid var(--border); }
.server-row-main { display:grid; gap:18px; align-items:center; }
.server-col-label { display:none; color:var(--muted); font-size:.78rem; margin-bottom:6px; }
.server-main-cell { display:flex; align-items:center; gap:12px; }
.server-icon-badge { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:rgba(225,29,72,.12); border:1px solid rgba(225,29,72,.24); color:#ffd1dc; font-size:1.15rem; }
.server-name, .server-title { font-weight:700; line-height:1.3; }
.server-type-chip, .support-id-chip { display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 14px; border-radius:999px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); }
.support-id-chip.large { min-height:46px; padding:0 16px; }
.service-overview-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(320px,.9fr); gap:24px; align-items:start; }
.service-detail-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:14px; }
.action-stack { display:grid; gap:12px; }
.overview-info-list { display:grid; gap:14px; }
.overview-info-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,0.08); }
.overview-info-row:last-child { border-bottom:0; padding-bottom:0; }
.overview-info-row span:first-child, .server-sub { color:var(--muted); }
.stack-row-card { display:flex; justify-content:space-between; gap:16px; align-items:center; padding:18px 20px; border-radius:20px; background:rgba(255,255,255,0.04); border:1px solid var(--border); }
.auth-shell { position:relative; min-height:100vh; display:grid; place-items:center; padding:16px; }
.auth-overlay { position:absolute; inset:0; background: radial-gradient(circle at top, rgba(225,29,72,0.22), transparent 40%); }
.site-footer { margin-top:auto; padding:14px 4px 2px; display:flex; align-items:center; gap:12px; color:var(--muted); font-size:.92rem; }
.support-discord-box { padding:20px; border-radius:18px; background:rgba(255,255,255,.035); border:1px solid var(--border); }
.support-discord-badge { display:inline-flex; align-items:center; min-height:40px; padding:0 14px; border-radius:999px; background:rgba(88,101,242,.16); border:1px solid rgba(88,101,242,.28); color:#d9ddff; font-weight:700; }
.subtle-alert { background: rgba(255,255,255,0.05) !important; color: var(--text) !important; border: 1px solid rgba(255,255,255,0.08) !important; border-radius: 16px; padding:14px 16px; }
.product-panel--compact { max-width:980px; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
@media (max-width: 1100px) {
  .app-shell { grid-template-columns:1fr; }
  .sticky-sidebar { position:static; height:auto; }
  .main-content { padding-right:0; }
  .main-content-inner { min-height:auto; }
  .service-overview-grid { grid-template-columns:1fr; }
  .server-table-head { display:none; }
  .server-row-main-clean { grid-template-columns:1fr; }
  .server-col-label { display:block; }
}
@media (max-width: 768px) {
  .stack-row-card, .section-head, .overview-info-row { flex-direction:column; align-items:flex-start; }
}

.status-pill.danger { background: rgba(225,29,72,0.16); color:#ff9ab2; border-color: rgba(225,29,72,0.28); }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:16px; }
.stats-card { background: linear-gradient(180deg, rgba(24,28,36,0.96), rgba(18,21,28,0.96)); border: 1px solid var(--border); border-radius: 20px; padding: 20px; box-shadow: 0 10px 28px rgba(0,0,0,0.18); }
.stats-value { font-size: 2rem; font-weight: 800; margin-top: 8px; }
.inline-edit-grid { display:grid; gap:14px; }
.inline-edit-field { display:grid; gap:8px; }
.inline-edit-field span { color: var(--muted); font-size: .84rem; font-weight: 600; }
.inline-edit-form .form-control, .inline-edit-form .form-select { min-height: 48px; }
