/* ═══ JUEGO: SOPA DE LETRAS ═══ */
.ws-layout{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}
.ws-grid{display:inline-grid;gap:2px;background:var(--wood-mid);padding:3px;border-radius:8px;border:2px solid var(--gold-dark);user-select:none;-webkit-user-select:none}
.ws-cell{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--bg-surface);font-weight:600;font-size:.85rem;color:var(--text1);border-radius:2px;cursor:pointer;transition:.15s}
.ws-cell:hover{background:rgba(201,168,76,.3)}
.ws-cell.selecting{background:rgba(201,168,76,.5);transform:scale(1.1)}
.ws-cell.found{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:white;font-weight:700}
.ws-word-list{flex:1;min-width:150px}
.ws-word-list h3{font-family:var(--fh);color:var(--text1);margin-bottom:.75rem;font-size:1rem}
.ws-word-item{padding:.4rem .6rem;margin-bottom:.3rem;background:rgba(255,255,255,.3);border-radius:6px;font-size:.9rem}
body.dark-mode .ws-word-item{background:rgba(255,255,255,.05)}
.ws-word-item.found{text-decoration:line-through;color:var(--green);background:rgba(74,124,89,.1)}
/* ═══ JUEGO: MEMORIA ═══ */
.memory-grid{display:grid;gap:8px;grid-template-columns:repeat(2,1fr);max-width:600px;margin:0 auto}
.memory-card{perspective:800px;height:110px;cursor:pointer}
.memory-card-inner{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d}
.memory-card.flipped .memory-card-inner,.memory-card.matched .memory-card-inner{transform:rotateY(180deg)}
.memory-card-front,.memory-card-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:.5rem;text-align:center;font-size:.8rem;font-weight:500}
.memory-card-back{background:linear-gradient(180deg,var(--wood-mid) 0%,#4a2e18 40%,var(--wood-mid) 60%,#4a2e18 100%);border:2px solid var(--gold-dark);box-shadow:inset 3px 0 6px rgba(0,0,0,.3),inset -3px 0 6px rgba(0,0,0,.3);color:var(--gold);font-family:var(--fh);font-size:1.3rem}
.memory-card-back::after{content:'📖';position:absolute;font-size:1.6rem;opacity:.5}
.memory-card-front{background:var(--bg-surface);border:2px solid var(--gold);transform:rotateY(180deg);color:var(--text1);line-height:1.3}
.memory-card.matched .memory-card-front{background:rgba(74,124,89,.1);border-color:var(--green)}
.memory-card.shake .memory-card-inner{animation:shake .4s ease}
@keyframes shake{0%,100%{transform:rotateY(180deg) translateX(0)}25%{transform:rotateY(180deg) translateX(-5px)}75%{transform:rotateY(180deg) translateX(5px)}}
.memory-moves{text-align:center;margin-top:1rem;font-size:1rem;color:var(--text2)}
/* ═══ JUEGO: ANAGRAMAS ═══ */
.anagram-wrap{text-align:center;max-width:450px;margin:0 auto}
.anagram-progress{color:var(--text2);margin-bottom:.75rem}
.anagram-scrambled{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap;margin-bottom:.4rem}
.anagram-letter{width:40px;height:48px;font-size:1.2rem;font-weight:700;background:linear-gradient(180deg,var(--wood-mid),#4a2e18);color:var(--gold);border-radius:8px;border:2px solid var(--gold-dark);transition:var(--tr);box-shadow:0 3px 6px rgba(0,0,0,.2)}
.anagram-letter:hover{transform:translateY(-2px)}
.anagram-letter.used{opacity:.2;transform:scale(.85);pointer-events:none}
.anagram-arrow{font-size:1.3rem;color:var(--gold);margin:.4rem 0}
.anagram-answer{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap;min-height:52px;padding:.4rem;border:2px dashed var(--border);border-radius:10px;background:rgba(255,255,255,.3);margin-bottom:.75rem}
body.dark-mode .anagram-answer{background:rgba(255,255,255,.03)}
.anagram-placed{width:40px;height:48px;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;background:var(--bg-surface);border:2px solid var(--gold);border-radius:8px;cursor:pointer;color:var(--text1);transition:var(--tr)}
.anagram-placed:hover{border-color:var(--red)}
.anagram-actions{display:flex;gap:.6rem;justify-content:center;margin-bottom:.75rem}
.anagram-feedback{font-size:1rem;font-weight:600;min-height:1.4em}
/* ═══ JUEGO: DELETRÉALO ═══ */
.spell-wrap{text-align:center;max-width:500px;margin:0 auto}
.spell-progress{color:var(--text2);margin-bottom:1rem}
.spell-word{display:flex;gap:.3rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.5rem}
.spell-char{width:36px;height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;border-radius:6px;background:var(--bg-surface);border:2px solid var(--border);color:var(--text1)}
.spell-blank{border-style:dashed;border-color:var(--gold);color:var(--gold-dark)}
.spell-filled{border-style:solid}
.spell-correct{background:rgba(74,124,89,.12);border-color:var(--green);color:var(--green)}
.spell-wrong{background:rgba(139,58,58,.1);border-color:var(--red);color:var(--red)}
.spell-keyboard{margin-bottom:.75rem}
.spell-kb-row{display:flex;gap:3px;justify-content:center;margin-bottom:3px}
.spell-key{width:28px;height:36px;font-size:.8rem;font-weight:600;background:linear-gradient(180deg,#f0e6d2,#e0d0b8);border:1px solid rgba(139,99,68,.3);border-radius:5px;color:var(--wood-dark);transition:var(--tr);box-shadow:0 2px 0 rgba(139,99,68,.2)}
body.dark-mode .spell-key{background:linear-gradient(180deg,#2a2018,#1a1410);color:var(--gold);border-color:rgba(201,168,76,.2)}
.spell-key:hover{background:var(--gold);color:#2C1810;transform:translateY(-1px)}
.spell-key:active{transform:translateY(1px);box-shadow:none}
/* ═══ JUEGO: OPCIÓN MÚLTIPLE ═══ */
.quiz-wrap{max-width:550px;margin:0 auto}
.quiz-progress-bar{height:6px;background:rgba(139,99,68,.12);border-radius:3px;margin-bottom:.75rem;overflow:hidden}
.quiz-progress-fill{height:100%;background:linear-gradient(90deg,var(--gold-dark),var(--gold));border-radius:3px;transition:width .4s}
.quiz-counter{text-align:center;color:var(--text2);margin-bottom:.4rem;font-size:.9rem}
.quiz-question{font-family:var(--fh);text-align:center;font-size:1.15rem;color:var(--text1);margin-bottom:.75rem}
.quiz-timer-bar{height:5px;background:rgba(139,99,68,.08);border-radius:3px;margin-bottom:1rem;overflow:hidden}
.quiz-timer-fill{height:100%;background:linear-gradient(90deg,var(--green),var(--gold));border-radius:3px;transition:width 1s linear}
.quiz-options{display:grid;gap:.6rem}
.quiz-opt-btn{padding:.8rem 1rem;background:var(--bg-surface2);border:2px solid var(--border);border-radius:10px;font-size:.9rem;text-align:left;transition:var(--tr);color:var(--text1)}
.quiz-opt-btn:hover{border-color:var(--gold);background:rgba(201,168,76,.06)}
.quiz-correct{background:rgba(74,124,89,.12)!important;border-color:var(--green)!important;color:var(--green)}
.quiz-wrong{background:rgba(139,58,58,.1)!important;border-color:var(--red)!important;color:var(--red)}
/* ═══ JUEGO: MATCH-UP ═══ */
.matchup-wrap{display:flex;flex-direction:column;gap:1rem;max-width:600px;margin:0 auto}
.matchup-col{display:flex;flex-direction:column;gap:.5rem}
.mu-item{padding:.7rem .8rem;background:var(--bg-surface2);border:2px solid var(--border);border-radius:10px;font-size:.9rem;text-align:center;transition:var(--tr);cursor:pointer;color:var(--text1)}
.mu-term{border-left:4px solid var(--blue-mid)}
.mu-def{border-right:4px solid var(--gold)}
.mu-item:hover{border-color:var(--gold);transform:translateY(-2px)}
.mu-selected{background:rgba(201,168,76,.15)!important;border-color:var(--gold)!important;box-shadow:0 0 0 3px rgba(201,168,76,.15)}
.mu-matched{background:rgba(74,124,89,.1)!important;border-color:var(--green)!important;opacity:.6;pointer-events:none}
.mu-wrong{background:rgba(139,58,58,.08)!important;border-color:var(--red)!important;animation:shake2 .3s}
@keyframes shake2{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
/* ═══ JUEGO: 3 EN RAYA ═══ */
.ttt-wrap{text-align:center;max-width:350px;margin:0 auto}
.ttt-turn{font-size:1rem;color:var(--text2);margin-bottom:.75rem}
.ttt-board{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:var(--wood-mid);padding:5px;border-radius:10px;border:2px solid var(--gold-dark);margin-bottom:1rem}
.ttt-cell{aspect-ratio:1;background:var(--bg-surface);border-radius:6px;font-size:2rem;font-weight:700;font-family:var(--fh);color:var(--text1);transition:var(--tr)}
.ttt-cell:hover{background:rgba(201,168,76,.15)}
.ttt-x{color:var(--blue-dark)}
body.dark-mode .ttt-x{color:var(--blue-mid)}
.ttt-o{color:var(--red)}
.ttt-challenge{margin-top:.75rem;padding:1rem;background:rgba(255,255,255,.3);border-radius:10px;border:2px solid var(--gold)}
body.dark-mode .ttt-challenge{background:rgba(255,255,255,.03)}
.ttt-q{font-size:.95rem;color:var(--text1);margin-bottom:.75rem}
.ttt-opts{display:grid;gap:.4rem}
/* ═══ JUEGO: CRUCIGRAMA ═══ */
.cw-wrap{text-align:center}
.cw-grid{display:inline-grid;gap:2px;margin-bottom:1rem;background:var(--wood-dark);padding:3px;border-radius:5px}
body.dark-mode .cw-grid{background:#000}
.cw-cell{width:30px;height:30px;background:var(--bg-surface);position:relative;border-radius:2px}
.cw-black{background:var(--wood-dark)}
body.dark-mode .cw-black{background:#000}
.cw-num{position:absolute;top:1px;left:2px;font-size:.5rem;color:var(--text2);font-weight:600}
.cw-input{width:100%;height:100%;border:none;background:transparent;text-align:center;font-size:.85rem;font-weight:700;font-family:var(--fb);color:var(--text1);outline:none}
.cw-input:focus{background:rgba(201,168,76,.2)}
.cw-clues{text-align:left;max-width:450px;margin:0 auto 1rem}
.cw-clues h4{font-family:var(--fh);color:var(--text1);margin-bottom:.4rem;font-size:1rem}
.cw-clues p{font-size:.85rem;color:var(--text2);margin-bottom:.25rem}
/* ═══ VICTORIA ═══ */
.win-overlay{position:fixed;inset:0;z-index:200;background:rgba(10,8,6,.88);display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}
.win-card{background:var(--bg-surface);padding:2rem 1.5rem;border-radius:18px;text-align:center;max-width:380px;width:92%;border:3px solid var(--gold);box-shadow:0 12px 48px rgba(0,0,0,.5);animation:bounceIn .5s}
.win-card h2{font-family:var(--fh);font-size:1.6rem;color:var(--gold-dark);margin-bottom:.5rem}
.win-card p{color:var(--text2);margin-bottom:1rem;font-size:1rem}
.win-stats{display:flex;justify-content:center;gap:1rem;margin-bottom:1rem}
.win-stats span{padding:.4rem .8rem;background:rgba(201,168,76,.12);border-radius:8px;font-weight:600;color:var(--text1);font-size:.9rem}
.win-card button{margin:.2rem}
@keyframes bounceIn{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.05)}100%{transform:scale(1);opacity:1}}
/* ═══ TOAST ═══ */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);padding:.7rem 1.3rem;border-radius:10px;color:white;font-weight:600;z-index:300;box-shadow:0 4px 16px rgba(0,0,0,.3);animation:toastIn .3s,toastOut .3s 2.2s forwards;font-size:.9rem}
.toast.success{background:linear-gradient(135deg,var(--green),#5a9a6a)}
.toast.error{background:linear-gradient(135deg,var(--red),#a04848)}
.toast.info{background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid))}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(16px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes toastOut{to{opacity:0;transform:translateX(-50%) translateY(16px)}}
/* ═══ FOOTER ═══ */
#main-footer{text-align:center;padding:1.2rem 1rem;color:var(--text2);font-size:.8rem;margin-top:2rem}
.footer-shelf{height:4px;margin-bottom:.75rem;background:linear-gradient(90deg,transparent,var(--wood-mid),var(--gold),var(--wood-mid),transparent);border-radius:2px}
body.dark-mode .footer-shelf{background:linear-gradient(90deg,transparent,rgba(201,168,76,.15),rgba(201,168,76,.3),rgba(201,168,76,.15),transparent)}
.footer-controls{display:flex;justify-content:center;gap:.75rem;margin-bottom:.75rem;flex-wrap:wrap}
.footer-btn{padding:.5rem 1rem;background:rgba(201,168,76,.1);color:var(--gold);border:1px solid rgba(201,168,76,.2);border-radius:8px;font-size:.85rem;transition:var(--tr)}
.footer-btn:hover{background:rgba(201,168,76,.2);border-color:var(--gold)}
.footer-copy{opacity:.6}
/* ═══ MEDIA QUERIES — TABLET ═══ */
@media(min-width:600px){
.game-cards-grid{grid-template-columns:repeat(2,1fr)}
.quiz-options-grid{grid-template-columns:1fr 1fr}
.memory-grid{grid-template-columns:repeat(3,1fr)}
.memory-card{height:130px}
.matchup-wrap{flex-direction:row}
.ws-cell{width:36px;height:36px;font-size:.95rem}
.cw-cell{width:34px;height:34px}
.spell-key{width:32px;height:38px;font-size:.85rem}
.anagram-letter,.anagram-placed{width:44px;height:52px;font-size:1.3rem}
}
/* ═══ MEDIA QUERIES — DESKTOP ═══ */
@media(min-width:960px){
.game-cards-grid{grid-template-columns:repeat(3,1fr)}
.hero-title{font-size:2.5rem}
.logo h1{font-size:1.7rem}
.memory-grid{grid-template-columns:repeat(4,1fr)}
.memory-card{height:140px}
#game-container{padding:2rem}
.tab-content{padding:2rem}
.ws-cell{width:38px;height:38px;font-size:1rem}
.cw-cell{width:36px;height:36px}
.cw-input{font-size:.95rem}
.spell-key{width:36px;height:42px;font-size:.95rem}
.spell-char{width:40px;height:48px;font-size:1.4rem}
.code-input-row{max-width:480px;margin:0 auto}
}