*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--mint-50: #F5FAF7;--mint-100: #EBF5EF;--mint-200: #D9EBE0;--mint-300: #B8DCC4;--mint-400: #8FC5A2;--mint-500: #6BAB82;--mint-600: #4A8B5C;--mint-700: #356B45;--bg: #F8FBF9;--bg-content: rgba(255, 255, 255, .72);--bg-tertiary: rgba(255, 255, 255, .5);--input-bg: rgba(255, 255, 255, .55);--text: #1A2420;--text-secondary: #4A5550;--text-dim: #8A948F;--text-quaternary: #B8C0BB;--separator: rgba(107, 171, 130, .12);--primary: #6BAB82;--primary-light: rgba(107, 171, 130, .12);--primary-soft: rgba(143, 197, 162, .25);--primary-hover: #4A8B5C;--success: #6BAB82;--warning: #D4A04A;--error: #B85450;--glass-border: rgba(255, 255, 255, .6);--glass-border-mint: rgba(143, 197, 162, .25);--shadow-sm: 0 1px 2px rgba(40, 80, 55, .04), 0 1px 3px rgba(40, 80, 55, .03);--shadow-md: 0 4px 12px rgba(40, 80, 55, .06), 0 2px 4px rgba(40, 80, 55, .03);--shadow-lg: 0 12px 32px rgba(40, 80, 55, .1), 0 4px 8px rgba(40, 80, 55, .05);--shadow-modal: 0 -8px 40px rgba(40, 80, 55, .12);--shadow-mint: 0 4px 16px rgba(107, 171, 130, .18);--shadow-float: 0 8px 24px rgba(40, 80, 55, .14);--gradient-mint: linear-gradient(135deg, #8FC5A2 0%, #6BAB82 60%, #4A8B5C 100%);--gradient-soft-mint: linear-gradient(135deg, #B8DCC4 0%, #8FC5A2 100%);--gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, .7) 0%, rgba(235, 245, 239, .5) 100%);--gradient-shimmer: linear-gradient(135deg, rgba(255, 255, 255, .5) 0%, rgba(143, 197, 162, .08) 50%, rgba(255, 255, 255, .5) 100%);--ai-bg: linear-gradient(135deg, #EBF5EF 0%, #D9EBE0 100%);--hermes-bg: linear-gradient(135deg, #D9EBE0 0%, #B8DCC4 100%);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Segoe UI", Roboto, sans-serif}html,body{height:100%;font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text);background:var(--bg);overscroll-behavior:none}body{background:radial-gradient(ellipse at top right,rgba(143,197,162,.1) 0%,transparent 50%),radial-gradient(ellipse at bottom left,rgba(107,171,130,.06) 0%,transparent 50%),linear-gradient(180deg,#f8fbf9,#f0f7f2);background-attachment:fixed;min-height:100vh}#root{height:100vh;display:flex;flex-direction:column}button{font-family:inherit;cursor:pointer;transition:all .2s var(--ease-smooth)}input,textarea,select{font-family:inherit}*{-webkit-tap-highlight-color:transparent}.glass{background:var(--gradient-glass);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:1px solid var(--glass-border)}.glass-card{background:#fff9;backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);border:1px solid var(--glass-border-mint);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.app{display:flex;flex-direction:column;height:100vh;max-width:480px;margin:0 auto;background:#ffffff59;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-left:1px solid var(--glass-border);border-right:1px solid var(--glass-border);position:relative;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;padding-top:max(16px,env(safe-area-inset-top));background:#ffffff8c;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-bottom:1px solid var(--glass-border);z-index:10}.topbar-title{font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--text);display:flex;align-items:center;gap:10px}.topbar-title-icon{width:28px;height:28px;background:var(--gradient-soft-mint);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:var(--shadow-sm)}.topbar-action{width:40px;height:40px;border-radius:12px;background:#ffffff8c;border:1px solid var(--glass-border-mint);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--text-secondary)}.chatlist{flex:1;overflow-y:auto;padding:8px 0 80px}.search-bar{margin:8px 16px 12px;padding:10px 16px;background:#ffffff8c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border-mint);border-radius:14px;display:flex;align-items:center;gap:8px}.search-bar input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:14px}.search-bar input::placeholder{color:var(--text-dim)}.chat-item{display:flex;align-items:center;gap:12px;padding:12px 20px;margin:2px 12px;border-radius:16px;cursor:pointer;transition:all .2s var(--ease-smooth)}.chat-item:hover{background:#ffffff80}.chat-item:active{transform:scale(.98)}.chat-item-avatar{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;background:var(--gradient-soft-mint);border:1px solid var(--glass-border-mint)}.chat-item-content{flex:1;min-width:0}.chat-item-name{font-size:16px;font-weight:600;color:var(--text);margin-bottom:2px}.chat-item-preview{font-size:13px;color:var(--text-dim);overflow:hidden;textOverflow:ellipsis;whiteSpace:nowrap}.chat-item-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.chat-item-time{font-size:12px;color:var(--text-dim)}.chat-item-badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--mint-500);color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center}.type-badge{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:6px;display:inline-flex;align-items:center}.type-human{background:var(--mint-100);color:var(--mint-700)}.type-llm{background:var(--mint-200);color:var(--mint-700)}.type-hermes{background:var(--gradient-soft-mint);color:#fff}.chatscreen{display:flex;flex-direction:column;height:100vh}.chat-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#ffffffa6;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-bottom:1px solid var(--glass-border);padding-top:max(12px,env(safe-area-inset-top))}.chat-back{width:40px;height:40px;border-radius:12px;background:transparent;border:none;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--text-secondary)}.chat-avatar{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--gradient-soft-mint);border:1px solid var(--glass-border-mint)}.chat-title{flex:1;min-width:0}.chat-name{font-size:16px;font-weight:600;color:var(--text)}.chat-sub{font-size:12px;color:var(--text-dim);display:flex;align-items:center;gap:4px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success);display:inline-block}.messages{flex:1;overflow-y:auto;padding:16px 16px 8px;display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth}.msg-row{display:flex;gap:8px;align-items:flex-end;max-width:85%;animation:messageIn .4s var(--ease-spring)}.msg-row-mine{align-self:flex-end;flex-direction:row-reverse}.msg-row-other{align-self:flex-start}@keyframes messageIn{0%{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.msg-bubble{padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.4;word-wrap:break-word;white-space:pre-wrap}.msg-mine{background:var(--gradient-soft-mint);color:var(--text);border-bottom-right-radius:6px;box-shadow:var(--shadow-sm)}.msg-other{background:#ffffffbf;color:var(--text);border:1px solid var(--glass-border-mint);border-bottom-left-radius:6px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.msg-ai{background:linear-gradient(135deg,#ebf5efd9,#d9ebe0bf);color:var(--text);border:1px solid var(--mint-200);border-bottom-left-radius:6px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.msg-hermes{background:var(--gradient-mint);color:#fff;border-bottom-left-radius:6px;box-shadow:var(--shadow-mint)}.msg-sender{font-size:11px;font-weight:600;color:var(--text-dim);margin-bottom:2px;padding:0 4px}.msg-time{font-size:11px;color:var(--text-dim);margin:2px 4px 0;text-align:center}.typing{display:flex;gap:4px;padding:12px 16px;background:#ffffffbf;border-radius:18px 18px 18px 6px;border:1px solid var(--glass-border-mint);width:fit-content;margin:4px 0}.typing-dot{width:7px;height:7px;background:var(--mint-400);border-radius:50%;animation:typingBounce 1.2s infinite}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}@keyframes typingBounce{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}.composer{padding:12px 16px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:#ffffffa6;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-top:1px solid var(--glass-border);display:flex;gap:8px;align-items:flex-end}.composer-input{flex:1;min-height:40px;max-height:120px;padding:10px 16px;background:#ffffff8c;border:1px solid var(--glass-border-mint);border-radius:20px;font-size:15px;color:var(--text);outline:none;resize:none;font-family:inherit;line-height:1.4;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .2s var(--ease-smooth)}.composer-input:focus{border-color:var(--mint-400);background:#ffffffbf;box-shadow:0 0 0 3px var(--primary-light)}.composer-input::placeholder{color:var(--text-dim)}.composer-send{width:40px;height:40px;border-radius:20px;background:var(--gradient-soft-mint);border:1px solid var(--mint-300);color:var(--mint-700);font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-sm)}.composer-send:disabled{opacity:.4;cursor:not-allowed}.composer-send:not(:disabled):active{transform:scale(.95)}.bottom-nav{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;padding:8px 16px;padding-bottom:max(8px,env(safe-area-inset-bottom));background:#ffffffb3;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border-top:1px solid var(--glass-border);z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 12px;background:transparent;border:none;border-radius:12px;color:var(--text-dim);font-size:11px;font-weight:500;min-width:56px;position:relative}.nav-item.active{color:var(--mint-600)}.nav-item.active:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);width:18px;height:2px;background:var(--mint-500);border-radius:0 0 2px 2px;opacity:.7}.nav-item-icon{font-size:22px;transition:transform .2s var(--ease-smooth)}.nav-item.active .nav-item-icon{color:var(--mint-600);transform:scale(1.05)}.nav-item.active .nav-item-text{font-weight:600;color:var(--mint-700)}.login-page{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:24px;position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(143,197,162,.18) 0%,transparent 60%);pointer-events:none}.login-card{width:100%;max-width:380px;padding:40px 32px;background:#ffffffa6;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--glass-border-mint);border-radius:28px;box-shadow:var(--shadow-lg);position:relative;z-index:1}.login-logo{width:72px;height:72px;margin:0 auto 20px;background:var(--gradient-soft-mint);border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:36px;color:var(--mint-700);box-shadow:var(--shadow-mint)}.login-title{font-size:28px;font-weight:700;text-align:center;margin-bottom:8px;color:var(--mint-700);letter-spacing:-.02em}.login-subtitle{font-size:14px;color:var(--text-dim);text-align:center;margin-bottom:28px}.login-input{width:100%;padding:14px 18px;background:#ffffff8c;border:1px solid var(--glass-border-mint);border-radius:14px;font-size:15px;color:var(--text);outline:none;margin-bottom:12px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .2s var(--ease-smooth)}.login-input:focus{border-color:var(--mint-400);background:#ffffffbf;box-shadow:0 0 0 3px var(--primary-light)}.login-button{width:100%;padding:16px;background:var(--gradient-soft-mint);color:var(--mint-700);border:1px solid var(--mint-300);border-radius:14px;font-size:16px;font-weight:600;margin-top:8px;box-shadow:var(--shadow-sm);letter-spacing:-.01em;transition:all .2s var(--ease-smooth)}.login-button:hover{background:var(--mint-200)}.login-button:disabled{opacity:.5;cursor:not-allowed}.login-button:not(:disabled):active{transform:scale(.98)}.login-error{padding:10px 14px;background:#b8545014;color:var(--error);border-radius:10px;font-size:13px;margin-bottom:12px;border:1px solid rgba(184,84,80,.15)}.card-animate{background:#fff9;backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);border:1px solid var(--glass-border-mint);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:all .3s var(--ease-smooth)}.card-animate:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);border-color:var(--mint-300)}.float-animate{animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.modal-animate{animation:modalFade .3s var(--ease-smooth)}@keyframes modalFade{0%{opacity:0}to{opacity:1}}@keyframes modalSlide{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.text-mint{color:var(--mint-700)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;text-align:center}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.6}.empty-title{font-size:17px;font-weight:600;color:var(--text);margin-bottom:6px}.empty-sub{font-size:14px;color:var(--text-dim)}.avatar{display:flex;align-items:center;justify-content:center;border-radius:14px;flex-shrink:0;border:1px solid var(--glass-border-mint)}.avatar-human{background:var(--mint-100)}.avatar-llm{background:var(--gradient-soft-mint)}.avatar-hermes{background:var(--gradient-soft-mint);color:var(--mint-700);box-shadow:var(--shadow-sm)}.chip-row{display:flex;gap:8px;padding:8px 16px;overflow-x:auto;scrollbar-width:none}.chip-row::-webkit-scrollbar{display:none}.chip{padding:8px 16px;background:#ffffff8c;border:1px solid var(--glass-border-mint);border-radius:20px;font-size:13px;font-weight:500;color:var(--text-secondary);white-space:nowrap;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .2s var(--ease-smooth)}.chip.active{background:var(--mint-100);color:var(--mint-700);border-color:var(--mint-300);font-weight:600;box-shadow:inset 0 0 0 1px #8fc5a24d}.chip:not(.active):hover{background:#ffffffbf}.settings-section{background:#fff9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border-mint);border-radius:var(--radius-lg);margin:0 16px 16px;overflow:hidden}.settings-item{display:flex;align-items:center;gap:12px;padding:14px 18px;background:transparent;border:none;width:100%;text-align:left;color:var(--text);font-size:15px;border-bottom:1px solid var(--separator)}.settings-item:last-child{border-bottom:none}.settings-item:active{background:#8fc5a20f}.settings-item-icon{width:32px;height:32px;border-radius:10px;background:var(--mint-100);display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--mint-700)}.settings-item-text{flex:1;font-weight:500}.settings-item-chevron{color:var(--text-dim);font-size:18px}.settings-item-danger{color:var(--error)}.settings-item-danger .settings-item-icon{background:#b8545014;color:var(--error)}.connection-banner{padding:6px 16px;text-align:center;font-size:12px;font-weight:500}.connection-banner.offline{background:#b8545014;color:var(--error)}.connection-banner.connecting{background:var(--mint-100);color:var(--mint-700)}.dashboard{padding:16px 0 80px}.stat-card{display:flex;flex-direction:column;gap:6px;padding:18px;background:#ffffffa6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border-mint);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all .2s var(--ease-smooth)}.stat-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.stat-label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;font-weight:500}.stat-value{font-size:28px;font-weight:700;color:var(--text);letter-spacing:-.02em}.stat-icon{font-size:22px;margin-bottom:4px;color:var(--mint-600)}.quick-action{display:flex;align-items:center;gap:14px;padding:14px 18px;background:#ffffffa6;border:1px solid var(--glass-border-mint);border-radius:var(--radius-md);cursor:pointer;transition:all .2s var(--ease-smooth)}.quick-action:hover{background:#fffc}.quick-action:active{transform:scale(.98)}.quick-action-icon{width:40px;height:40px;border-radius:12px;background:var(--gradient-soft-mint);color:var(--mint-700);display:flex;align-items:center;justify-content:center;font-size:20px}.quick-action-text{flex:1;font-weight:600;color:var(--text)}.quick-action-arrow{color:var(--text-dim)}.agent-modal{background:#fffc;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--glass-border-mint)}.modal-select{width:100%;padding:12px 32px 12px 16px;background:#ffffff8c;border:1px solid var(--glass-border-mint);border-radius:12px;font-size:15px;color:var(--text);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mint-500) 50%),linear-gradient(135deg,var(--mint-500) 50%,transparent 50%);background-position:calc(100% - 18px) center,calc(100% - 12px) center;background-size:6px 6px;background-repeat:no-repeat;transition:all .2s var(--ease-smooth)}.modal-textarea{width:100%;padding:12px 16px;background:#ffffff8c;border:1px solid var(--glass-border-mint);border-radius:12px;font-size:14px;color:var(--text);outline:none;resize:vertical;font-family:inherit;min-height:100px;line-height:1.5;transition:all .2s var(--ease-smooth)}.modal-textarea:focus,.modal-select:focus{border-color:var(--mint-400);background:#ffffffbf;box-shadow:0 0 0 3px var(--primary-light)}.btn-primary{padding:14px 24px;background:var(--gradient-soft-mint);color:var(--mint-700);border:1px solid var(--mint-300);border-radius:12px;font-size:15px;font-weight:600;box-shadow:var(--shadow-sm);transition:all .2s var(--ease-smooth)}.btn-primary:hover{background:var(--mint-200);transform:translateY(-1px);box-shadow:var(--shadow-mint)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary:active{transform:scale(.98)}.btn-secondary{padding:14px 24px;background:#ffffff8c;color:var(--text);border:1px solid var(--glass-border-mint);border-radius:12px;font-size:15px;font-weight:500}.btn-danger{padding:14px 24px;background:#b854500f;color:var(--error);border:1px solid rgba(184,84,80,.15);border-radius:12px;font-size:15px;font-weight:500}.btn-danger-solid{padding:14px 24px;background:var(--error);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:600}@media (min-width: 768px){.app{max-width:720px}.messages{padding:24px 32px 8px}.msg-row{max-width:70%}}