*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--purple: #6C25FF;--purple-hover: #5a1ee0;--purple-light: #CBC8FF;--purple-label: #6C25FF;--red-star: #FF0000;--text-dark: #1A1A1A;--text-gray: #8A8A8A;--text-mid: #4B4B4B;--border: #CFCFCF;--bg-light: #F7F7F7;--white: #FFFFFF;--font: "Inter", sans-serif}html,body{height:100%;font-family:var(--font);-webkit-font-smoothing:antialiased;background:#e8e8e8}#root{min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:40px 0}.shell{width:390px;min-height:844px;background:var(--bg-light);border-radius:4px;border:1px solid #DEDEDE;box-shadow:0 2px 12px #00000014;overflow:hidden;display:flex;flex-direction:column;position:relative}.landing{flex:1;display:flex;flex-direction:column;background:var(--bg-light);padding:0 24px 48px}.landing__spacer{flex:1}.landing__title{font-size:29px;font-weight:800;color:var(--text-dark);margin-bottom:8px;line-height:1.2}.landing__sub{font-size:15px;color:var(--text-gray);margin-bottom:32px;line-height:1.5}.auth{flex:1;display:flex;flex-direction:column;background:var(--bg-light);padding:40px 24px}.auth__title{font-size:27px;font-weight:800;color:var(--text-dark);line-height:1.25;margin-bottom:10px}.auth__sub{font-size:15px;color:var(--text-gray);margin-bottom:28px;line-height:1.65;width:100%}.float-field{position:relative;margin-bottom:20px}.float-field__label{display:inline-block;font-size:12px;font-weight:600;color:var(--purple-label);background:var(--bg-light);padding:0 6px;margin-left:10px;position:relative;bottom:-9px;z-index:1;line-height:1}.float-field__box{background:var(--white);border:1.5px solid var(--border);border-radius:8px;padding:14px 16px}.float-field__input{width:100%;border:none;outline:none;background:transparent;font-size:15px;color:var(--text-dark);font-family:var(--font);padding:0}.float-field__input::placeholder{color:var(--text-gray)}.field{position:relative;margin-bottom:20px;background:var(--white);border:1.5px solid var(--border);border-radius:6px;padding:10px 14px 8px}.field__label{display:block;font-size:11px;font-weight:600;color:var(--purple-label);margin-bottom:4px;letter-spacing:.01em}.field__label--required:after{content:"*";color:var(--red-star);margin-left:2px}.field__input{width:100%;border:none;outline:none;background:transparent;font-size:15px;font-weight:400;color:var(--text-dark);font-family:var(--font);padding:0}.field__input::placeholder{color:var(--text-gray);font-size:14px}.radio-label{font-size:14px;font-weight:500;color:var(--text-dark);margin-bottom:10px}.radio-label span{color:var(--red-star);margin-left:2px}.radio-group{display:flex;align-items:center;gap:24px;margin-bottom:20px}.radio-option{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--text-dark);cursor:pointer}.radio-option input[type=radio]{accent-color:var(--purple);width:18px;height:18px;cursor:pointer}.btn{width:100%;padding:17px;border:none;border-radius:8px;font-size:15px;font-weight:700;cursor:pointer;font-family:var(--font);transition:opacity .18s,transform .1s;letter-spacing:.01em}.btn:active{transform:scale(.98);opacity:.88}.btn--purple{background:var(--purple);color:var(--white);margin-bottom:12px}.btn--purple:hover{background:var(--purple-hover)}.btn--lavender{background:var(--purple-light);color:var(--text-dark)}.btn--gray{background:#cbcbcb;color:var(--white)}.signup__spacer{flex:1;min-height:24px}.profile{flex:1;display:flex;flex-direction:column;background:var(--bg-light)}.profile__topbar{background:var(--white);padding:24px 24px 16px;font-size:17px;font-weight:600;color:var(--text-dark);border-bottom:1px solid var(--border)}.profile__card-section{background:var(--bg-light);padding:24px 24px 0}.profile__card{display:flex;align-items:center;gap:18px;margin-bottom:20px}.avatar{position:relative;flex-shrink:0;width:72px;height:72px}.avatar__img{width:72px;height:72px;border-radius:50%;object-fit:cover;display:block}.avatar__initials{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#6c25ff,#a78bfa);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#fff}.avatar__badge{position:absolute;bottom:2px;right:2px;width:22px;height:22px;background:var(--purple);border-radius:50%;border:2px solid var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;outline:none}.avatar__badge svg{width:11px;height:11px}.profile__info{display:flex;flex-direction:column;gap:4px}.profile__name{font-size:17px;font-weight:700;color:var(--text-dark)}.profile__email{font-size:13px;color:var(--text-mid)}.profile__bio{font-size:14px;color:var(--text-mid);line-height:1.7;margin-bottom:24px}.profile__dash{width:100%;border:none;border-top:1.5px dashed #C8C8C8;margin:0 -24px;width:calc(100% + 48px);padding-bottom:1px}@media (max-width: 430px){#root{padding:0;align-items:stretch}.shell{width:100%;min-height:100vh;border-radius:0;border:none;box-shadow:none}}