:root{
  --app-bg-1:#0b1020;
  --app-bg-2:#0d1733;
  --app-bg-3:#0a0f1f;
  --app-panel:rgba(12,18,34,.78);
  --app-panel-2:rgba(15,24,45,.90);
  --app-ink:#eaf0ff;
  --app-muted:rgba(234,240,255,.70);
  --app-muted-2:rgba(234,240,255,.55);
  --app-accent:#6aa8ff;
  --app-accent-2:#4fd1c5;
  --app-good:#2fe67c;
  --app-warn:#ffcc66;
  --app-bad:#ff5a5a;
  --app-border:rgba(234,240,255,.12);
  --app-shadow:0 16px 40px rgba(4,9,25,.45);
  --app-radius:16px;
  --app-font-sans:"Roboto","Inter","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --app-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  --app-body-bg:
    radial-gradient(1000px 700px at 15% -10%, rgba(106,168,255,.18), transparent 60%),
    radial-gradient(900px 650px at 90% 0%, rgba(79,209,197,.12), transparent 55%),
    radial-gradient(800px 600px at 50% 110%, rgba(47,230,124,.10), transparent 60%),
    linear-gradient(180deg,var(--app-bg-1),var(--app-bg-3));
  --app-focus-ring:0 0 0 3px rgba(106,168,255,.45);
  --app-space-1:8px;
  --app-space-2:12px;
  --app-space-3:16px;
  --app-space-4:24px;
  --app-space-5:32px;
}

body{
  color:var(--app-ink);
  background:var(--app-body-bg);
  font-family:var(--app-font-sans);
}

body.theme-light{
  --app-bg-1:#f7f8fb;
  --app-bg-2:#f1f3f8;
  --app-bg-3:#eef1f6;
  --app-panel:#ffffff;
  --app-panel-2:#f8fafc;
  --app-ink:#0b1220;
  --app-muted:rgba(11,18,32,.65);
  --app-muted-2:rgba(11,18,32,.55);
  --app-accent:#2563eb;
  --app-accent-2:#0ea5e9;
  --app-good:#16a34a;
  --app-warn:#d97706;
  --app-bad:#dc2626;
  --app-border:rgba(15,23,42,.12);
  --app-shadow:0 6px 18px rgba(15,23,42,.08);
  --app-body-bg:linear-gradient(180deg,var(--app-bg-1),var(--app-bg-3));
}

body.theme-light .card,
body.theme-light .cardX{
  background:var(--app-panel);
  border-color:rgba(15,23,42,.12);
}

body.theme-light .muted,
body.theme-light .muted2{
  color:rgba(11,18,32,.65);
}

body.theme-light *{
  text-shadow:none;
}

body.theme-light a{
  color:#1d4ed8;
}

body.theme-light button,
body.theme-light .btn,
body.theme-light .btn-primary,
body.theme-light .btn-secondary,
body.theme-light .btn-success,
body.theme-light .btn-warning,
body.theme-light .btn-info,
body.theme-light .btn-danger,
body.theme-light .btn-outline-light{
  background:linear-gradient(180deg, rgba(37,99,235,.12), rgba(37,99,235,.03));
  border-color:rgba(15,23,42,.18);
  color:rgba(11,18,32,.95);
  box-shadow:0 1px 2px rgba(15,23,42,.10);
}

body.theme-light .btn-success{background:linear-gradient(180deg, rgba(22,163,74,.12), rgba(22,163,74,.03))}
body.theme-light .btn-warning{background:linear-gradient(180deg, rgba(217,119,6,.12), rgba(217,119,6,.03))}
body.theme-light .btn-info{background:linear-gradient(180deg, rgba(14,165,233,.12), rgba(14,165,233,.03))}
body.theme-light .btn-danger{background:linear-gradient(180deg, rgba(220,38,38,.12), rgba(220,38,38,.03))}

body.theme-light .tag,
body.theme-light .pill{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.16);
  color:rgba(11,18,32,.85);
}

body.theme-light table th{
  color:rgba(11,18,32,.80);
}
body.theme-light table td{
  color:rgba(11,18,32,.92);
}

a{color:var(--app-accent)}
a:hover{color:var(--app-accent);filter:brightness(1.08)}

.card,
.cardX{
  background:var(--app-panel);
  border:1px solid var(--app-border);
  border-radius:var(--app-radius);
  box-shadow:var(--app-shadow);
}

.muted{color:var(--app-muted)}
.muted2{color:var(--app-muted-2)}
.mono{font-family:var(--app-font-mono)}

input,select,textarea,button{
  border-radius:12px;
  border:1px solid var(--app-border);
}

:focus-visible{
  outline:2px solid var(--app-accent);
  outline-offset:2px;
  box-shadow:var(--app-focus-ring);
}

.table-wrap{
  max-width:100%;
  overflow:auto;
  border:1px solid var(--app-border);
  border-radius:12px;
}

.btn-soft{
  background:linear-gradient(180deg, rgba(106,168,255,.22), rgba(106,168,255,.08));
  border:1px solid var(--app-border);
  color:var(--app-ink);
}
body.theme-light .btn-soft{
  background:linear-gradient(180deg, rgba(37,99,235,.14), rgba(37,99,235,.04));
  border-color:rgba(15,23,42,.14);
  color:var(--app-ink);
}

.mt-0{margin-top:0}
.mt-6{margin-top:6px}
.mt-8{margin-top:8px}
.mt-10{margin-top:10px}
.mt-12{margin-top:12px}
.mt-14{margin-top:14px}
.mt-16{margin-top:16px}
.mt-22{margin-top:22px}
.mb-0{margin-bottom:0}
.mb-8{margin-bottom:8px}
.mb-6{margin-bottom:6px}
.my-8{margin:8px 0}
.ml-8{margin-left:8px}
.gap-8{gap:8px}
.gap-10{gap:10px}
.gap-12{gap:12px}
.space{justify-content:space-between}
.flex-1{flex:1}
.align-start{align-items:flex-start}
.align-center{align-items:center}
.text-right{text-align:right}
.text-center{text-align:center}
.minw-90{min-width:90px}
.minw-160{min-width:160px}
.minw-360{min-width:360px}
.maxw-180{max-width:180px}
.w-160{width:160px}
.pre-wrap{white-space:pre-wrap}
.h3-sm{margin:0 0 10px 0;font-size:14px}
.h3-sm-tight{margin:14px 0 8px 0;font-size:14px}
.pre-muted{color:var(--app-muted)}

@media (max-width: 520px){
  .minw-360{min-width:0;width:100%}
  .minw-160{min-width:0;width:100%}
  .minw-90{min-width:0;width:100%}
  .w-160{width:100%}
  .maxw-180{max-width:100%;width:100%}
}
.bar > i{width:var(--bar-w,0%)}

.has-fixed-nav{
  padding-top:64px;
}

.alert{
  background:var(--app-panel-2);
  border:1px solid var(--app-border);
  color:var(--app-ink);
  box-shadow:var(--app-shadow);
}

.alert-danger{
  border-color:rgba(255,90,90,.45);
  color:#ffd5d5;
}
body.theme-light .alert-danger{
  color:#7f1d1d;
  border-color:rgba(220,38,38,.35);
}
body.theme-light .alert-success{
  color:#14532d;
  border-color:rgba(22,163,74,.35);
}
body.theme-light .alert-warning{
  color:#7c2d12;
  border-color:rgba(217,119,6,.35);
}
body.theme-light .alert-info{
  color:#0b3866;
  border-color:rgba(37,99,235,.35);
}
body.theme-light .card,
body.theme-light .cardX{
  box-shadow:var(--app-shadow);
}

.badge,
.badge.bg-secondary,
.badge.bg-info,
.badge.bg-warning,
.badge.bg-success{
  background:rgba(255,255,255,.08) !important;
  border:1px solid var(--app-border);
  color:var(--app-ink);
  font-weight:600;
}
body.theme-light .badge,
body.theme-light .badge.bg-secondary,
body.theme-light .badge.bg-info,
body.theme-light .badge.bg-warning,
body.theme-light .badge.bg-success{
  background:rgba(15,23,42,.06) !important;
}
.mb-10{margin-bottom:10px}
