:root{--bg: #0f0f1a;--surface: #1a1a2e;--surface2: #16213e;--primary: #ff6b35;--primary-dim: rgba(255, 107, 53, .15);--secondary: #4ecdc4;--text: #f0f0f0;--text-muted: #888;--border: rgba(255,255,255,.08);--radius: 16px;--radius-sm: 10px;--shadow: 0 4px 24px rgba(0,0,0,.4)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;overflow-x:hidden}.page{min-height:100svh;max-width:480px;margin:0 auto;padding:0 16px 32px;display:flex;flex-direction:column}.card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);padding:20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;border:none;border-radius:100px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .1s,opacity .2s;-webkit-user-select:none;user-select:none}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.4;cursor:default;transform:none}.btn-primary{background:var(--primary);color:#fff}.btn-ghost{background:var(--surface2);color:var(--text);border:1px solid var(--border)}.record-btn{width:88px;height:88px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--surface2);border:3px solid var(--border);transition:all .2s;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.record-btn:active{transform:scale(.93)}.record-btn.recording{background:#e74c3c;border-color:#e74c3c;animation:pulse 1s ease-in-out infinite}.record-btn.processing{background:var(--primary-dim);border-color:var(--primary)}@keyframes pulse{0%,to{box-shadow:0 0 #e74c3c80}50%{box-shadow:0 0 0 16px #e74c3c00}}.score-badge{display:inline-block;padding:2px 10px;border-radius:100px;font-size:.78rem;font-weight:700}.score-good{background:#4ecdc433;color:var(--secondary)}.score-ok{background:#ffc10733;color:#ffc107}.score-low{background:#e74c3c33;color:#e74c3c}.bubble-wrap{display:flex;flex-direction:column;gap:12px;flex:1;overflow-y:auto;padding:8px 0}.bubble{max-width:82%;padding:12px 16px;border-radius:18px;font-size:1rem;line-height:1.5;word-break:break-word;overflow-wrap:break-word}.bubble-ai{align-self:flex-start;background:var(--surface2);border-bottom-left-radius:4px}.bubble-user{align-self:flex-end;background:var(--primary-dim);border:1px solid rgba(255,107,53,.3);border-bottom-right-radius:4px}.bubble-meta{margin-top:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.streak-fire{font-size:2rem;line-height:1}.bubble-wrap::-webkit-scrollbar{width:4px}.bubble-wrap::-webkit-scrollbar-track{background:transparent}.bubble-wrap::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.hint-box{background:#4ecdc414;border:1px solid rgba(78,205,196,.25);border-radius:var(--radius-sm);padding:8px 14px;font-size:.85rem;color:var(--secondary)}.progress-bar{height:4px;background:var(--border);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--primary);border-radius:4px;transition:width .4s}.score-big{font-size:3.5rem;font-weight:800;color:var(--primary);line-height:1}.text-muted{color:var(--text-muted);font-size:.85rem}.text-center{text-align:center}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.gap-8{gap:8px}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.w-full{width:100%}