:root{--bg:#05060a;--bg-soft:#0c0e15;--card-bg:#0f1219;--card-bg-2:#131722;--green:#10b981;--green-2:#34d399;--green-3:#6ee7b7;--green-soft:rgba(16,185,129,.12);--green-ring:rgba(16,185,129,.35);--red:#ef4444;--red-soft:rgba(239,68,68,.12);--yellow:#f59e0b;--yellow-soft:rgba(245,158,11,.12);--blue:#3b82f6;--text:#eef1f7;--text-strong:#ffffff;--muted:#8b97ab;--muted-2:#5f6a7d;--border:rgba(255,255,255,.07);--border-strong:rgba(255,255,255,.13);--input-bg:#171a24;--input-border:#232838;--shadow-lg:0 30px 60px rgba(0,0,0,.55);--shadow-md:0 14px 34px rgba(0,0,0,.4);--shadow-sm:0 6px 18px rgba(0,0,0,.25);--shadow-green:0 14px 36px rgba(16,185,129,.35);--gradient-brand:linear-gradient(135deg,#10b981 0%,#059669 100%);--gradient-brand-2:linear-gradient(135deg,#34d399 0%,#10b981 50%,#059669 100%);--gradient-card:linear-gradient(160deg,#131722 0%,#0c0e15 100%)}[data-theme=light]{--bg:#f0f3f9;--bg-soft:#e8ecf4;--card-bg:#ffffff;--card-bg-2:#f8fafc;--text:#0f172a;--text-strong:#020617;--muted:#64748b;--muted-2:#94a3b8;--border:rgba(15,23,42,.07);--border-strong:rgba(15,23,42,.13);--input-bg:#f8fafc;--input-border:#e2e8f0;--shadow-lg:0 30px 60px rgba(15,23,42,.1);--shadow-md:0 14px 34px rgba(15,23,42,.08);--shadow-sm:0 6px 18px rgba(15,23,42,.06);--shadow-green:0 14px 36px rgba(16,185,129,.25);--gradient-card:linear-gradient(160deg,#ffffff 0%,#f8fafc 100%)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;color:var(--text);display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;overflow-x:hidden;transition:background .3s,color .3s;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.01em;font-size:14px;position:relative}body:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 20% 20%,rgba(16,185,129,.18),transparent 40%),radial-gradient(circle at 80% 30%,rgba(59,130,246,.12),transparent 45%),radial-gradient(circle at 50% 90%,rgba(168,85,247,.1),transparent 50%);animation:auroraMove 24s ease-in-out infinite alternate;pointer-events:none;z-index:0}@keyframes auroraMove{0%{transform:translate(0) scale(1)}50%{transform:translate(-3%,2%) scale(1.05)}to{transform:translate(3%,-2%) scale(1)}}body:after{content:"";position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:0;mask-image:radial-gradient(circle at 50% 50%,black,transparent 80%);-webkit-mask-image:radial-gradient(circle at 50% 50%,black,transparent 80%)}[data-theme=light] body:after{background-image:linear-gradient(rgba(15,23,42,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.025) 1px,transparent 1px)}.register-card{position:relative;z-index:1;background:var(--gradient-card);border-radius:26px;padding:36px 28px 30px;max-width:460px;width:100%;border:1px solid var(--border);box-shadow:var(--shadow-lg);overflow:hidden;animation:cardIn .55s cubic-bezier(.2,.9,.3,1.2) both}@keyframes cardIn{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.register-card:before{content:"";position:absolute;top:-80px;left:50%;transform:translate(-50%);width:320px;height:200px;background:radial-gradient(circle,var(--green-ring),transparent 65%);filter:blur(40px);pointer-events:none}.register-card:after{content:"";position:absolute;inset:0;border-radius:26px;padding:1px;background:linear-gradient(180deg,rgba(16,185,129,.4),transparent 45%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.logo-wrap{text-align:center;margin-bottom:22px;position:relative;z-index:1}.logo{font-size:1.75rem;font-weight:900;letter-spacing:3px;color:var(--text-strong);line-height:1}.logo .brand-dot{color:var(--green);text-shadow:0 0 12px var(--green-ring)}.subtitle{text-align:center;color:var(--muted);margin-top:8px;font-size:.84rem;font-weight:500;position:relative;z-index:1}.steps{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:22px;position:relative;z-index:1}.step-dot{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;border:1.5px solid var(--border-strong);transition:all .3s}.step-dot.active{background:var(--gradient-brand);border-color:transparent;color:#fff;box-shadow:0 4px 14px #10b98166}.step-dot.done{background:var(--green);border-color:transparent;color:#fff}.step-line{width:32px;height:2px;border-radius:2px;transition:background .3s}.step-line.done{background:var(--green)}.form-group{margin-bottom:14px;position:relative;z-index:1}label{display:block;font-weight:700;margin-bottom:7px;color:var(--text);font-size:.78rem;letter-spacing:.3px}input[type=text]{width:100%;padding:13px 42px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:13px;font-size:.9rem;font-weight:600;color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s;font-family:inherit;letter-spacing:.3px}input::placeholder{color:var(--muted-2);font-weight:500;letter-spacing:0}input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}.btn-primary{position:relative;width:100%;padding:14px;background:var(--gradient-brand-2);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:14px;font-weight:900;font-size:.92rem;cursor:pointer;transition:transform .15s,box-shadow .25s,filter .2s;margin-top:8px;letter-spacing:.5px;box-shadow:0 10px 26px #10b98166,inset 0 1px #ffffff38;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:8px;overflow:hidden;z-index:1}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s}.btn-primary:hover{filter:brightness(1.07);transform:translateY(-1px);box-shadow:0 16px 34px #10b9818c,inset 0 1px #ffffff4d}.btn-primary:hover:before{left:100%}.btn-primary:active{transform:translateY(0) scale(.99)}.btn-outline{background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);padding:12px 18px;border-radius:12px;font-weight:800;font-size:.84rem;cursor:pointer;transition:all .2s;width:100%;text-align:center;margin-top:10px;letter-spacing:.3px;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:6px}.btn-outline:hover:not(:disabled){border-color:var(--green);color:var(--green)}.btn-outline:disabled{opacity:.55;cursor:not-allowed}@keyframes shakeIn{0%{opacity:0;transform:translate(-8px)}25%{transform:translate(4px)}50%{transform:translate(-2px)}75%{transform:translate(1px)}to{opacity:1;transform:translate(0)}}.otp-header{text-align:center;margin-bottom:20px;position:relative;z-index:1}.otp-icon{width:56px;height:56px;margin:0 auto 12px;border-radius:16px;background:var(--green-soft);border:1px solid rgba(16,185,129,.35);display:flex;align-items:center;justify-content:center;font-size:1.6rem;box-shadow:0 0 30px #10b98140}.otp-title{font-weight:800;font-size:1.05rem;color:var(--text-strong);margin-bottom:6px;letter-spacing:-.01em}.otp-hint{color:var(--muted);font-size:.84rem;line-height:1.5}.otp-hint strong{color:var(--green);font-weight:800;letter-spacing:.5px}.timer-text{text-align:center;color:var(--yellow);font-weight:800;font-size:.82rem;margin-top:12px;align-items:center;justify-content:center;gap:6px;padding:8px 14px;background:var(--yellow-soft);border:1px solid rgba(245,158,11,.28);border-radius:10px;width:fit-content;margin-left:auto;margin-right:auto;letter-spacing:.4px;font-variant-numeric:tabular-nums;position:relative;z-index:1}.otp-input{text-align:center}.otp-input:focus{border-color:var(--green);box-shadow:0 0 0 4px var(--green-soft)}.otp-input::placeholder{color:var(--muted-2);letter-spacing:6px;font-weight:700;font-size:1.1rem}.divider{display:flex;align-items:center;gap:12px;margin:22px 0 16px;color:var(--muted-2);font-size:.68rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;position:relative;z-index:1}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.register-line{text-align:center;font-size:.84rem;color:var(--muted);font-weight:500;position:relative;z-index:1}.register-line a{color:var(--green);text-decoration:none;font-weight:800;transition:color .2s;margin-left:4px}.register-line a:hover{color:var(--green-2)}.theme-toggle{position:absolute;top:16px;right:16px;background:var(--card-bg);border:1px solid var(--border-strong);color:var(--text);width:34px;height:34px;border-radius:50%;font-size:.92rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s,background .2s,border-color .2s;z-index:2}.theme-toggle:hover{transform:translateY(-1px) rotate(15deg);border-color:var(--green);box-shadow:0 0 16px var(--green-ring)}@media screen and (max-width:420px){.register-card{padding:30px 20px 24px;border-radius:22px}.logo{font-size:1.5rem;letter-spacing:2.5px}.btn-primary{padding:13px;font-size:.86rem}.otp-input{font-size:1.3rem;letter-spacing:8px}}
