@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500&family=Playfair+Display:ital,wght@0,400;1,400&display=swap');
:root{color-scheme:dark;--pink:#e09aa4;--muted:#c2b2b5}*{box-sizing:border-box}body{margin:0;background:#171319;color:#f4e7de;font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}header{max-width:1160px;margin:auto;padding:30px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font:italic 25px Georgia}.back{font-size:12px;color:var(--muted)}main{max-width:1040px;margin:auto;padding:50px 24px}.eyebrow{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--pink)}h1,h2{font-family:'Playfair Display',Georgia,serif;font-weight:400}h1{font-size:clamp(42px,6vw,70px);letter-spacing:-2px;margin:18px 0}h1 em{color:var(--pink)}p{font-size:14px;line-height:1.8;color:var(--muted)}.intro{margin-bottom:42px}.game{background:#211a23;border:1px solid #513945;padding:clamp(18px,4vw,40px);border-radius:12px}.game-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}h2{font-size:clamp(25px,3vw,35px);margin:14px 0}.badge{font-size:11px;color:var(--pink);white-space:nowrap}.toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:26px 0 20px}label{font-size:11px;color:var(--muted);display:grid;gap:7px}select,button{font:13px 'DM Sans',sans-serif;border:1px solid #795365;background:#30242e;color:#f4e7de;padding:12px 16px;border-radius:5px}button,select{cursor:pointer}button:hover{background:#49313e}.primary{background:#a64a63;border-color:#a64a63;color:#fff4f0}.primary:hover{background:#bb5a74}:focus-visible{outline:3px solid #d4ac79;outline-offset:4px}.stats{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted);margin-bottom:12px}.board-wrap{position:relative}.board{display:grid;grid-template-columns:repeat(var(--cols),1fr);aspect-ratio:16/9;gap:3px;background:#120f14;border:3px solid #120f14;border-radius:6px;overflow:hidden}.piece{padding:0;min-width:0;min-height:0;border:0;border-radius:0;background-image:var(--photo,url('assets/fotos/nosotros.png'));background-repeat:no-repeat;touch-action:pan-y;position:relative}.piece:hover{filter:brightness(1.13);background-color:transparent}.piece[aria-pressed=true]{outline:3px solid #ffcf89;outline-offset:-4px;z-index:1;filter:brightness(1.15)}.piece:focus-visible{outline-offset:-4px;z-index:2}.piece.dragging{opacity:.45}.piece.drop-target{box-shadow:inset 0 0 0 4px #ffcf89}#reference{display:block;width:100%;border-radius:6px;margin-top:18px}#reference[hidden],[hidden]{display:none!important}.status{min-height:24px;font-size:12px;margin-bottom:0}.win{text-align:center;padding:30px 12px 12px}.win>span{font:52px Georgia;color:var(--pink)}.win h2{color:var(--pink)}.footnote{text-align:center;font:italic 16px Georgia;margin:30px 0}footer{max-width:990px;margin:auto;border-top:1px solid #4b3542;padding:25px;text-align:center;color:#b99da5;font-size:10px;letter-spacing:2px}.board.solved{gap:0;border-color:#a64a63}.board.solved .piece{cursor:default}.board.solved .piece:hover{filter:none}@media(max-width:600px){header{padding:24px 20px;align-items:start}.brand{font-size:21px}.back{font-size:10px;max-width:100px;text-align:right}main{padding:30px 14px}.badge{display:none}.toolbar{gap:8px}.toolbar button{padding:12px 10px;font-size:12px}.stats{font-size:10px}.board{gap:2px}.intro{margin-bottom:30px}}

.photo-picker{margin-top:26px}.photos{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}.photo-option{padding:3px;width:86px;height:68px;overflow:hidden;border:2px solid transparent;background:#30242e}.photo-option img{display:block;width:100%;height:100%;object-fit:cover;border-radius:2px}.photo-option[aria-pressed=true]{border-color:#e09aa4;box-shadow:0 0 0 2px #e09aa430}.photo-name{font-size:12px;margin:10px 0 0}.board-wrap{max-width:760px;margin:auto}.board{max-height:none}@media(max-width:600px){.photos{gap:8px}.photo-option{width:66px;height:58px}}

.photo-select{display:block;margin-top:10px;width:min(100%,320px)}