body{
  font-family:var(--font-body);
  background:var(--bg-deep);
  color:var(--text-primary);
  overflow-x:hidden;
  min-width:960px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.app{
  min-height:100vh;
  position:relative;
  display:flex;
  flex-direction:column;
}
.stadium-bg{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 90% 55% at 50% -10%,var(--accent-glow),transparent 62%),
    radial-gradient(ellipse 50% 40% at 85% 80%,rgba(255,255,255,.03),transparent 55%),
    linear-gradient(180deg,var(--bg-deep) 0%,var(--bg-panel) 100%);
}
.stadium-bg .light{
  position:absolute;border-radius:50%;opacity:.14;
  background:radial-gradient(circle,var(--accent) 0%,transparent 70%);
  animation:lightPulse 7s ease-in-out infinite;
  filter:blur(2px);
}
.light-1{width:440px;height:440px;top:-120px;left:8%;animation-delay:0s}
.light-2{width:320px;height:320px;top:18%;right:4%;animation-delay:2s}
.light-3{width:380px;height:380px;bottom:8%;left:38%;animation-delay:4s}
.screen-root{
  position:relative;z-index:1;
  flex:1;
  margin:0 auto;
  width:100%;
  max-width:var(--max-width);
  padding:var(--space-lg);
  padding-top:calc(var(--status-height) + var(--space-lg));
}
.screen-root.has-sidebar{
  margin-left:var(--sidebar-width);
  max-width:calc(var(--max-width) + var(--sidebar-width));
}
.status-bar{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--status-height);
  display:flex;align-items:center;gap:var(--space-md);
  padding:0 var(--space-lg);
  background:var(--glass);
  border-bottom:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.status-bar.hidden{display:none}
.status-item{
  display:flex;align-items:center;gap:var(--space-sm);
  font-size:.82rem;color:var(--text-secondary);
  letter-spacing:.01em;
}
.status-item strong{color:var(--text-primary);font-weight:700}
.status-team{
  display:flex;align-items:center;gap:var(--space-sm);
  margin-right:auto;
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.95rem;
}
.team-swatch{
  width:28px;height:28px;border-radius:8px;
  border:2px solid rgba(255,255,255,.18);
  box-shadow:0 4px 12px rgba(0,0,0,.25);
}
.sidebar{
  position:fixed;left:0;top:var(--status-height);bottom:0;z-index:90;
  width:var(--sidebar-width);
  background:var(--glass);
  border-right:1px solid var(--border);
  padding:var(--space-md) var(--space-sm);
  overflow-y:auto;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.sidebar.hidden{display:none}
.nav-btn{
  display:flex;align-items:center;gap:var(--space-sm);
  width:100%;padding:11px 14px;
  color:var(--text-secondary);
  transition:background var(--speed-fast) var(--ease),color var(--speed-fast) var(--ease),transform var(--speed-fast) var(--ease);
  text-align:left;
  border-radius:10px;
  font-weight:600;
  font-size:.9rem;
  margin-bottom:2px;
}
.nav-btn:hover{
  background:rgba(255,255,255,.04);
  color:var(--text-primary);
}
.nav-btn.active{
  background:linear-gradient(90deg,var(--accent-glow),transparent);
  color:var(--accent);
  box-shadow:inset 3px 0 0 var(--accent);
}
.screen{
  animation:fadeIn var(--speed-normal) var(--ease);
}
.screen-title{
  font-family:var(--font-display);
  font-size:clamp(1.8rem,3vw,2.35rem);
  font-weight:700;
  margin-bottom:var(--space-lg);
  letter-spacing:.04em;
  text-transform:uppercase;
}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md)}
.card{
  background:
    linear-gradient(165deg,rgba(255,255,255,.04),transparent 42%),
    var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:var(--space-lg);
  box-shadow:var(--shadow-sm);
}
.card h3{
  font-family:var(--font-display);
  font-size:1.05rem;
  margin-bottom:var(--space-sm);
  color:var(--accent);
  letter-spacing:.05em;
  text-transform:uppercase;
}
.panel{
  background:var(--bg-panel);
  border-radius:var(--radius-md);
  padding:var(--space-md);
  border:1px solid var(--border);
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);
  padding:11px 18px;
  border-radius:12px;
  font-family:var(--font-body);
  font-weight:700;font-size:.9rem;
  background:rgba(255,255,255,.04);
  color:var(--text-primary);
  border:1px solid var(--border);
  transition:transform var(--speed-fast) var(--ease),background var(--speed-fast),box-shadow var(--speed-fast),border-color var(--speed-fast);
  letter-spacing:.01em;
}
.btn:hover{
  transform:translateY(-1px);
  box-shadow:var(--shadow-sm);
  border-color:rgba(255,255,255,.2);
  background:rgba(255,255,255,.07);
}
.btn-primary{
  background:linear-gradient(180deg,var(--accent) 0%,var(--accent-dim) 100%);
  color:var(--on-accent);
  border-color:transparent;
  box-shadow:0 8px 22px var(--accent-glow);
}
.btn-primary:hover{
  background:linear-gradient(180deg,#55e4d0 0%,var(--accent) 100%);
  box-shadow:0 12px 28px var(--accent-glow);
}
.btn-danger{background:var(--danger);color:#fff;border-color:transparent}
.btn-sm{padding:7px 12px;font-size:.8rem;border-radius:9px}
.btn-group{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.tabs{display:flex;gap:var(--space-xs);margin-bottom:var(--space-md);flex-wrap:wrap}
.tab{
  padding:var(--space-sm) var(--space-md);
  border-radius:999px;
  color:var(--text-secondary);
  border:1px solid transparent;
  font-weight:600;
  font-size:.85rem;
}
.tab.active{
  background:var(--accent-glow);
  color:var(--accent);
  border-color:rgba(61,214,192,.28);
}
.stat-row{display:flex;justify-content:space-between;padding:var(--space-xs) 0;border-bottom:1px solid var(--border)}
.stat-row:last-child{border:none}
.badge{
  display:inline-block;padding:3px 9px;border-radius:999px;
  font-size:.72rem;font-weight:700;background:var(--bg-elevated);
  letter-spacing:.04em;
}
.badge-success{background:rgba(92,219,122,.2);color:var(--success)}
.badge-warning{background:rgba(255,200,87,.2);color:var(--warning)}
.text-muted{color:var(--text-muted)}
.text-accent{color:var(--accent)}
.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}
.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}
.flex-between{display:flex;justify-content:space-between;align-items:center}
.flex-gap{display:flex;gap:var(--space-md);align-items:center;flex-wrap:wrap}
.hidden{display:none!important}
.tutorial-overlay{
  position:fixed;inset:0;z-index:250;background:rgba(10,14,20,.85);
  display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:var(--space-2xl);
}
.tutorial-overlay.hidden{display:none}
.modal-root,.toast-root{position:fixed;z-index:200;pointer-events:none}
.modal-root>*{pointer-events:auto}
.toast-root{top:var(--status-height);right:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-sm)}