*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root,[data-theme=dark]{--bg:#0f0f10;--surface:#1a1a1e;--surface-hover:#242428;--border:#2a2a2e;--text:#e4e4e7;--text-muted:#71717a;--accent:#f59e0b;--accent-hover:#d97706;--user-bg:#1e293b;--agent-bg:#1a1a1e;--radius:12px;--danger:#ef4444;--checker-a:#2a2a2e;--checker-b:#1a1a1e}[data-theme=light]{--bg:#fff;--surface:#f4f4f5;--surface-hover:#e4e4e7;--border:#d4d4d8;--text:#18181b;--text-muted:#71717a;--accent:#3b82f6;--accent-hover:#2563eb;--user-bg:#dbeafe;--agent-bg:#f4f4f5;--radius:12px;--danger:#ef4444;--checker-a:#e4e4e7;--checker-b:#f4f4f5}[data-theme=midnight]{--bg:#0a0e1a;--surface:#111827;--surface-hover:#1e293b;--border:#1e3a5f;--text:#e0e7ff;--text-muted:#6b7fa3;--accent:#06b6d4;--accent-hover:#0891b2;--user-bg:#172554;--agent-bg:#111827;--radius:12px;--danger:#f87171;--checker-a:#1e293b;--checker-b:#111827}[data-theme=sunset]{--bg:#1a1210;--surface:#261c17;--surface-hover:#33241c;--border:#44302a;--text:#fde8d8;--text-muted:#a0806b;--accent:#f97316;--accent-hover:#ea580c;--user-bg:#451a03;--agent-bg:#261c17;--radius:12px;--danger:#ef4444;--checker-a:#44302a;--checker-b:#261c17}[data-theme=forest]{--bg:#0d1512;--surface:#14201b;--surface-hover:#1c2e27;--border:#264a3a;--text:#d1fae5;--text-muted:#6b9a84;--accent:#10b981;--accent-hover:#059669;--user-bg:#064e3b;--agent-bg:#14201b;--radius:12px;--danger:#f87171;--checker-a:#264a3a;--checker-b:#14201b}html,body,#root{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#root{flex-direction:column;max-width:720px;margin:0 auto;display:flex}.header{flex-shrink:0;position:relative}.header-glow{background:radial-gradient(ellipse 60% 100% at 20% 50%, color-mix(in srgb, var(--accent) 8%, transparent), transparent);pointer-events:none;position:absolute;inset:0;overflow:hidden}.header-inner{justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;display:flex;position:relative}.header-brand{align-items:center;gap:12px;display:flex}.header-logo{filter:drop-shadow(0 2px 8px color-mix(in srgb, var(--accent) 40%, transparent));flex-shrink:0;animation:.5s cubic-bezier(.34,1.56,.64,1) both logo-enter}@keyframes logo-enter{0%{opacity:0;transform:scale(.5)rotate(-20deg)}to{opacity:1;transform:scale(1)rotate(0)}}.header-text{flex-direction:column;gap:1px;animation:.4s ease-out .1s both text-enter;display:flex}@keyframes text-enter{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.header-title{letter-spacing:.02em;gap:6px;font-family:Lilita One,cursive;font-size:22px;font-weight:400;line-height:1.1;display:flex}.header-title-emoji{color:var(--text)}.header-title-hero{color:var(--accent);position:relative}.header-title-hero:after{content:"";background:var(--accent);opacity:.4;border-radius:2px;height:3px;position:absolute;bottom:0;left:0;right:0}.header-tagline{color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:500}.header-actions{align-items:center;gap:8px;animation:.4s ease-out .2s both text-enter;display:flex}.header-accent-line{background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 60%, transparent) 20%, var(--accent) 50%, color-mix(in srgb, var(--accent) 60%, transparent) 80%, transparent);height:2px;animation:3s ease-in-out infinite accent-shimmer}@keyframes accent-shimmer{0%,to{opacity:.5}50%{opacity:1}}.messages{flex-direction:column;flex:1;gap:12px;padding:16px 20px;display:flex;overflow-y:auto}.message{border-radius:var(--radius);white-space:pre-wrap;word-break:break-word;max-width:85%;padding:10px 14px;font-size:14px;line-height:1.5}.message.user{background:var(--user-bg);border-bottom-right-radius:4px;align-self:flex-end}.message.assistant{background:var(--agent-bg);border:1px solid var(--border);border-bottom-left-radius:4px;align-self:flex-start}.message.assistant .thinking{color:var(--text-muted);font-style:italic}.search-result-image{margin:6px 6px 0 0;display:inline-block}.search-result-image img{object-fit:cover;border:2px solid var(--border);cursor:pointer;background:var(--surface);border-radius:8px;width:100px;height:100px;transition:border-color .15s,transform .15s}.search-result-image img:hover{border-color:var(--accent);transform:scale(1.05)}.emoji-preview{flex-wrap:wrap;gap:8px;margin-top:8px;display:inline-flex}.emoji-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;flex-direction:column;align-items:center;gap:6px;padding:8px;display:flex}.emoji-card img{object-fit:contain;width:64px;height:64px;image-rendering:pixelated;background:repeating-conic-gradient(var(--checker-a) 0% 25%, var(--checker-b) 0% 50%) 50% / 16px 16px;border-radius:4px}.emoji-card .download-btn{background:var(--accent);color:#000;cursor:pointer;border:none;border-radius:4px;padding:3px 8px;font-size:11px;font-weight:600;text-decoration:none}.emoji-card .download-btn:hover{background:var(--accent-hover)}.input-area{border-top:1px solid var(--border);flex-shrink:0;padding:12px 20px}.input-area form{gap:8px;display:flex}.input-area input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);outline:none;flex:1;padding:10px 14px;font-family:inherit;font-size:14px;transition:border-color .15s}.input-area input:focus{border-color:var(--accent)}.input-area input::placeholder{color:var(--text-muted)}.input-area button{background:var(--accent);color:#000;border-radius:var(--radius);cursor:pointer;border:none;padding:10px 20px;font-family:inherit;font-size:14px;font-weight:600;transition:background .15s}.input-area button:hover:not(:disabled){background:var(--accent-hover)}.input-area button:disabled{opacity:.5;cursor:not-allowed}.messages::-webkit-scrollbar{width:6px}.messages::-webkit-scrollbar-track{background:0 0}.messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.welcome{color:var(--text-muted);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;padding:40px 20px;display:flex}.welcome-logo{filter:drop-shadow(0 4px 16px color-mix(in srgb, var(--accent) 35%, transparent))}.welcome h2{color:var(--text);font-size:20px;font-weight:600}.welcome p{max-width:380px;font-size:14px;line-height:1.5}.suggestions{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:8px;display:flex}.suggestions button{background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:20px;padding:6px 12px;font-family:inherit;font-size:13px;transition:background .15s,border-color .15s}.suggestions button:hover{background:var(--surface-hover);border-color:var(--accent)}.theme-picker{position:relative}.theme-toggle{background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:20px;align-items:center;gap:4px;padding:7px 10px;transition:border-color .2s,box-shadow .2s;display:flex}.theme-toggle:hover{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent)}.theme-toggle-swatches{gap:3px;display:flex}.theme-toggle-dot{border-radius:50%;width:10px;height:10px;transition:transform .15s}.theme-toggle:hover .theme-toggle-dot{transform:scale(1.15)}.theme-dropdown{background:var(--surface);border:1px solid var(--border);z-index:100;min-width:160px;box-shadow:0 12px 40px #00000059, 0 0 0 1px color-mix(in srgb, var(--accent) 10%, transparent);transform-origin:100% 0;border-radius:14px;padding:6px;animation:.2s cubic-bezier(.34,1.56,.64,1) dropdown-enter;position:absolute;top:calc(100% + 8px);right:0}@keyframes dropdown-enter{0%{opacity:0;transform:scale(.9)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}.theme-option{width:100%;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:9px;align-items:center;gap:10px;padding:8px 12px;font-family:inherit;font-size:13px;transition:background .15s;display:flex}.theme-option:hover{background:var(--surface-hover)}.theme-option.active{color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent);font-weight:600}.theme-swatch{border:2px solid var(--border);border-radius:50%;flex-shrink:0;width:18px;height:18px;transition:transform .15s}.theme-option:hover .theme-swatch{transform:scale(1.1)}.theme-option.active .theme-swatch{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent)}