*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden;font-family:Comic Sans MS,Trebuchet MS,Noto Sans Khmer,system-ui,sans-serif;background:#1d1b4b;color:#fff}.screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;padding:16px}#lobby,#menu{background:radial-gradient(circle at 30% 20%,#5b4bdb,#1d1b4b 70%)}h1{font-size:clamp(32px,6vw,64px);text-shadow:0 4px 0 #0005}#qr{background:#fff;padding:16px;border-radius:20px;box-shadow:0 10px 30px #0006;min-width:150px;min-height:150px;display:grid;place-items:center;color:#333}#code{font-size:28px;letter-spacing:4px;background:#ffd23f;color:#1d1b4b;padding:6px 18px;border-radius:12px;font-weight:700}#status{font-size:20px;opacity:.9}.hint{opacity:.6;font-size:15px;max-width:520px}.warn{background:#ff5d5d;padding:10px 14px;border-radius:12px;max-width:560px;font-size:15px}.cards{display:flex;gap:24px;flex-wrap:wrap;justify-content:center}.card{width:220px;height:240px;border-radius:28px;background:#fff2;border:5px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;font-size:90px;transition:transform .15s,border-color .15s}.card span{font-size:24px}.card.sel{border-color:#ffd23f;transform:scale(1.1);background:#fff3}.card.soon{opacity:.45}.card.shake{animation:shake .4s}@keyframes shake{25%{transform:translate(-10px) scale(1.1)}75%{transform:translate(10px) scale(1.1)}}#badge{font-size:16px;opacity:.8}.play{padding:0}#race{background:#3fa34d}#balloon{background:#6ec6ff}#fish{background:#0d47a1}#cv{position:absolute;top:0;right:0;bottom:0;left:0}#hud{position:absolute;top:14px;left:50%;transform:translate(-50%);background:#0007;padding:8px 22px;border-radius:30px;font-size:28px;white-space:nowrap}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0008}.box{background:#fff;color:#1d1b4b;padding:30px 44px;border-radius:28px;font-size:24px;line-height:1.6}.box h2{font-size:48px;color:#ff5d5d}.lobby-row{display:flex;gap:48px;align-items:center;justify-content:center;flex-wrap:wrap}.hello,.join{display:flex;flex-direction:column;align-items:center;gap:14px}.hello p{font-size:30px}.photo{width:min(260px,32vh);height:min(260px,32vh);border-radius:50%;object-fit:cover;border:8px solid #ffd23f;box-shadow:0 10px 30px #0006;animation:bob 3s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-10px) rotate(-2deg)}}.menu-title{display:flex;align-items:center;gap:18px}.avatar{width:1.4em;height:1.4em;border-radius:50%;object-fit:cover;border:4px solid #ffd23f}#abc{background:radial-gradient(circle at 50% 30%,#fff6d6,#ffd9a8 70%);color:#1d1b4b;gap:2vh}#abc .hint{opacity:.7}.tabs{display:flex;gap:12px;align-items:center;font-size:24px}.tabs span{padding:6px 20px;border-radius:30px;background:#0001}.tabs span.on{background:#1d1b4b;color:#fff}.tabs small{opacity:.5;font-size:16px}.learn{display:flex;align-items:center;gap:4vw}.arrow{font-size:60px;opacity:.3}.letter-card{background:#fff;border-radius:40px;padding:2vh 6vw;box-shadow:0 12px 0 var(--c),0 20px 40px #0002;animation:pop .35s}@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.05)}}.big-letter{font-size:min(30vh,30vw);line-height:1;font-weight:700;color:var(--c);text-shadow:0 6px 0 #0002}.big-letter small{font-size:.6em;margin-left:.15em}.pic{font-size:min(16vh,16vw);line-height:1.1}.pic.small{font-size:1em;vertical-align:middle}.word{font-size:min(7vh,7vw)}.word b{color:var(--c)}.quiz{display:flex;flex-direction:column;align-items:center;gap:4vh}.ask{font-size:min(9vh,9vw)}.ask b{background:#1d1b4b;color:#ffd23f;padding:0 .4em;border-radius:20px}.choices{display:flex;gap:4vw}.choice{width:min(26vh,26vw);height:min(26vh,26vw);border-radius:36px;background:#fff;display:grid;place-items:center;font-size:min(18vh,18vw);font-weight:700;color:var(--c);border:8px solid transparent;box-shadow:0 10px #0002;transition:transform .15s}.choice.sel{border-color:#1d1b4b;transform:scale(1.1)}.choice.right{background:#3ddc84;color:#fff;animation:pop .4s}.choice.shake{animation:shake .4s}.stars{font-size:40px;min-height:50px}#hud{display:flex;align-items:center;gap:6px}.tokens{display:inline-flex;align-items:baseline;gap:6px;min-width:1.2em}.tokens b{font-size:26px;opacity:.85;text-shadow:0 2px 0 #0008}.tokens b.last{font-size:38px;opacity:1;animation:pop .35s}.box .reach{font-size:44px;color:#ff5d5d}#abc.km .big-letter{font-size:min(26vh,26vw);line-height:1.25}#abc.km .choice{font-size:min(14vh,14vw);line-height:1.3}#abc.km .ask b{line-height:1.4;display:inline-block}.sound-pill{position:fixed;right:16px;bottom:16px;z-index:10;font:inherit;font-size:18px;padding:10px 18px;border:0;border-radius:30px;background:#ffd23f;color:#1d1b4b;box-shadow:0 6px 20px #0006;cursor:pointer;animation:bob 2s ease-in-out infinite}