:root{
  --brand-blue: #3A66FF;   
  --brand-green:#61C676;   
  --text:       #E9EDF5;
  --muted:      #A7AFC2;
  --bg:         #0B0D11;
  --card-bg:    #121721;
  --border:     #232937;
  --error:      #FF6B6B;
  --success:    #2AD38B;
  --focus-ring: rgba(58,102,255,.35);
  --shadow:     0 14px 44px rgba(0,0,0,.55);
  --radius:     14px;
}

html,body{height:100%}

/* ---------- Busy / Spinner (reusable) ---------- */

/* Full-screen busy overlay you can toggle from JS */
.busy-overlay{
  position:fixed; inset:0;
  display:none; align-items:center; justify-content:center;
  background:rgba(5,7,11,.45); backdrop-filter: blur(2px);
  z-index:2147483647;
}
.busy-overlay.show{ display:flex; }

/* Spinner */
.spinner{
  width:30px; height:30px; border-radius:50%;
  border:3px solid rgba(255,255,255,.22);
  border-top-color:var(--brand-blue);
  animation:spin .8s linear infinite;
}
.spinner.small{ width:20px; height:20px; }

@keyframes spin{ to{ transform:rotate(360deg) } }