:root{--color-brand-navy:#0d272e;--color-brand-green:#1db87a;--color-brand-green-bg:#1db87a1f;--color-btn-primary:#25373c;--color-btn-primary-hover:#1e2f34;--color-btn-primary-text:#fff;--color-btn-secondary:#fff;--color-btn-secondary-text:#25373c;--color-btn-secondary-border:#d1d5db;--color-bg-primary:#fafafa;--color-bg-elevated:#fff;--color-bg-secondary:#f9fafb;--color-bg-tertiary:#f3f4f6;--color-bg-hover:#f3f4f6;--color-text-primary:#111827;--color-text-secondary:#6b7280;--color-text-muted:#9ca3af;--color-text-inverse:#fff;--color-border:#e5e7eb;--color-border-strong:#d1d5db;--color-border-muted:#f3f4f6;--color-status-success:#22c55e;--color-status-success-bg:#dcfce7;--color-status-warning:#f59e0b;--color-status-warning-bg:#fef3c7;--color-status-error:#ef4444;--color-status-error-bg:#fee2e2;--color-status-info:#3b82f6;--color-status-info-bg:#dbeafe;--color-whatsapp-green:#25d366;--color-whatsapp-green-dark:#128c7e;--color-whatsapp-teal:#128c7e;--color-whatsapp-wallpaper:#e5ddd5;--color-whatsapp-bubble-sent:#d9fdd3;--color-whatsapp-bubble-recv:#fff;--color-whatsapp-system-bg:#fef9c3;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-pill:999px;--shadow-card:0 1px 3px #0000000d, 0 1px 2px #0000000a;--shadow-elevated:0 4px 12px #00000014;--shadow-modal:0 20px 40px #00000026;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--font-family-base:"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;--font-size-xs:12px;--font-size-sm:13px;--font-size-base:14px;--font-size-md:15px;--font-size-lg:17px;--font-size-xl:20px;--font-size-2xl:24px;--font-size-3xl:30px;--line-height-tight:1.25;--line-height-base:1.5}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;padding:0}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-primary);background:var(--color-bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit}:root{--app-height:100vh}#root{background:var(--color-bg-primary);min-height:var(--app-height);height:var(--app-height);justify-content:center;display:flex}.app-shell{width:100%;max-width:480px;height:var(--app-height);background:var(--color-bg-elevated);flex-direction:column;display:flex;position:relative;overflow:hidden}.centered-screen{padding:var(--space-6);background:var(--color-bg-primary);flex-direction:column;flex:1;justify-content:center;align-items:stretch;display:flex}.card{background:var(--color-bg-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--space-6);gap:var(--space-4);flex-direction:column;display:flex}.card-error{border-left:4px solid var(--color-status-error);background:var(--color-status-error-bg)}.brand-mark{color:var(--color-brand-navy);font-weight:700;font-size:var(--font-size-xl);letter-spacing:-.5px;align-items:baseline;gap:2px;display:inline-flex}.brand-mark .dot{border-radius:var(--radius-pill);background:var(--color-brand-green);align-self:flex-end;width:6px;height:6px;margin-bottom:4px;margin-left:2px;display:inline-block}.eyebrow{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.08em;font-weight:600}.h1{font-size:var(--font-size-2xl);color:var(--color-text-primary);font-weight:700;line-height:var(--line-height-tight);margin:0}.h2{font-size:var(--font-size-lg);color:var(--color-text-primary);margin:0;font-weight:600}.body-text{color:var(--color-text-secondary);font-size:var(--font-size-base)}.label{gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-secondary);flex-direction:column;font-weight:500;display:flex}.label .hint{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:400}.input{border:1px solid var(--color-border-strong);border-radius:var(--radius-md);font-size:var(--font-size-md);color:var(--color-text-primary);background:var(--color-bg-elevated);outline:none;padding:12px 14px;transition:border-color .12s,box-shadow .12s}.input:focus{border-color:var(--color-brand-navy);box-shadow:0 0 0 3px var(--color-brand-green-bg)}.btn{border-radius:var(--radius-md);font-size:var(--font-size-md);cursor:pointer;border:none;padding:12px 16px;font-weight:600;transition:background .12s,opacity .12s}.btn-primary{background:var(--color-btn-primary);color:var(--color-btn-primary-text)}.btn-primary:hover:not(:disabled){background:var(--color-btn-primary-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-text{color:var(--color-text-secondary);background:0 0;padding:8px 4px;font-weight:500}.btn-text:hover{color:var(--color-text-primary)}.spinner{border:3px solid var(--color-border);border-top-color:var(--color-brand-navy);border-radius:var(--radius-pill);align-self:center;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.success-check{border-radius:var(--radius-pill);background:var(--color-brand-green-bg);width:56px;height:56px;color:var(--color-brand-green);justify-content:center;align-self:center;align-items:center;display:flex}.brand-footer{text-align:center;font-size:var(--font-size-xs);color:var(--color-text-muted);padding:var(--space-3) 0}.chat{background-color:var(--color-whatsapp-wallpaper);background-image:url(/wa-background.png);background-repeat:repeat;background-size:544px;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.chat-header{background:var(--color-whatsapp-teal);color:var(--color-text-inverse);padding:var(--space-3) var(--space-4);justify-content:space-between;align-items:center;gap:var(--space-3);z-index:2;display:flex;position:sticky;top:0}.chat-header-title{flex-direction:column;flex:1;min-width:0;display:flex}.chat-header-title .title{font-weight:600;font-size:var(--font-size-md);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-header-title .subtitle{font-size:var(--font-size-xs);opacity:.85}.chat-header .wordmark{font-weight:600;font-size:var(--font-size-md);letter-spacing:-.3px;color:var(--color-text-inverse)}.chat-messages{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;min-height:0;padding:var(--space-4) var(--space-3);gap:var(--space-2);flex-direction:column;flex:1;display:flex;overflow-y:auto}.bubble-row{width:100%;display:flex}.bubble-row.right{justify-content:flex-end}.bubble-row.left{justify-content:flex-start}.bubble-row.center{justify-content:center}.bubble{border-radius:var(--radius-md);max-width:78%;box-shadow:var(--shadow-card);font-size:var(--font-size-base);color:var(--color-text-primary);word-wrap:break-word;flex-direction:column;padding:6px 10px 4px;display:flex}.bubble-sent{background:var(--color-whatsapp-bubble-sent);border-top-right-radius:2px}.bubble-recv{background:var(--color-whatsapp-bubble-recv);border-top-left-radius:2px}.bubble .sender-name{font-size:var(--font-size-xs);color:var(--color-brand-navy);margin-bottom:2px;font-weight:600}.bubble .body{white-space:pre-wrap;line-height:1.35}.bubble .time{color:var(--color-text-muted);align-self:flex-end;margin-top:2px;font-size:11px}.system-pill{background:var(--color-whatsapp-system-bg);color:var(--color-brand-navy);font-size:var(--font-size-xs);border-radius:var(--radius-pill);text-align:center;max-width:88%;box-shadow:var(--shadow-card);padding:6px 12px}.system-pill .pill-label{text-transform:uppercase;letter-spacing:.06em;margin-right:4px;font-size:10px;font-weight:700}.hold-banner{background:var(--color-status-warning-bg);color:var(--color-brand-navy);font-size:var(--font-size-sm);padding:var(--space-2) var(--space-4);text-align:center;border-top:1px solid var(--color-border-muted)}.ended-banner{background:var(--color-status-info-bg);color:var(--color-brand-navy);font-size:var(--font-size-sm);padding:var(--space-3) var(--space-4);text-align:center;border-top:1px solid var(--color-border-muted);font-weight:500}.chat-input-bar{background:var(--color-bg-secondary);padding:var(--space-2) var(--space-3);padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0px));gap:var(--space-2);border-top:1px solid var(--color-border);z-index:2;flex-shrink:0;align-items:flex-end;display:flex;position:sticky;bottom:0}.chat-input{background:var(--color-bg-elevated);border-radius:var(--radius-xl);font-size:var(--font-size-md);color:var(--color-text-primary);resize:none;min-height:40px;max-height:120px;box-shadow:var(--shadow-card);border:1px solid #0000;outline:none;flex:1;padding:10px 14px;line-height:1.3}.chat-input:focus{border-color:var(--color-whatsapp-green-dark)}.send-btn{border-radius:var(--radius-pill);background:var(--color-whatsapp-green);width:44px;height:44px;color:var(--color-text-inverse);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:background .12s,opacity .12s;display:flex}.send-btn:disabled{opacity:.5;cursor:not-allowed}.chat-footer{text-align:center;font-size:var(--font-size-xs);color:var(--color-text-muted);background:var(--color-bg-secondary);border-top:1px solid var(--color-border-muted);padding:6px 0}.toast{background:var(--color-brand-navy);color:var(--color-text-inverse);border-radius:var(--radius-pill);font-size:var(--font-size-sm);box-shadow:var(--shadow-elevated);z-index:10;align-items:center;gap:var(--space-2);padding:8px 16px;display:flex;position:fixed;bottom:88px;left:50%;transform:translate(-50%)}.toast .dot-blink{border-radius:var(--radius-pill);background:var(--color-status-warning);width:8px;height:8px;animation:1s ease-in-out infinite blink}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.form-error{color:var(--color-status-error);font-size:var(--font-size-sm);margin:0}@media (width>=481px){.app-shell{min-height:100dvh;box-shadow:var(--shadow-elevated)}}.survey-answer-zone{background:var(--color-bg-secondary);border-top:1px solid var(--color-border);padding:var(--space-3);padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom,0px));z-index:2;flex-shrink:0}.survey-answer-zone .chat-input-bar{background:0 0;border-top:none;padding:0}.survey-input-wrap{gap:var(--space-3);flex-direction:column;display:flex}.survey-chips{gap:var(--space-2);flex-wrap:wrap;display:flex}.survey-chip{background:var(--color-bg-tertiary);color:var(--color-brand-navy);border:1px solid var(--color-border);border-radius:var(--radius-pill);font-size:var(--font-size-sm);cursor:pointer;min-height:36px;padding:8px 14px;font-weight:500;transition:background .12s,color .12s,border-color .12s}.survey-chip:hover:not(:disabled){background:var(--color-bg-hover)}.survey-chip:disabled{opacity:.6;cursor:not-allowed}.survey-chip-on{background:var(--color-brand-green);color:var(--color-text-inverse);border-color:var(--color-brand-green)}.survey-chip-on:hover:not(:disabled){background:var(--color-brand-green)}.survey-submit{align-self:stretch}.survey-scale{gap:var(--space-2);flex-wrap:nowrap;justify-content:space-between;display:flex}.survey-scale-btn{border-radius:var(--radius-md);border:1px solid var(--color-border-strong);background:var(--color-bg-elevated);min-width:36px;min-height:44px;color:var(--color-brand-navy);font-weight:600;font-size:var(--font-size-md);cursor:pointer;flex:1 1 0;transition:background .12s,color .12s,border-color .12s}.survey-scale-btn:hover:not(:disabled){background:var(--color-brand-green-bg);border-color:var(--color-brand-green)}.survey-scale-btn:disabled{opacity:.6;cursor:not-allowed}.survey-scale-labels{font-size:var(--font-size-xs);color:var(--color-text-muted);justify-content:space-between;padding:0 2px;display:flex}.survey-matrix{gap:var(--space-3);flex-direction:column;max-height:40vh;display:flex;overflow-y:auto}.survey-matrix-row{gap:var(--space-2);flex-direction:column;display:flex}.survey-matrix-label{font-size:var(--font-size-sm);color:var(--color-brand-navy);font-weight:600}.survey-matrix-chips{gap:var(--space-2);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;padding-bottom:2px;display:flex;overflow-x:auto}.survey-matrix-chips .survey-chip{white-space:nowrap;flex:none}.survey-voice-wrap{text-align:center;align-items:center}.survey-voice-btn{border-radius:var(--radius-pill);background:var(--color-whatsapp-green);width:72px;height:72px;color:var(--color-text-inverse);cursor:pointer;box-shadow:var(--shadow-elevated);border:none;justify-content:center;align-self:center;align-items:center;transition:transform .12s,background .12s;display:flex}.survey-voice-btn:hover:not(:disabled){transform:scale(1.04)}.survey-voice-btn:disabled{opacity:.6;cursor:not-allowed}.survey-voice-btn-on{background:var(--color-status-error);animation:1.2s ease-in-out infinite voice-pulse}@keyframes voice-pulse{0%,to{box-shadow:0 0 #ef444480}50%{box-shadow:0 0 0 12px #ef444400}}.survey-voice-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.survey-media-wrap{text-align:center;align-items:center;gap:var(--space-3)}.survey-media-preview-live,.survey-media-preview{border-radius:var(--radius-md);width:100%;max-width:320px;box-shadow:var(--shadow-card);background:#000}.survey-media-preview-audio{width:100%;max-width:320px}.survey-media-recording-row{align-items:center;gap:var(--space-2);font-size:var(--font-size-md);color:var(--color-text-primary);font-weight:600;display:flex}.survey-media-rec-dot{border-radius:var(--radius-pill);background:var(--color-status-error);width:10px;height:10px;animation:1s ease-in-out infinite blink;display:inline-block}.survey-media-timer{font-variant-numeric:tabular-nums}.survey-media-max{color:var(--color-text-muted);font-variant-numeric:tabular-nums;font-weight:500}.survey-media-note{background:var(--color-status-warning-bg);color:var(--color-brand-navy);font-size:var(--font-size-sm);border-radius:var(--radius-md);padding:6px 12px}.survey-media-actions{justify-content:center;align-items:center;gap:var(--space-3);flex-wrap:wrap;width:100%;display:flex}.survey-media-meta{font-size:var(--font-size-xs);color:var(--color-text-muted)}.survey-media-done{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:500}