:root {
  --bg: #f4f6f8;
  --bg-soft: #eef2f6;
  --panel: rgba(255, 255, 255, 0.9);
  --panel-strong: #ffffff;
  --ink: #111827;
  --muted: #475467;
  --line: rgba(15, 23, 42, 0.1);
  --brand-blue: #0f4c81;
  --brand-blue-strong: #0b365d;
  --brand-red: #d94841;
  --brand-orange: #f97316;
  --brand-black: #111827;
  --brand-white: #ffffff;
  --danger: #be123c;
  --warning: #c2410c;
  --shadow: 0 24px 48px rgba(15, 23, 42, 0.08);
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(15, 76, 129, 0.16), transparent 28rem),
    radial-gradient(circle at top right, rgba(217, 72, 65, 0.14), transparent 22rem),
    radial-gradient(circle at bottom right, rgba(249, 115, 22, 0.14), transparent 26rem),
    linear-gradient(180deg, #f9fafb 0%, var(--bg) 100%);
}

.glass-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}

.sidebar-surface {
  background:
    linear-gradient(180deg, rgba(17, 24, 39, 0.98) 0%, rgba(15, 76, 129, 0.97) 56%, rgba(217, 72, 65, 0.95) 100%);
}

.table-shell table tr:last-child td {
  border-bottom: 0;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 9999px;
  padding: 0.15rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 700;
}

.badge-ok {
  background: rgba(15, 76, 129, 0.12);
  color: var(--brand-blue);
}

.badge-warn {
  background: rgba(249, 115, 22, 0.14);
  color: var(--warning);
}

.badge-danger {
  background: rgba(217, 72, 65, 0.12);
  color: var(--brand-red);
}

.badge-neutral {
  background: rgba(71, 84, 103, 0.12);
  color: var(--muted);
}

.soft-grid {
  background-image:
    linear-gradient(to right, rgba(15, 23, 42, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
  background-size: 32px 32px;
}

.panel-link[aria-current="page"] {
  background: rgba(255, 255, 255, 0.15);
  color: white;
}

.brand-logo-shell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.brand-logo-shell img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.brand-logo-shell.light {
  background: #ffffff;
  border-color: rgba(15, 23, 42, 0.08);
}

.brand-logo-shell.light img {
  width: 46px;
  height: 46px;
}

.brand-ring {
  border: 1px solid rgba(15, 76, 129, 0.18);
  box-shadow: 0 8px 20px rgba(15, 76, 129, 0.08);
}

.content-wide {
  width: 100%;
  min-width: 0;
}

.table-responsive {
  overflow-x: auto;
}