:root{color-scheme:dark;--gold:#eac58e;--muted:#bdaf9a;--dark:#0c171d;--line:#8a6536}
*{box-sizing:border-box}html{min-height:100%;background:#0b1117}body{margin:0;min-height:100vh;color:#f1dec2;font:16px/1.45 Georgia,'Times New Roman',serif}
.backdrop{position:fixed;inset:0;background:linear-gradient(0deg,rgba(5,10,15,.88),rgba(5,10,15,.68)),url('assets/menu/fondo_principal.png') center / cover no-repeat;z-index:-1}
.lobby{width:min(100%,700px);min-height:100vh;margin:auto;padding:16px clamp(15px,3vw,32px) 26px;display:flex;flex-direction:column;gap:14px}
.lobby-heading{text-align:center}.logo{width:min(100%,400px);height:auto;display:block;margin:0 auto -8px;filter:drop-shadow(0 6px 12px #000b)}.kicker{font-size:.74rem;letter-spacing:.18em;color:var(--gold);margin:0 0 3px}.lobby-heading h1{font-size:clamp(1.4rem,4vw,2rem);font-weight:400;color:#ffe6b3;margin:0}.subtitle{max-width:460px;margin:5px auto;color:var(--muted);font-size:.93rem}
.panel{border:1px solid var(--line);background:linear-gradient(140deg,rgba(24,39,46,.96),rgba(6,15,21,.97));box-shadow:0 14px 34px #0009,inset 0 0 0 3px #0b151c;border-radius:13px;padding:clamp(18px,3vw,28px)}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}.field span{font-size:.91rem;color:var(--gold)}input,select{width:100%;padding:12px 13px;border-radius:6px;border:1px solid #9c7850;background:#101f27;color:#fce6c2;font:inherit;min-width:0}input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid #ffe5ad;outline-offset:3px}
input[readonly]{color:#dbc8a6;background:#101920}.hint{color:#bbaf9c;font-size:.87rem;margin:3px 0 17px}
button{font:inherit;cursor:pointer;border:1px solid #bd925c;border-radius:7px;padding:12px 18px;transition:filter .15s ease}button:hover:not(:disabled){filter:brightness(1.12)}button:disabled{opacity:.58;cursor:wait}.primary{background:linear-gradient(#f8db9b,#ad773b);color:#1a160f;font-weight:bold}.secondary{background:linear-gradient(#24353b,#101e24);color:#f8dcad}.full{width:100%;font-size:1rem}.separator{display:flex;gap:15px;align-items:center;color:#c2aa82;font-size:.83rem;margin:15px 0}.separator:before,.separator:after{content:'';height:1px;flex:1;background:#76603f}
.room{text-align:center}.room-label{font-size:.75rem;letter-spacing:.16em;color:#d6b37a;margin:0}.room h2{font-size:clamp(1.8rem,5vw,2.6rem);letter-spacing:.045em;margin:2px 0;color:#f5d6a2}.status{color:#e0c595;font-size:.95rem;margin:4px auto 20px}.players{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}.player{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;background:#101d26;border:1px solid #745f43;border-radius:9px;min-height:100px;padding:12px 8px}.player b,.player small{display:block}.player small{color:#cbbda8;margin-top:4px}.player strong{font-size:.72rem;letter-spacing:.04em;color:#e0c288}.dot{width:11px;height:11px;border-radius:50%;display:block}.dot.blue{background:#74b7e0}.dot.red{background:#d76d6d}.vs{color:#d3ac75;font-size:.82rem}.room .field{text-align:left;margin-top:16px}.room-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}.notice{font: .85rem/1.5 Georgia,serif;color:#c5b9a7;border-top:1px solid #5b5044;padding-top:17px;margin:20px 0 0}.notice-bottom{text-align:center;color:#f1cc91;min-height:1.3rem;margin:0;white-space:pre-line;font-size:.91rem}
footer{margin-top:auto;display:flex;justify-content:space-between;gap:12px;align-items:center;color:#bbaa8d;font-size:.86rem}footer a{color:#e5c087;text-decoration:none}footer a:hover{text-decoration:underline}
@media(max-width:460px){.players{gap:5px}.player{min-height:110px;padding:9px 3px;font-size:.84rem}.room-actions button{flex:1}.logo{max-width:315px}}
[hidden]{display:none!important}

/* Tanda 3: acceso a la mesa después de que el anfitrión la prepara. */
.host-start{margin:16px 0;padding:13px;border:1px solid #8c6b3c;border-radius:10px;background:#10191f}
#enterTable{margin:17px auto;font-size:1.08rem}