:root{--navy: #0b1b3a;--navy-2: #13284f;--blue: #3b82f6;--orange: #f97316;--text: #e8eefc;--muted: #9db0d0;--card: #162a52;--ok: #22c55e;--bad: #ef4444;--radius: 16px;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;background:var(--navy);color:var(--text);overflow:hidden}#app{width:100%;height:100%;position:relative}#game-container{width:100%;height:100%}#ui-overlay{position:absolute;inset:0;pointer-events:none;display:flex;align-items:stretch;justify-content:center}#ui-overlay>*{pointer-events:auto}.screen{width:min(480px,100%);max-height:100%;overflow:auto;padding:20px 16px 32px;background:linear-gradient(180deg,#0b1b3a,#101f42)}.screen.wide{width:min(920px,100%)}h1,h2,h3{margin:0 0 12px}.muted{color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;padding:14px 18px;font-weight:700;font-size:16px;cursor:pointer;transition:transform .08s ease,opacity .15s ease}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--blue),#2563eb);color:#fff;width:100%}.btn-secondary{background:var(--card);color:var(--text);width:100%;border:1px solid #27406e}.btn-ghost{background:transparent;color:var(--muted);border:1px solid #2a4068}.btn-row{display:grid;gap:10px;margin-top:16px}.card{background:var(--card);border:1px solid #243a66;border-radius:var(--radius);padding:14px 16px;margin-bottom:10px}.card.selectable{cursor:pointer}.card.selectable:hover{border-color:var(--blue)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid-levels{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.level-cell{aspect-ratio:1;border-radius:12px;border:1px solid #2a4068;background:#13284f;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;cursor:pointer}.level-cell.locked{opacity:.35;cursor:not-allowed}.level-cell.done{border-color:#3b82f6}.stars{color:#fbbf24;font-size:12px;letter-spacing:1px}.answer{background:#1a315c;border:2px solid #2d4a7a;border-radius:14px;padding:16px;text-align:center;font-size:20px;font-weight:700;cursor:pointer}.answer.correct{border-color:var(--ok);background:#163528}.answer.wrong{border-color:var(--bad);background:#3a1a1a}.answer.disabled{pointer-events:none;opacity:.7}.hud{display:flex;justify-content:space-between;gap:8px;margin-bottom:16px;font-weight:600}.logo-row{display:flex;align-items:center;gap:12px;margin-bottom:20px}.logo-mark{width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,#3b82f6 0% 50%,#f97316 50% 100%)}.progress-bar{height:8px;background:#1a315c;border-radius:99px;overflow:hidden;margin:8px 0 16px}.progress-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--orange))}.memory-board{display:grid;gap:8px;margin:12px 0}.mem-card{aspect-ratio:1;border-radius:12px;background:#1e3a6e;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;border:2px solid #2d4a7a;user-select:none}.mem-card.face{background:#0f274f}.mem-card.matched{opacity:.55;border-color:var(--ok)}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:#1e3a6e;padding:10px 16px;border-radius:999px;font-size:14px}@media (min-width: 900px){.screen{padding-top:32px}.screen.wide{width:min(1000px,100%)}}

/* Y8 responsive viewport fix: keep the game inside the embed without outer/internal scrollbars. */
html,body,#app,#game-container{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;}
html,body{overflow:hidden;overscroll-behavior:none;}
#app,#game-container{overflow:hidden;}
#ui-overlay{overflow:hidden;min-width:0;min-height:0;}
.screen{width:min(480px,100%);height:100%;max-height:none;min-height:0;overflow:hidden;padding:clamp(10px,2.2vh,20px) clamp(10px,2vw,16px) clamp(12px,3vh,32px);}
.screen.wide{width:min(920px,100%);}
@supports (height:100dvh){html,body,#app,#game-container{height:100dvh;}}
@media (max-height:720px){
 .screen{padding-top:10px;padding-bottom:12px;}
 .logo-row{margin-bottom:10px;gap:8px;}
 .logo-mark{width:40px;height:40px;}
 h1,h2,h3{margin-bottom:7px;}
 .card{padding:9px 12px;margin-bottom:6px;border-radius:12px;}
 .card h3{font-size:15px;}
 .card p{margin:4px 0;font-size:12px;line-height:1.25;}
 .btn{padding:10px 13px;font-size:14px;}
 .btn-row{gap:7px;margin-top:9px;}
 .grid-2{gap:7px;}
 .grid-levels{gap:6px;}
 .level-cell{border-radius:9px;font-size:13px;}
 .answer{padding:10px;font-size:16px;}
 .hud{margin-bottom:9px;font-size:13px;}
 .progress-bar{margin:5px 0 9px;}
 .memory-board{gap:6px;margin:7px 0;}
 .mem-card{font-size:22px;border-radius:9px;}
}
@media (max-height:560px){
 .screen{padding-top:6px;padding-bottom:7px;}
 .logo-row{margin-bottom:6px;}
 .logo-mark{width:34px;height:34px;}
 h1{font-size:20px} h2{font-size:18px} h3{font-size:14px}
 .muted{font-size:11px;}
 .card{padding:6px 9px;margin-bottom:4px;}
 .card p{margin:2px 0;font-size:10px;line-height:1.15;}
 .btn{padding:7px 10px;font-size:12px;border-radius:10px;}
 .btn-row{gap:5px;margin-top:6px;}
 .grid-levels{gap:4px;}
 .stars{font-size:9px;}
 .answer{padding:7px;font-size:14px;}
 .hud{margin-bottom:6px;font-size:11px;}
 .memory-board{gap:4px;margin:5px 0;}
 .mem-card{font-size:18px;}
}
@media (max-width:520px){
 .screen,.screen.wide{width:100%;}
 .grid-levels{grid-template-columns:repeat(5,minmax(0,1fr));}
 .logo-row{min-width:0;}
 .logo-row h1,.logo-row h2,.logo-row h3{min-width:0;overflow-wrap:anywhere;}
}
@media (max-width:380px){
 .screen{padding-left:8px;padding-right:8px;}
 .btn{padding-left:8px;padding-right:8px;}
 .grid-2{gap:5px;}
}