:root{--bg:#fff6e9;--paper:#fff;--ink:#2b2340;--muted:#8a8199;--line:#efe4d2;--orange:#ff8a3d;--orange-d:#e06a1c;--blue:#3d8bff;--blue-d:#2167d6;--green:#22b865;--green-d:#15924c;--red:#f0544f;--red-d:#c93530;--yellow:#ffc93c;--yellow-d:#d9a21f;--purple:#8b6cff;--soft-blue:#e7f0ff;--soft-green:#e3f8ec;--soft-red:#fde8e7;--soft-orange:#ffebdb;--soft-yellow:#fff4d1;--radius:24px;--ph-vowel:#e5484d;--ph-consonant:#2167d6;--ph-silent:#b8b0c4}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%;margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Rounded,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0}button:disabled{cursor:default;opacity:.5}input,select,textarea{font:inherit;color:inherit}img{display:block}.phw{letter-spacing:.02em;flex-wrap:wrap;align-items:flex-end;gap:0 .35em;font-weight:800;line-height:1.1;display:inline-flex}.phw-sm{font-size:22px}.phw-md{font-size:40px}.phw-lg{font-size:72px}.phw-group,.phw-word{align-items:flex-end;display:inline-flex}.phw-dot{color:var(--muted);margin:0 .08em;font-weight:400}.phw-syl{border-radius:.15em;padding:0 .04em;transition:background .15s,transform .15s;position:relative}.phw-syl.is-stressed:before{content:"ˈ";color:var(--orange-d);font-size:.6em;position:absolute;top:-.32em;left:-.12em}.phw-syl.is-stressed{text-decoration:underline;-webkit-text-decoration-color:var(--yellow);text-decoration-color:var(--yellow);text-underline-offset:.12em;text-decoration-thickness:.12em}.phw-syl.is-active{background:var(--soft-yellow);transform:translateY(-.05em)scale(1.06)}.phw-vowel{color:var(--ph-vowel)}.phw-consonant{color:var(--ph-consonant)}.phw-silent{color:var(--ph-silent)}.phw-other{color:var(--muted)}.phw-l.is-magic{text-underline-offset:.18em;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.spinner{border:4px solid var(--line);border-top-color:var(--orange);border-radius:50%;width:36px;height:36px;margin:40px auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-box{background:var(--soft-red);color:var(--red-d);border-radius:16px;margin:12px 0;padding:14px 18px}