/* Sobrecarga - The game's pickers (target, chamber) and its touches on the shell's windows. */
/* ---------- Overlays ---------- */
.overlay{
  position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:18px;
  background:rgba(6,6,9,.82);backdrop-filter:blur(3px);
}
.overlay.hidden{display:none}
.panel{
  width:min(calc(580px * var(--s)),100%);border:1px solid var(--line);border-radius:18px;
  background:linear-gradient(180deg,#16161c,#0f0f13);
  box-shadow:0 30px 80px rgba(0,0,0,.7),0 0 0 1px rgba(255,34,51,.07);
  padding:26px 24px;max-height:90dvh;overflow:auto;
}
.panel h1{font-family:var(--font-display);font-size:clamp(30px,6vw,52px);margin:0 0 4px;letter-spacing:.05em;text-transform:uppercase}
.panel h2{font-family:var(--font-mono);font-size:calc(12px * var(--s));letter-spacing:.2em;color:var(--red-soft);margin:22px 0 8px;text-transform:uppercase}
.panel p{color:var(--muted);font-size:calc(13.5px * var(--s));line-height:1.6;margin:0 0 6px}
.rules{font-size:calc(12.5px * var(--s));color:#9a9aa4;line-height:1.65}
.rules b{color:#dcdce2}
.rules ul{margin:6px 0 0;padding-left:18px}
.rules li{margin-bottom:5px}
/* target picker */
#targetOverlay .panel{width:min(calc(430px * var(--s)),100%);text-align:center}
.targets{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.target-btn{
  display:flex;align-items:center;gap:12px;background:#191920;border:1px solid var(--line);
  border-radius:10px;padding:12px 14px;cursor:pointer;transition:.15s;text-align:left;
}
.target-btn:hover{border-color:var(--red);background:#201417}
.target-btn .tname{font-family:var(--font-mono);font-size:calc(13px * var(--s));letter-spacing:.1em}
.target-btn .tcount{margin-left:auto;font-family:var(--font-mono);font-size:calc(11px * var(--s));color:var(--red-soft)}
.hintline.hidden{display:none}
.hintline{font-family:var(--font-mono);font-size:calc(10.5px * var(--s));color:#6f6f79;letter-spacing:.06em;margin-top:14px}
/* roulette chamber picker */
#chamberOverlay .panel{width:min(calc(520px * var(--s)),100%);text-align:center}
.chambers{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}
.chamber-slot{display:flex;flex-direction:column;align-items:center;gap:5px}
.chamber-slot .idx{font-family:var(--font-mono);font-size:calc(10px * var(--s));color:var(--muted)}
.chambers button.card{--cw:clamp(46px,7vw,60px)}
.chambers button.card:hover .chip,.chambers button.card:focus-visible .chip{
  animation:pulse .5s infinite;
}

/* ---------- The shell's windows, dressed for Sobrecarga ---------- */
.cp-setup-hero h1{font-family:var(--font-display);font-size:clamp(30px,6vw,52px);margin:0;letter-spacing:.05em;text-transform:uppercase}
.cp-setup-hero p{color:var(--muted);font-size:calc(13.5px * var(--s));line-height:1.6;margin:0}
.cp-sheet h2{letter-spacing:.06em;text-transform:uppercase}
.cp-code,.cp-room-code{font-family:var(--font-mono)}
.cp-btn,.cp-chip,.cp-mode,.cp-bar-status,.cp-score-head,.cp-journal-title,.cp-group-label{font-family:var(--font-mono)}
.cp-btn.cp-primary{border-color:var(--red-dim)}
.cp-btn:hover:not(:disabled),.cp-chip:hover:not(:disabled){border-color:var(--red);box-shadow:0 0 0 1px var(--red-dim),0 0 16px rgba(255,34,51,.25);filter:none}
.cp-chip.on{border-color:var(--red);box-shadow:0 0 0 1px var(--red-dim),0 0 20px rgba(255,34,51,.18)}
.cp-journal-list{font-family:var(--font-mono);color:#b7b7c0}
.cp-journal-list li::before{content:"> ";color:#4a4a54}
.cp-j-boom,.cp-j-bad{color:#fff;background:linear-gradient(90deg,rgba(255,34,51,.3),transparent);font-weight:700}
.cp-j-turn{color:var(--red-soft)}
.cp-j-sys{font-style:italic}
.cp-score-list li.me .cp-score-bar i{background:linear-gradient(90deg,#1c8f8f,var(--cyan))}
.cp-score-bar i{background:linear-gradient(90deg,var(--red-dim),var(--red))}