*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#0a0a1a;--color-bg-secondary:#12122a;--color-surface:#1a1a35;--color-surface-elevated:#222250;--color-text:#f0f0ff;--color-text-secondary:#88a;--color-like:#00e676;--color-like-glow:#00e6764d;--color-nope:#ff4757;--color-nope-glow:#ff47574d;--color-accent:#7c4dff;--color-accent-glow:#7c4dff40;--card-radius:20px;--font:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html,body{width:100%;height:100%;font-family:var(--font);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}#root{width:100%;height:100%}.app{-webkit-user-select:none;user-select:none;background:radial-gradient(circle at 50% -20%, #7c4dff26 0%, transparent 60%), radial-gradient(circle at 10% 80%, #00f2fe14 0%, transparent 50%), radial-gradient(circle at 90% 80%, #ff008014 0%, transparent 50%), var(--color-bg);flex-direction:column;width:100%;height:100dvh;display:flex;position:relative;overflow:hidden}.app:before{content:"";pointer-events:none;z-index:1;background:radial-gradient(circle,#0000 40%,#05050fcc 100%);position:absolute;inset:0}.particles{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.particle{width:var(--size);height:var(--size);background:var(--color-accent);opacity:var(--opacity);bottom:-10px;left:var(--x-start);animation:float-up var(--duration) var(--delay) infinite linear;border-radius:50%;position:absolute}@keyframes float-up{0%{opacity:0;transform:translateY(0)translate(0)}10%{opacity:var(--opacity)}90%{opacity:var(--opacity)}to{transform:translateY(-110vh) translateX(calc(var(--x-end) - var(--x-start)));opacity:0}}.swipe-flash{pointer-events:none;z-index:100;opacity:0;transition:opacity .3s;position:fixed;inset:0}.swipe-flash.active{opacity:1;animation:.6s ease-out forwards flash-pulse}.flash-like{background:radial-gradient(circle at center, var(--color-like-glow) 0%, transparent 70%)}.flash-nope{background:radial-gradient(circle at center, var(--color-nope-glow) 0%, transparent 70%)}@keyframes flash-pulse{0%{opacity:.8}to{opacity:0}}.header{z-index:20;-webkit-backdrop-filter:blur(20px);background:#0a0a1a99;border-bottom:1px solid #7c4dff26;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex;position:relative}.header-left{flex-shrink:0}.header-center{z-index:30;flex:1;max-width:400px;position:relative}.header-right{flex-shrink:0}.search-container{width:100%;position:relative}.search-input-wrapper{align-items:center;display:flex;position:relative}.search-icon{width:16px;height:16px;color:var(--color-text-secondary);pointer-events:none;z-index:1;position:absolute;left:14px}.search-input{width:100%;color:var(--color-text);font-family:var(--font);background:#ffffff0a;border:1px solid #7c4dff33;border-radius:12px;outline:none;padding:10px 36px 10px 40px;font-size:14px;font-weight:500;transition:all .3s}.search-input::placeholder{color:var(--color-text-secondary);opacity:.6}.search-input:focus{background:#ffffff12;border-color:#7c4dff80;box-shadow:0 0 20px #7c4dff26,inset 0 0 15px #7c4dff0d}.search-clear{width:22px;height:22px;color:var(--color-text-secondary);cursor:pointer;background:#ffffff14;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:11px;transition:all .2s;display:flex;position:absolute;right:10px}.search-clear:hover{color:var(--color-nope);background:#ff475733}.search-dropdown{-webkit-backdrop-filter:blur(24px);z-index:50;background:#14142df7;border:1px solid #7c4dff40;border-radius:16px;width:max(100%,340px);min-width:340px;max-height:360px;animation:.25s cubic-bezier(.25,.8,.25,1) dropdown-in;position:absolute;top:calc(100% + 8px);left:50%;overflow:hidden auto;transform:translate(-50%);box-shadow:0 12px 40px #00000080,0 0 0 1px #ffffff0a,0 0 30px #7c4dff14}.search-dropdown::-webkit-scrollbar{width:4px}.search-dropdown::-webkit-scrollbar-track{background:0 0}.search-dropdown::-webkit-scrollbar-thumb{background:#7c4dff4d;border-radius:2px}@keyframes dropdown-in{0%{opacity:0;transform:translate(-50%)translateY(-8px)scale(.97)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}.search-loading{color:var(--color-text-secondary);justify-content:center;align-items:center;gap:10px;padding:24px;font-size:14px;display:flex}.search-spinner{border:2px solid #7c4dff26;border-top-color:var(--color-accent);border-radius:50%;width:18px;height:18px;animation:.7s linear infinite spin}.search-empty{color:var(--color-text-secondary);justify-content:center;align-items:center;gap:8px;padding:24px;font-size:14px;display:flex}.search-results{flex-direction:column;padding:6px;display:flex}.search-result-item{cursor:pointer;text-align:left;width:100%;font-family:var(--font);background:0 0;border:none;border-radius:12px;align-items:center;gap:12px;padding:10px 12px;transition:all .2s;display:flex}.search-result-item:hover{background:#7c4dff1a}.search-result-item:active{transform:scale(.98)}.search-result-avatar{object-fit:cover;background:var(--color-surface);border:1px solid #ffffff0f;border-radius:10px;flex-shrink:0;width:44px;height:44px}.search-result-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.search-result-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.search-result-username{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.search-result-add{color:var(--color-like);background:#00e6761f;border:1px solid #00e6764d;border-radius:8px;flex-shrink:0;padding:4px 10px;font-size:12px;font-weight:600;transition:all .2s}.search-result-item:hover .search-result-add{background:#00e67640;box-shadow:0 0 12px #00e67626}.logo{align-items:center;gap:10px;display:flex}.logo-icon{filter:drop-shadow(0 0 8px var(--color-accent-glow));font-size:28px}.logo-text{background:linear-gradient(135deg,#7c4dff,#b388ff,#7c4dff) 0 0/200% 200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:22px;font-weight:800;animation:4s infinite gradient-shift}@keyframes gradient-shift{0%,to{background-position:0%}50%{background-position:100%}}.liked-btn{color:var(--color-nope);font-family:var(--font);cursor:pointer;background:#ff475726;border:1px solid #ff47574d;border-radius:50px;align-items:center;gap:8px;padding:8px 16px;font-size:15px;font-weight:600;transition:all .3s;display:flex}.liked-btn:hover{background:#ff475740;transform:scale(1.05);box-shadow:0 0 20px #ff475733}.liked-icon{font-size:18px}.liked-count{text-align:center;min-width:20px}.main{z-index:1;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;padding:16px;display:flex;position:relative}.card-stack{width:340px;max-width:90vw;height:440px;position:relative}.swipe-card{border-radius:var(--card-radius);background:var(--color-surface);will-change:transform;touch-action:none;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden;box-shadow:0 8px 40px #0006,0 0 0 1px #ffffff0f,inset 0 1px #ffffff14}.swipe-card:active{cursor:grabbing}.stamp{z-index:15;letter-spacing:3px;pointer-events:none;border:4px solid;border-radius:8px;padding:6px 20px;font-size:32px;font-weight:900;transition:opacity .15s;position:absolute;top:28px;transform:rotate(-15deg)}.stamp-like{color:var(--color-like);border-color:var(--color-like);text-shadow:0 0 20px var(--color-like-glow);box-shadow:0 0 30px var(--color-like-glow);background:#00e6761a;left:20px}.stamp-nope{color:var(--color-nope);border-color:var(--color-nope);text-shadow:0 0 20px var(--color-nope-glow);box-shadow:0 0 30px var(--color-nope-glow);background:#ff47571a;right:20px;transform:rotate(15deg)}.card-image-wrapper{background:linear-gradient(135deg, var(--color-surface), var(--color-surface-elevated));width:100%;height:75%;position:relative;overflow:hidden}.card-avatar{object-fit:cover;object-position:center top;pointer-events:none;width:100%;height:100%;transition:transform .3s}.swipe-card:hover .card-avatar{transform:scale(1.03)}.card-gradient-overlay{background:linear-gradient(to top, var(--color-surface) 0%, #1a1a35cc 40%, transparent 100%);pointer-events:none;height:50%;position:absolute;bottom:0;left:0;right:0}.card-info{background:var(--color-surface);padding:16px 20px;position:relative}.card-display-name{color:var(--color-text);margin-bottom:2px;font-size:22px;font-weight:700;line-height:1.2}.card-username{color:var(--color-accent);margin-bottom:2px;font-size:14px;font-weight:500}.card-id{color:var(--color-text-secondary);font-size:12px;font-weight:400}.action-buttons{align-items:center;gap:20px;display:flex}.action-btn{cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;transition:all .25s cubic-bezier(.25,.8,.25,1);display:flex;position:relative;overflow:hidden}.action-btn:after{content:"";opacity:0;border-radius:50%;transition:opacity .3s;position:absolute;inset:0}.action-btn:hover{transform:scale(1.15)}.action-btn:active{transform:scale(.95)}.btn-nope{width:64px;height:64px;color:var(--color-nope);background:#ff47571f;border:2px solid #ff475766}.btn-nope svg{width:28px;height:28px}.btn-nope:hover{border-color:var(--color-nope);background:#ff475740;box-shadow:0 0 30px #ff47574d,0 0 60px #ff47571a}.btn-like{width:64px;height:64px;color:var(--color-like);background:#00e6761f;border:2px solid #00e67666}.btn-like svg{width:28px;height:28px}.btn-like:hover{border-color:var(--color-like);background:#00e67640;box-shadow:0 0 30px #00e6764d,0 0 60px #00e6761a}.btn-reload{width:48px;height:48px;color:var(--color-accent);background:#7c4dff1f;border:2px solid #7c4dff4d}.btn-reload svg{width:20px;height:20px}.btn-reload:hover{box-shadow:0 0 30px var(--color-accent-glow);border-color:var(--color-accent);background:#7c4dff40}.btn-reload:disabled{opacity:.4;cursor:not-allowed;transform:none}.stats-bar{-webkit-backdrop-filter:blur(12px);background:#1a1a3580;border:1px solid #ffffff0f;border-radius:50px;gap:32px;padding:10px 24px;display:flex}.stat{align-items:center;gap:6px;display:flex}.stat-emoji{font-size:16px}.stat-value{color:var(--color-text);font-size:16px;font-weight:700}.loading-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;display:flex}.loading-state p{color:var(--color-text-secondary);font-size:16px;font-weight:500}.loading-sub{opacity:.6;font-size:13px!important}.loading-spinner{border:3px solid #7c4dff26;border-top-color:var(--color-accent);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;height:100%;display:flex}.empty-emoji{font-size:64px;animation:2s infinite bounce}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.empty-state p{color:var(--color-text-secondary);font-size:18px;font-weight:500}.reload-btn{background:linear-gradient(135deg, var(--color-accent), #9c7cff);color:#fff;font-family:var(--font);cursor:pointer;box-shadow:0 4px 20px var(--color-accent-glow);border:none;border-radius:50px;margin-top:8px;padding:12px 28px;font-size:15px;font-weight:600;transition:all .3s}.reload-btn:hover{box-shadow:0 6px 30px var(--color-accent-glow);transform:translateY(-2px)}.panel-overlay{z-index:49;background:#0009;animation:.3s fade-in;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.liked-panel{background:var(--color-bg-secondary);z-index:50;border-left:1px solid #7c4dff33;flex-direction:column;width:380px;max-width:85vw;height:100%;transition:right .4s cubic-bezier(.25,.8,.25,1);display:flex;position:fixed;top:0;right:-400px;box-shadow:-8px 0 40px #00000080}.liked-panel.open{right:0}.panel-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.panel-header h2{font-size:20px;font-weight:700}.panel-close{width:36px;height:36px;color:var(--color-text-secondary);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;font-size:16px;transition:all .2s;display:flex}.panel-close:hover{color:var(--color-nope);background:#ff475733;border-color:#ff47574d}.panel-content{flex:1;padding:16px;overflow-y:auto}.panel-content::-webkit-scrollbar{width:4px}.panel-content::-webkit-scrollbar-track{background:0 0}.panel-content::-webkit-scrollbar-thumb{background:#7c4dff4d;border-radius:2px}.panel-empty{text-align:center;height:200px;color:var(--color-text-secondary);flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex}.panel-empty-sub{opacity:.6;font-size:13px}.liked-grid{flex-direction:column;gap:12px;display:flex}.liked-card{background:#ffffff08;border:1px solid #ffffff0f;border-radius:14px;align-items:center;gap:12px;padding:12px;transition:all .2s;display:flex}.liked-card:hover{background:#7c4dff14;border-color:#7c4dff33;transform:translate(-4px)}.liked-avatar{object-fit:cover;background:var(--color-surface);border-radius:12px;flex-shrink:0;width:52px;height:52px}.liked-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.liked-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.liked-username{color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.liked-profile-link{color:var(--color-accent);font-size:12px;font-weight:600;font-family:var(--font);background:#7c4dff26;border:1px solid #7c4dff4d;border-radius:8px;flex-shrink:0;padding:6px 12px;text-decoration:none;transition:all .2s}.liked-profile-link:hover{background:#7c4dff4d;transform:scale(1.05)}@media (width<=480px){.header{padding:12px 16px}.logo-text{display:none}.header-center{max-width:none}.search-input{padding:8px 32px 8px 36px;font-size:13px}.search-dropdown{width:auto;min-width:auto;max-width:none;position:fixed;top:64px;left:8px;right:8px;transform:none}.card-stack{width:300px;height:400px}.stamp{padding:4px 14px;font-size:24px}.action-buttons{gap:16px}.btn-nope,.btn-like{width:56px;height:56px}.btn-reload{width:42px;height:42px}.stats-bar{gap:24px;padding:8px 20px}}@media (width<=360px){.card-stack{width:280px;height:370px}.card-display-name{font-size:18px}}@media (prefers-reduced-motion:reduce){.particle,.logo-text,.loading-spinner,.empty-emoji{animation:none}.swipe-card,.action-btn,.liked-panel,.liked-card{transition-duration:.01ms!important}}
