#app { min-height:100vh; }
.loading-screen { min-height:100vh; display:grid; place-content:center; justify-items:center; gap:24px; background:#050914; }
.loader { width:24px; height:24px; border:2px solid rgba(55,221,255,.2); border-top-color:#37ddff; border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.nav-item { border:0; }
.nav-item.logout { margin-top:8px; }
.inline-form { display:grid; gap:12px; }
.grid-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.action-row,.card-actions,.button-row,.modal-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.action-row button,.card-actions button,.table-row button,.link-button { display:inline-flex; align-items:center; gap:5px; border:1px solid rgba(132,168,245,.2); border-radius:8px; background:rgba(8,19,49,.65); color:#c8d9ff; padding:7px 9px; font-size:10px; }
.action-row .primary,.card-actions .primary { color:#071126; }
.table-row { display:grid; grid-template-columns:1.2fr 1fr .75fr .8fr 1fr; gap:9px; align-items:center; padding:11px 4px; border-bottom:1px solid rgba(155,184,255,.1); font-size:10px; overflow-wrap:anywhere; }
.table-row:last-child { border-bottom:0; }
.table-row span { min-width:0; }
.table-row small { display:block; color:#8497bd; margin-top:4px; }
.table-head { color:#88a2d7; text-transform:uppercase; font-size:8px; letter-spacing:.08em; }
.responsive-table { overflow-x:auto; }
.role-chip,.count-pill { white-space:nowrap; }
.error-banner,.success-banner { padding:10px 12px; border-radius:10px; font-size:11px; }
.error-banner { color:#ff9ca9; border:1px solid rgba(255,88,108,.3); background:rgba(255,88,108,.08); }
.success-banner { color:#8ef3bd; border:1px solid rgba(57,233,138,.25); background:rgba(57,233,138,.08); }
.server-banner { display:flex; justify-content:space-between; align-items:center; }
.status-line { display:inline-flex; gap:5px; align-items:center; text-transform:uppercase; font-size:9px; }
.status-line i { width:6px; height:6px; background:#39e98a; border-radius:50%; }
.status-line.danger i { background:#ff586c; }
.status-line.muted i { background:#8896b3; }
pre,code { max-width:100%; overflow-wrap:anywhere; }
.auth-switch { margin-top:9px; }
.auth-forgot { justify-content:center; width:100%; padding:8px; }
.active-alert { margin-bottom:14px; padding:10px 12px; border-radius:10px; color:#ffe38a; font-size:10px; background:rgba(255,154,46,.12); border:1px solid rgba(255,154,46,.25); }
.active-alert span { text-transform:uppercase; font-weight:900; margin-right:8px; }
@media (min-width:760px) { .app-content { padding-top:28px; } .metric-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:540px) { .grid-two { grid-template-columns:1fr; } .table-row { min-width:620px; } .hero-strip h2 { font-size:18px; } }