:root{--bg:#fef6e4;--bg2:#e3f6f5;--ink:#172c66;--accent:#f582ae;--accent2:#8bd3dd;--ok:#4ecb71;--card:#fff;--shadow:0 10px 30px #172c661f;color:var(--ink);font-family:Segoe UI,Microsoft YaHei,PingFang SC,Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(circle at 20% 10%, #fff7d6 0, var(--bg) 40%, var(--bg2) 100%);-webkit-user-select:none;user-select:none;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}.screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:3vh;height:100%;padding:3vh 4vw;display:flex}.teacher{align-items:center;gap:2vw;max-width:90vw;display:flex}.teacher .avatar{font-size:9vh;line-height:1;animation:2.4s ease-in-out infinite bob}.teacher .bubble{background:var(--card);box-shadow:var(--shadow);border-radius:3vh;align-items:center;min-height:9vh;padding:2vh 3vw;font-size:4.6vh;font-weight:600;display:flex}.teacher .bubble.en{font-family:Segoe UI,Comic Sans MS,system-ui,sans-serif}.scene{white-space:pre-line;letter-spacing:.04em;font-size:14vh;line-height:1.15}.scene.small{font-size:9vh}.scene-text{background:#ffffffb3;border-radius:2vh;max-width:80vw;padding:1.5vh 2vw;font-size:3.6vh;line-height:1.5}.choices{justify-content:center;align-items:stretch;gap:3vw;width:100%;display:flex}.card{background:var(--card);max-width:22vw;min-height:34vh;box-shadow:var(--shadow);border:1vh solid #0000;border-radius:4vh;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:1vh;padding:2vh;transition:transform .15s,border-color .15s;display:flex;position:relative}.card .visual{word-break:break-all;text-align:center;font-size:15vh;line-height:1.1}.card .visual.text{font-weight:800}.card .visual.multi{max-width:18vw;font-size:7vh;line-height:1.2}.card .label{opacity:.8;font-size:3.4vh;font-weight:600}.card .key{opacity:.35;font-size:2.4vh;position:absolute;top:1.2vh;left:1.6vh}.card.focused{border-color:var(--accent);transform:scale(1.07)}.card.correct{border-color:var(--ok);background:#ecfff1;animation:.6s pop}.card.wrong{opacity:.55;animation:.5s shake}.card.dim{opacity:.25}.card.demo{border-color:var(--ok);background:#ecfff1;animation:.7s infinite jump}.card.nudge{border-color:#ffd803;animation:.6s infinite wiggle}.card .visual.long{word-break:keep-all;white-space:pre-line;font-size:5.2vh;line-height:1.3}.caption{letter-spacing:.08em;white-space:pre-line;background:#ffffffbf;border-radius:2vh;max-width:88vw;padding:1vh 3vw;font-size:4.2vh;font-weight:700;line-height:1.5}.screen.with-caption .scene.small{font-size:8vh}.screen.with-caption .card{min-height:26vh}.screen.with-caption .card .visual{font-size:11vh}.screen.with-caption .card .visual.long{font-size:4.6vh}.song{width:80vw;height:62vh;box-shadow:var(--shadow);background:#000;border:0;border-radius:3vh}.big-button{background:var(--accent);color:#fff;box-shadow:var(--shadow);border:none;border-radius:6vh;padding:3vh 6vw;font-size:5.5vh;font-weight:800;transition:transform .15s}.big-button.secondary{background:var(--accent2);color:var(--ink)}.big-button.focused,.big-button:focus-visible{outline-offset:.5vh;outline:1vh solid #ffd803;transform:scale(1.08)}.pet{font-size:22vh;line-height:1;animation:3s ease-in-out infinite bob}.title{letter-spacing:.05em;margin:0;font-size:7vh;font-weight:900}.subtitle{opacity:.75;margin:0;font-size:3.4vh}.corner{opacity:.4;background:0 0;border:none;font-size:2.2vh;position:fixed;bottom:1.5vh;right:2vw}.corner:hover{opacity:.9}.progress{background:#172c6614;height:1.4vh;position:fixed;top:0;left:0;right:0}.progress>div{background:var(--accent2);height:100%;transition:width .4s}.mic{opacity:.7;align-items:center;gap:1vw;font-size:3vh;display:flex;position:fixed;bottom:2vh;left:2vw}.mic.on:before{content:"";background:#ff4d6d;border-radius:50%;width:1.6vh;height:1.6vh;animation:1s infinite pulse}.mic .heard{opacity:.7;font-size:2.4vh}.hint-row{gap:3vw;display:flex}.stars-burst{font-size:12vh;animation:.8s pop}.countdown{color:var(--accent);font-size:34vh;font-weight:900;line-height:1;animation:.5s pop}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-1.5vh)}}@keyframes pop{0%{transform:scale(.8)}50%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-1.5vw)}75%{transform:translate(1.5vw)}}@keyframes jump{0%,to{transform:translateY(0)scale(1.05)}50%{transform:translateY(-3vh)scale(1.1)}}@keyframes wiggle{0%,to{transform:rotate(0)scale(1.04)}25%{transform:rotate(-3deg)scale(1.06)}75%{transform:rotate(3deg)scale(1.06)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.parent{text-align:left;-webkit-user-select:text;user-select:text;height:100%;padding:24px clamp(16px,5vw,64px);font-size:16px;overflow-y:auto}.parent h1{margin:0 0 4px;font-size:28px}.parent h2{border-bottom:2px solid var(--accent2);margin:28px 0 10px;padding-bottom:4px;font-size:20px}.parent .grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;display:grid}.parent .tile{background:#fff;border-radius:12px;padding:12px 14px;box-shadow:0 2px 10px #172c6614}.parent .tile .name{font-weight:600}.parent .tile .meta{opacity:.65;margin-top:2px;font-size:13px}.parent .stat{background:#fff;border-radius:12px;margin:0 10px 10px 0;padding:12px 18px;display:inline-block;box-shadow:0 2px 10px #172c6614}.parent .stat b{font-size:26px;display:block}.parent label{border-bottom:1px dashed #172c6626;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;display:flex}.parent input[type=text],.parent input[type=month],.parent input[type=number]{font:inherit;border:1px solid #cbd5e1;border-radius:8px;width:160px;padding:6px 10px}.parent input[type=range]{width:160px}.parent .btn{background:var(--ink);color:#fff;border:none;border-radius:10px;margin:6px 8px 6px 0;padding:10px 16px;font-size:15px}.parent .btn.light{color:var(--ink);background:#fff;border:1px solid #cbd5e1}.parent .btn.danger{background:#e11d48}.parent .tip{background:#fff8e1;border-left:4px solid #ffd803;border-radius:8px;margin:6px 0;padding:10px 12px}.parent .badge{background:#eef2ff;border-radius:999px;margin-left:6px;padding:2px 8px;font-size:12px;display:inline-block}.parent .badge.mastered{background:#dcfce7}.parent .badge.review{background:#fee2e2}.parent .badge.learning{background:#fef3c7}.parent .topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}