*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0a0a0f;--bg-card: #111116;--bg-hover: rgba(255,255,255,.03);--border: rgba(255,255,255,.08);--text: #e4e4e7;--text-muted: #9a9aa3;--text-dim: #858590;--teal: #14b8a6;--teal-light: #2dd4bf;--teal-bg: rgba(20,184,166,.12);--teal-border: rgba(20,184,166,.2);--radius: 16px}html,body,#root{height:100%;overflow:hidden}body{font-family:Inter,system-ui,-apple-system,Noto Sans SC,Noto Sans TC,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Devanagari,Noto Sans Thai,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}.app{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:430px;margin:0 auto;box-shadow:0 0 0 1px #ffffff0f}:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:2px}:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.skip-link{position:absolute;top:-40px;left:8px;background:var(--teal);color:#fff;padding:8px 16px;border-radius:4px;z-index:10000;font-weight:600;text-decoration:none}.skip-link:focus{top:8px}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shake{0%,to{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(6px)}45%{transform:translate(-4px)}60%{transform:translate(4px)}75%{transform:translate(-2px)}}.shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97)}@keyframes checkIn{0%{transform:scale(0) rotate(-30deg);opacity:0}60%{transform:scale(1.1) rotate(5deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.check-animate{animation:checkIn .4s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes tabFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.tab-panel{animation:tabFadeIn .18s ease-out}@keyframes ripple{0%{transform:scale(0);opacity:.5}to{transform:scale(2.5);opacity:0}}.send-ripple{position:absolute;width:100%;height:100%;border-radius:50%;background:#ffffff59;animation:ripple .45s ease-out forwards;pointer-events:none}@keyframes staggerIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.stagger-item{animation:staggerIn .22s ease-out both}.stagger-item:nth-child(1){animation-delay:0ms}.stagger-item:nth-child(2){animation-delay:40ms}.stagger-item:nth-child(3){animation-delay:80ms}.stagger-item:nth-child(4){animation-delay:.12s}.stagger-item:nth-child(5){animation-delay:.16s}.stagger-item:nth-child(6){animation-delay:.2s}.stagger-item:nth-child(n+7){animation-delay:.24s}@keyframes routeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.route-enter{animation:routeIn .2s ease-out}.msg-pending .msg-bubble{opacity:.65}.msg-pending .msg-meta{color:var(--text-dim)}.upload-progress-wrap{position:relative;padding:8px 12px;background:#14b8a60f;border-top:1px solid var(--teal-border);font-size:11px;color:var(--teal);font-weight:600;display:flex;align-items:center;gap:8px}.upload-progress-fill{height:3px;background:var(--teal);border-radius:2px;transition:width .2s ease;box-shadow:0 0 6px #14b8a666}.welcome-banner{margin:12px 12px 0;padding:14px 16px;border-radius:14px;background:linear-gradient(135deg,#14b8a614,#3b82f60f);border:1px solid rgba(20,184,166,.2);animation:fadeIn .4s ease-out}.welcome-banner h3{font-size:14px;font-weight:800;margin-bottom:4px}.welcome-banner p{font-size:12px;color:var(--text-muted);line-height:1.5}.welcome-banner-dismiss{margin-top:10px;font-size:11px;font-weight:700;color:var(--teal);background:none;border:none;cursor:pointer;padding:0;font-family:inherit}.auth-screen{height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg)}.auth-card{text-align:center;max-width:320px}.auth-icon{width:64px;height:64px;border-radius:20px;background:var(--teal-bg);border:1px solid var(--teal-border);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--teal)}.auth-card h1{font-size:22px;font-weight:800;margin-bottom:4px}.auth-card>p{font-size:13px;color:var(--text-muted);margin-bottom:24px}.auth-loading{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--teal);font-size:14px;font-weight:600}.auth-error{padding:12px 16px;border-radius:12px;background:#ef44441a;border:1px solid rgba(239,68,68,.2);color:#ef4444;font-size:13px}.auth-hint p{font-size:14px;color:var(--text-muted);line-height:1.6}.auth-sub{font-size:12px!important;color:var(--text-dim)!important;margin-top:8px}.list-header{padding:16px 16px 12px;border-bottom:1px solid var(--border);background:var(--bg-card)}.list-header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.list-header h1{font-size:24px;font-weight:800}.list-subtitle{font-size:12px;color:var(--text-muted);margin-top:2px}.list-badge{width:28px;height:28px;border-radius:50%;background:var(--teal-bg);border:1px solid var(--teal-border);color:var(--teal);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}.search-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:#ffffff0a;border:1px solid var(--border);color:var(--text-dim)}.search-bar input{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:14px;font-family:inherit}.search-bar input::placeholder{color:var(--text-dim)}.pill-tabs{display:flex;gap:8px;padding:10px 16px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-bottom:1px solid var(--border)}.pill-tabs::-webkit-scrollbar{display:none}.pill{flex-shrink:0;display:flex;align-items:center;gap:4px;padding:5px 10px;border-radius:99px;font-size:11px;font-weight:700;font-family:inherit;border:1px solid rgba(255,255,255,.07);background:#ffffff0a;color:var(--text-dim);cursor:pointer;transition:all .2s;white-space:nowrap}.pill:active{opacity:.8}.pill-teal{background:#14b8a626;color:#5eead4;border-color:#14b8a659;box-shadow:0 0 12px #14b8a626}.pill-amber{background:#f59e0b26;color:#fcd34d;border-color:#f59e0b59;box-shadow:0 0 12px #f59e0b26}.pill-teal-alt{background:#14b8a61f;color:#2dd4bf;border-color:#14b8a64d;box-shadow:0 0 12px #14b8a61f}.pill-gold{background:#eab30826;color:#fde047;border-color:#eab30859;box-shadow:0 0 12px #eab30826}.pill-badge{min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#ffffffe6;color:#111;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1}.pill-teal .pill-badge{background:#14b8a6;color:#000}.pill-amber .pill-badge{background:#f59e0b;color:#000}.pill-teal-alt .pill-badge{background:#14b8a6;color:#000}.pill-gold .pill-badge{background:#eab308;color:#000}.avatar-active{background:linear-gradient(135deg,#14b8a64d,#3b82f64d)!important;color:var(--teal)!important}.avatar-pending{background:#ffffff0d!important;color:var(--text-dim)!important;border:1px dashed rgba(255,255,255,.15)}.convo-status{font-size:10px;font-weight:600;flex-shrink:0}.status-active{color:var(--teal)}.status-pending{color:var(--text-dim)}.convo-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.convo-item{width:100%;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:none;border-bottom:1px solid rgba(255,255,255,.03);background:none;color:var(--text);text-align:start;cursor:pointer;transition:background .15s;font-family:inherit;animation:fadeIn .2s ease-out}.convo-item:active{background:var(--bg-hover)}.convo-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#14b8a633,#3b82f633);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--teal);flex-shrink:0}.convo-content{flex:1;min-width:0}.convo-top{display:flex;align-items:center;justify-content:space-between}.convo-name{font-size:15px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.convo-time{font-size:11px;color:var(--text-dim);flex-shrink:0;margin-inline-start:8px}.convo-role{font-size:11px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}.convo-preview{font-size:13px;color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}.convo-badge{width:22px;height:22px;border-radius:50%;background:var(--teal);color:#000;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:4px}.convo-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text-dim)}.convo-empty svg{margin-bottom:12px;opacity:.4}.convo-empty p{font-size:14px;font-weight:600}.convo-empty-hint{font-size:12px;color:var(--text-dim);margin-top:4px}.thread-header{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--bg-card)}.back-btn{background:none;border:none;color:var(--teal);cursor:pointer;padding:4px;display:flex;align-items:center}.thread-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#14b8a633,#3b82f633);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--teal);flex-shrink:0}.thread-info{min-width:0}.thread-name{font-size:15px;font-weight:700;display:block}.thread-role{font-size:11px;color:var(--text-muted);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.messages-container{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px;display:flex;flex-direction:column;gap:8px}.messages-loading,.messages-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-dim)}.messages-empty svg{margin-bottom:8px;opacity:.3}.messages-empty p{font-size:14px}.msg{display:flex;animation:fadeIn .15s ease-out}.msg-out{justify-content:flex-end}.msg-in{justify-content:flex-start}.msg-bubble{max-width:80%;padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.4;word-break:break-word}.bubble-out{background:var(--teal-bg);border:1px solid var(--teal-border);color:#d1fae5;border-bottom-right-radius:4px}.bubble-in{background:#ffffff0d;border:1px solid var(--border);color:var(--text);border-bottom-left-radius:4px}.msg-bubble p{white-space:pre-wrap}.msg-meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:4px;font-size:10px;color:var(--text-dim)}.msg-meta .read{color:var(--teal)}.input-bar{display:flex;align-items:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--border);background:var(--bg-card);padding-bottom:max(12px,env(safe-area-inset-bottom))}.input-bar textarea{flex:1;padding:10px 14px;border-radius:20px;background:#ffffff0d;border:1px solid var(--border);color:var(--text);font-size:15px;font-family:inherit;resize:none;outline:none;max-height:120px;transition:border-color .2s}.input-bar textarea:focus{border-color:var(--teal-border)}.input-bar textarea::placeholder{color:var(--text-dim)}.send-btn{width:42px;height:42px;border-radius:50%;background:var(--teal);border:none;color:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.send-btn:disabled{opacity:.3;cursor:not-allowed}.send-btn:not(:disabled):active{transform:scale(.92)}.convo-list::-webkit-scrollbar,.messages-container::-webkit-scrollbar{width:4px}.convo-list::-webkit-scrollbar-thumb,.messages-container::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}:root{--chat-bg: #09090f;--chat-bg-header: rgba(13, 17, 23, .92);--chat-card: rgba(255, 255, 255, .04);--chat-card-strong: rgba(255, 255, 255, .06);--chat-border: rgba(255, 255, 255, .08);--chat-border-strong: rgba(255, 255, 255, .14);--chat-text: #f4f4f5;--chat-text-dim: #a1a1aa;--chat-text-muted: #71717a;--chat-text-faint: #52525b;--chat-teal: #14b8a6;--chat-teal-glow: rgba(20, 184, 166, .25);--chat-teal-dim: rgba(20, 184, 166, .12);--chat-teal-soft: rgba(20, 184, 166, .08);--chat-amber: #f59e0b;--chat-amber-bright: #fbbf24;--chat-amber-dim: rgba(245, 158, 11, .15);--chat-red: #ef4444;--chat-red-dim: rgba(239, 68, 68, .15);--chat-blue: #60a5fa;--chat-blue-dim: rgba(96, 165, 250, .15);--chat-purple: #a78bfa;--chat-purple-dim: rgba(167, 139, 250, .15);--chat-green: #10b981;--chat-bubble-sent-bg: var(--chat-teal);--chat-bubble-sent-text: #ffffff;--chat-bubble-recv-bg: var(--chat-card);--chat-bubble-recv-text: var(--chat-text);--chat-bubble-radius: 18px;--chat-bubble-tail: 6px;--chat-bubble-pad: 10px 14px;--chat-font: 14px;--chat-meta-font: 10px;--chat-line-height: 1.4;--chat-receipt-read: #a0e7dc;--chat-receipt-delivered: rgba(255, 255, 255, .55);--chat-receipt-sent: rgba(255, 255, 255, .35);--chat-receipt-pending: rgba(255, 255, 255, .25);--chat-composer-bg: var(--chat-card);--chat-composer-focus: var(--chat-teal-glow)}@keyframes yoseh-chat-typing-bounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-3px);opacity:1}}@keyframes yoseh-chat-recording-pulse{0%,to{opacity:.35}50%{opacity:1}}