:root{--bg-1: #0b0f1e;--bg-2: #1a103d;--bg-3: #2a1a5e;--card: rgba(30, 41, 59, .55);--card-border: rgba(148, 163, 184, .12);--accent: #38bdf8;--accent-2: #a78bfa;--accent-3: #f472b6;--text: #e2e8f0;--muted: #94a3b8;--error: #f87171;--success: #4ade80}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,system-ui,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:linear-gradient(135deg,var(--bg-1) 0%,var(--bg-2) 50%,var(--bg-3) 100%);background-attachment:fixed;overflow-x:hidden;position:relative}body:before,body:after{content:"";position:fixed;border-radius:50%;filter:blur(80px);opacity:.4;pointer-events:none;z-index:0}body:before{width:500px;height:500px;background:var(--accent);top:-200px;left:-200px;animation:float1 20s ease-in-out infinite}body:after{width:600px;height:600px;background:var(--accent-3);bottom:-300px;right:-300px;animation:float2 25s ease-in-out infinite}@keyframes float1{0%,to{transform:translate(0) scale(1)}50%{transform:translate(150px,100px) scale(1.1)}}@keyframes float2{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-150px,-100px) scale(1.15)}}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:1.5rem;position:relative;z-index:1}.auth-card{width:100%;max-width:400px;padding:2.5rem;background:var(--card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--card-border);border-radius:20px;box-shadow:0 25px 60px #00000080,inset 0 1px #ffffff0d;animation:cardIn .7s cubic-bezier(.16,1,.3,1) both}@keyframes cardIn{0%{opacity:0;transform:translateY(40px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-logo{width:56px;height:56px;margin:0 auto 1.25rem;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 10px 30px #38bdf866;font-size:1.6rem;animation:pulse 3s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 10px 30px #38bdf866}50%{box-shadow:0 10px 40px #a78bfa99}}.auth-card h1{text-align:center;font-size:1.75rem;font-weight:700;background:linear-gradient(135deg,#fff 0%,var(--accent) 50%,var(--accent-2) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem;letter-spacing:-.02em}.subtitle{text-align:center;color:var(--muted);font-size:.95rem;margin-bottom:1.75rem}.field{margin-bottom:1rem;animation:fieldIn .6s cubic-bezier(.16,1,.3,1) both}.field:nth-child(1){animation-delay:.15s}.field:nth-child(2){animation-delay:.25s}@keyframes fieldIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.field label{display:block;font-size:.8rem;font-weight:500;color:var(--muted);margin-bottom:.4rem;text-transform:uppercase;letter-spacing:.05em}.field input{width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid rgba(148,163,184,.18);background:#0f172a80;color:var(--text);font-size:.95rem;transition:all .25s ease}.field input:hover{border-color:#94a3b859}.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #38bdf826;background:#0f172abf}.btn-primary{width:100%;padding:.85rem;margin-top:.5rem;border:0;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0f172a;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .25s ease;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,var(--accent-2),var(--accent-3));opacity:0;transition:opacity .3s ease}.btn-primary:hover:before{opacity:1}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 25px #38bdf84d}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-primary>*{position:relative;z-index:1}.spinner{width:16px;height:16px;border:2px solid rgba(15,23,42,.3);border-top-color:#0f172a;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error{color:var(--error);font-size:.85rem;margin-top:.85rem;text-align:center;animation:shake .4s cubic-bezier(.36,.07,.19,.97)}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.hint{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid rgba(148,163,184,.1);font-size:.8rem;color:var(--muted);text-align:center}.hint code{background:#0f172a99;padding:.15rem .5rem;border-radius:4px;color:var(--accent);font-family:SF Mono,Monaco,Consolas,monospace;font-size:.78rem}.topbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#0f172a80;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:10;animation:slideDown .5s cubic-bezier(.16,1,.3,1) both}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:1rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.brand .dot{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-size:.9rem;-webkit-text-fill-color:#0f172a;color:#0f172a;box-shadow:0 4px 12px #38bdf866}.btn-ghost{background:#38bdf814;color:var(--accent);border:1px solid rgba(56,189,248,.3);border-radius:10px;padding:.45rem .95rem;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .25s ease}.btn-ghost:hover{background:#38bdf826;border-color:var(--accent);transform:translateY(-1px)}.home{max-width:1000px;margin:0 auto;padding:4rem 2rem;position:relative;z-index:1}.hero{text-align:center;margin-bottom:4rem;animation:heroIn .8s cubic-bezier(.16,1,.3,1) both}@keyframes heroIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .85rem;border-radius:999px;background:#4ade801a;border:1px solid rgba(74,222,128,.25);color:var(--success);font-size:.8rem;font-weight:500;margin-bottom:1.25rem}.badge .ping{width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 #4ade80b3;animation:ping 2s infinite}@keyframes ping{0%{box-shadow:0 0 #4ade80b3}70%{box-shadow:0 0 0 10px #4ade8000}to{box-shadow:0 0 #4ade8000}}.hero h1{font-size:clamp(2rem,5vw,3.25rem);font-weight:800;line-height:1.1;letter-spacing:-.03em;margin-bottom:1rem;background:linear-gradient(135deg,#fff 0%,var(--accent) 60%,var(--accent-2) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero .wave{-webkit-text-fill-color:initial;display:inline-block;animation:wave 2.5s ease-in-out infinite;transform-origin:70% 70%}@keyframes wave{0%,60%,to{transform:rotate(0)}10%,30%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}.hero p{font-size:1.1rem;color:var(--muted);max-width:620px;margin:0 auto;line-height:1.6}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem}.card{padding:1.75rem;background:var(--card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--card-border);border-radius:18px;position:relative;overflow:hidden;cursor:default;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s ease;animation:cardSlide .7s cubic-bezier(.16,1,.3,1) both}.card:nth-child(1){animation-delay:.15s}.card:nth-child(2){animation-delay:.25s}.card:nth-child(3){animation-delay:.35s}@keyframes cardSlide{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,transparent 0%,rgba(56,189,248,.05) 100%);opacity:0;transition:opacity .4s ease}.card:hover{transform:translateY(-8px);border-color:#38bdf84d}.card:hover:before{opacity:1}.card .num{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0f172a;font-weight:700;margin-bottom:1rem;box-shadow:0 8px 20px #38bdf84d;position:relative;z-index:1}.card h3{font-size:1.1rem;margin-bottom:.5rem;position:relative;z-index:1}.card p{color:var(--muted);font-size:.92rem;line-height:1.55;position:relative;z-index:1}@media (max-width: 600px){.auth-card{padding:2rem 1.5rem}.topbar{padding:1rem 1.25rem}.home{padding:2.5rem 1.25rem}}
