/* ReyesMoon Games V5 · Damas 10x10 / Trivia Tlapalera */
.rm-board.rm-checkers{
  grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));
  width:min(900px,calc(100dvh - 156px),calc(100vw - 365px));
  min-width:0;border:5px solid #edc985;box-sizing:border-box;
  background:#ead7b4;aspect-ratio:1/1;overflow:hidden
}
.rm-checkers .rm-square{background:linear-gradient(145deg,#f6dcad,#dcb77e)}
.rm-checkers .rm-square.rm-dark{background:linear-gradient(145deg,#386c68,#1c4244)}
.rm-checkers .rm-square.rm-selected{outline:3px solid #ffdf70;outline-offset:-3px}
.rm-checkers .rm-piece{width:82%;height:82%;border:1px solid #fff9df;box-shadow:inset 0 3px 4px #fff6,inset 0 -6px 7px #0006,0 3px 6px #0016}
.rm-checkers .rm-piece.rm-king:before{content:'♛';font-size:clamp(14px,2.5vmin,28px)}
.rm-tile-preview.rm-preview-trivia-tlapalera{background:linear-gradient(145deg,#7e421d,#e8a751 47%,#3b1c3c);box-shadow:inset 0 0 35px #edcc964d}
.rm-board.rm-trivia-preview{width:min(630px,85%);aspect-ratio:5/3;border-radius:20px;background:linear-gradient(140deg,#173b43,#536242,#142f43);box-shadow:0 15px 38px #0008}
.rm-trivia-board{display:flex;flex-direction:column;gap:clamp(10px,1.5vw,20px);aspect-ratio:auto;max-width:860px;width:100%;overflow:visible;
  border:2px solid #cfb37d;border-radius:18px;padding:clamp(12px,2vw,25px);background:linear-gradient(145deg,#193c46,#11283d 70%,#16313b);
  box-shadow:0 10px 40px #0008,inset 0 0 30px #e3ca8510;
}
.rm-trivia-meta{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:clamp(11px,1vw,14px);color:#f8d995;font-weight:800;letter-spacing:.02em}
.rm-trivia-question{font-size:clamp(18px,2.45vw,29px);text-align:center;line-height:1.32;margin:4px 0 6px;overflow-wrap:anywhere;color:#fff5dc}
.rm-trivia-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(8px,1vw,13px)}
.rm-trivia-option{border:1px solid #b9d4d380;border-radius:14px;background:#11334a;color:#f9faff;font:600 clamp(12px,1.1vw,16px)/1.35 system-ui;
  padding:clamp(9px,1.3vw,16px);min-height:68px;display:flex;align-items:center;text-align:left;gap:10px;white-space:normal;overflow-wrap:anywhere;cursor:pointer}
.rm-trivia-option b{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#e0b76d;color:#203143;font-size:15px}
.rm-trivia-option:hover:not(:disabled){background:#256271;border-color:#ffe7ad;transform:translateY(-1px)}
.rm-trivia-option:disabled{opacity:.67;cursor:default}
.rm-trivia-option:focus-visible{outline:3px solid #ffcf6a;outline-offset:2px}
.rm-trivia-feedback{font-size:13px;border:1px solid #d3c38b66;border-radius:10px;padding:9px;background:#d2b46b17;line-height:1.35;color:#f5dfb0}
.rm-trivia-feedback.is-correct{background:#2e7b6344;border-color:#67cf9b88;color:#d2ffe6}
.rm-team-config .rm-btn{width:100%;white-space:normal}
@media(max-width:730px){
 .rm-board.rm-checkers{width:min(98vw,calc(100dvh - 127px),650px);max-width:100%;border-width:3px}
 .rm-trivia-board{width:100%;min-width:0;padding:11px 10px;gap:10px}
 .rm-trivia-options{grid-template-columns:1fr;gap:7px}
 .rm-trivia-question{font-size:clamp(17px,4.7vw,25px)}
 .rm-trivia-option{min-height:51px;padding:9px;font-size:clamp(12px,3.6vw,15px)}
 .rm-trivia-option b{width:25px;height:25px;font-size:13px}
 .rm-board.rm-trivia-preview{width:min(96vw,480px)}
}
@media(max-width:380px){
 .rm-board.rm-checkers{width:min(97vw,calc(100dvh - 122px));}
 .rm-trivia-meta{font-size:10px}
 .rm-trivia-question{font-size:17px}
}
@media(max-height:580px) and (min-width:731px){
 .rm-board.rm-checkers{width:min(calc(100dvh - 120px),calc(100vw - 365px),700px)}
}
.rm-trivia-final{text-align:center;align-items:center;justify-content:center}
.rm-trivia-final h2{font-size:clamp(22px,3vw,35px);margin:0;color:#ffe6aa}
.rm-trivia-final p{margin:0;color:#f3e6cd;line-height:1.5}
.rm-trivia-results{display:grid;width:100%;gap:9px}
.rm-trivia-results>div{display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between;background:#ffffff12;padding:9px 12px;border-radius:11px}
/* Mantener las 100 casillas dentro del contenedor y por encima del pie visible. */
.rm-game-stage{grid-template-columns:minmax(0,1fr);min-width:0}
.rm-board.rm-checkers{width:min(100%,900px,calc(100dvh - 245px),calc(100vw - 365px));max-width:100%}
@media(max-width:920px){
 .rm-game-layout{display:flex;flex-direction:column;align-items:stretch;gap:10px;height:auto}
 .rm-game-stage{width:100%;min-width:0}
 .rm-arena{min-width:0}
 .rm-sidebar{max-height:none;width:100%}
 .rm-board.rm-checkers{width:min(100%,720px,calc(100dvh - 190px));max-width:100%}
}
@media(max-width:730px){
 .rm-board.rm-checkers{width:min(100%,650px,calc(100dvh - 180px));max-width:100%}
}
/* Preferencias completamente desplazables en pantallas pequeñas. */
.rm-dialog{max-height:min(780px,calc(100dvh - 42px));overflow-y:auto;overscroll-behavior:contain}
.rm-dialog form{min-height:0;padding-bottom:8px}
@media(max-height:640px){.rm-dialog{max-height:calc(100dvh - var(--footer-h) - 24px);margin:10px auto calc(14px + var(--footer-h))}}
.rm-zoom{min-height:30px;padding:5px 12px;font-size:11px;background:#1b4f54;border-color:#80c9b9;color:#d6fff1}
html.rm-checkers-expanded .rm-head,html.rm-checkers-expanded #rm-carrilla{display:none}
html.rm-checkers-expanded .rm-sidebar{display:none}
html.rm-checkers-expanded .rm-main{padding:2px 6px 4px}
html.rm-checkers-expanded .rm-game-layout{display:block;height:100%;min-height:0}
html.rm-checkers-expanded .rm-arena{width:100%;max-width:100%;margin:0;gap:4px;padding:3px}
html.rm-checkers-expanded .rm-board.rm-checkers{width:min(100%,calc(100dvh - 150px),calc(100vw - 24px),1000px)}
html.rm-checkers-expanded .rm-arena-title{font-size:clamp(12px,2vw,17px);gap:6px}
html.rm-checkers-expanded .rm-tutorial{font-size:11px}