:root{
  --bg:#07131f;--panel:#0e2132;--panel2:#10283b;--line:#28465d;
  --text:#edf5fa;--muted:#9fb3c3;--accent:#f2d36b;--ok:#8de0a5;--danger:#ff9c9c;
}
*{box-sizing:border-box}
body{
  margin:0;min-height:100vh;color:var(--text);
  background:radial-gradient(circle at 50% -10%,#17374f 0,#081725 45%,#050d15 100%);
  font-family:system-ui,-apple-system,"Pretendard","Noto Sans KR",sans-serif;
}
button,input,select{font:inherit}
button{cursor:pointer}
button:disabled{opacity:.45;cursor:not-allowed}
.shell{width:min(980px,100%);margin:0 auto;padding:22px 14px 60px}
.hero{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}
h1{font-size:28px;margin:2px 0 4px}
h2{margin:0 0 10px;font-size:20px}
h3{margin:12px 0 8px}
.eyebrow{font-size:11px;letter-spacing:.18em;color:#86a9bf;font-weight:800;margin:0}
.sub,.muted{color:var(--muted);font-size:13px}
.card{
  background:rgba(14,33,50,.97);border:1px solid var(--line);
  border-radius:18px;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.24)
}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.adminLayout{grid-template-columns:minmax(280px,.8fr) minmax(360px,1.2fr)}
@media(max-width:760px){.two,.adminLayout{grid-template-columns:1fr}.hero{align-items:center}}
.hidden{display:none!important}
.center{min-height:220px;display:grid;place-items:center;text-align:center}
.centerText{text-align:center}
.spinner{width:34px;height:34px;border:4px solid #28465d;border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
label{display:grid;gap:7px;margin:12px 0;color:#cbd9e2;font-size:13px}
input,select{
  width:100%;border:1px solid #36566f;background:#091a28;color:white;
  border-radius:11px;padding:12px 13px;outline:none;
}
input:focus,select:focus{border-color:#7297b0;box-shadow:0 0 0 3px rgba(114,151,176,.12)}
button{border-radius:11px;padding:11px 13px;border:1px solid transparent}
.primary{background:var(--accent);color:#161a1e;font-weight:900}
.secondary{background:#112a3d;color:white;border-color:#3c5f78}
.ghost{background:transparent;color:#bdd0dd;border-color:#35536a}
.full{width:100%;margin-top:10px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;gap:12px;align-items:center}
.sectionHead{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.badge{padding:6px 10px;border:1px solid #395c74;border-radius:999px;background:#0a1b28;color:#dbeaf3;font-size:12px}
.adminBadge{border-color:#8c782b;color:#ffeda7;background:#292410}
.countGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0}
@media(max-width:520px){.countGrid{grid-template-columns:repeat(2,1fr)}}
.countItem{background:#0a1b28;border:1px solid #2a485f;border-radius:12px;padding:9px}
.countItem label{display:flex;justify-content:space-between;align-items:center;margin:0;font-weight:800}
.countItem input{width:68px;padding:8px;text-align:center}
.totals{padding:10px 0}
.warning{min-height:20px;color:#ffbd7d;font-size:13px}
.error{min-height:18px;color:var(--danger);white-space:pre-wrap;font-size:13px}
.roomCodeBox{
  margin:12px 0;padding:16px;border-radius:15px;border:1px dashed #55768c;
  background:#091a28;display:grid;gap:5px;text-align:center
}
.roomCodeBox strong{font-size:31px;letter-spacing:.18em;color:#fff0a2}
.roomCodeBox.compact strong{font-size:25px}
.qr{width:230px;height:230px;background:white;border-radius:14px;padding:10px;margin:14px auto;display:grid;place-items:center}
.qr img,.qr canvas{max-width:100%;max-height:100%}
.playerList{display:grid;gap:8px;margin-top:10px}
.playerRow{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;border-radius:11px;background:#091a28;border:1px solid #29485e}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}
.chip{padding:7px 9px;border-radius:999px;background:#102b3f;border:1px solid #36566f;font-size:12px}
.notice,.successBox{margin-top:14px;padding:12px;border:1px solid #31536a;background:#0b2131;border-radius:12px;font-size:13px;line-height:1.55}
.successBox{border-color:#37694a;background:#0d2a1b}
.successBox p{margin:5px 0 0;color:#b9d7c3}
.divider{height:1px;background:#27445a;margin:16px 0}
.miniCounts{display:flex;flex-wrap:wrap;gap:7px}
.miniCount{padding:6px 9px;border:1px solid #36566f;border-radius:8px;background:#091a28;font-size:12px}
.dangerText{color:#ffc1c1;border-color:#704747}
.toast{
  position:fixed;left:50%;bottom:24px;transform:translateX(-50%);
  background:#101d27;color:white;border:1px solid #42647a;border-radius:12px;
  padding:11px 15px;box-shadow:0 12px 36px rgba(0,0,0,.35);z-index:50
}