:root{color-scheme:light;--ink:#192e34;--muted:#5a6b70;--paper:#f6f5ef;--blue:#b9d6ee;--blue-deep:#305974;--line:#dce0dc;--green:#28604b;--font:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);-webkit-tap-highlight-color:transparent}button,select{font:inherit;color:inherit}button{cursor:pointer}button,select,a{touch-action:manipulation}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #3577a8;outline-offset:4px}button{border:0}button:disabled{cursor:default}a{color:inherit;text-decoration:none}.app{max-width:920px;margin:auto;padding:26px 32px 20px}.top{display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;font-size:25px;font-weight:850;letter-spacing:-1.1px}.brand-dot{color:#719fb5}.brandmark{width:36px;height:30px;position:relative;margin-right:10px}.brandmark i{position:absolute;display:block;width:20px;height:26px;border:2px solid var(--ink);border-radius:5px;background:var(--paper);transform:rotate(-13deg);top:2px}.brandmark i+ i{transform:rotate(12deg);left:12px;background:var(--blue)}.round{width:38px;height:38px;border:1px solid #ccd4d2;background:transparent;border-radius:50%;font-size:18px;font-weight:750}.round:hover{background:#e7eeed}.intro{padding:35px 0 26px;text-align:center}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2.2px;color:#55716f}h1{margin:11px 0 10px;font-size:clamp(27px,4vw,42px);line-height:1.12;font-weight:800;letter-spacing:-1.8px}h1 span{color:#84a896}.intro p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}.game{background:#fff;border-radius:23px;border:1px solid #dde1db;box-shadow:0 12px 32px #1b343108;overflow:hidden}.settings{display:flex;justify-content:space-between;align-items:center;padding:19px 24px;border-bottom:1px solid #edf0eb;gap:15px}.modes{display:flex;background:#f0f2ee;padding:4px;border-radius:13px;gap:2px}.mode{background:transparent;font-size:13px;font-weight:750;border-radius:10px;padding:11px 16px;white-space:nowrap}.mode span{margin-right:7px;color:#536d74}.mode.active{background:var(--blue);box-shadow:0 2px 4px #25445810;color:#172e3b}.level-label{display:flex;gap:10px;align-items:center;font-size:9px;font-weight:800;letter-spacing:1px;color:#5a6b70}select{background:#fff;padding:10px 25px 10px 12px;border:1px solid #d9dfdc;border-radius:10px;font-size:12px;font-weight:650;letter-spacing:0}.play-area{max-width:620px;margin:auto;padding:18px 24px 0}.scoreboard{display:flex;justify-content:space-between;max-width:410px;margin:0 auto 14px;text-align:center;gap:25px}.scoreboard>div{min-width:73px}.stat-label{display:block;font-size:9px;letter-spacing:1.5px;color:#657675;font-weight:800;margin-bottom:6px}.scoreboard strong{font-size:24px;font-weight:750;letter-spacing:-.5px;font-variant-numeric:tabular-nums}.stat-total{color:#81918f;font-size:18px;font-weight:500}.progress{height:4px;background:#edf1ed;border-radius:5px;overflow:hidden;margin:0 0 18px}.progress span{display:block;width:0;height:100%;background:#79ac93;transition:width .4s}.board{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:auto;max-width:440px}.board.large{grid-template-columns:repeat(6,1fr);max-width:570px}.card{position:relative;padding:0;aspect-ratio:1.12;border-radius:13px;background:transparent;perspective:800px;min-width:0}.card-inner{height:100%;width:100%;display:block;position:relative;transform-style:preserve-3d;transition:transform .32s cubic-bezier(.22,.7,.3,1)}.card.flipped .card-inner,.card.matched .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:13px;backface-visibility:hidden;-webkit-backface-visibility:hidden}.card-back{background-color:#bcd6e9;background-image:radial-gradient(#8eafc155 .8px,transparent .8px);background-size:9px 9px;border:1px solid #a7c4d9;box-shadow:0 3px 0 #9fbacf;color:#315970}.card-back:after{content:"✦";width:39%;aspect-ratio:1;border:1px solid #7b9eb375;border-radius:50%;display:grid;place-items:center;font-size:27px;background:#c9dfedc9}.card:hover:not(.flipped):not(.matched) .card-back{background-color:#cce3f3;box-shadow:0 4px 0 #8cabc0}.card-front{transform:rotateY(180deg);background:#fffcf7;border:1.5px solid #c8d2cc;box-shadow:0 2px 0 #d4ddd6;flex-direction:column;gap:3px}.emoji{font-size:clamp(30px,5vw,43px);line-height:1.05;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}.card-name{font-size:9px;color:#526660;font-weight:650;max-width:100%;padding:0 3px;white-space:nowrap}.card.matched .card-front{background:#e5f1e7;border-color:#97b9a2;box-shadow:0 2px 0 #bad1c0}.card.matched .card-front:after{content:"✓";position:absolute;top:4px;right:7px;font-size:12px;color:var(--green);font-weight:850}.card.wrong .card-front{border-color:#cb9d8d;background:#fff0e9}.feedback{min-height:53px;display:flex;align-items:center;justify-content:center;text-align:center;color:#385b56;font-size:13px;font-weight:650;line-height:1.4;padding:10px 0}.bottom-bar{border-top:1px solid #edf0eb;display:flex;align-items:center;justify-content:space-between;padding:14px 24px;gap:10px;background:#fcfdfb}.bottom-bar>span{color:#67766d;font-size:11px;display:flex;align-items:center;gap:7px}.little-dot{height:6px;width:6px;background:#92b19e;border-radius:50%;flex-shrink:0}.restart{background:#eef2ee;padding:10px 13px;border:1px solid #dce4dc;border-radius:9px;font-size:12px;font-weight:750;white-space:nowrap}.restart span{font-size:17px;margin-right:4px}.restart:hover{background:#e0eae1}footer{display:flex;justify-content:space-between;color:#60736e;font-size:10px;padding:16px 3px;gap:10px}.footer-note{color:#75877f}.footer-note span{margin-left:4px}dialog{border:1px solid #d7dfd8;border-radius:24px;width:min(90vw,420px);color:var(--ink);padding:0;box-shadow:0 30px 100px #17352c30}dialog::backdrop{background:#122e3266;backdrop-filter:blur(4px)}.dialog-content{padding:30px;text-align:center}.dialog-content h2{font-size:27px;letter-spacing:-.8px;margin:12px 0}.dialog-content p{font-size:14px;line-height:1.6;color:#526660}.dialog-icon{font-size:42px}.dialog-actions{display:flex;gap:8px;justify-content:center;margin-top:24px}.dialog-actions button{padding:13px 18px;border-radius:11px;font-size:14px;font-weight:750;background:var(--blue)}.dialog-actions .cancel{background:#fae8e5;color:#8d352b}.help-example{font-size:29px;background:#f0f4ed;padding:14px;border-radius:13px;margin:17px 0;letter-spacing:6px}.win-stats{background:#eff5ee;padding:15px;border-radius:12px;font-weight:700;font-size:15px;color:#355748;margin-top:18px}.confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:20}.confetti i{position:absolute;top:-20px;width:8px;height:15px;background:#b9d6ee;animation:fall 2s ease-in forwards}.confetti i:nth-child(3n){background:#92b89d}.confetti i:nth-child(3n + 1){background:#e5bd84}@keyframes fall{to{transform:translateY(105vh) rotate(540deg);opacity:.1}}@media(min-width:760px){.app{max-width:860px}.board{max-width:420px}.intro{padding-top:32px}.card{aspect-ratio:1.25}.board.large .card{aspect-ratio:1.05}}@media(max-width:600px){.app{padding:18px 15px 12px}.brand{font-size:23px}.intro{padding:26px 0 20px}h1{letter-spacing:-1.1px}.eyebrow{font-size:8px;letter-spacing:1.7px}.intro p{font-size:12px;max-width:330px;margin:auto;min-height:36px}.settings{padding:13px;flex-direction:column;gap:12px}.modes{width:100%}.mode{flex:1;padding:11px 9px}.level-label{width:100%;justify-content:space-between;padding:0 4px}select{padding:8px 27px 8px 10px}.play-area{padding:15px 14px 0}.scoreboard{margin-bottom:12px}.scoreboard strong{font-size:22px}.board{gap:8px}.board.large{grid-template-columns:repeat(4,1fr);gap:7px}.card{aspect-ratio:1.08}.card-back:after{font-size:22px}.emoji{font-size:33px}.card-name{font-size:8px}.card.matched .card-front:after{font-size:10px;top:3px;right:5px}.feedback{font-size:12px;min-height:48px}.bottom-bar{padding:12px}.bottom-bar>span{font-size:9px;max-width:160px;line-height:1.5}.restart{font-size:11px;padding:9px 10px}.footer-note{display:none}footer{justify-content:center}.game{border-radius:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}.confetti{display:none}}
/* Paleta corporativa Sari / Canary Options, verificada el 18-10-2026. */
:root{--sari-azul:#1688B4;--sari-amarillo:#E3BB32;--sari-naranja:#E17B46;--sari-verde:#77A56B;--sari-rojo-coral:#D15B63;--sari-violeta:#8174B3;--sari-gris:#8B929B;--ink:#111;--paper:#f3f7fa;--blue:#c4e6f1;--blue-deep:#1688B4;--green:#355b2c;--muted:#465467}
body{background:radial-gradient(ellipse at 5% 0%,#1688b414,transparent 50%),radial-gradient(ellipse at 95% 100%,#8174b312,transparent 55%),var(--paper)}.brand-dot,h1 span{color:var(--sari-azul)}.brandmark i{border-color:var(--sari-azul)}.brandmark i+i{background:var(--sari-amarillo)}.eyebrow{color:#37596d}.header-actions{display:flex;align-items:center;gap:9px}.sound{border:1px solid #a9cbd8;background:#e2f2f8;border-radius:20px;font-size:12px;font-weight:750;padding:10px 12px;min-height:40px}.sound[aria-pressed=false]{background:#e7e9ed;border-color:var(--sari-gris)}.round{border-color:var(--sari-azul);color:#111}.game{border-color:#bdcfda;border-top:4px solid var(--sari-azul)}.modes{background:#edf1f5}.mode.active{background:#bde2f0;color:#000;box-shadow:inset 0 -3px var(--sari-azul)}#related.active{background:#e4dff1;box-shadow:inset 0 -3px var(--sari-violeta)}.mode span{color:#182e42}select{color:#000;font-weight:750}.stat-label{color:#465467}.scoreboard>div{border-radius:10px;padding:7px 12px;background:#f0f4f7}.scoreboard>div:first-child{background:#77a56b20}.scoreboard>div:last-child{background:#e3bb322b}.scoreboard{gap:12px}.stat-total{color:#536371}.progress span{background:var(--sari-verde)}.card-back{background-color:#c1e2ee;background-image:radial-gradient(#1688b438 .8px,transparent .8px);border-color:var(--sari-azul);box-shadow:0 3px 0 #1688b4a3;color:#174657}.card-back:after{border-color:#1688b470;background:#e1f2f8b8}.card:hover:not(.flipped):not(.matched) .card-back{background-color:#d3edf6;box-shadow:0 4px 0 var(--sari-azul)}.card-front{background:#fff;border-color:#aabac5}.card-name{color:#111;font-weight:750;overflow:hidden;text-overflow:ellipsis;max-width:95%}.card.matched .card-front{background:#e4efdf;border-color:var(--sari-verde);box-shadow:0 2px 0 var(--sari-verde)}.card.wrong .card-front{background:#f8e5e7;border-color:var(--sari-rojo-coral)}.feedback{color:#000;font-weight:750;min-height:58px}.restart{color:#000;background:#f8e5db;border-color:var(--sari-naranja)}.restart:hover{background:#f4d7c7}.bottom-bar{background:#f7f9fb;border-top-color:#dde5ea}.bottom-bar>span{color:#465467}.little-dot{background:var(--sari-violeta)}.dialog-actions button{color:#000;background:#bde2f0;font-weight:800;border:1px solid var(--sari-azul)}.dialog-actions .cancel{background:#f2d8db;border-color:var(--sari-rojo-coral);color:#000}.win-stats{background:#e4efdf;color:#111}.confetti i{background:var(--sari-azul)}.confetti i:nth-child(3n){background:var(--sari-verde)}.confetti i:nth-child(3n + 1){background:var(--sari-amarillo)}.app:has(.dense){max-width:1100px}.play-area:has(.dense){max-width:960px}.board.dense{max-width:none;grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:9px}.board.dense .card{aspect-ratio:1;min-height:44px}.board.dense .emoji{font-size:clamp(28px,3.7vw,42px)}.board.dense .card-back:after{font-size:22px}.board.dense .card-name{font-size:9px}footer{color:#465467}
@media(max-width:600px){.header-actions{gap:7px}.sound{font-size:11px;padding:9px 10px}.board.dense{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.board.dense .card,.board.dense .card-face{border-radius:8px}.board.dense .card{aspect-ratio:.94}.board.dense .emoji{font-size:28px}.board.dense .card-name{display:none}.board.dense .card-back:after{width:50%;font-size:17px}.board.dense .card.matched .card-front:after{font-size:9px;top:1px;right:3px}.board.dense .card-inner{transition-duration:.22s}.scoreboard>div{padding:6px 10px}.app:has(.dense){padding-inline:10px}.play-area:has(.dense){padding-inline:10px}.intro{padding-top:22px}.settings{gap:9px}.feedback{min-height:54px}}
@media(max-width:359px){.board.dense{grid-template-columns:repeat(5,minmax(0,1fr))}.brand{font-size:21px}.brandmark{margin-right:6px}.sound{padding-inline:8px}}

/* Adjustable layout and low-glare pastel theme */
.view-settings{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 24px;border-bottom:1px solid var(--line);font-size:13px;font-weight:700}
.view-settings span{font-size:11px;color:var(--muted)}
.top{gap:12px;flex-wrap:wrap}.header-actions{flex-wrap:wrap}
.board[data-layout]:not([data-layout="auto"]){grid-template-columns:repeat(var(--chosen-columns),minmax(0,1fr));max-width:none;gap:6px}
.play-area:has([data-layout]:not([data-layout="auto"])){max-width:960px}
.app:has([data-layout]:not([data-layout="auto"])){max-width:1100px}
.board[data-layout]:not([data-layout="auto"]) .card{aspect-ratio:.9;min-height:0;container-type:inline-size}
.board[data-layout]:not([data-layout="auto"]) .emoji{font-size:clamp(14px,53cqw,68px)}
.board[data-layout]:not([data-layout="auto"]) .card-name{display:block;font-size:clamp(7px,12cqw,13px);white-space:normal;text-align:center;line-height:1.1}
.board[data-layout="10"] .card-name,.board[data-layout="8"] .card-name{display:none}
.board[data-layout]:not([data-layout="auto"]) .card-back:after{font-size:clamp(12px,35cqw,32px)}
[data-theme="dark"]{color-scheme:dark;--ink:#edf0f6;--paper:#191d28;--muted:#bdc6d8;--line:#42495e;--green:#b9dcb1}
[data-theme="dark"] body{background:#191d28}
[data-theme="dark"] .game,[data-theme="dark"] dialog{background:#252b3b;color:var(--ink);border-color:#535e76}
[data-theme="dark"] .settings,[data-theme="dark"] .bottom-bar{border-color:#42495e}
[data-theme="dark"] .bottom-bar,[data-theme="dark"] .modes{background:#202535}
[data-theme="dark"] .mode{color:#edf0f6}
[data-theme="dark"] .mode.active{color:#111}
[data-theme="dark"] .mode span{color:inherit}
[data-theme="dark"] select{background:#30394c;color:#edf0f6;border-color:#68758e}
[data-theme="dark"] .sound,[data-theme="dark"] .round{background:#333f54;color:#e2edf8;border-color:#819db8}
[data-theme="dark"] .eyebrow,[data-theme="dark"] .stat-label,[data-theme="dark"] .stat-total,[data-theme="dark"] .level-label,[data-theme="dark"] footer,[data-theme="dark"] .footer-note,[data-theme="dark"] .bottom-bar>span,[data-theme="dark"] .dialog-content p{color:#bdc6d8}
[data-theme="dark"] .feedback{color:#e2def3}
[data-theme="dark"] .scoreboard>div{background:#343d50}
[data-theme="dark"] .scoreboard>div:first-child{background:#34483e}
[data-theme="dark"] .scoreboard>div:last-child{background:#494333}
[data-theme="dark"] .progress{background:#40495e}
[data-theme="dark"] .card-back{background-color:#536782;border-color:#a4bdd7;color:#d9e5f6;box-shadow:0 3px 0 #38465c}
[data-theme="dark"] .card-back:after{background:#627894;border-color:#a4bdd7}
[data-theme="dark"] .card:hover:not(.flipped):not(.matched) .card-back{background-color:#647c9b}
[data-theme="dark"] .card-front{background:#394155;border-color:#a99bc6;box-shadow:0 2px 0 #202535}
[data-theme="dark"] .card-name{color:#f0edf7}
[data-theme="dark"] .card.matched .card-front{background:#3b554b;border-color:#a5c6a1}
[data-theme="dark"] .card.wrong .card-front{background:#65434d;border-color:#e1a8b5}
[data-theme="dark"] .help-example,[data-theme="dark"] .win-stats{background:#394155;color:#edf0f6}
@media(max-width:600px){.view-settings{padding:12px}.view-settings span{flex-basis:100%}.header-actions{gap:5px}.sound{padding:8px;font-size:11px}}
