:root{--font-family: "Outfit", sans-serif;--bg-color: #0f172a;--text-color: #f8fafc;--primary-color: #6366f1;--primary-hover: #4f46e5;--secondary-color: #1e293b;--secondary-hover: #334155;--accent-gradient: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);--glass-bg: rgba(30, 41, 59, .7);--glass-border: rgba(255, 255, 255, .1)}body{margin:0;font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-color);display:flex;justify-content:center;align-items:center;min-height:100vh;overflow:hidden;position:relative}#background-layer{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background-size:cover;background-position:center;background-repeat:no-repeat;transition:background-image .5s ease-in-out}@keyframes pan-right{0%{background-position:0% 50%;transform:scale(1)}to{background-position:100% 50%;transform:scale(1.1)}}@keyframes pan-left{0%{background-position:100% 50%;transform:scale(1)}to{background-position:0% 50%;transform:scale(1.1)}}.pan-right{animation:pan-right 15s linear infinite alternate}.pan-left{animation:pan-left 15s linear infinite alternate}#background-layer:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#0f172a99}#app{width:100%;max-width:600px;padding:2rem;box-sizing:border-box}.card{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:24px;padding:3rem 2rem;text-align:center;box-shadow:0 25px 50px -12px #00000080;transition:transform .3s ease}h1{font-size:2.5rem;font-weight:700;margin-bottom:2.5rem;line-height:1.2;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}h2{font-size:2rem;font-weight:600;margin-bottom:1.5rem}p{font-size:1.1rem;color:#cbd5e1;margin-bottom:2rem;line-height:1.6}.button-group{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.btn{border:none;padding:1rem 2.5rem;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:var(--font-family)}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:0 4px 14px #6366f163}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f13b}.btn-secondary{background:var(--secondary-color);color:#fff;border:1px solid var(--glass-border)}.btn-secondary:hover{background:var(--secondary-hover);transform:translateY(-2px)}.input-field{width:100%;padding:1rem;border-radius:12px;border:1px solid var(--glass-border);background:#0f172a99;color:#fff;font-size:1rem;margin-bottom:1rem;box-sizing:border-box;font-family:var(--font-family);transition:border-color .2s}.input-field:focus{outline:none;border-color:var(--primary-color)}.link{color:var(--primary-color);text-decoration:none;font-weight:500;transition:color .2s}.link:hover{color:var(--primary-hover);text-decoration:underline}.fade-in{animation:fadeIn .5s ease-out forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:640px){h1{font-size:2rem}.card{padding:2rem 1.5rem}.button-group{flex-direction:column}.btn{width:100%}}
