@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap";:root{--color-primary:#1f3b61;--color-primary-dark:#03254a;--color-accent:#f28926;--color-success:#28a745;--color-warning:#e67e00;--color-error:#dc3545;--color-info:#3b82f6;--color-bg:#f7f9fc;--color-surface:#fff;--color-surface-low:#f2f4f7;--color-surface-high:#e6e8eb;--color-text:#191c1e;--color-text-muted:#43474e;--color-outline:#74777f;--color-outline-variant:#c4c6cf;--font-headline:"Space Grotesk", sans-serif;--font-body:"Inter", sans-serif;--radius:8px;--radius-lg:12px;--shadow-ambient:0 12px 32px #03254a14}[data-theme=dark]{--color-bg:#0a1018;--color-surface:#0f1923;--color-surface-low:#162230;--color-surface-high:#1d2d3d;--color-text:#fff;--color-text-muted:#a0aab4;--color-outline:#5a6470;--color-outline-variant:#2a3a4a}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5}h1,h2,h3,h4{font-family:var(--font-headline);font-weight:600}h1{font-size:24px}h2{font-size:20px}h3{font-size:18px}a{color:var(--color-accent);text-decoration:none}.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-ambient);margin-bottom:12px;padding:16px}.chip{border-radius:100px;padding:4px 12px;font-size:12px;font-weight:500;display:inline-block}.chip.draft{color:#e67e00;background:#fff3e0}.chip.approved{color:#28a745;background:#e8f5e9}.chip.sent{color:#1565c0;background:#e3f2fd}.chip.failed{color:#dc3545;background:#fce4ec}.chip.voices_rendered{color:#00796b;background:#e0f2f1}.btn{border-radius:var(--radius);font-family:var(--font-body);cursor:pointer;border:none;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:500;transition:opacity .2s;display:inline-flex}.btn:hover{opacity:.9}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));color:#fff}.btn-accent{background:var(--color-accent);color:#fff}.btn-ghost{color:var(--color-primary);border:1px solid var(--color-outline-variant);background:0 0}.btn-success{background:var(--color-success);color:#fff}input,textarea,select{border-radius:var(--radius);background:var(--color-surface-low);width:100%;color:var(--color-text);font-family:var(--font-body);border:1px solid #c4c6cf33;padding:12px 16px;font-size:14px}input:focus,textarea:focus{border:2px solid var(--color-primary);outline:none}.topbar{background:var(--color-primary);color:#fff;z-index:100;align-items:center;gap:12px;padding:12px 16px;display:flex;position:sticky;top:0}.topbar h1{flex:1;font-size:18px}.topbar .back-btn{color:#fff;cursor:pointer;background:0 0;border:none;font-size:20px}.bottomnav{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:8px 0 calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--color-outline-variant);z-index:100;background:#ffffffe6;justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0}.bottomnav a{color:var(--color-text-muted);flex-direction:column;align-items:center;padding:4px 12px;font-size:11px;text-decoration:none;display:flex}.bottomnav a.active{color:var(--color-accent)}.page{max-width:600px;margin:0 auto;padding:16px 16px 80px}.metric-card{background:var(--color-surface);border-radius:var(--radius-lg);text-align:center;min-width:110px;box-shadow:var(--shadow-ambient);padding:12px 16px}.metric-card .value{font-family:var(--font-headline);color:var(--color-primary);font-size:28px;font-weight:700}.metric-card .label{color:var(--color-text-muted);margin-top:4px;font-size:11px}.scroll-row{-webkit-overflow-scrolling:touch;gap:12px;padding:4px 0;display:flex;overflow-x:auto}.scroll-row::-webkit-scrollbar{display:none}.tabs{border-bottom:2px solid var(--color-outline-variant);margin-bottom:16px;display:flex}.tab{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px;padding:12px 16px;font-size:14px;font-weight:500}.tab.active{color:var(--color-accent);border-bottom-color:var(--color-accent)}@media (width>=1024px){.page{max-width:1200px;padding:24px 32px 80px}}
