:root{
  --neon-blue:#3b82f6; --neon-cyan:#22d3ee; --neon-purple:#a855f7; --neon-pink:#ec4899;
}
*{ scrollbar-width:thin; scrollbar-color:#1b2647 #0b1120; }
*::-webkit-scrollbar{ width:8px; height:8px; }
*::-webkit-scrollbar-track{ background:#0b1120; }
*::-webkit-scrollbar-thumb{ background:#1b2647; border-radius:8px; }
*::-webkit-scrollbar-thumb:hover{ background:#2a3a66; }

body{ background:radial-gradient(1200px 800px at 80% -10%, rgba(168,85,247,.08), transparent 60%),
                  radial-gradient(1000px 700px at -10% 10%, rgba(59,130,246,.10), transparent 55%), #070b1a; }

/* Glassmorphism */
.glass{ background:rgba(19,28,51,.55); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
        border:1px solid rgba(148,163,184,.10); }
.glass-strong{ background:rgba(15,22,41,.85); backdrop-filter:blur(20px); border:1px solid rgba(148,163,184,.12); }

.card{ border-radius:18px; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card:hover{ transform:translateY(-3px); border-color:rgba(59,130,246,.35);
             box-shadow:0 12px 40px rgba(8,12,28,.6), 0 0 0 1px rgba(59,130,246,.12); }

.neon-text{ background:linear-gradient(90deg,#22d3ee,#3b82f6,#a855f7);
            -webkit-background-clip:text; background-clip:text; color:transparent; }
.neon-border{ position:relative; }
.neon-glow{ box-shadow:0 0 0 1px rgba(59,130,246,.4), 0 0 24px rgba(59,130,246,.25); }

.gradient-blue{ background:linear-gradient(135deg,#3b82f6,#22d3ee); }
.gradient-purple{ background:linear-gradient(135deg,#a855f7,#6366f1); }
.gradient-pink{ background:linear-gradient(135deg,#ec4899,#f43f5e); }
.gradient-green{ background:linear-gradient(135deg,#10b981,#22d3ee); }

.btn{ transition:all .2s ease; border-radius:12px; }
.btn-primary{ background:linear-gradient(135deg,#3b82f6,#6366f1); color:#fff; }
.btn-primary:hover{ box-shadow:0 6px 24px rgba(59,130,246,.45); transform:translateY(-1px); }
.btn-ghost{ background:rgba(148,163,184,.08); }
.btn-ghost:hover{ background:rgba(148,163,184,.16); }

.nav-item{ border-radius:12px; transition:all .18s ease; }
.nav-item:hover{ background:rgba(59,130,246,.10); color:#e2e8f0; }
.nav-item.active{ background:linear-gradient(135deg,rgba(59,130,246,.22),rgba(168,85,247,.18));
                  color:#fff; box-shadow:inset 3px 0 0 #3b82f6; }

@keyframes fadeIn{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;} }
.animate-fade{ animation:fadeIn .4s ease both; }
@keyframes pulseGlow{ 0%,100%{ opacity:.6 } 50%{ opacity:1 } }
.live-dot{ width:8px;height:8px;border-radius:50%;background:#10b981; animation:pulseGlow 1.6s infinite; box-shadow:0 0 10px #10b981; }

.spinner{ width:38px;height:38px;border:3px solid rgba(148,163,184,.2); border-top-color:#3b82f6;
          border-radius:50%; animation:spin 1s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

table.data-table{ width:100%; border-collapse:collapse; }
.data-table th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em;
                color:#64748b; padding:10px 12px; border-bottom:1px solid rgba(148,163,184,.10); white-space:nowrap; }
.data-table td{ padding:11px 12px; font-size:13px; border-bottom:1px solid rgba(148,163,184,.06); white-space:nowrap; }
.data-table tr:hover td{ background:rgba(59,130,246,.05); }

.badge{ font-size:11px; padding:2px 9px; border-radius:999px; font-weight:600; }
.badge-active{ background:rgba(16,185,129,.15); color:#34d399; }
.badge-paused{ background:rgba(245,158,11,.15); color:#fbbf24; }
.badge-completed{ background:rgba(99,102,241,.15); color:#818cf8; }
.badge-pending{ background:rgba(245,158,11,.15); color:#fbbf24; }
.badge-draft{ background:rgba(148,163,184,.15); color:#94a3b8; }

.metric-chip{ cursor:pointer; user-select:none; transition:all .15s ease; }
.metric-chip.on{ background:linear-gradient(135deg,rgba(59,130,246,.25),rgba(168,85,247,.2)); border-color:rgba(59,130,246,.5); color:#fff; }

/* ===== Report Builder grid ===== */
.builder-grid td{ padding:6px 8px; }
.builder-grid th{ position:sticky; top:0; background:rgba(13,20,40,.96); z-index:2; }
.builder-grid tbody tr:hover td{ background:rgba(59,130,246,.06); }

.grid-input{
  width:100%; background:rgba(11,17,32,.6); border:1px solid rgba(148,163,184,.14);
  border-radius:6px; padding:6px 8px; font-size:13px; color:#e2e8f0;
  transition:border-color .12s ease, background .12s ease, box-shadow .12s ease;
}
.grid-input.num{ text-align:right; -moz-appearance:textfield; }
.grid-input.num::-webkit-outer-spin-button,
.grid-input.num::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.grid-input.dim{ min-width:120px; font-weight:500; color:#fff; }
.grid-input:hover{ border-color:rgba(59,130,246,.4); background:rgba(11,17,32,.85); }
.grid-input:focus{
  outline:none; border-color:#3b82f6; background:#0b1120;
  box-shadow:0 0 0 2px rgba(59,130,246,.25);
}
.grid-input::placeholder{ color:#475569; }

.calc-cell{ background:rgba(16,185,129,.07); }
.builder-grid tr.bld-rowsel td{ background:rgba(168,85,247,.12) !important; }
.builder-grid th.bld-sort:hover{ color:#cbd5e1; }
.builder-grid tfoot td{ background:rgba(168,85,247,.06); padding:10px 8px; font-size:13px; }
