* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #f3f3ff;
  background: #0f1023;
}
.bg {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at 20% 20%, #2b8cff66, transparent 35%),
              radial-gradient(circle at 80% 30%, #6e7bff66, transparent 36%),
              radial-gradient(circle at 50% 80%, #00d6d655, transparent 30%),
              #0f1023;
  z-index: -1;
}
.app { max-width: 1060px; margin: 0 auto; padding: 28px 18px 40px; }
header h1 { margin: 0 0 6px; font-size: 30px; }
header p { margin: 0 0 18px; color: #cfd1ff; }
.card, .panel {
  background: #1b1d3ac9;
  border: 1px solid #ffffff1f;
  border-radius: 14px;
  padding: 16px;
}
.card { margin-bottom: 18px; backdrop-filter: blur(8px); }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 820px) { .grid2 { grid-template-columns: 1fr; } }
label { display: block; font-size: 14px; color: #d6d9ff; margin-bottom: 9px; }
input, select, button {
  width: 100%;
  border-radius: 10px;
  border: 1px solid #ffffff22;
  padding: 10px 12px;
  margin-top: 6px;
  background: #12142cc9;
  color: #fff;
}
button {
  border: none;
  background: linear-gradient(90deg, #2b8cff, #16b3a7);
  cursor: pointer;
  font-weight: 700;
}
button:hover { filter: brightness(1.06); }
button.ghost {
  background: #2a2d53;
  width: auto;
  padding: 8px 12px;
}
small { color: #b6bcff; }
.msg { min-height: 22px; color: #ffd780; }
.hidden { display: none !important; }
.room-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.actions { display: flex; gap: 8px; }
.status {
  border-radius: 10px;
  padding: 12px;
  margin: 12px 0;
  font-weight: 700;
  background: #ffffff1a;
}
.score-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-bottom: 12px; }
.score-card {
  border-radius: 12px;
  padding: 12px;
  background: #11142f;
  border: 1px solid #ffffff20;
}
.score-card .name { font-size: 18px; font-weight: 700; }
.score-card .meta { color: #b8bdff; margin-top: 5px; }
.score-card .flame { color: #8dd3ff; }
.score-card .badges { color: #ffd780; }
.score-card .task { color: #95ffc8; }
.inline { display: flex; gap: 8px; }
.inline input { flex: 1; }
.inline button { width: auto; white-space: nowrap; }
.choices label { margin: 6px 0; padding: 8px; border-radius: 10px; background: #0f1230; display: flex; gap: 8px; align-items: center; }
.choices input { margin: 0; width: auto; }
.scroll { max-height: 280px; overflow: auto; padding-right: 6px; }
.item {
  border: 1px solid #ffffff1a;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 8px;
  background: #141737;
}
.item .time { color: #9fa6ff; font-size: 12px; margin-top: 5px; }