:root {
  --neon: #ffb84d;
  --pink: #ff5c5c;
  --bg0: #120805;
  --bg1: #2a1408;
  --card: rgba(28, 14, 8, 0.94);
  --line: rgba(255, 184, 77, 0.35);
}
* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh; font-family: system-ui, sans-serif; color: #ffe8d0;
  background: radial-gradient(ellipse at top, #402010 0%, var(--bg1) 40%, var(--bg0) 100%);
}
header {
  display: flex; justify-content: space-between; align-items: center; padding: 14px 20px;
  background: rgba(0,0,0,.55); border-bottom: 1px solid var(--line); gap: 12px; flex-wrap: wrap;
}
.brand {
  color: var(--neon); font-family: Orbitron, sans-serif; font-weight: 700; text-decoration: none;
  text-shadow: 0 0 10px rgba(255,184,77,.45);
}
nav { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
a.btn, button.btn {
  display: inline-block; padding: 8px 14px; background: transparent; color: #ffe8d0; border: 1px solid #654;
  border-radius: 8px; text-decoration: none; font-weight: 600; cursor: pointer; font-size: .95rem;
}
a.btn.primary, button.btn.primary {
  background: linear-gradient(90deg, var(--neon), #ff7a4d); color: #1a0a00; border: none;
}
main { max-width: 860px; margin: 0 auto; padding: 28px 16px 48px; }
h1, h2 { font-family: Orbitron, sans-serif; color: var(--neon); margin: 0 0 8px; }
.card {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 18px; margin-top: 16px;
}
.stats { display: flex; gap: 24px; flex-wrap: wrap; }
.stat strong { display: block; font-size: 1.4rem; color: var(--pink); }
.guest-badge {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
  background: rgba(255,92,92,.2); border: 1px solid var(--pink); font-size: .75rem; color: var(--pink);
}
.hint { opacity: .82; font-size: .92rem; line-height: 1.45; }
.controls code, .room-row code { background: #1a0c06; padding: 2px 6px; border-radius: 4px; }
.row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
input, select {
  background: #1a0c06; border: 1px solid #654; color: #ffe8d0; border-radius: 8px; padding: 8px 12px; min-width: 140px;
}
.room-list { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.room-row {
  display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; border: 1px solid rgba(255,184,77,.2); border-radius: 8px; background: rgba(0,0,0,.25);
}
.muted { opacity: .75; font-size: .9rem; }
table.hs { width: 100%; border-collapse: collapse; }
table.hs th, table.hs td { text-align: left; padding: 8px 6px; border-bottom: 1px solid rgba(255,184,77,.15); }
table.hs th { color: var(--neon); font-size: .85rem; }
