*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #1a1a1a;--surface: #2a2a2a;--text: #ffffff;--text-muted: #888888;--accent: #4a9eff;--success: #4caf50;--warning: #ff9800;--danger: #f44336}html,body,#root{height:100%;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}.app{height:100%;display:flex;flex-direction:column}.nav{display:flex;border-bottom:1px solid var(--surface);background:var(--bg)}.nav-btn{flex:1;padding:16px;background:none;border:none;color:var(--text-muted);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.nav-btn.active{color:var(--text);border-bottom:2px solid var(--accent)}.screen{flex:1;display:flex;flex-direction:column;padding:20px;overflow:hidden}.progress-bar{display:flex;justify-content:space-between;margin-bottom:24px;font-size:14px}.progress-sent{color:var(--success);font-weight:600}.progress-discards{color:var(--warning)}.progress-discards.exhausted{color:var(--danger)}.message-card{flex:1;display:flex;flex-direction:column;background:var(--surface);border-radius:12px;padding:24px;margin-bottom:20px;overflow:hidden}.contact-name{font-size:20px;font-weight:700;margin-bottom:8px}.contact-meta{font-size:14px;color:var(--text-muted);margin-bottom:16px}.message-text{flex:1;font-size:18px;line-height:1.5;overflow-y:auto}.actions{display:flex;flex-direction:column;gap:12px}.btn{padding:16px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-success{background:var(--success);color:#fff}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid #444}.btn-danger{background:transparent;color:var(--danger);border:1px solid var(--danger)}.complete-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.complete-screen h2{font-size:32px;margin-bottom:16px;color:var(--success)}.complete-screen p{color:var(--text-muted);font-size:18px}.add-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.add-btn{width:200px;height:200px;border-radius:50%;background:var(--danger);border:none;color:#fff;font-size:24px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.add-btn:active{transform:scale(.95)}.add-btn.recording{animation:pulse 1s infinite;background:#b71c1c}@keyframes pulse{0%{box-shadow:0 0 #f44336b3}70%{box-shadow:0 0 0 30px #f4433600}to{box-shadow:0 0 #f4433600}}.add-hint{margin-top:24px;color:var(--text-muted);font-size:14px}.add-status{margin-top:24px;padding:16px;border-radius:8px;text-align:center;max-width:300px}.add-status.success{background:#4caf5033;color:var(--success)}.add-status.error{background:#f4433633;color:var(--danger)}.loading{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--text-muted)}.empty-state h2{margin-bottom:8px;color:var(--text)}