/* Swinger Party — pantalla del MANDO en el móvil (?mando=CÓDIGO). Todo cuelga de .pad-mode o #pad: sin ?mando= (móvil normal, ordenador, tele) no cambia nada.
 * Solo controles: botones enormes, texto grande y vertical. Sin tablero ni registro. */
.pad-mode h1, .pad-mode #setup, .pad-mode #game, .pad-mode #editor, .pad-mode #lobby, .pad-mode #fxOverlay, .pad-mode #modal, .pad-mode #creditsNote, .pad-mode .audio-gate { display: none !important; }
.pad-mode body { padding: 10px 12px 28px; }
.pad { max-width: 520px; margin: 0 auto; font-size: 1.05rem; }
.pad-status { text-align: center; padding: 22px 10px; font-size: 1.3rem; color: #fff; background: #1e1b4b; border-radius: 14px; margin-bottom: 12px; }
.pad-turn { font-size: 1.9rem; font-weight: 900; text-align: center; color: #fff; margin: 4px 0 10px; }
.pad-diceline { display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.pad-dice { width: 84px; height: 84px; background: #fff; color: #000; border-radius: 16px; font-size: 3rem; font-weight: 900; display: flex; align-items: center; justify-content: center; }
.pad-who { margin-left: 14px; font-size: 1rem; color: #e9d5ff; max-width: 40%; }
.pad button { display: block; width: 100%; min-height: 56px; margin: 8px 0; font-size: 1.25rem; font-weight: 800; color: #fff; background: #312e81; border: 3px solid #c4b5fd; border-radius: 14px; padding: 10px 14px; }
.pad button:disabled { opacity: 0.55; }
.pad .pad-roll { min-height: 128px; font-size: 2.2rem; background: #5b21b6; border-color: #fff; }
.pad .pad-danger { background: #7f1d1d; border-color: #fecaca; }
.pad .pad-pass { background: #7f1d1d; border-color: #fecaca; }
.pad .pad-sec { background: #1e1b4b; }
.pad-players { margin: 8px 0; }
.pad-player { display: flex; justify-content: space-between; padding: 10px 12px; margin: 4px 0; border-radius: 12px; background: #1e1b4b; color: #fff; font-size: 1.1rem; }
.pad-player.on { background: #5b21b6; border: 2px solid #facc15; }
.pad-ctrl button { display: inline-block; width: calc(50% - 8px); margin: 4px; }
.pad-ctrl .pad-danger { width: calc(100% - 8px); }
.pad-where { margin-top: 14px; padding: 10px; border-radius: 14px; background: #0b0816; border: 2px solid #4c1d95; color: #fff; }
.pad-where span { font-weight: 800; display: block; margin-bottom: 4px; }
.pad-where button { display: inline-block; width: calc(50% - 8px); margin: 4px; }
.pad-where button.on { background: #166534; border-color: #bbf7d0; }
.pad-note { font-size: 1rem; color: #fde68a; margin-top: 6px; }
.pad-decision { position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; z-index: 300; background: #14101a; padding: 22px 16px; overflow-y: auto; text-align: center; }
.pad-decision h2 { font-size: 2rem; color: #fff; margin: 10px 0; }
.pad-dectext { font-size: 1.35rem; color: #fff; margin: 12px 0 18px; line-height: 1.35; }
.pad-decision button { min-height: 72px; font-size: 1.5rem; }

/* ---- Configurar la partida desde el móvil (anfitrión): 3 pasos, barra de progreso arriba y barra fija abajo. La lista de jugadores NO crece con el número de jugadores: filas de 56 px y se desplaza por dentro. ---- */
.pad-mode #padSetup { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 120; background: #14101a; display: flex; flex-direction: column; color: #fff; }
.pad-mode #padSetup.hidden { display: none; }
.pad-mode .ps-top { flex: none; padding: 10px 14px 6px; }
.pad-mode .ps-progress { display: flex; gap: 6px; }
.pad-mode .ps-progress i { flex: 1; height: 6px; border-radius: 3px; background: #3b2d63; }
.pad-mode .ps-progress i.on { background: #c084fc; }
.pad-mode .ps-title { font-size: 1.15rem; font-weight: 800; margin-top: 8px; }
.pad-mode .ps-body { flex: 1; min-height: 0; overflow-y: auto; padding: 6px 14px 12px; -webkit-overflow-scrolling: touch; }
.pad-mode .ps-bar { flex: none; display: flex; gap: 10px; padding: 10px 14px calc(40px + env(safe-area-inset-bottom, 0px)); background: #0b0816; border-top: 2px solid #4c1d95; }
.pad-mode .ps-bar button, .pad-mode .ps-actions button, .pad-mode .ps-sheet button, .pad-mode #padTake { display: block; min-height: 48px; margin: 0; font-size: 1.05rem; font-weight: 800; color: #fff; background: #5b21b6; border: 2px solid #c4b5fd; border-radius: 12px; padding: 8px 12px; }
.pad-mode .ps-bar button { flex: 1; }
.pad-mode .ps-bar button:disabled { opacity: 0.45; }
.pad-mode .ps-bar .ps-sec { background: #1e1b4b; }
.pad-mode .ps-actions { display: flex; gap: 8px; margin: 6px 0 10px; }
.pad-mode .ps-actions button { flex: 1; font-size: 0.95rem; }
.pad-mode .ps-list { overflow-y: auto; max-height: calc(100vh - 290px); min-height: 112px; border-radius: 12px; }
.pad-mode .ps-row { display: flex; align-items: center; box-sizing: border-box; margin: 0 0 6px; padding: 0 6px 0 12px; border-radius: 12px; background: #1e1b4b; overflow: hidden; }
.pad-mode .ps-e { font-size: 1.7rem; width: 40px; flex: none; }
.pad-mode .ps-t { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.pad-mode .ps-t b { font-size: 1.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pad-mode .ps-t small { font-size: 0.85rem; color: #d8b4fe; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pad-mode .ps-row .ps-edit { width: 48px; min-height: 48px; padding: 0; flex: none; background: transparent; border: none; font-size: 1.3rem; }
.pad-mode .ps-count { font-size: 0.9rem; color: #c4b5fd; margin: 8px 2px; }
.pad-mode .ps-msg { color: #fde68a; margin: 8px 2px; }
.pad-mode .ps-h { font-weight: 800; color: #e9d5ff; margin: 14px 0 6px; }
.pad-mode .ps-boards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pad-mode .ps-board { min-height: 72px; text-align: left; font-size: 1rem; color: #fff; background: #1e1b4b; border: 2px solid #4c1d95; border-radius: 12px; padding: 8px 10px; }
.pad-mode .ps-board.on { border-color: #facc15; background: #5b21b6; }
.pad-mode .ps-board small { display: block; font-weight: 400; font-size: 0.78rem; color: #ddd6fe; margin-top: 2px; }
.pad-mode .ps-code { display: flex; gap: 8px; margin-top: 10px; }
.pad-mode .ps-code input { flex: 1; min-width: 0; }
.pad-mode .ps-toggle, .pad-mode .ps-field { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 6px 12px; margin: 6px 0; border-radius: 12px; background: #1e1b4b; }
.pad-mode .ps-field { flex-direction: column; align-items: stretch; }
.pad-mode .ps-toggle input[type=checkbox] { width: 28px; height: 28px; flex: none; }
.pad-mode .ps-sum { line-height: 1.5; margin: 4px 2px; }
.pad-mode .ps-issues p { color: #fecaca; margin: 6px 2px; }
.pad-mode .ps-ok { color: #bbf7d0; margin: 12px 2px; font-weight: 800; }
.pad-mode .ps select, .pad-mode .ps input:not([type=checkbox]):not([type=range]), .pad-mode .ps-sheet select, .pad-mode .ps-sheet input, .pad-mode .ps-sheet textarea { min-height: 46px; font-size: 1.05rem; width: 100%; box-sizing: border-box; }
.pad-mode .ps-sheet { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 140; background: rgba(8,6,18,0.7); display: flex; align-items: flex-end; }
.pad-mode .ps-sheet.hidden { display: none; }
.pad-mode .ps-sheet-in { width: 100%; max-height: 88vh; overflow-y: auto; background: #1b1530; border-radius: 18px 18px 0 0; padding: 14px 14px calc(14px + env(safe-area-inset-bottom, 0px)); box-sizing: border-box; }
.pad-mode .ps-sheet-in label { display: block; margin: 8px 0; font-weight: 700; }
.pad-mode .ps-lab { font-weight: 700; margin: 8px 0 4px; }
.pad-mode .ps-emojis { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.pad-mode .ps-emojis .ps-emoji { min-height: 44px; padding: 0; font-size: 1.5rem; background: #1e1b4b; border-width: 2px; border-color: #4c1d95; }
.pad-mode .ps-emojis .ps-emoji.on { border-color: #facc15; background: #5b21b6; }
.pad-mode .ps-sheet-btns { display: flex; gap: 10px; margin-top: 14px; }
.pad-mode .ps-sheet-btns button { flex: 1; }
.pad-mode .ps-sheet-btns .ps-danger { background: #7f1d1d; border-color: #fecaca; }
.pad-mode #padTake { width: 100%; margin: 8px 0; min-height: 56px; }
.pad-mode .ps-row.dup { border: 2px solid #f87171; }
.pad-mode .ps-issue { margin: 8px 0; }
.pad-mode .ps-issue .ps-link { width: 100%; min-height: 48px; background: #7f1d1d; border-color: #fecaca; }
.pad-mode .brand-bar { display: none !important; }
.pad-mode .ps-titlerow { display: flex; align-items: center; margin-top: 6px; }
.pad-mode .ps-mascot { display: block; height: 44px; width: auto; margin-right: 10px; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5)); }
.pad-mode .ps-titlerow .ps-title { margin-top: 0; }