/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/Other/CascadeStyleSheet.css to edit this template
*/
/* 
    Created on : Aug 21, 2026, 11:30:13 AM
    Author     : VERMAJI
*/

:root{--ink:#151526;--muted:#73738a;--line:#e7e7ef;--purple:#6f35ff;--pink:#ed3e9b;--bg:#f8f7fc}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--bg);min-height:100vh}.page-shell{min-height:100vh;display:grid;grid-template-columns:43% 57%;overflow:hidden}.brand-panel{position:relative;isolation:isolate;padding:42px 8%;color:#fff;background:linear-gradient(145deg,#24124f 0%,#4b217f 48%,#ed3e9b 150%);overflow:hidden}.brand-panel:after{content:"";position:absolute;width:560px;height:560px;border-radius:50%;right:-260px;bottom:-250px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 68%);z-index:-1}.ambient{position:fixed;border-radius:50%;filter:blur(2px);pointer-events:none}.ambient-one{width:300px;height:300px;background:rgba(111,53,255,.08);top:-120px;right:-80px}.ambient-two{width:350px;height:350px;background:rgba(237,62,155,.08);bottom:-170px;left:-130px}.brand-top{display:flex;align-items:center;gap:12px}.logo-mark{width:43px;height:43px;border-radius:14px;background:linear-gradient(135deg,#ff4ea6,#ffcc42 48%,#55d9ff);display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.18)}.logo-mark span{font:800 25px Manrope;color:#fff}.brand-name{font:800 24px Manrope;letter-spacing:-1px}.brand-name span{color:#ff70b8}.brand-content{max-width:520px;margin-top:17vh}.rainbow{height:55px;display:flex;align-items:flex-end;gap:4px;margin-bottom:24px}.rainbow i{display:block;border-radius:99px 99px 0 0;width:27px}.rainbow i:nth-child(1){height:20px;background:#ff4b9b}.rainbow i:nth-child(2){height:28px;background:#ff8b45}.rainbow i:nth-child(3){height:36px;background:#ffd34e}.rainbow i:nth-child(4){height:44px;background:#63db91}.rainbow i:nth-child(5){height:50px;background:#51c7ff}.rainbow i:nth-child(6){height:55px;background:#9b73ff}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;opacity:.72;margin:0 0 14px}.brand-content h1{font:800 clamp(42px,4.7vw,72px)/.98 Manrope;margin:0;letter-spacing:-3px}.brand-content h1 em{font-style:normal;color:#ff8bc6}.intro{font-size:16px;line-height:1.75;color:rgba(255,255,255,.78);max-width:500px;margin:26px 0 34px}.feature-row{display:flex;gap:14px;align-items:flex-start;margin:20px 0}.feature-row>span{width:30px;height:30px;border:1px solid rgba(255,255,255,.25);border-radius:10px;display:grid;place-items:center;color:#ffd05e}.feature-row b,.feature-row small{display:block}.feature-row b{font-size:14px}.feature-row small{font-size:12px;color:rgba(255,255,255,.58);margin-top:4px}.brand-footer{position:absolute;bottom:35px;font-size:11px;color:rgba(255,255,255,.45)}.form-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:50px 7%;background:rgba(255,255,255,.68);backdrop-filter:blur(15px)}.form-card{width:min(100%,580px)}.mobile-logo{display:none}.form-head{margin-bottom:30px}.form-head h2{font:800 38px/1.05 Manrope;margin:0 0 10px;letter-spacing:-1.5px}.form-head>p:last-child{color:var(--muted);margin:0;font-size:14px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:block;margin-bottom:17px}.field>span{display:block;font-size:12px;font-weight:700;margin:0 0 7px;color:#3d3d52}.field input{width:100%;height:48px;border:1px solid var(--line);border-radius:13px;padding:0 14px;font:500 14px Inter;color:var(--ink);outline:none;background:#fff;transition:.2s}.field input:focus{border-color:#8e6bff;box-shadow:0 0 0 4px rgba(111,53,255,.08)}.field input.invalid{border-color:#ed5d72;background:#fffafb}.input-prefix{position:relative}.input-prefix b{position:absolute;left:14px;top:15px;color:#9898aa;font-size:14px}.input-prefix input{padding-left:29px}.password-wrap{position:relative}.password-wrap input{padding-right:60px}.toggle{position:absolute;right:9px;top:8px;height:32px;padding:0 9px;border:0;background:#f3f1fa;border-radius:8px;color:#5d4b88;font-size:11px;font-weight:800;cursor:pointer}.error{display:block;color:#d74a5d;font-size:10px;margin-top:5px;min-height:0}.strength{display:flex;gap:4px;margin-top:8px}.strength i{height:3px;flex:1;border-radius:9px;background:#e7e6ed}.strength-text{font-size:10px;color:#9999aa;display:block;margin-top:4px}.dob-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:end}.note{height:48px;border-radius:13px;background:#f3f0ff;padding:8px 12px;font-size:10px;line-height:1.45;color:#77718e;margin-bottom:17px}.note b{display:block;color:#6147a7;font-size:11px;margin-bottom:1px}.terms{display:flex;align-items:flex-start;gap:9px;font-size:11px;color:#77778b;line-height:1.5;margin:2px 0 20px}.terms input{accent-color:var(--purple);margin-top:2px}.terms a,.login-line a{color:var(--purple);font-weight:700;text-decoration:none}.submit-btn{width:100%;height:52px;border:0;border-radius:14px;background:linear-gradient(100deg,#6732ef,#9b45ff 52%,#ed3e9b);color:#fff;font-weight:800;display:flex;justify-content:center;align-items:center;gap:12px;cursor:pointer;box-shadow:0 14px 30px rgba(111,53,255,.2);transition:.2s}.submit-btn:hover{transform:translateY(-1px);box-shadow:0 17px 34px rgba(111,53,255,.27)}.submit-btn b{font-size:19px}.login-line{text-align:center;font-size:12px;color:#858598;margin:18px 0 0}.secure-line{font-size:10px;color:#a0a0ae;margin:24px 0 0;text-align:center;max-width:520px}.toast{position:fixed;right:22px;bottom:22px;background:#181827;color:#fff;padding:13px 16px;border-radius:12px;font-size:12px;box-shadow:0 15px 40px rgba(0,0,0,.18);opacity:0;transform:translateY(10px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translateY(0)}@media(max-width:900px){.page-shell{grid-template-columns:1fr}.brand-panel{display:none}.form-panel{min-height:100vh;padding:35px 22px}.mobile-logo{display:flex;align-items:center;gap:10px;margin-bottom:45px}.mobile-logo .logo-mark{width:38px;height:38px;border-radius:12px}.mobile-logo .logo-mark span{font-size:22px}.mobile-logo .brand-name{font-size:21px}.form-card{width:min(100%,570px)}}@media(max-width:560px){.field-grid,.dob-row{grid-template-columns:1fr;gap:0}.form-head h2{font-size:31px}.form-head{margin-bottom:24px}.note{margin-top:-3px}.form-panel{padding:26px 18px}.mobile-logo{margin-bottom:34px}}

.username-status {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    min-height: 18px;
}

.username-status.available {
    color: #24935d;
}

.username-status.taken {
    color: #ed5d72;
}

.username-status.checking {
    color: #888;
}
