@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--radius-sm: 8px;--radius: 14px;--radius-lg: 20px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .08);--shadow: 0 8px 24px rgba(0, 0, 0, .12);--shadow-lg: 0 20px 50px rgba(0, 0, 0, .25);--accent: #16a34a;--accent-2: #22c55e;--accent-grad: linear-gradient(135deg, #22c55e, #16a34a 60%, #15803d);--transition: .18s cubic-bezier(.4, 0, .2, 1)}[data-theme=dark]{--bg: #0b1220;--bg-grad: radial-gradient(1200px 600px at 80% -10%, #16331f 0%, transparent 60%), radial-gradient(900px 500px at -10% 0%, #0d2a3a 0%, transparent 55%), #0b1220;--surface: rgba(255, 255, 255, .05);--surface-2: rgba(255, 255, 255, .08);--border: rgba(255, 255, 255, .1);--text: #e8edf4;--text-muted: #9aa7b8;--input-bg: rgba(255, 255, 255, .06)}[data-theme=light]{--bg: #f3f6f9;--bg-grad: radial-gradient(1100px 600px at 85% -10%, #d7f3e1 0%, transparent 60%), radial-gradient(900px 500px at -5% 0%, #dbeefe 0%, transparent 55%), #f3f6f9;--surface: #ffffff;--surface-2: #f7faf8;--border: rgba(15, 30, 25, .1);--text: #14211b;--text-muted: #5d6b66;--input-bg: #ffffff}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;font-family:var(--font);color:var(--text);background:var(--bg-grad);background-attachment:fixed;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;transition:background var(--transition),color var(--transition)}h1,h2,h3{line-height:1.2}button{font-family:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px;border-radius:var(--radius-sm)}.app-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) var(--space-6);max-width:1200px;width:100%;margin:0 auto}.brand h1{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-.02em;background:var(--accent-grad);-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{color:var(--text-muted);font-size:.95rem;margin-top:2px}.theme-toggle{width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:var(--surface);font-size:1.2rem;display:grid;place-items:center;transition:transform var(--transition),background var(--transition)}.theme-toggle:hover{transform:rotate(-15deg) scale(1.06);background:var(--surface-2)}.app-main{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:0 var(--space-6) var(--space-6)}.controls{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.search-form{display:flex;gap:var(--space-4);align-items:flex-end;flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:var(--space-2)}.field:first-child{flex:1 1 320px}.field label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}input[type=text],select{font-size:1rem;color:var(--text);background:var(--input-bg);border:1px solid var(--border);border-radius:var(--radius);padding:.7rem .9rem;transition:border-color var(--transition),box-shadow var(--transition)}input[type=text]::placeholder{color:var(--text-muted)}input[type=text]:focus,select:focus{outline:none;border-color:var(--accent-2);box-shadow:0 0 0 3px #22c55e2e}.rating-field select{min-width:90px}.actions{display:flex;gap:var(--space-2)}.btn{border:1px solid transparent;border-radius:var(--radius);padding:.7rem 1.2rem;font-size:.95rem;font-weight:600;transition:transform var(--transition),filter var(--transition),background var(--transition);white-space:nowrap}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent-grad);color:#fff;box-shadow:0 6px 16px #16a34a59}.btn-primary:hover{filter:brightness(1.07)}.btn-ghost{background:var(--surface-2);color:var(--text);border-color:var(--border)}.btn-ghost:hover{background:var(--surface)}.btn-outline{background:transparent;color:var(--text);border-color:var(--border);padding:.7rem 2rem}.btn-outline:hover{border-color:var(--accent-2);color:var(--accent-2)}.history{margin-top:var(--space-4);display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.history-label{font-size:.82rem;color:var(--text-muted);font-weight:600}.chips{display:flex;gap:var(--space-2);flex-wrap:wrap}.chip{background:var(--surface-2);border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:.3rem .8rem;font-size:.85rem;transition:all var(--transition)}.chip:hover{color:var(--text);border-color:var(--accent-2)}.tabs{display:flex;gap:var(--space-2);margin:var(--space-5) 0 var(--space-4)}.tab{background:transparent;border:none;color:var(--text-muted);font-size:1rem;font-weight:600;padding:.5rem .25rem;position:relative;display:flex;align-items:center;gap:var(--space-2);transition:color var(--transition)}.tab:after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;border-radius:3px;background:var(--accent-grad);transform:scaleX(0);transition:transform var(--transition)}.tab.is-active{color:var(--text)}.tab.is-active:after{transform:scaleX(1)}.badge{background:var(--accent);color:#fff;font-size:.72rem;font-weight:700;border-radius:999px;padding:.05rem .5rem;min-width:1.4rem;text-align:center}.quick-buttons-section{margin-bottom:var(--space-5)}.buttons{display:flex;flex-wrap:wrap;gap:var(--space-2)}.muted{color:var(--text-muted);font-size:.9rem}.animal-chip{display:inline-flex;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:999px;overflow:hidden;transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition)}.animal-chip:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.animal-chip.is-active{border-color:var(--accent-2);box-shadow:0 0 0 2px #22c55e40}.chip-label{background:transparent;border:none;color:var(--text);font-weight:600;font-size:.92rem;padding:.45rem .4rem .45rem 1rem}.animal-chip.is-active .chip-label{color:var(--accent-2)}.chip-remove{background:transparent;border:none;color:var(--text-muted);font-size:1.1rem;line-height:1;padding:0 .7rem;align-self:stretch;transition:color var(--transition),background var(--transition)}.chip-remove:hover{color:#fff;background:#ef4444}.results-title{font-size:1.25rem;font-weight:700;margin-bottom:var(--space-4);letter-spacing:-.01em}.gif-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-4)}.gif-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--transition),box-shadow var(--transition);display:flex;flex-direction:column}.gif-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.gif-media{position:relative;width:100%;background:var(--surface-2);overflow:hidden}.gif-media img{width:100%;height:100%;object-fit:cover;display:block}.gif-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-between;padding:var(--space-2);background:linear-gradient(to bottom,rgba(0,0,0,.35) 0%,transparent 30%,transparent 60%,rgba(0,0,0,.45) 100%);opacity:0;transition:opacity var(--transition)}.gif-card:hover .gif-overlay,.gif-card:focus-within .gif-overlay{opacity:1}.rating-badge{align-self:flex-start;background:#0009;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.05em;padding:.15rem .45rem;border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.gif-actions{align-self:flex-end;display:flex;gap:var(--space-2)}.icon-btn{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;border:none;background:#ffffffeb;color:#1a1a1a;font-size:1rem;text-decoration:none;transition:transform var(--transition),background var(--transition)}.icon-btn:hover{transform:scale(1.12);background:#fff}.fav-btn.is-active{background:#facc15;color:#7c5e00}.icon-btn.copied{background:var(--accent-2);color:#fff}.gif-title{padding:var(--space-3);font-size:.85rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status{grid-column:1 / -1;text-align:center;padding:var(--space-6) var(--space-4);color:var(--text-muted)}.status-icon{font-size:2.6rem;margin-bottom:var(--space-3)}.status h3{color:var(--text);font-size:1.15rem;margin-bottom:var(--space-2)}.skeleton{aspect-ratio:1 / 1;border-radius:var(--radius);background:linear-gradient(100deg,var(--surface) 30%,var(--surface-2) 50%,var(--surface) 70%);background-size:200% 100%;animation:shimmer 1.3s infinite;border:1px solid var(--border)}@keyframes shimmer{to{background-position:-200% 0}}.load-more-wrap{display:flex;justify-content:center;margin:var(--space-6) 0 var(--space-4)}.app-footer{max-width:1200px;width:100%;margin:0 auto;padding:var(--space-5) var(--space-6);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-2);color:var(--text-muted);font-size:.85rem;border-top:1px solid var(--border)}.powered{font-weight:700;letter-spacing:.04em}@media(max-width:640px){.app-header,.app-main,.app-footer{padding-left:var(--space-4);padding-right:var(--space-4)}.search-form{flex-direction:column;align-items:stretch}.actions{flex-direction:column}.actions .btn{width:100%}.gif-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
