.marlis-embed{--green:#2ecc71;--yellow:#f1c40f;--blue:#3498db;--orange:#e67e22;--bg:#eef7ff;--panel:#fff;--text:#203040;--muted:#718096;--border:#dce6ef;max-width:1050px;margin:16px auto;font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--text);line-height:1.4}.marlis-embed *{box-sizing:border-box}.marlis-embed .topbar{background:#fff;padding:14px 18px;border-radius:22px 22px 0 0;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.08)}.marlis-logo{display:block;max-width:210px;max-height:80px;object-fit:contain;margin:0 auto 7px}.brand{font-size:clamp(2rem,7vw,3.2rem);font-weight:900}.g{color:var(--green)}.y{color:var(--yellow)}.b{color:var(--blue)}.o{color:var(--orange)}.areas{font-weight:800;color:var(--muted);font-size:.9rem}.stats{font-weight:800;margin-top:7px}.marlis-embed>main{background:var(--bg);padding:18px;border-radius:0 0 22px 22px}.screen{display:none}.screen.active{display:block;animation:fade .18s ease}.screen h1{text-align:center;font-size:clamp(1.45rem,5vw,2.2rem);margin:8px 0}.lead,.muted{text-align:center;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.lesson-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.card{appearance:none;width:100%;background:#fff!important;color:var(--text)!important;border:3px solid var(--border)!important;border-radius:18px;padding:16px 10px;min-height:115px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 5px 14px rgba(0,0,0,.06);cursor:pointer}.card .icon{font-size:2.4rem}.card .title{font-size:1.05rem;font-weight:850;margin-top:5px}.small{font-size:.82rem;color:var(--muted)}.navline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.marlis-embed button{font:inherit}.navline button,.secondary{background:#fff!important;color:var(--text)!important;border:1px solid var(--border)!important;border-radius:12px;padding:9px 13px}.progress{height:8px;background:#d9e5ee;border-radius:99px;overflow:hidden;margin:0 0 12px}.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#2ecc71,#f1c40f,#3498db);transition:.25s}.gamebox{background:#fff;border-radius:20px;padding:15px;box-shadow:0 8px 24px rgba(0,0,0,.07);min-height:0}.question{text-align:center;font-size:clamp(1.05rem,4.2vw,1.4rem);font-weight:850;margin:4px auto 13px;max-width:700px}.options{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:700px;margin:auto}.option,.match,.word,.listen{appearance:none;background:#fff!important;color:var(--text)!important;border:3px solid var(--border)!important;border-bottom-width:5px!important;border-radius:16px;padding:14px 10px;min-height:64px;font-weight:800;cursor:pointer}.option:active,.match:active,.word:active,.listen:active{transform:translateY(2px);border-bottom-width:3px!important}.option.correct,.match.correct{background:#d9ffd0!important;color:#176b2c!important;border-color:#2ecc71!important}.option.wrong,.match.wrong{background:#ffe0e0!important;color:#a11!important;border-color:#e74c3c!important;animation:shake .35s}.match-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;max-width:700px;margin:auto}.match{min-height:76px}.match.selected{background:#e3f4ff!important;color:#126a9b!important;border-color:#3498db!important}.wordbank,.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px auto;max-width:700px}.word,.chip{min-height:48px;padding:9px 13px}.word:disabled{opacity:.35}.chip{background:#e7f4ff!important;color:#126a9b!important;border:2px solid #9bd4f5!important;border-radius:12px}.typing-input{display:block;width:100%;max-width:650px;margin:12px auto;padding:14px;border:3px solid var(--border);border-radius:15px;font-size:1.15rem;color:var(--text);background:#fff}.full-btn{display:block;width:100%;max-width:650px;margin:12px auto 0;background:#3498db!important;color:#fff!important;border:0!important;border-radius:15px;padding:13px;font-weight:850;cursor:pointer}.video-wrap{position:relative;width:100%;max-width:760px;margin:10px auto;padding-top:56.25%;border-radius:16px;overflow:hidden;background:#111}.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.step-note{max-width:700px;margin:8px auto;padding:9px 12px;border-radius:12px;background:#eef7ff;color:#35506a;text-align:center;font-size:.9rem}.flashcard{display:flex;align-items:center;justify-content:center;width:100%;max-width:650px;min-height:180px;margin:10px auto;border:0;border-radius:22px;background:linear-gradient(135deg,#e6f7ff,#fff5c7);color:var(--text);font-size:clamp(2rem,9vw,3.5rem);font-weight:900;cursor:pointer}.flash-nav{display:flex;align-items:center;justify-content:center;gap:20px}.result-card{text-align:center;background:#fff;padding:28px 18px;border-radius:22px;box-shadow:0 8px 24px rgba(0,0,0,.07);max-width:600px;margin:15px auto}.big{font-size:3.8rem}.earned{font-size:2.2rem;font-weight:900;color:#e67e22;margin:8px}.result-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.primary{background:#3498db!important;color:#fff!important;border:0!important;border-radius:14px;padding:12px 18px;font-weight:850;cursor:pointer}.modal{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:18px;z-index:99999}.hidden{display:none!important}.modal-card{background:#fff;max-width:460px;width:100%;border-radius:22px;padding:28px;text-align:center;position:relative}.modal-x{position:absolute;right:12px;top:8px;border:0;background:none;font-size:28px}.haptic-flash{animation:hapticflash .16s}@keyframes hapticflash{0%{transform:scale(1)}50%{transform:scale(.985)}100%{transform:scale(1)}}@keyframes shake{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}@keyframes fade{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}.marlis-embed.no-topbar{margin-top:0}.marlis-embed.no-topbar>main{border-radius:22px}.marlis-embed .screen#game{scroll-margin-top:12px}
@media(max-width:700px){.grid{grid-template-columns:repeat(2,1fr)}.lesson-grid{grid-template-columns:1fr 1fr}.marlis-embed>main{padding:10px}.gamebox{padding:10px}.options{grid-template-columns:1fr 1fr}.option,.match{min-height:58px;padding:11px 8px;font-size:.95rem}.match-grid{gap:8px}.question{margin-bottom:10px}.video-wrap{border-radius:12px}.topbar{padding:10px}.areas{font-size:.75rem}}@media(max-width:420px){.lesson-grid{grid-template-columns:1fr}.card{min-height:96px}.card .icon{font-size:2rem}.options{gap:8px}.option{font-size:.9rem}}