:root{--primary: #f43f5e;--primary-hover: #e11d48;--primary-active: #be123c;--primary-light: #ffe4e6;--primary-soft: #fff1f2;--primary-gradient: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%);--partner-bubble-bg: #ffffff;--partner-bubble-border: #fecdd3;--bg-main: #fff7f8;--bg-card: rgba(255, 255, 255, .92);--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #94a3b8;--shadow-sm: 0 2px 8px -2px rgba(244, 63, 94, .08);--shadow-md: 0 6px 20px -3px rgba(244, 63, 94, .12);--shadow-lg: 0 12px 32px -4px rgba(244, 63, 94, .16);--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--radius-full: 9999px;--transition-fast: .18s ease;--transition-normal: .28s cubic-bezier(.4, 0, .2, 1);--safe-area-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--bg-main);background-attachment:fixed;color:var(--text-primary);min-height:100vh;min-height:-webkit-fill-available;display:flex;justify-content:center;align-items:stretch;overflow-x:hidden}#app{width:100%;max-width:540px;min-height:100vh;min-height:-webkit-fill-available;display:flex;flex-direction:column;background:var(--bg-card);box-shadow:0 0 40px #f43f5e14;position:relative}.connection-banner{background:#f59e0b;color:#fff;padding:6px 12px;font-size:.82rem;font-weight:500;text-align:center;position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;gap:6px;animation:slideDown .3s ease}.connection-banner.online{background:#10b981}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.toast-container{position:fixed;top:16px;left:50%;transform:translate(-50%);z-index:9999;width:90%;max-width:400px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{background:#1e293beb;color:#fff;padding:12px 16px;border-radius:var(--radius-md);font-size:.9rem;box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;animation:toastIn .25s cubic-bezier(.175,.885,.32,1.275);display:flex;align-items:center;gap:10px}.toast.toast-error{background:#e11d48f0}.toast.toast-success{background:#10b981f0}@keyframes toastIn{0%{opacity:0;transform:translateY(-12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.login-container{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:32px 24px;text-align:center;background:radial-gradient(circle at 50% 30%,#fff1f2,#fff7f8 70%)}.login-brand{margin-bottom:28px}.login-heart-icon{width:84px;height:84px;margin:0 auto 16px;background:var(--primary-gradient);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);font-size:2.4rem;animation:floatHeart 3s ease-in-out infinite alternate}@keyframes floatHeart{0%{transform:translateY(0) scale(1)}to{transform:translateY(-6px) scale(1.03)}}.login-title{font-size:1.85rem;font-weight:700;color:var(--text-primary);letter-spacing:-.02em}.login-subtitle{font-size:.95rem;color:var(--text-secondary);margin-top:6px}.login-form{width:100%;max-width:360px;display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;text-align:left;gap:6px}.form-label{font-size:.85rem;font-weight:600;color:var(--text-secondary)}.form-input{width:100%;padding:13px 16px;border:1.5px solid #fecdd3;border-radius:var(--radius-md);background:#fff;font-size:.98rem;color:var(--text-primary);outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.form-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #f43f5e29}.btn-primary{width:100%;padding:14px;background:var(--primary-gradient);border:none;border-radius:var(--radius-md);color:#fff;font-size:1.05rem;font-weight:600;cursor:pointer;box-shadow:var(--shadow-md);transition:transform var(--transition-fast),box-shadow var(--transition-fast),opacity var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-primary:active{transform:translateY(1px)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.login-error{background:#ffe4e6;border:1px solid #fecdd3;color:#be123c;padding:10px 14px;border-radius:var(--radius-sm);font-size:.88rem;text-align:left;line-height:1.35}.chat-container{display:flex;flex-direction:column;height:100vh;height:-webkit-fill-available;position:relative;background:snow}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:#fffffff2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #ffe4e6;position:sticky;top:0;z-index:50;box-shadow:var(--shadow-sm)}.chat-partner-info{display:flex;align-items:center;gap:12px}.partner-avatar{width:44px;height:44px;border-radius:var(--radius-full);background:var(--primary-gradient);color:#fff;font-weight:700;font-size:1.1rem;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);position:relative}.partner-status-dot{width:12px;height:12px;border-radius:var(--radius-full);background:#10b981;border:2px solid #ffffff;position:absolute;bottom:0;right:0}.partner-text-meta{display:flex;flex-direction:column}.partner-name{font-weight:700;font-size:1.05rem;color:var(--text-primary);display:flex;align-items:center;gap:5px}.partner-status-sub{font-size:.78rem;color:var(--text-secondary)}.header-actions{display:flex;align-items:center;gap:8px}.icon-btn{background:transparent;border:none;width:40px;height:40px;border-radius:var(--radius-full);color:var(--text-secondary);font-size:1.25rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.icon-btn:hover{background:var(--primary-soft);color:var(--primary)}.messages-scroll-area{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth;overscroll-behavior-y:contain}.date-divider{display:flex;align-items:center;justify-content:center;margin:12px 0 6px}.date-divider-badge{background:#fecdd373;color:var(--text-secondary);font-size:.76rem;font-weight:600;padding:4px 12px;border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.04em}.empty-state{margin:auto;text-align:center;padding:32px 20px;max-width:320px}.empty-heart{font-size:3rem;margin-bottom:12px;opacity:.85}.empty-title{font-size:1.15rem;font-weight:700;color:var(--text-primary);margin-bottom:6px}.empty-desc{font-size:.88rem;color:var(--text-secondary);line-height:1.4}.message-row{display:flex;flex-direction:column;max-width:82%;animation:messagePop .2s cubic-bezier(.175,.885,.32,1.2)}@keyframes messagePop{0%{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.message-row.sent{align-self:flex-end;align-items:flex-end}.message-row.received{align-self:flex-start;align-items:flex-start}.message-bubble{padding:11px 15px;border-radius:var(--radius-lg);font-size:.96rem;line-height:1.45;word-break:break-word;position:relative;box-shadow:var(--shadow-sm)}.message-row.sent .message-bubble{background:var(--primary-gradient);color:#fff;border-bottom-right-radius:4px}.message-row.received .message-bubble{background:var(--partner-bubble-bg);color:var(--text-primary);border:1px solid var(--partner-bubble-border);border-bottom-left-radius:4px}.message-row .message-bubble.type-quick{font-weight:500;font-size:1.02rem}.message-meta{display:flex;align-items:center;gap:6px;font-size:.72rem;margin-top:3px;color:var(--text-muted)}.message-row.sent .message-meta{justify-content:flex-end}.delivery-badge{font-size:.78rem;display:inline-flex;align-items:center;gap:2px}.delivery-badge.read{color:#f43f5e;font-weight:600}.delivery-badge.fcm{color:#6366f1}.delivery-badge.saved{color:var(--text-muted)}.quick-actions-bar{background:#fff;border-top:1px solid #ffe4e6;padding:8px 12px;overflow-x:auto;white-space:nowrap;display:flex;gap:8px;scrollbar-width:none;-ms-overflow-style:none}.quick-actions-bar::-webkit-scrollbar{display:none}.quick-chip{display:inline-flex;align-items:center;background:var(--primary-soft);color:#be123c;border:1px solid #fecdd3;padding:7px 14px;border-radius:var(--radius-full);font-size:.86rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;flex-shrink:0}.quick-chip:hover{background:#ffe4e6;transform:translateY(-1px)}.quick-chip:active{transform:scale(.96);background:#fecdd3}.quick-chip-add{background:#fff;border:1px dashed #f43f5e;color:var(--primary)}.chat-composer-container{padding:10px 14px calc(10px + var(--safe-area-bottom));background:#fff;border-top:1px solid #fecdd3;display:flex;flex-direction:column;gap:4px}.composer-row{display:flex;align-items:center;gap:10px}.composer-input-wrapper{flex:1;position:relative;display:flex;align-items:center}.composer-input{width:100%;padding:12px 42px 12px 16px;background:#f8fafc;border:1.5px solid #f1f5f9;border-radius:var(--radius-full);font-size:.96rem;color:var(--text-primary);outline:none;transition:border-color var(--transition-fast),background var(--transition-fast)}.composer-input:focus{background:#fff;border-color:var(--primary)}.char-counter{position:absolute;right:14px;font-size:.68rem;color:var(--text-muted);pointer-events:none}.char-counter.warning{color:#f59e0b}.char-counter.limit{color:#ef4444;font-weight:700}.btn-send{width:44px;height:44px;border-radius:var(--radius-full);background:var(--primary-gradient);border:none;color:#fff;font-size:1.25rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform var(--transition-fast),opacity var(--transition-fast);flex-shrink:0}.btn-send:hover{transform:scale(1.04)}.btn-send:active{transform:scale(.96)}.btn-send:disabled{opacity:.45;cursor:not-allowed;transform:none}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:flex;justify-content:center;align-items:flex-end;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-sheet{background:#fff;width:100%;max-width:540px;border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);padding:20px 24px calc(24px + var(--safe-area-bottom));box-shadow:var(--shadow-lg);max-height:85vh;overflow-y:auto;animation:slideUp .25s cubic-bezier(.16,1,.3,1);display:flex;flex-direction:column;gap:20px}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffe4e6;padding-bottom:12px}.modal-title{font-size:1.2rem;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:8px}.settings-section{display:flex;flex-direction:column;gap:12px}.settings-section-title{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.settings-card{background:var(--primary-soft);border:1px solid #fecdd3;border-radius:var(--radius-md);padding:14px;display:flex;flex-direction:column;gap:10px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.setting-meta{display:flex;flex-direction:column;gap:2px}.setting-name{font-size:.95rem;font-weight:600;color:var(--text-primary)}.setting-description{font-size:.78rem;color:var(--text-secondary)}.badge{display:inline-block;padding:3px 8px;border-radius:var(--radius-full);font-size:.72rem;font-weight:600}.badge-granted{background:#dcfce7;color:#15803d}.badge-denied{background:#fee2e2;color:#b91c1c}.badge-default{background:#fef3c7;color:#b45309}.toggle-switch{position:relative;display:inline-block;width:46px;height:26px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;right:0;bottom:0;left:0;background-color:#cbd5e1;transition:.3s;border-radius:34px}.toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%;box-shadow:0 1px 3px #0003}input:checked+.toggle-slider{background-color:var(--primary)}input:checked+.toggle-slider:before{transform:translate(20px)}.btn-secondary{padding:10px 16px;background:#fff;border:1.5px solid #fecdd3;color:var(--primary);border-radius:var(--radius-md);font-weight:600;font-size:.9rem;cursor:pointer;transition:all var(--transition-fast)}.btn-secondary:hover{background:var(--primary-soft)}.btn-danger{padding:12px 16px;background:#fee2e2;border:1px solid #fca5a5;color:#dc2626;border-radius:var(--radius-md);font-weight:600;font-size:.95rem;cursor:pointer;transition:all var(--transition-fast);margin-top:8px}.btn-danger:hover{background:#fecaca}.install-guide{font-size:.82rem;color:var(--text-secondary);line-height:1.45;background:#f8fafc;padding:12px;border-radius:var(--radius-md);border:1px solid #e2e8f0}.install-guide ol{margin-left:18px;margin-top:6px;display:flex;flex-direction:column;gap:4px}