*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f5f0e8;color:#1a1a1a}.app{max-width:480px;margin:0 auto;padding:1.25rem 1rem 0;display:flex;flex-direction:column;gap:1rem;min-height:100dvh}.app-header{display:flex;align-items:center;justify-content:space-between}h1{font-size:1.5rem;font-weight:700;letter-spacing:-.02em}.logout-btn{background:none;border:1px solid #ccc;border-radius:.4rem;padding:.3rem .7rem;font-size:.8rem;color:#888;cursor:pointer}.logout-btn:hover{border-color:#888;color:#444}.back-btn{background:none;border:none;font-size:.9rem;font-weight:600;color:#b07080;cursor:pointer;padding:.3rem 0}.back-btn:hover{color:#8c4a5c}.login-screen{justify-content:center;min-height:100vh;align-items:center;text-align:center}.scenario{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#999}.chips{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.review-chip{font-size:.72rem;padding:.2rem .6rem;border-radius:999px;border:1px dashed #c9c2b4;color:#999}.conversation{display:flex;flex-direction:column;gap:.75rem;flex:1;overflow-y:auto;padding-bottom:.5rem}.message-row{display:flex;align-items:flex-end;gap:.5rem}.message-row--user{flex-direction:row-reverse}.avatar{width:32px;height:32px;border-radius:50%;background:#c8e6c9;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.bubble{padding:.65rem .9rem;border-radius:1.1rem;max-width:78%;line-height:1.5;font-size:.92rem}.bubble--assistant{background:#fff;border-bottom-left-radius:.25rem;box-shadow:0 1px 3px #00000012;position:relative;padding-bottom:1.4rem}.bubble--user{background:#e8c4ce;border-bottom-right-radius:.25rem;font-size:1rem;font-weight:500}.bubble--feedback{background:#fdf3c8;font-style:italic;font-size:.88rem;color:#6b5c00}.bubble-meta{font-size:.72rem;color:#b07080;text-align:right;margin-top:.2rem;margin-right:.25rem}.loading{color:#bbb;font-size:1.4rem;padding-left:2.5rem}.hint{font-style:italic;color:#999;font-size:.82rem;padding:0 .25rem}.error-panel{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:#fdecea;border:1.5px solid #e57373;border-radius:.6rem;padding:.75rem 1rem}.error-panel__msg{color:#c0392b;font-size:.9rem;flex:1}.error-panel__retry{padding:.4rem 1rem;background:#c0392b;color:#fff;border:none;border-radius:.4rem;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap}.error-panel__retry:disabled{opacity:.5;cursor:default}.banner{background:#c8e6c9;padding:1rem;border-radius:.75rem;font-weight:600;text-align:center;font-size:1.05rem;display:flex;flex-direction:column;align-items:center;gap:.75rem}.continue-btn{padding:.6rem 1.4rem;background:#1a1a1a;color:#fff;border:none;border-radius:.5rem;font-size:.95rem;font-weight:600;cursor:pointer}.bottom-area{position:sticky;bottom:0;background:#f5f0e8;padding:.75rem 0 1.25rem;display:flex;flex-direction:column;align-items:center;gap:.75rem}.focus-word{background:#fff;border-radius:1rem;padding:.75rem 1.5rem;text-align:center;width:100%;box-shadow:0 1px 4px #00000014;display:flex;align-items:center;justify-content:center;gap:.75rem}.focus-word__pl{font-size:1.5rem;font-weight:700;font-style:italic;color:#c0435a}.focus-word__en{font-size:.85rem;color:#aaa}.mic-row{display:flex;flex-direction:column;align-items:center;gap:.4rem;position:relative;width:100%}.mic-btn{width:68px;height:68px;border-radius:50%;border:none;background:linear-gradient(135deg,#d45078,#8b44c8);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #b43c7866;transition:transform .15s ease,box-shadow .15s ease}.mic-btn:active{transform:scale(.94)}.mic-btn--listening{animation:mic-pulse 1.5s ease-in-out infinite;box-shadow:0 4px 20px #b43c7899}.mic-btn--processing,.mic-btn--speaking{opacity:.5;cursor:default}.mic-btn--recording{animation:mic-pulse .8s ease-in-out infinite;box-shadow:0 4px 24px #d2325abf}.mic-btn svg{width:28px;height:28px;fill:#fff}@keyframes mic-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.mic-label{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:#aaa}.replay-speech-btn{background:none;border:1px solid #555;border-radius:12px;color:#aaa;font-size:.7rem;padding:.15rem .6rem;cursor:pointer;transition:color .15s ease,border-color .15s ease}.replay-speech-btn:hover:not(:disabled){color:#ddd;border-color:#888}.replay-speech-btn:disabled{opacity:.3;cursor:default}.mode-toggle{display:flex;align-items:center;gap:.5rem;align-self:flex-end}.mode-toggle__label{font-size:.78rem;color:#888}.switch{width:40px;height:22px;border-radius:11px;border:none;background:#ccc;cursor:pointer;padding:0;position:relative;transition:background .15s ease}.switch--on{background:#d45078}.switch__knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #00000040;transition:transform .15s ease}.switch--on .switch__knob{transform:translate(18px)}.noise-toast{width:100%;background:#fff6e5;border:1.5px solid #e0b04a;border-radius:.6rem;padding:.75rem .9rem;display:flex;flex-direction:column;gap:.6rem}.noise-toast__body{font-size:.85rem;line-height:1.45;color:#6b5400}.noise-toast__actions{display:flex;gap:.5rem;justify-content:flex-end}.noise-toast__action{padding:.4rem .9rem;background:#d45078;color:#fff;border:none;border-radius:.4rem;font-size:.8rem;font-weight:600;cursor:pointer}.noise-toast__dismiss{padding:.4rem .9rem;background:none;border:1px solid #d0b070;color:#8a6d20;border-radius:.4rem;font-size:.8rem;cursor:pointer}.replay-btn{position:absolute;bottom:.4rem;right:.4rem;background:none;border:none;padding:0;font-size:.85rem;cursor:pointer;opacity:.45;line-height:1;transition:opacity .15s}.replay-btn:hover:not(:disabled){opacity:1}.replay-btn:disabled{opacity:.2;cursor:default}.signal-meter{display:flex;align-items:flex-end;gap:2px;height:14px}.signal-bar{width:4px;border-radius:1px;background:#ddd}.signal-bar--1{height:4px}.signal-bar--2{height:7px}.signal-bar--3{height:10px}.signal-bar--4{height:14px}.signal-bar--active{background:#d45078}.input-row{display:flex;gap:.5rem;width:100%}.input-row--secondary input{flex:1;padding:.5rem .8rem;border:1px solid #ddd;border-radius:.5rem;font-size:.85rem;background:#fff;outline:none;opacity:.75}.input-row--secondary input:focus{opacity:1;border-color:#aaa}.input-row--secondary button{padding:.5rem 1rem;background:#1a1a1a;color:#fff;border:none;border-radius:.5rem;font-size:.85rem;cursor:pointer;opacity:.75}.input-row--secondary button:disabled{opacity:.35;cursor:default}.diag-row{display:flex;gap:.5rem;width:100%}.noise-test-btn{background:none;border:1px dashed #c0a0a8;border-radius:.5rem;padding:.4rem .8rem;font-size:.78rem;color:#a07080;cursor:pointer;flex:1}.noise-test-btn:disabled{border-style:solid;border-color:#d45078;color:#d45078;background:#fdf0f3;cursor:default}.start-screen{display:flex;flex-direction:column;align-items:center;gap:1.25rem;padding:2rem 0 1rem}.intro{background:#fff;border-radius:.75rem;padding:1rem 1.25rem;font-size:.9rem;line-height:1.6;color:#555;text-align:center;box-shadow:0 1px 3px #0000000f}.start-btn{padding:.85rem 2.5rem;background:linear-gradient(135deg,#d45078,#8b44c8);color:#fff;border:none;border-radius:2rem;font-size:1.05rem;font-weight:600;cursor:pointer;box-shadow:0 4px 14px #b43c7859}.chip{background:#ebe6dd;border-radius:999px;padding:.4rem .85rem;display:inline-flex;flex-direction:column;align-items:center;gap:.05rem;transition:background .3s ease}.chip--mastered{background:#d4ecd5}.chip--struggled{background:#f7e3c0}.chip__retry{font-size:.8rem;color:#b07a2a;margin-top:.1rem;line-height:1}.chip .pl{font-weight:600;font-size:.88rem}.chip .en{font-size:.7rem;color:#888}.confidence-bars{display:flex;gap:2px;margin-top:.2rem}.bar{width:5px;height:6px;border-radius:1px;background:#adc9ae}.bar--filled{background:#4a9e4e}.dashboard{display:flex;flex-direction:column;gap:.75rem;padding-bottom:1.5rem}.dash-loading{color:#999;text-align:center;padding:2rem 0}.lesson-card{background:#fff;border:none;border-radius:1rem;padding:.9rem 1.1rem;text-align:left;cursor:pointer;box-shadow:0 1px 4px #00000012;display:flex;flex-direction:column;gap:.45rem;font:inherit;color:inherit;transition:transform .12s ease,box-shadow .12s ease}.lesson-card:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 3px 10px #0000001a}.lesson-card--locked{opacity:.55;cursor:default;background:#efeae1;box-shadow:none}.lesson-card--complete{background:#f2f9f2}.lesson-card__top{display:flex;align-items:center;gap:.6rem}.lesson-card__num{width:26px;height:26px;border-radius:50%;background:#ebe6dd;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;color:#888;flex-shrink:0}.lesson-card--complete .lesson-card__num{background:#c8e6c9;color:#2e7d32}.lesson-card__title{font-weight:700;font-size:1rem;flex:1}.lesson-card__badge{font-size:.75rem;font-weight:600;color:#b07080}.lesson-card--complete .lesson-card__badge{color:#2e7d32}.lesson-card__desc{font-size:.82rem;color:#999;line-height:1.4}.lesson-card__words{display:flex;flex-wrap:wrap;gap:.3rem}.word-pill{font-size:.7rem;padding:.15rem .5rem;border-radius:999px;background:#ebe6dd;color:#888}.word-pill--mastered{background:#d4ecd5;color:#2e7d32}.transcripts{display:flex;flex-direction:column;gap:.5rem;padding-bottom:2rem}.transcripts__heading{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#999;margin-top:.5rem}.transcript{background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000000f;overflow:hidden}.transcript__row{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;padding:.7rem 1rem;background:none;border:none;font:inherit;color:inherit;cursor:pointer;text-align:left}.transcript__row:hover{background:#faf7f1}.transcript__title{font-weight:600;font-size:.88rem}.transcript__meta{font-size:.75rem;color:#aaa;white-space:nowrap}.transcript__body{display:flex;flex-direction:column;gap:.5rem;padding:.5rem 1rem 1rem;border-top:1px solid #f0ece3}.transcript__body .bubble--assistant{padding-bottom:.65rem;align-self:flex-start}.transcript__body .bubble--user{align-self:flex-end}
