/* ===== ROOT VARIABLES ===== */
:root {
  --neon:           #C855FF;
  --neon-dim:       #9A3FC4;
  --neon-glow:      rgba(200,85,255,0.25);
  --bg-deep:        #0A0010;
  --bg-dark:        #0D0018;
  --bg-card:        #180030;
  --bg-card-h:      #200040;
  --bg-input:       #120024;
  --border:         rgba(200,85,255,0.14);
  --border-hi:      rgba(200,85,255,0.40);
  --text:           #F0E6FF;
  --text-muted:     #9070B0;
  --text-dim:       #5A3870;
  --rental:         #C855FF;
  --rental-bg:      rgba(200,85,255,0.12);
  --tourn:          #FF6B35;
  --tourn-bg:       rgba(255,107,53,0.12);
  --manual:         #4ECDC4;
  --manual-bg:      rgba(78,205,196,0.12);
  --green:          #39FF85;
  --red:            #FF4D6A;
  --gold:           #FFD700;
  --sidebar-w:      228px;
  --topbar-h:       68px;
  --hour-px:        80px;   /* px per hour in timeline */
  --row-h:          104px;  /* pitch row height */
  --label-w:        128px;  /* pitch label column width */
  --day-start:      7;      /* 7 am */
  --day-end:        23;     /* 11 pm */
}

/* ===== SVG ICON SYSTEM ===== */
.icon { display:inline-block; width:1em; height:1em; vertical-align:-0.125em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.icon-sm  { width:14px; height:14px; }
.icon-md  { width:18px; height:18px; }
.icon-lg  { width:24px; height:24px; }
.icon-xl  { width:36px; height:36px; }
.icon-2xl { width:48px; height:48px; }
.icon-spin { animation:icon-spin 1.2s linear infinite; }
@keyframes icon-spin { to { transform:rotate(360deg); } }

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family:'Outfit', sans-serif;
  background: var(--bg-deep);
  color: var(--text);
  height: 100vh;
  display: flex;
  overflow: hidden;
}