:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#213a31;background:#f4f6ef;font-synthesis:none;--green:#175b43;--lime:#d8ef8b;--muted:#64756d;--line:#dce3d6}
/* La actividad efímera no desplaza preguntas ni botones; el texto completo permanece en el chat. */
.salon-activity{position:fixed;z-index:30;left:50%;bottom:24px;transform:translateX(-50%);width:max-content;max-width:min(680px,calc(100vw - 32px));max-height:min(30vh,180px);overflow:hidden;padding:14px 22px;border:1px solid #4a8072;border-radius:18px;background:#184f43;color:#fff;box-shadow:0 10px 35px #123c3330;font-size:14px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;pointer-events:none}
.chat .chat-system{margin:6px 0;padding:10px 12px;border-left:3px solid #b2c882;border-radius:0 10px 10px 0;background:#f1f5e8;color:#455b35;font-size:12px}
.play-column,.social-column,.panel{min-width:0}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}a{color:var(--green)}[hidden]{display:none!important}
.topbar{display:flex;align-items:center;gap:24px;max-width:1400px;padding:24px 40px;margin:auto;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:30px;font-weight:800;letter-spacing:-1.7px;color:#213a31}.brand span{color:#668f3c}.brand-dot{font-size:35px}.connection{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.dot{height:7px;width:7px;border-radius:50%;background:#719145}
main{max-width:1320px;margin:auto;padding:36px 32px 64px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(30px,4vw,46px);letter-spacing:-1.8px;line-height:1.12;margin-bottom:20px}h2{font-size:22px;letter-spacing:-.5px}h3{font-size:19px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;color:#638141}.muted{color:var(--muted);line-height:1.6}.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px}.btn{border-radius:10px;padding:12px 18px;border:1px solid transparent;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}.btn-primary{background:var(--green);color:white}.btn-secondary{background:#f4f6ef;border-color:var(--line);color:#31463c}.btn:hover{filter:brightness(.95)}.btn:disabled{opacity:.5;cursor:wait}.wide{width:100%;margin-top:12px}input{width:100%;border:1px solid #ccd6c7;border-radius:9px;padding:12px;background:#fff;color:#263e32;min-width:0}input:focus,button:focus-visible,a:focus-visible{outline:3px solid #92b65c;outline-offset:3px}label{display:block;font-size:13px;font-weight:650;margin:18px 0 8px}label>input{margin-top:8px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.password-wrap{display:flex;gap:6px;margin-top:8px}.password-wrap input{flex:1}.check{display:flex;align-items:flex-start;gap:10px;line-height:1.5;font-weight:400}.check input{width:18px;height:18px;margin:2px 0}.quiet-link{display:block;text-align:center;margin-top:22px;font-size:13px}
.access-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;max-width:1080px;margin:6vh auto}.intro{padding-top:50px}.intro h1{font-size:clamp(40px,5vw,65px);margin-top:27px;letter-spacing:-3px}.lede{font-size:20px;line-height:1.6;color:var(--muted);max-width:400px}.intro-rule{height:5px;width:70px;background:var(--lime);margin:38px 0 25px}.intro>p:last-child{line-height:1.7;color:var(--muted)}.login-panel{padding:36px;box-shadow:0 20px 65px #29492c08}.login-panel h2{font-size:27px}.message{padding:15px 20px;border:1px solid #d0d9ab;background:#f3f8de;border-radius:12px;margin-bottom:18px;display:block;white-space:pre-wrap}.message.error{background:#fff0eb;border-color:#edc7b6;color:#89372e}
.room-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:34px}.room-card{padding:28px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:18px;display:flex;flex-direction:column;gap:20px;color:inherit}.room-card:hover{border-color:#668d43;background:#faffed}.room-card strong{font-size:24px}.room-card span{color:var(--muted)}.room-card .enter-label{font-weight:700;color:var(--green)}.room-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.room-heading h1{font-size:34px}.room-heading .btn{margin-left:8px}.battle-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px}.play-column,.social-column{display:flex;flex-direction:column;gap:22px}.question-panel{padding:32px}.question-panel h2{font-size:clamp(24px,3vw,34px);line-height:1.3;margin:20px 0 28px}.question-meta{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:13px;margin-bottom:26px}#clock{display:flex;align-items:center;justify-content:center;min-width:48px;height:48px;border-radius:50%;background:var(--lime);color:var(--green);font-size:22px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer{display:flex;align-items:center;gap:12px;text-align:left;min-height:74px;padding:16px;border:1px solid var(--line);background:#fafbf7;border-radius:12px;color:#294438;line-height:1.4;overflow-wrap:anywhere}.answer-letter{flex-shrink:0;display:grid;place-items:center;width:29px;height:29px;border-radius:7px;background:#e7ecdf;font-weight:700}.answer:hover{border-color:#789b48}.answer.correct{background:#e2f2dc;border-color:#6eaa58}.answer.incorrect{background:#fff0ea;border-color:#dc8464}.answer:disabled{cursor:default;opacity:.75}.answer img{max-width:90px;max-height:80px;border-radius:6px}.question-image{max-height:230px;max-width:100%;display:block;margin:0 auto 22px;border-radius:12px}#confirmation{margin:18px 0 0;font-weight:600}.waiting{margin-top:18px;border-top:1px solid var(--line);padding-top:18px;color:var(--muted)}.topic-options{display:flex;flex-wrap:wrap;gap:10px}.topic-options button{white-space:normal}.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.section-title h2{font-size:18px;margin:0}.count{padding:4px 9px;border-radius:20px;background:#eff3e8;font-size:12px}.points-total{font-size:13px;font-weight:700;color:var(--green)}
.ranking{display:flex;gap:12px;overflow-x:auto;padding:5px 0}.rank-card{min-width:102px;padding:15px 10px;text-align:center;border-radius:13px;background:#f4f6ef;border:1px solid var(--line)}.rank-card.correct{background:#e1f2db;border-color:#99c48a}.rank-card.incorrect{background:#fff0eb;border-color:#e4a38c}.avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#e4eadc;display:inline-flex;align-items:center;justify-content:center;font-weight:700;color:#476b38;flex-shrink:0}.rank-card .avatar{width:46px;height:46px;margin:9px auto}.rank-card .nick{font-weight:650;font-size:13px;display:block}.rank-card .result-label{display:block;font-size:11px;margin-top:6px}.rank-card .rank-points{display:block;font-size:20px;font-weight:750}.players{list-style:none;margin:0;padding:0;max-height:350px;overflow:auto}.players li{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0e7}.players li:last-child{border:0}.player-info{flex:1;font-size:14px;overflow-wrap:anywhere}.player-state{display:block;color:var(--muted);font-size:11px;margin-top:5px}.self{font-size:10px;padding:3px 5px;background:#edf3df;border-radius:5px}.chat-panel h2{font-size:18px}.chat{list-style:none;padding:0;margin:0 0 16px;height:220px;overflow:auto;font-size:13px}.chat li{padding:8px 0;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.chat strong{color:var(--green)}#chat-form{display:flex;gap:6px}#chat-form .btn{padding:10px}.streak{margin:14px 0 0;color:#537327;font-weight:650}#final-ranking{padding-left:24px}#final-ranking li{padding:8px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:950px){.battle-layout{grid-template-columns:1fr}.social-column{display:grid;grid-template-columns:1fr 1fr}.access-layout{gap:5%}.intro h1{font-size:48px}.login-panel{padding:25px}}@media(max-width:650px){.topbar{padding:16px 20px;gap:12px}.brand{font-size:25px}.connection{font-size:11px}.topbar>.btn{font-size:11px;padding:8px;min-height:36px}main{padding:24px 16px}.access-layout{grid-template-columns:1fr;margin:0}.intro{padding-top:5px}.intro h1{font-size:40px;letter-spacing:-2px;margin:18px 0}.lede{font-size:16px}.intro-rule,.intro>p:last-child{display:none}.login-panel{margin-top:18px}.room-heading{align-items:flex-start}.room-heading h1{font-size:27px}.room-heading .btn{font-size:12px;padding:9px}.answers{grid-template-columns:1fr}.panel,.question-panel{padding:22px}.social-column{display:flex}.question-panel h2{font-size:25px}.answer{min-height:62px}.question-meta{margin-bottom:16px}.room-grid{grid-template-columns:1fr}}

/* Los dos controles de contrasena comparten el ojo y muestran el trazo al revelar el campo. */
.password-wrap .btn svg{flex:none;pointer-events:none}.password-eye-slash{display:none}.password-wrap .btn[data-password-visible="true"] .password-eye-slash{display:inline}