:root{--primary: #ff2a85;--secondary: #8a2be2;--accent: #00e5ff;--bg-color: #0f0c29;--bg-gradient: linear-gradient(to right, #24243e, #302b63, #0f0c29);--text-light: #f8f9fa;--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .37);--font-family: "Outfit", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);background:var(--bg-gradient);color:var(--text-light);min-height:100vh;overflow-x:hidden}#app{max-width:1200px;margin:0 auto;padding:2rem;display:flex;flex-direction:column;align-items:center}header{text-align:center;margin-bottom:3rem;animation:fadeInDown 1s ease-out}.logo{font-size:3.5rem;font-weight:700;background:-webkit-linear-gradient(45deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem;letter-spacing:-1px}.tagline{font-size:1.2rem;font-weight:300;color:#ffffffb3}.feed{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;width:100%}.card{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:20px;padding:1rem;box-shadow:var(--glass-shadow);transition:transform .4s cubic-bezier(.175,.885,.32,1.275),box-shadow .4s ease;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(to right,#fff0,#ffffff1a,#fff0);transform:skew(-25deg);transition:.75s}.card:hover:before{left:125%}.card:hover{transform:translateY(-10px);box-shadow:0 15px 45px #00e5ff33;border-color:#00e5ff4d}.card-img-wrapper{border-radius:12px;overflow:hidden;margin-bottom:1rem;display:flex;justify-content:center;align-items:center;background:#00000080;aspect-ratio:1}.card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.card:hover img{transform:scale(1.05)}.card-info{padding:.5rem}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.pet-name{font-size:1.4rem;font-weight:500;display:flex;align-items:center;gap:.5rem}.verified-badge{color:var(--accent);font-size:1rem;text-shadow:0 0 5px var(--accent)}.subscribe-btn{background:linear-gradient(45deg,var(--primary),var(--secondary));border:none;padding:.6rem 1.2rem;border-radius:20px;color:#fff;font-weight:700;font-family:var(--font-family);cursor:pointer;transition:all .3s ease;text-transform:uppercase;font-size:.8rem;letter-spacing:1px}.subscribe-btn:hover{box-shadow:0 0 15px var(--primary);transform:scale(1.05)}.card-caption{font-size:.95rem;color:#fffc;font-weight:300;line-height:1.4}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-up{animation:fadeInUp .8s ease-out forwards;opacity:0}#app{max-width:100%;padding:0;display:block}.app-header{position:sticky;top:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#0f0c29d9;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-bottom:1px solid var(--glass-border);box-shadow:0 4px 30px #00000080;animation:fadeInDown .5s ease-out}.logo-container{display:flex;align-items:center;gap:.8rem;cursor:pointer;text-decoration:none}.header-logo{height:35px;width:auto}.logo-text{font-size:1.5rem;font-weight:700;background:-webkit-linear-gradient(45deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.5px}.nav-links{display:flex;align-items:center;gap:1.5rem}.welcome-text{color:#ffffffb3;font-weight:300;font-size:.95rem;display:none}@media(min-width:768px){.welcome-text{display:block}}.nav-btn{background:none;border:none;color:var(--text-light);font-weight:500;font-family:var(--font-family);cursor:pointer;text-decoration:none;transition:color .3s;font-size:1rem}.nav-btn:hover{color:var(--accent)}.logout-btn{color:#ff4d4d}.login-view{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:2rem}.login-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:3rem;box-shadow:var(--glass-shadow);width:100%;max-width:420px;text-align:center}.login-logo{width:80px;margin-bottom:1rem}.login-title{font-size:2.2rem;font-weight:700;margin-bottom:.5rem;background:-webkit-linear-gradient(45deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.login-subtitle{color:#fff9;margin-bottom:2rem;font-weight:300}.input-group{margin-bottom:1.5rem}.input-group input{width:100%;padding:1rem 1.2rem;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#0003;color:#fff;font-family:var(--font-family);font-size:1rem;outline:none;transition:all .3s}.input-group input:focus{border-color:var(--primary);box-shadow:0 0 10px #ff2a854d}.primary-btn{width:100%;padding:1rem;background:linear-gradient(45deg,var(--primary),#d91c6e);color:#fff;border:none;border-radius:12px;font-family:var(--font-family);font-weight:700;font-size:1.1rem;cursor:pointer;transition:transform .3s,box-shadow .3s;box-shadow:0 5px 15px #ff2a8566}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff2a8599}.login-footer{margin-top:1.5rem;font-size:.9rem;color:#ffffffb3}.accent-link{color:var(--accent);text-decoration:none;font-weight:500}.feed-view{max-width:1200px;margin:0 auto;padding:2rem}.feed-header{text-align:center;margin-bottom:3rem}.feed-header h2{font-size:2.5rem}.card-img-link{display:block;text-decoration:none;color:inherit}.card .pet-name{text-decoration:none;color:#fff;display:flex}.card .pet-name:hover{color:var(--accent)}.price-tag{background:#00e5ff1a;color:var(--accent);padding:5px 10px;border-radius:20px;font-size:.8rem;font-weight:600}.profile-view{max-width:800px;margin:0 auto;padding:2rem 1rem}.profile-header-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;overflow:hidden;margin-bottom:2rem}.profile-banner{height:150px;background:linear-gradient(135deg,var(--primary),var(--secondary))}.profile-info-container{padding:0 2rem 2rem;position:relative;display:flex;flex-direction:column}.profile-avatar{margin-top:-60px;width:120px;height:120px;border-radius:50%;border:4px solid var(--bg-color);overflow:hidden;margin-bottom:1rem;background:#000}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-name{font-size:1.8rem;display:flex;align-items:center;gap:.5rem}.profile-username{color:var(--accent);margin-bottom:1rem}.profile-bio{margin-bottom:1.5rem;line-height:1.5;color:#ffffffe6}.profile-stats{display:flex;gap:1.5rem;color:#ffffffb3}.profile-stats strong{color:#fff}.profile-actions{position:absolute;top:1rem;right:2rem}.profile-sub-btn{font-size:1rem;padding:.8rem 1.5rem}.sections-title{margin-bottom:1rem;border-bottom:1px solid var(--glass-border);padding-bottom:.5rem;color:#fffc}.post-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:15px;padding:1.5rem;margin-bottom:1.5rem}.post-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.post-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden}.post-avatar img{width:100%;height:100%;object-fit:cover}.post-author{font-weight:500;display:flex;flex-direction:column}.post-time{font-size:.8rem;color:#ffffff80;font-weight:300}.post-text{margin-bottom:1rem;line-height:1.5}.post-image-locked{aspect-ratio:16/9;border-radius:12px;background:#00000080;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}.locked-overlay:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,#ffffff0d,#ffffff0d 10px,#0000001a 10px 20px);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1}.locked-content{text-align:center;z-index:2;position:absolute;width:100%}.lock-icon{font-size:3rem;margin-bottom:.5rem}.locked-text{margin-bottom:1rem;font-weight:500;text-shadow:0 2px 4px rgba(0,0,0,.8)}.small-sub-btn{font-size:.8rem}.unlocked-msg{color:var(--accent);font-size:1.5rem;font-weight:700;text-shadow:0 0 10px var(--accent)}.subscribe-btn.unlocked{background:transparent;border:1px solid var(--accent);color:var(--accent);box-shadow:none}.splash-view{display:flex;min-height:100vh;width:100%}.splash-left{flex:1.2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3rem 2.5rem;gap:2.5rem;background:linear-gradient(160deg,#8a2be240,#0f0c2999);border-right:1px solid var(--glass-border);overflow:hidden}.splash-right{width:440px;display:flex;align-items:center;justify-content:center;padding:3rem 2rem;background:#0003}.splash-right .login-card{width:100%;max-width:380px}.splash-brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;max-width:720px}.splash-logo{width:60px;height:60px;border-radius:12px}.splash-title{font-size:3rem;font-weight:700;background:-webkit-linear-gradient(45deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1.1}.splash-tagline{font-size:1.1rem;font-weight:300;color:#ffffffb3;line-height:1.6}.splash-stats{display:flex;justify-content:center;gap:2rem;margin-top:.5rem}.stat-item{display:flex;flex-direction:column;gap:2px}.stat-num{font-size:1.6rem;font-weight:700;background:-webkit-linear-gradient(45deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.stat-label{font-size:.8rem;color:#ffffff80;text-transform:uppercase;letter-spacing:1px}@keyframes border-spin{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.splash-slideshow{position:relative;max-width:720px;width:100%;border-radius:16px;overflow:hidden;border:2px solid transparent;background-clip:padding-box;box-shadow:0 0 0 2px transparent,0 8px 40px #ff2a8559,0 4px 60px #8a2be24d,0 0 80px #00e5ff26;aspect-ratio:4 / 3;background:#000;z-index:5;outline:2px solid;outline-color:transparent}.splash-slideshow:before{content:"";position:absolute;inset:-2px;z-index:-1;border-radius:18px;background:linear-gradient(270deg,var(--primary),var(--secondary),var(--accent),var(--primary));background-size:300% 300%;animation:border-spin 4s ease infinite}.slideshow-track{width:100%;height:100%;position:relative}.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1);pointer-events:none}.slide.active{opacity:1;pointer-events:auto}.slide img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.08);transition:transform 5s ease-out;filter:saturate(1.25) contrast(1.05) brightness(.95)}.slide.active img{transform:scale(1)}.slide:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#8a2be22e,#ff2a851f,#00e5ff14);mix-blend-mode:screen;pointer-events:none;z-index:1}.slide-overlay{position:absolute;bottom:0;left:0;right:0;padding:1.5rem 1.2rem 1rem;background:linear-gradient(to top,rgba(15,12,41,.92) 0%,rgba(48,43,99,.55) 50%,transparent 100%);display:flex;flex-direction:column;gap:.3rem;z-index:2}.slide-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--accent);text-shadow:0 0 8px var(--accent)}.slide-caption{font-size:1rem;font-weight:500;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.8)}.slide-btn{position:absolute;top:50%;transform:translateY(-50%);background:#0006;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:2rem;line-height:1;width:42px;height:42px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10;transition:background .2s,border-color .2s,transform .2s}.slide-btn:hover{background:#ff2a8580;border-color:var(--primary);transform:translateY(-50%) scale(1.1)}.slide-prev{left:.75rem}.slide-next{right:.75rem}.slide-dots{position:absolute;bottom:.75rem;right:1rem;display:flex;gap:.4rem;z-index:10}.slide-dot{width:8px;height:8px;border-radius:50%;background:#fff6;border:none;cursor:pointer;padding:0;transition:background .3s,transform .3s}.slide-dot.active{background:var(--primary);transform:scale(1.3);box-shadow:0 0 6px var(--primary)}.divider{display:flex;align-items:center;gap:1rem;margin:1.5rem 0;color:#ffffff4d;font-size:.85rem}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#ffffff1a}.social-btn{width:100%;padding:.85rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fff;font-family:var(--font-family);font-size:.95rem;cursor:pointer;margin-bottom:.75rem;transition:background .2s,border-color .2s}.social-btn:hover{background:#ffffff1a;border-color:#ffffff40}@media(max-width:768px){.splash-view{flex-direction:column}.splash-left{border-right:none;border-bottom:1px solid var(--glass-border)}.splash-right{width:100%;padding:2rem 1.5rem}.splash-title{font-size:2.2rem}.splash-grid{grid-template-columns:repeat(3,1fr)}}