body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #020617;
  color: #e5e7eb;
}
header {
  background: linear-gradient(90deg, #4b2c82, #0f766e);
  padding: 1rem 1.5rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.6);
}
h1 { margin: 0; font-size: 1.6rem; }
.app { max-width: 1100px; margin: 0 auto; padding: 1rem; }
#connectSection {
  background: #0b1120;
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.6);
}
.row { margin-bottom: 0.5rem; }
.row label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.9rem; }
input[type="text"], input[type="number"], select {
  background: #020617; border: 1px solid #374151; border-radius: 0.5rem;
  padding: 0.35rem 0.6rem; color: #e5e7eb;
}
button {
  background: #111827; color: #e5e7eb; border-radius: 999px; border: 1px solid #374151;
  padding: 0.35rem 0.9rem; margin-right: 0.5rem; margin-top: 0.35rem; cursor: pointer;
}
button:hover { background: #1f2937; }
nav { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.hidden { display: none; }
.tab {
  background: #020617; border-radius: 0.75rem; padding: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.6);
}
.stat-block {
  margin-top: 1rem; padding: 0.75rem; border-radius: 0.75rem;
  background: #020617; border: 1px solid #1f2937;
}
.nexus-display { margin-bottom: 0.5rem; font-size: 1.1rem; }
.stress-bar {
  height: 10px; border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #eab308, #ef4444);
}
.player-list { list-style: none; padding-left: 0; }
.player-list li { padding: 0.25rem 0; border-bottom: 1px solid #1f2937; }
#diceResults {
  margin-top: 0.5rem; max-height: 150px; overflow-y: auto;
  background: #020617; padding: 0.5rem; border-radius: 0.5rem; font-size: 0.9rem;
}
.skills-hint { font-size: 0.85rem; color: #9ca3af; }
#skillsContainer {
  display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem;
}
#skillsContainer button { min-width: 160px; text-align: left; }
#skillResult { margin-top: 0.5rem; font-size: 0.9rem; }
#mapDisplay {
  margin-bottom: 0.5rem; min-height: 120px; background:#020617;
  border-radius: 0.75rem; border: 1px solid #1f2937;
  display: flex; align-items: center; justify-content: center;
}