:root{--bg-color: #0f172a;--card-bg: rgba(30, 41, 59, .7);--text-primary: #f8fafc;--text-secondary: #cbd5e1;--primary: #6366f1;--primary-hover: #4f46e5;--secondary: #ec4899;--accent: #8b5cf6;--success: #10b981;--glass-border: rgba(255, 255, 255, .1);--input-bg: rgba(255, 255, 255, .05)}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 0% 0%,rgba(99,102,241,.15) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(236,72,153,.15) 0px,transparent 50%);min-height:100vh}#root{min-height:100vh;display:flex;flex-direction:column}.glass-card{background:var(--card-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:0 4px 30px #0000001a}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:none;padding:12px 24px;border-radius:99px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #6366f14d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.btn-secondary{background:transparent;border:2px solid var(--primary);color:var(--text-primary);padding:10px 22px;border-radius:99px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-secondary:hover{background:#6366f11a}.container{max-width:800px;margin:0 auto;padding:20px;width:100%}h1,h2,h3{letter-spacing:-.025em;font-weight:700}h1{font-size:2.5rem}h2{font-size:1.8rem}label{display:block;margin-bottom:8px;font-weight:500;color:var(--text-secondary);font-size:.9rem}.input-group{display:flex;align-items:center;background:var(--input-bg);border:1px solid var(--glass-border);border-radius:12px;padding:0 15px;transition:border-color .3s ease}.input-group:focus-within{border-color:var(--primary)}.input-group svg{color:var(--text-secondary);margin-right:10px}input,select{width:100%;padding:12px 0;background:transparent;border:none;color:#fff;font-size:1rem;font-family:inherit;outline:none}input::placeholder{color:#ffffff4d}select{padding:12px 15px;background:var(--input-bg);border:1px solid var(--glass-border);border-radius:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23cbd5e1%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E);background-repeat:no-repeat;background-position:right 15px top 50%;background-size:12px auto}select option{background:#1e293b;color:#fff}.progress-bar{height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));transition:width .5s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .5s ease forwards}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}
