/* Dos columnas completas: la cabecera pertenece al tablero y el chat empieza arriba. */
body:has(.game-page:not([hidden])) .game-page{height:100dvh;padding:0 12px 8px}
body:has(.game-page:not([hidden])):has(.demo-ribbon) .game-page{height:calc(100dvh - 33px)}
.game-shell{gap:0}.game-table-column{display:grid;grid-template-rows:64px minmax(0,1fr);min-width:0;min-height:0}
.game-table-column>.topbar{width:100%;padding:0 16px;min-width:0;gap:12px}
.game-table-column .topbar-right{gap:10px;min-width:0}.game-table-column #account-label{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.game-layout>.game-social{border-top-left-radius:0;border-top-right-radius:0}
/* La botonera se superpone a la franja anterior a las cartas, sin redistribuir el tablero. */
.game-board>.game-actions{position:absolute;left:0;right:0;bottom:calc(29% + 54px);z-index:6;display:grid;grid-template-columns:repeat(var(--action-columns),minmax(0,1fr));gap:5px;padding:6px;background:#091d18eb;box-shadow:0 3px 12px #0005}
.game-board>.game-actions .btn{min-width:0;min-height:44px;margin:0;padding:9px 6px;white-space:normal;font-size:.85rem;line-height:1.2}
.game-board>.game-actions .btn:nth-child(5){grid-column:1/-1}
/* Señas solo gráficas como partida.js, por encima de las cartas y dentro del tapete. */
.game-board>.game-signals{position:absolute;left:10px;right:10px;bottom:8px;height:28px;z-index:7;pointer-events:none;display:block}
.game-board>.game-signals .btn{position:absolute;bottom:0;pointer-events:auto;width:28px;height:28px;min-height:0;padding:2px;border:0;background:transparent;border-radius:50%}
.game-board>.game-signals .btn[data-slot="0"]{left:0}.game-board>.game-signals .btn[data-slot="1"]{right:0}.game-board>.game-signals .btn[data-slot="2"]{right:56px}
.game-board>.game-signals img{width:24px;height:24px}
/* Reloj circular: usa el plazo existente del servidor, con aviso visual al agotarse. */
.game-turn-clock{--remaining:1;--clock-ink:#edc580;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;width:50px;height:50px;flex:0 0 50px;border-radius:50%;background:conic-gradient(var(--clock-ink) calc(var(--remaining)*1turn),#ffffff16 0);box-shadow:0 2px 10px #0004;color:var(--clock-ink);font-variant-numeric:tabular-nums}
.game-turn-clock:before{content:"";position:absolute;inset:3px;border-radius:50%;background:#10241f;z-index:-1}
.game-turn-clock strong{font-size:1.12rem;line-height:1.1}.game-turn-clock small{font-size:.55rem;line-height:1.2;letter-spacing:.08em}.game-turn-clock.is-urgent{--clock-ink:#ff9e86}
@media(max-width:900px){body:has(.game-page:not([hidden])) .game-page{padding:0 6px 6px}.game-table-column{grid-template-rows:64px minmax(0,1fr)}body:has(.game-page:not([hidden])) .game-table-column>.topbar{padding:0 8px;gap:5px}.game-table-column .topbar-right{gap:6px}.game-table-column #account-label{max-width:70px;font-size:.75rem}.game-turn-clock{width:44px;height:44px;flex-basis:44px}.game-board>.game-actions{bottom:calc(27% + 48px)}.game-board>.game-actions .btn{font-size:.7rem}}
/* La cabecera alcanza el borde de la ventana sin ensanchar el tapete ni el chat. */
body:has(.salon-page:not([hidden])) .topbar{padding-left:8px}
body:has(.game-page:not([hidden])) .game-table-column>.topbar{--header-offset:max(12px,calc((100vw - 1420px)/2));margin-left:calc(-1 * var(--header-offset));width:calc(100% + var(--header-offset));padding-left:8px}
@media(max-width:900px){body:has(.game-page:not([hidden])) .game-table-column>.topbar{--header-offset:max(6px,calc((100vw - 760px)/2))}}

/* Acciones al pie del tapete, con espacio reservado para la pausa. */
.game-board>.game-actions{bottom:0;padding:6px 58px 6px 6px;background:#0b211ded;box-shadow:0 -2px 12px #0004}
.game-board>.game-actions .btn{background:#12382f;border:1px solid #b79a60;color:#fff;box-shadow:inset 0 1px 0 #ffffff08}
.game-board>.game-actions .btn:hover{background:#1b493c;transform:none}
.game-board>.game-pause-button{position:absolute;right:7px;bottom:7px;z-index:9;width:42px;height:42px;min-height:42px;padding:0;background:#12382f;border:1px solid #b79a60;color:#fff;font-size:1.5rem}
.game-board>.game-pause-button:hover{background:#1b493c;transform:none}
.game-board>.game-signals{right:64px}.game-board>.game-signals .btn[data-slot="1"]{right:0}.game-board>.game-signals .btn[data-slot="2"]{right:36px}
.game-board:has(>.game-actions)>.game-signals{bottom:116px}
/* Preparación: jugadores visibles y acciones claras sobre el verde de la partida. */
#game-preparation{padding:28px;background:linear-gradient(145deg,#193c32,#0d241f);border:1px solid #b79a6080;border-radius:20px;box-shadow:0 24px 90px #0009}
#game-preparation h2{font-size:1.85rem;letter-spacing:-.03em;margin:10px 0 22px}
.preparation-roster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0 22px}
.preparation-player{display:flex;flex-direction:column;align-items:center;gap:9px;min-width:0;padding:18px 8px;background:#09221d80;border:1px solid #c6ad692e;border-radius:12px;text-align:center}
.preparation-player .avatar{width:64px;height:64px;flex:none;border:2px solid #b79a60;font-size:1.1rem}
.preparation-player strong{font-size:.85rem;overflow-wrap:anywhere;color:#f4f3e9}
.preparation-player small{color:var(--gold);font-size:.7rem}
#game-preparation .game-clock{display:inline-block;margin:0 0 12px;padding:7px 12px;border:1px solid #c6ad6950;border-radius:20px;color:var(--gold);font-variant-numeric:tabular-nums;font-size:.85rem}
#game-preparation .dialog-actions{gap:10px;padding-top:18px;border-top:1px solid #c6ad692e;margin-top:20px}
#game-preparation .dialog-actions .btn{flex:1}
@media(max-width:520px){#game-preparation{padding:20px}#game-preparation h2{font-size:1.5rem}.preparation-roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.preparation-player{padding:12px 8px}.preparation-player .avatar{width:52px;height:52px}}

/* Selector de subida nativo: seis columnas de botones circulares. */
.game-action-dialog{width:min(520px,calc(100% - 24px));max-height:90dvh;overflow:auto;padding:20px;background:#102b24;border:1px solid #b79a60}
.game-action-dialog .game-menu-heading{background:#102b24}.game-action-dialog h2{margin:0}
.raise-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:12px}
.raise-grid .btn{aspect-ratio:1;min-width:0;min-height:0;padding:0;border-radius:50%;background:#173c31;border:1px solid #b79a60;color:white;font-size:clamp(1rem,4vw,1.5rem)}
.raise-grid .btn:hover{background:#245440;transform:none}.raise-grid .raise-ordago{background:#802d40;border-color:#e7b276}.raise-grid .raise-ordago:hover{background:#99374c}

/* Turno con el mismo aro luminoso y tinta del reproductor de /player. */
.game-player.has-turn>.avatar{border-color:#fff4a8;box-shadow:0 0 0 5px #ffd83d,0 0 22px 10px #ffe269aa,0 3px 9px #001b1666;filter:drop-shadow(0 0 8px #ffe26988)}
.game-player.has-turn>strong{color:#fff09a;font-weight:800}
.game-toast{position:fixed;left:50%;top:74px;transform:translateX(-50%);z-index:1000;max-width:calc(100vw - 32px);padding:12px 22px;border:1px solid #b79a60;border-radius:12px;background:#12382f;color:#fff;box-shadow:0 8px 28px #0006;pointer-events:none;font-size:.9rem;text-align:center}

/* Jugador desconectado: giro horario y aspecto apagado; conserva su asiento y su nick legible. */
.game-player.player-disconnected>.avatar{transform:rotate(90deg);filter:grayscale(1);opacity:.5;border-color:#8b9891;box-shadow:0 0 0 2px #8b98914d}
.game-player.player-disconnected>strong{color:#95a39d;font-weight:500}

/* Parejas inequívocas antes de repartir, conservando los asientos opuestos. */
.preparation-teams{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0 22px}
.preparation-team{min-width:0;padding:12px;border:1px solid #b79a6050;border-radius:14px;background:#09221d60}
.preparation-team h3{margin:0 0 12px;color:var(--gold);font-size:1rem;text-align:center}
.preparation-team-members{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.preparation-team .preparation-player{padding:12px 5px;border:0;background:transparent}
@media(max-width:520px){.preparation-teams{grid-template-columns:1fr;gap:10px}.preparation-team{padding:10px}.preparation-team h3{margin-bottom:6px}}

/* Almacén y sacas por rival, separados de la conversación. */
#game-preparation.has-betting{width:min(1100px,calc(100% - 24px))}
.bet-tabs{display:flex;gap:8px;position:sticky;top:-28px;background:#123027;padding:8px 0 12px;z-index:3}.bet-tabs .btn{flex:1}.bet-tabs [aria-selected=true]{border-color:var(--gold);color:var(--gold)}
.bet-editor{grid-column:1/-1;display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,1.5fr);gap:16px}
.bet-stock,.bet-rival{min-width:0}.bet-stock h3,.bet-rival h3{font-size:1rem;margin:0 0 10px;color:var(--gold)}
.bet-stock>p,.bet-drop-hint{font-size:.8rem!important;line-height:1.5!important}
.bet-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px}
.bet-object{display:flex;flex-direction:column;gap:7px;background:#fff;color:#223c32;padding:12px;border-radius:10px;min-width:0;overflow-wrap:anywhere;font-size:.8rem;border:1px solid #dfd9c9}
.bet-object>img{width:64px;height:64px;object-fit:contain;align-self:center}.bet-object .btn{color:#244033;background:#f4f2e9;border-color:#9e8a5f;padding:7px;font-size:.75rem;min-height:36px;white-space:normal}
.bet-object .btn:hover{background:#ece5d3;transform:none}.bet-object[draggable=true]{cursor:grab}.bet-object>b{color:#755215}.bet-available{font-weight:650;color:#306247}
.bet-rivals,.bet-review{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.bet-rival{padding:12px;background:#0a211bc0;border:1px solid #ae995f77;border-radius:12px}.bet-rival.drag-over{outline:2px solid var(--gold);background:#234b39}
.bet-rival>.bet-object{margin-top:10px}.bet-rival-heading{display:flex;align-items:center;gap:8px;margin-bottom:10px}.bet-rival-heading h3{margin:0;overflow-wrap:anywhere}.bet-rival-heading .avatar{width:40px;height:40px;flex:none}.bet-object .bet-rival-heading .avatar{width:28px;height:28px}
.bet-sack-total{font-size:.85rem!important;color:var(--gold)!important;margin:8px 0}.bet-quantity{display:flex;align-items:center;justify-content:space-between;gap:6px}.bet-quantity .btn{width:36px}
.bet-rules{grid-column:1/-1;margin-bottom:12px}.bet-rules summary{cursor:pointer;color:var(--gold);padding:8px 0}.has-betting .dialog-actions{position:sticky;bottom:-28px;background:#102b24;padding:14px 0;z-index:2}
.has-betting .preparation-chat-log{max-height:52dvh;min-height:200px}.has-betting .preparation-chat{border:0;margin:0;padding:0}
@media(max-width:720px){.bet-editor{grid-template-columns:1fr}.bet-rivals{grid-row:1}.bet-review{grid-template-columns:1fr}.bet-rival{padding:8px}.bet-rival-heading{flex-wrap:wrap}.bet-rival-heading h3{font-size:.85rem}.bet-tabs{top:-20px}.has-betting .dialog-actions{bottom:-20px}}

/* Marco discreto del registro, sin cambiar su altura ni el interlineado. */
.game-board .game-log{border:2px solid #b99b5ab0;border-top-color:#d8bb7bc9;border-bottom-color:#87703ebf;border-radius:0;background:linear-gradient(155deg,#102e26d9,#0b231ed9);box-shadow:0 2px 8px #0003,inset 0 0 0 1px #eed39a18,inset 0 0 16px #00000018;scrollbar-color:#887747 #0c251f}
/* En la vista móvil, el tablero de mensajes queda sin marco ni sombras de borde. */
@media(max-width:900px){.game-board .game-log{border:0;box-shadow:none}}

/* Frases y señas comparten una fila y dejan libre el acceso permanente a pausa. */
.game-shortcuts{position:absolute;left:8px;right:60px;bottom:7px;z-index:8;display:flex;align-items:center;gap:10px;min-height:36px;pointer-events:none}
.game-shortcuts>.game-quick-phrases{position:relative;pointer-events:auto;background:#102b24;border:1px solid #b79a6070;border-radius:8px;padding:0 8px}
.game-shortcuts>.game-quick-phrases summary{white-space:nowrap}
.game-shortcuts .phrases{position:absolute;left:0;bottom:calc(100% + 8px);width:min(300px,calc(100vw - 40px));max-height:min(300px,45dvh);padding:8px;background:#102b24;border:1px solid #b79a60;border-radius:10px;box-shadow:0 6px 24px #0008}
.game-shortcuts>.game-signals{display:flex;gap:6px;pointer-events:auto;flex-wrap:nowrap}
.game-shortcuts>.game-signals .btn{width:28px;height:28px;min-height:28px;padding:2px;border:0;background:transparent}.game-shortcuts>.game-signals img{width:24px;height:24px}
.game-board>.game-actions{bottom:50px;padding-right:6px}

/* Tres vistas independientes; existencias compactas con icono reducido un 10 %. */
.bet-conditions,.bet-content{grid-column:1/-1;min-width:0}.bet-conditions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}
.bet-catalog{grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px}
.bet-stock-card{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 5px;border:1px solid #d7d1c4;border-radius:9px;background:#fff;color:#254032;cursor:grab;font-size:.78rem}
.bet-stock-card img{width:57.6px;height:57.6px;object-fit:contain}.bet-stock-card strong{color:#755215;font-size:.78rem}.bet-stock-card[aria-pressed=true]{outline:2px solid var(--gold);outline-offset:1px}
.bet-stock.drag-over{outline:2px dashed var(--gold);outline-offset:4px}.bet-object[draggable=true]{cursor:grab}.bet-quantity{flex-wrap:wrap}.bet-quantity .btn{width:auto;flex:1}
@media(max-width:520px){.bet-conditions{grid-template-columns:1fr}.bet-tabs{gap:5px}.bet-tabs .btn{padding:8px 6px;font-size:.8rem}}

/* El órdago muestra su nombre completo en la última fila del selector. */
.raise-grid .raise-ordago{grid-column:span 3;aspect-ratio:auto;border-radius:12px;font-size:clamp(.9rem,3.5vw,1.25rem);min-height:44px}

/* Apuestas compactas: cabeceras fijas en su propio espacio de desplazamiento. */
#game-preparation.bet-tab-active .preparation-main>.eyebrow,#game-preparation.bet-tab-active .preparation-main>h2,#game-preparation.bet-tab-active .preparation-main>p{display:none}
.bet-editor{display:block;max-height:55dvh;overflow:auto;scrollbar-width:thin;position:relative}
.bet-basket-heads{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:3px 0 8px;background:#133128}
.bet-basket-head{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 8px;border:1px solid #b79a6070;border-radius:10px;background:#09251f}.bet-basket-head.drag-over{outline:2px solid var(--gold)}
.bet-rival-avatar,.bet-basket-toggle{padding:0;border:0;background:none;display:flex;align-items:center;gap:5px;cursor:pointer}.bet-rival-avatar .avatar{width:36px;height:36px;flex:none}.bet-basket-toggle{color:var(--gold);min-height:36px}.bet-basket-toggle[aria-expanded=true]{color:#fff}
.bet-basket-value{display:flex;align-items:center;gap:4px;min-width:0;font-size:.78rem;color:#f4e0b5}.bet-basket-value strong{overflow-wrap:anywhere}.bet-basket-value svg{flex:none}
.bet-basket-lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.bet-basket-list{min-width:0}.bet-basket-list h3{font-size:.85rem;color:var(--gold);margin:8px 0}.bet-basket-list .bet-object{position:relative;margin-bottom:8px;padding-right:30px}.bet-delete{position:absolute;right:4px;top:4px;padding:3px;background:#fff;border:1px solid #a67171;border-radius:5px;color:#802d40;cursor:pointer}
.bet-editor .bet-catalog{grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:6px;margin-top:8px}.bet-editor .bet-stock-card{padding:5px 3px;gap:3px;font-size:.7rem}.bet-editor .bet-stock-card img{width:46px;height:46px}.bet-editor .bet-stock-card strong{font-size:.7rem}
@media(max-width:520px){.bet-basket-head{padding:5px;gap:5px;flex-wrap:wrap}.bet-basket-value{font-size:.72rem}.bet-basket-heads{gap:6px}}

/* Aviso compartido: aparece solo al recibir mensajes mientras se consulta el historial. */
.chat-follow-new{flex:none;align-self:center;padding:7px 12px;border:1px solid #b79a60;border-radius:16px;background:#214739;color:#fff;font-size:.75rem;cursor:pointer;margin:5px auto}

/* Color del chat compartido por configuración general y ajustes del salón. */
.chat-color-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0;font-size:.85rem}
.chat-color-setting input.chat-color-input{width:48px;height:32px;padding:3px;min-width:48px;border:1px solid #b79a6070;cursor:pointer;background:#102b24}

/* Almacén y cesta comparten tarjetas de medidas idénticas, también en la modal superior. */
.bet-item-grid{display:grid;grid-template-columns:repeat(auto-fill,124px);justify-content:center;gap:8px;margin-top:12px}
.bet-item-grid .bet-object{position:relative;box-sizing:border-box;width:124px;height:184px;padding:8px;gap:4px;font-size:.7rem;line-height:1.2;text-align:center}
.bet-item-grid .bet-object>img{width:46px;height:46px;flex:none}
.bet-item-grid .bet-object>strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:32px;flex:none;font-size:.78rem;line-height:16px;color:#183d30}
.bet-item-grid .bet-object>span,.bet-item-grid .bet-object>b{font-size:.7rem;line-height:16px}
.bet-stock-item{cursor:grab}.bet-stock-item[aria-pressed=true],.bet-stock-item:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.bet-basket-head{width:100%;cursor:pointer;color:var(--gold);font:inherit;text-align:left;transition:none}
.bet-basket-head:hover{background:#143c30;transform:none}.bet-basket-head:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.bet-detail-dialog{box-sizing:border-box;width:min(610px,calc(100vw - 24px));max-height:85dvh;padding:20px;border:1px solid #ba9c60;border-radius:16px;background:#102b24;color:#f3f2e8;box-shadow:0 24px 80px #0009;overflow:auto}
.bet-detail-dialog::backdrop{background:#020e0bd1;backdrop-filter:blur(3px)}
.bet-detail-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.bet-detail-identity{display:flex;align-items:center;gap:10px;min-width:0}.bet-detail-identity .avatar{width:42px;height:42px;flex:none}.bet-detail-identity h2{font-size:1.05rem;color:var(--gold);margin:0;overflow-wrap:anywhere}
.bet-detail-summary{display:flex;justify-content:space-between;gap:12px;margin:16px 0;padding:12px 0;border-top:1px solid #ba9c6040;border-bottom:1px solid #ba9c6040;font-size:.9rem}.bet-detail-summary strong{color:var(--gold)}
.bet-empty{grid-column:1/-1;color:#b7ccc1;text-align:center;padding:16px 0}
.bet-item-grid .bet-delete{width:24px;height:24px;display:grid;place-items:center;padding:2px;min-height:0}

/* Chats compartidos: mismo mensaje y compositor, con altura flexible según el contenedor. */
.shared-chat{min-height:0}.preparation-chat.shared-chat:not([hidden]){display:flex;flex-direction:column;height:58dvh;min-height:300px}
.shared-chat .chat-log{flex:1;min-height:0;max-height:none;padding:12px;overflow:auto}
.shared-chat .chat-message{line-height:1.25;margin-bottom:9px}.shared-chat .chat-message.mine{padding:7px;margin-left:12px}
.shared-chat .chat-system{line-height:1.3}.shared-chat .message-author{margin-bottom:2px}
.shared-chat-compose{flex:none;padding:10px;border-radius:10px}.shared-chat-compose .compose-input{display:flex;align-items:stretch;gap:8px}
.shared-chat-compose .compose-input input{flex:1;min-width:0;width:0;height:44px;min-height:44px;padding:10px 12px;line-height:1.4;background:#0e201e}
.shared-chat-compose .send-button{position:static;flex:0 0 44px;width:44px;height:44px;align-self:center}
.shared-chat-tools{position:relative;display:flex;justify-content:flex-end;flex:none}.shared-chat-tools>.icon-button{min-height:30px;height:30px;width:34px;padding:3px;font-size:1.1rem}
.shared-chat-tools>.chat-settings{position:absolute;right:0;top:34px;z-index:5;width:min(300px,100%);padding:12px;background:#173c31;border:1px solid #a58c5260;border-radius:10px;box-shadow:0 10px 30px #0005}
.game-social .shared-chat-tools{margin-top:-4px;margin-bottom:-4px}

/* Enviar conserva el mismo icono y centrado en todos los chats. */
.chat-send-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;min-width:44px;height:44px;padding:0}.chat-send-icon svg{display:block;flex:none;width:22px;height:22px}

/* Fondo claro común para las conversaciones; los colores personales mantienen su prioridad. */
.chat-log,.shared-chat .chat-log,.private-chat-log{background:#fff;color:#20372f;scrollbar-color:#99aaa2 #f1f5f2}
/* Esquinas del historial de conversación, iguales a las del compositor. */
.chat-log,.shared-chat .chat-log{border-radius:10px}
.chat-log .chat-system,.private-chat-log p{color:#52665d}
.chat-log .message-author strong,.game-chat .message-author strong{color:#214f3b}
.chat-log .message-author time{color:#66786f}.chat-log .message-author .moderator{color:#80601f}
.chat-log .chat-message.mine{background:#edf5ef}
.chat-compose{background:#f6f8f6;border-top-color:#dce5df;color:#40594c}
#chat-form #chat-text,.shared-chat-compose .compose-input input{background:#fff;color:#20372f;border-color:#bdcec3}
.chat-compose input::placeholder{color:#6b7c72}.chat-compose .compose-foot{color:#607569}.chat-compose .emoji-trigger{color:#294c39;border-color:#c8d6cd}

.game-menu-content>.profile-action{display:flex;align-items:center;justify-content:flex-start;gap:12px;text-align:left}.profile-action>img{flex:0 0 32px;width:32px;height:32px;object-fit:contain}

/* Las frases comparten el pie del compositor; su lista se abre encima sin restar altura al historial. */
.game-social.shared-chat{padding-bottom:0;row-gap:8px}
.game-social .shared-chat-compose{margin-bottom:0;border-radius:10px}
.game-social .compose-foot .game-quick-phrases{position:relative;min-width:0}
.game-social .compose-foot .game-quick-phrases summary{padding:4px 0;color:#6d501d}
.game-social .compose-foot .game-quick-phrases .phrases{position:absolute;bottom:calc(100% + 8px);left:0;z-index:10;width:min(280px,65vw);max-height:220px;overflow:auto;padding:8px;background:#102b24;border:1px solid #b79a60;border-radius:10px;box-shadow:0 8px 24px #0005}

/* El slider común gobierna los chats sin mínimos impuestos por el antiguo modo de letra grande. */
.chat-log .chat-message,.chat-log .message-text,.chat-log .chat-system,.private-chat-log,.private-chat-log p,
.game-large-chat .message-text,.game-large-chat .chat-system,.game-large-chat .private-chat-log{font-size:var(--chat-font,16px);line-height:1.3}
.chat-log .message-author{font-size:max(12px,.85em)}
#chat-form #chat-text,.shared-chat-compose .compose-input input,#private-chat-input{font-size:var(--chat-font,16px)}

/* El tablero comparte el tamaño persistido del chat, también con el modo antiguo de letra grande. */
.game-board .game-log,.game-large-chat .game-board .game-log{font-size:var(--chat-font,16px)}
.game-board .game-log p{font-size:inherit;line-height:1.2;margin:4px 0}

/* Composición compacta: el espacio recuperado queda para el historial. */
.chat-compose,.shared-chat-compose{padding:6px 8px}
#chat-form .compose-input,.shared-chat-compose .compose-input{gap:6px}
#chat-form #chat-text,.shared-chat-compose .compose-input input{height:38px;min-height:38px;padding:6px 10px}
#chat-form .send-button,.shared-chat-compose .send-button{flex-basis:38px;min-width:38px;width:38px;height:38px;min-height:38px}
.chat-compose .compose-foot{margin-top:2px;padding:0;gap:6px;min-height:28px;line-height:1.2}
.chat-compose .emoji-trigger{width:30px;height:28px;min-height:28px;padding:2px}
.game-social .compose-foot .game-quick-phrases summary{padding:3px 0}
.private-chat-log+form{display:flex;align-items:center;gap:6px;margin:0;padding:4px 0}
.private-chat-log+form input{flex:1;min-width:0;width:0;height:38px;min-height:38px;padding:6px 10px}
.private-chat-log+form .chat-send-icon{flex-basis:38px;min-width:38px;height:38px;min-height:38px;padding:0}
.private-chat-log+form .emoji-trigger{min-height:30px;height:30px;padding:2px}

.chat-compose{border-radius:10px}

/* Ajustes alineados con las pestañas; el desplegable conserva su anchura. */
.game-chat-tabs{position:relative;align-items:center}
.game-chat-tabs .shared-chat-tools{position:static;margin:0;align-self:center}
.game-chat-tabs .shared-chat-tools>.chat-settings{top:calc(100% + 6px);width:min(300px,100%);box-sizing:border-box}

/* Un pequeño respiro entre los mensajes del salón y la escritura. */
#chat-form{margin-top:6px}

/* Cierre visible incluso al desplazar la lista de frases. */
.quick-phrases-header{position:sticky;top:0;z-index:1;flex:0 0 100%;display:flex;justify-content:flex-end;background:#102b24}
.game-quick-phrases .quick-phrases-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;min-height:28px;padding:0;border-radius:6px;color:var(--gold);font:24px/1 Arial,sans-serif}

/* Editor de frases: filas compactas y controles de orden accesibles sin arrastrar. */
.phrases-editor-intro{margin:0;font-size:.85rem;line-height:1.4}
.phrases-editor-toolbar{display:flex;flex-wrap:wrap;gap:8px}.phrases-editor-toolbar .btn{font-size:.8rem;padding:8px 12px}
.phrases-editor-list{display:flex;flex-direction:column;gap:8px;max-height:52dvh;overflow:auto;padding:2px}
.phrases-editor-row{display:flex;align-items:center;gap:8px;padding:8px;background:#102b24;border:1px solid #b79a6040;border-radius:10px}
.phrases-editor-number{font-size:.7rem;color:var(--gold);font-variant-numeric:tabular-nums}
.phrases-editor-row input{flex:1;min-width:0;width:0;padding:8px;font-size:.85rem;height:38px}
.phrases-editor-actions{display:flex;gap:3px}.phrases-editor-actions .btn{padding:0;width:30px;min-height:34px;font:20px/1 Arial,sans-serif}.phrases-editor-actions .btn:disabled{opacity:.25}
.phrases-editor-status{font-size:.75rem;color:var(--gold)}
@media(max-width:480px){.phrases-editor-row{gap:4px;padding:6px}.phrases-editor-number{display:none}.phrases-editor-actions .btn{width:26px}}

/* Accesos nativos del catálogo, con etiquetas y espacio para cada acción. */
.rooms-actions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;max-width:850px;margin:24px auto 0;padding:12px;background:#142c25;border:1px solid #b79a6050;border-radius:16px}
.rooms-actions .rooms-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:84px;width:auto;padding:10px 6px;background:transparent;border:1px solid transparent;border-radius:10px;color:var(--text);font-size:.82rem;cursor:pointer}
.rooms-action img,.rooms-action svg{width:34px;height:34px;object-fit:contain}.rooms-actions .rooms-action:hover{background:#ffffff08;border-color:#b79a6070}.rooms-actions .rooms-action:focus-visible{outline:2px solid var(--gold)}
.rooms-action-dialog{width:min(850px,calc(100vw - 24px));padding:20px}.rooms-action-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.rooms-action-heading h2{margin:0;font-size:1.4rem}.rooms-action-body{min-height:100px}.rooms-web-frame{width:100%;height:65dvh;border:0;border-radius:10px;background:white}.rooms-web-external{display:block;margin-top:10px;color:var(--gold);font-size:.8rem;text-align:right}
.rooms-friends-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}.rooms-friends-list{max-height:60dvh;overflow:auto}.rooms-friend{display:flex;align-items:center;gap:12px;padding:12px;border-bottom:1px solid #ffffff12}.rooms-friend .avatar{flex:0 0 48px;width:48px;height:48px}.rooms-friend-text{flex:1;min-width:0}.rooms-friend-text strong,.rooms-friend-text small{display:block;overflow-wrap:anywhere}.rooms-friend-text small{margin-top:5px;color:var(--muted)}
@media(max-width:560px){.rooms-actions{gap:2px;padding:6px}.rooms-actions .rooms-action{font-size:.65rem;min-height:74px;padding:6px 2px}.rooms-action img,.rooms-action svg{width:28px;height:28px}.rooms-action-dialog{padding:14px}}

#notice-dialog.notice-web{width:min(850px,calc(100vw - 24px))}
#notice-dialog.notice-web .rooms-web-frame{display:block;margin:12px 0;height:60dvh}

/* OPEN_WEB ocupa toda la ventana y superpone el cierre sin reservar espacio. */
#notice-dialog.notice-web-fullscreen{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;padding:0;border:0;border-radius:0;overflow:hidden;box-sizing:border-box;background:var(--bg,#102923)}
#notice-dialog.notice-web-fullscreen>h2,#notice-dialog.notice-web-fullscreen #notice-text,#notice-dialog.notice-web-fullscreen #notice-link{display:none}
#notice-dialog.notice-web-fullscreen .rooms-web-frame{display:block;width:100%;height:100%;margin:0;border:0;border-radius:0;background:#fff}
#notice-dialog.notice-web-fullscreen #close-notice{position:absolute;z-index:2;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));margin:0;width:44px;min-height:44px;height:44px;padding:10px;display:grid;place-items:center;background:#102923;color:#fff;border:1px solid #bd9450;border-radius:10px;box-shadow:0 2px 10px #0003}

.web-page-loading{position:relative;width:100%}.web-loading-message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;background:#102923;color:#ecd09a}.web-loading-message strong{font-size:24px}.web-loading-message span{color:#c4d2c9;font-size:14px;max-width:420px;line-height:1.6}
#notice-dialog.notice-web-fullscreen .web-page-loading{height:100%}

/* Dos páginas deslizables en móvil, con desplazamiento vertical nativo dentro del chat. */
@media(max-width:900px){
 .game-layout{overflow:hidden;touch-action:pan-y pinch-zoom;--swipe-x:0px}
 /* Cada contenedor con scroll delimita sus gestos; el horizontal queda disponible para cambiar de vista. */
 .game-layout .game-social,.game-layout .chat-log,.game-layout .game-log,.game-layout .game-quick-phrases .phrases{touch-action:pan-y pinch-zoom}
 .game-layout>.game-table-column,.game-layout>.game-social{transition:transform .22s ease;will-change:transform}
 .game-layout>.game-table-column{transform:translateX(var(--swipe-x))}
 .game-layout>.game-social,.game-layout>.game-social.is-open{display:flex;position:absolute;inset:0;z-index:3;transform:translateX(calc(100% + var(--swipe-x)));visibility:hidden}
 .game-layout.show-chat>.game-table-column{transform:translateX(calc(-100% + var(--swipe-x)))}
 .game-layout.show-chat>.game-social{transform:translateX(var(--swipe-x));visibility:visible}
 .game-layout.is-dragging>.game-social{visibility:visible}
 .game-layout.is-dragging>.game-table-column,.game-layout.is-dragging>.game-social{transition:none}
}
@media(max-width:900px) and (prefers-reduced-motion:reduce){.game-layout>.game-table-column,.game-layout>.game-social{transition:none}}

/* Configuración rápida en la cabecera de partida, en lugar del nick. */
.game-table-column #account-label{display:none}
.game-table-column>.topbar{position:relative;z-index:12}
.game-header-settings{position:static}
.game-header-settings>.icon-button{width:40px;height:40px;min-height:40px}
.game-header-settings>.chat-settings{top:calc(100% + 6px);right:8px;width:min(300px,calc(100vw - 24px));max-height:calc(100dvh - 100px);overflow-y:auto;text-align:left;white-space:normal}

/* Cierre explícito y compacto de los ajustes rápidos de partida. */
.quick-settings-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;color:var(--gold)}
.quick-settings-heading>.icon-button{display:grid;place-items:center;flex:none;width:32px;height:32px;min-width:32px;min-height:32px;padding:0;font:24px/1 Arial,sans-serif;color:var(--text)}
