*{box-sizing:border-box}html{font-family:'Segoe UI',Arial,sans-serif;color:#154d54;background:#0c3940}body{margin:0;background:linear-gradient(#082e3a55,#082e3a88),url('assets/fondo-mesa-juegos.webp') center/cover fixed;min-height:100dvh}header{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:12px 4vw;background:#fff9e9}header img{width:220px;max-width:48vw}header nav{display:flex;gap:12px}a{color:#17666d}button,a.button{font:inherit;font-weight:700;border:1px solid #b4ccc2;background:#f4faf5;color:#175c64;border-radius:10px;padding:10px 14px;cursor:pointer;min-height:43px}button:hover{background:#f8e1a1}button:disabled{opacity:.55;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e8ac2d;outline-offset:2px}main{max-width:1400px;margin:auto;padding:24px}.intro,.setup{background:#fffaf0;border-radius:22px;padding:28px;margin:0 0 22px;box-shadow:0 7px 20px #001e2c55}h1{font-size:clamp(25px,3vw,38px);line-height:1.15;margin:12px 0}h2{font-size:24px}h3{font-size:18px}.kicker{font-size:10px;letter-spacing:1.3px;font-weight:800}p,li{line-height:1.6}.game-picker,.grade-picker,.buttons{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.game-picker a,.grade-picker a{background:#ecf4eb;padding:10px 12px;border-radius:10px;text-decoration:none;font-size:13px;border:1px solid #c9dbcd}.game-picker a.active,.grade-picker a.active{background:#0c7077;color:#fff}.setup{display:grid;grid-template-columns:1fr 280px;gap:30px}.setup aside{display:flex;flex-direction:column;gap:14px}.setup aside img{width:100%;max-height:350px;object-fit:contain;background:#f3e4bb;border-radius:14px}.profile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}fieldset{border:1px solid #bed0c2;border-radius:13px;padding:18px;min-width:0}legend{font-weight:700}label{display:grid;gap:7px;margin:12px 0;font-size:13px;font-weight:700}input,select{font:inherit;min-width:0;width:100%;padding:11px;border:1px solid #b8cdc4;border-radius:9px;background:#fff;color:#18515a}label.check{display:flex;align-items:center}label.check input{width:20px}.entry-actions{display:flex;flex-wrap:wrap;align-items:end;gap:13px}.entry-actions label{margin:0}.entry-actions button{background:#087780;color:#fff}.code{letter-spacing:3px;font-size:28px}.playing-original{height:100dvh;overflow:hidden}.playing-original>header{display:none}.playing-original main{height:100dvh;padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:9px;max-width:none}.game-head{display:flex;justify-content:space-between;align-items:center;gap:15px;color:#fff4d6;background:#08343cdd;padding:10px 18px;border-radius:14px}.game-head h1{font-size:24px;margin:5px 0}.game-head .buttons{margin:0}.game-head a{color:#fff4d6}.game-status{background:#e8f5df;padding:9px 16px;border-radius:11px;font-weight:700;text-align:center;line-height:1.3}.arena{display:grid;grid-template-columns:minmax(160px,230px) minmax(0,1fr) minmax(210px,290px);gap:16px;min-height:0}.players,.controls{background:#fff9e9f5;border:1px solid #d8bd70;border-radius:17px;padding:14px;min-height:0;overflow:auto}.player{padding:14px;background:#f4f8ef;border:1px solid #cadacc;border-radius:12px;margin-bottom:12px;display:grid;gap:6px;overflow-wrap:anywhere}.player.current{background:#fff0b9;border:2px solid #d5a72d}.player small{font-size:11px;color:#5f7775}.players>button{width:100%;margin:5px 0}.controls h3{margin:5px 0 13px}.controls p{font-size:13px}.controls>button{width:100%;margin:6px 0}.board-area{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0}.grid-board{display:grid;width:min(100%,calc(100dvh - 165px));aspect-ratio:1;max-height:100%;min-height:0;border:8px solid #ca963c;box-shadow:0 7px 0 #6b451e,0 12px 25px #00152077;background:#b67b25;gap:0;border-radius:9px;overflow:hidden}.chess-board,.checker-board,.race-board{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr))}.grid-board .tile{border:0;border-radius:0;position:relative;min-width:0;min-height:0;padding:0;display:flex;align-items:center;justify-content:center;aspect-ratio:1}.tile.light,.race-cell.light{background:#fffcf0;color:#172c42}.tile.dark,.race-cell.dark{background:#1754bd;color:white}.tile small{position:absolute;left:4px;top:3px;font-size:9px;opacity:.75}.chessman{font-family:'Segoe UI Symbol','Noto Sans Symbols 2',serif;font-size:clamp(25px,5.4vh,60px);line-height:1;filter:drop-shadow(0 3px 1px #0006);z-index:1}.side-0{color:#fff6d5;-webkit-text-stroke:1.2px #4d473c}.side-1{color:#26242d;-webkit-text-stroke:1px #d2c3a8}.tile.picked,.picked{outline:3px solid #ffd04d!important;outline-offset:-3px}.tile.legal:after{content:'';position:absolute;width:22%;height:22%;background:#ffd665bb;border:2px solid #fff7c6;border-radius:50%;bottom:4px;right:4px}.counter{display:grid;place-items:center;border-radius:50%;border:2px solid #fff7c8;background:radial-gradient(circle at 30% 20%,#ffffffaa,var(--piece) 45%,#0008);color:white;font-size:20px;box-shadow:0 3px 0 #0007,0 6px 8px #0006;width:68%;height:68%;position:relative;z-index:1}.p0{--piece:#cf163a}.p1{--piece:#3d3b4d}.p2{--piece:#1583b9}.p3{--piece:#24893d}.checker-board .number{position:absolute;left:5px;top:2px;font-size:clamp(10px,1.8vh,19px);font-weight:800}.race-cell{position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;min-width:0;min-height:0}.race-cell small{position:absolute;top:3px;left:3px;font-size:10px;font-weight:800}.race-cell .counter{width:40%;height:40%;font-size:12px}.pdf-board{grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));gap:2px;padding:3px}.pdf-board>button{min-width:0;min-height:0;padding:0;border:0;border-radius:4px;position:relative;display:flex}.paper{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;aspect-ratio:3/4;background:#fffdf1;border:3px solid #dcaa49;border-radius:7px;outline:1px solid #b9543e;outline-offset:-5px;padding:10%;width:100%;height:100%;color:var(--ink,#176c78)}.paper b{font-size:clamp(9px,1.5vh,18px);overflow-wrap:anywhere;text-align:center;line-height:1.15}.paper svg{width:100%;height:100%}.paper.wild{color:#b53923;background:#fff0bb}.paper.wild>span{font-size:clamp(12px,2vh,22px)}.paper small{font-size:8px}.pdf-board .paper{aspect-ratio:auto;border-width:1px;padding:9%;outline-offset:-3px}.pdf-board .paper b{font-size:clamp(7px,1.5vh,18px)}.pdf-board .paper small{display:none}.pdf-board .counter{position:absolute;inset:15%;font-size:17px}.own-hand{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.own-hand button,.casino-table>button{padding:0;border:0;background:transparent;min-width:0;min-height:0;aspect-ratio:3/4}.own-hand .paper b{font-size:17px}.casino-table{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;width:100%;max-height:100%;overflow:auto;background:#72243b;border:9px solid #b78b3b;border-radius:20px;padding:18px}.casino-table .paper b{font-size:clamp(12px,2vw,24px)}.challenge{display:grid;gap:9px}.die{font-size:45px}.game-status:empty{display:none}#originalNotice:not(:empty){position:fixed;bottom:12px;left:50%;transform:translateX(-50%);max-width:90vw;background:#fff0b6;color:#5b4317;z-index:15;border:2px solid #d6a645;padding:13px 20px;border-radius:12px;box-shadow:0 6px 20px #001b2d66}dialog{max-width:850px;width:92vw;max-height:88dvh;overflow:auto;border:2px solid #b8994e;border-radius:19px;background:#fffbef;color:#194d53;padding:24px}dialog::backdrop{background:#002531aa}.large-hand{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:15px}.large-hand .paper{height:auto}.large-hand .paper b{font-size:25px}
@media(max-width:1000px){.arena{grid-template-columns:150px minmax(0,1fr) 210px;gap:10px}.players,.controls{padding:10px}.game-head h1{font-size:20px}.game-head button{font-size:12px}.own-hand{grid-template-columns:repeat(2,minmax(0,1fr))}.setup{grid-template-columns:1fr 200px}.casino-table{grid-template-columns:repeat(4,1fr);gap:8px}}
@media(max-width:700px){header{padding:12px;align-items:flex-start}header nav{font-size:11px;gap:10px}main{padding:14px}.intro,.setup{padding:20px;border-radius:17px}.setup{grid-template-columns:1fr}.setup aside{display:grid;grid-template-columns:100px 1fr}.setup aside img{grid-row:span 2;max-height:120px}.profile-grid{grid-template-columns:1fr}.game-picker a{font-size:11px}.playing-original main{padding:6px;gap:5px}.game-head{padding:8px;gap:6px;align-items:flex-start}.game-head h1{font-size:16px}.game-head .kicker{font-size:7px}.game-head button,.game-head a{font-size:10px;padding:7px;min-height:32px}.game-head .buttons{gap:5px;justify-content:flex-end}.game-status{font-size:12px;padding:8px}.arena{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) minmax(120px,26dvh);gap:7px}.players{display:flex;gap:5px;padding:5px;overflow:auto;border-radius:11px}.player{margin:0;padding:6px;min-width:110px;font-size:11px}.player small{font-size:9px}.player>span{font-size:10px}.players>button{font-size:10px;min-width:65px;width:auto;min-height:35px;padding:6px}.controls{padding:9px;border-radius:11px;overflow:auto}.controls h3{font-size:14px}.controls p{font-size:11px;margin:6px 0}.controls>button{width:auto;margin:4px;font-size:12px;padding:8px;min-height:36px}.controls label{display:inline-grid;max-width:180px;font-size:11px;margin:6px}.controls input,.controls select{padding:7px}.board-area{min-height:0}.grid-board{width:min(100%,calc(48dvh));border-width:4px}.chessman{font-size:clamp(20px,4vh,40px)}.tile small{font-size:6px}.checker-board .number{font-size:9px;left:2px;top:0}.counter{font-size:14px;border-width:1px}.own-hand{display:flex;overflow:auto;gap:7px}.own-hand>button{flex:0 0 65px;height:85px}.own-hand .paper b{font-size:14px}.pdf-board{gap:1px;padding:1px}.pdf-board .paper b{font-size:clamp(6px,1.15vh,12px)}.pdf-board .paper.wild>span{font-size:11px}.pdf-board .paper{padding:5%;outline-offset:-2px}.pdf-board .counter{font-size:12px}.casino-table{max-height:100%;grid-template-columns:repeat(5,1fr);gap:5px;padding:6px;border-width:4px}.casino-table .paper b{font-size:11px}.paper{border-width:2px;outline-offset:-3px}.race-cell small{font-size:6px}.race-cell .counter{font-size:7px}.challenge{grid-template-columns:1fr 1fr;gap:7px}.challenge button{font-size:11px;padding:7px}.large-hand{grid-template-columns:1fr 1fr}.entry-actions>*{width:100%}.playing-original .controls .die{font-size:25px}}
@media(max-height:550px) and (orientation:landscape){.arena{grid-template-columns:130px 1fr 180px;grid-template-rows:minmax(0,1fr)}.players{display:block}.grid-board{width:min(100%,calc(100dvh - 130px))}.controls{height:100%}.chessman{font-size:30px}.game-head h1{font-size:17px}}
@media print{header,.buttons,#originalNotice{display:none}.sheet{break-before:page;background:white;padding:10px}.sheet img{max-width:100%;max-height:240mm;object-fit:contain}.print-deck{display:grid;grid-template-columns:repeat(4,1fr);gap:6mm}.print-deck>div{height:78mm;break-inside:avoid}.paper b{font-size:20px}body{background:white;color:#111}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}main{padding:0}.intro{box-shadow:none;border:0}.sheet .grid-board{max-width:170mm;max-height:none;width:170mm}.sheet .paper b{font-size:12px}}

.chessman{display:grid;place-items:center;width:82%;height:82%;border-radius:40%;font-size:clamp(25px,5.1vh,56px)}.chessman.side-0{background:radial-gradient(circle at 30% 20%,#fffdf2,#f2dfac);color:#34313b;-webkit-text-stroke:0;border:1px solid #514531;box-shadow:0 3px 0 #4a3c29}.chessman.side-1{background:radial-gradient(circle at 30% 20%,#5d5c66,#242532);color:#fff3d3;-webkit-text-stroke:0;border:1px solid #d8bc7c;box-shadow:0 3px 0 #090c14}.board-magnifier{overflow:auto;max-height:65dvh}.board-magnifier .board-area{display:block;min-width:850px}.board-magnifier .grid-board{width:850px;max-width:none;max-height:none;aspect-ratio:1}.board-magnifier .paper b,.board-magnifier .pdf-board .paper b{font-size:19px}.board-magnifier .tile:disabled,.board-magnifier .pdf-board>button:disabled{opacity:1}.board-magnifier .casino-table{width:850px;max-height:none}.board-magnifier .chessman{font-size:70px}.board-magnifier .number{font-size:23px}@media(max-width:700px){.chessman{font-size:clamp(18px,3.3vh,34px);width:85%;height:85%}}
@supports(width:1cqw){.board-area{container-type:size}.board-area>.grid-board{width:min(100cqw,100cqh);height:min(100cqw,100cqh);max-height:none;flex:none}.board-magnifier .board-area{container-type:normal;height:850px}.board-magnifier .board-area>.grid-board{width:850px;height:850px}}
@media(max-width:700px){.arena{grid-template-rows:auto minmax(0,1fr) auto}.controls{max-height:28dvh;min-height:78px}}