.account-body{min-height:100vh;background:radial-gradient(ellipse at 80% 18%,#eeeaff 0,transparent 34%),#f8f8fc}.account-shell{width:min(980px,calc(100% - 36px));margin:28px auto 65px}.account-card{display:grid;grid-template-columns:1fr .88fr;min-height:520px;background:#fff;border:1px solid #eceaf4;border-radius:30px;overflow:hidden;box-shadow:0 25px 70px #25204412}.account-visual{position:relative;display:flex;flex-direction:column;justify-content:center;padding:54px;background:linear-gradient(145deg,#171b34,#302858 64%,#5742a1);color:#fff;overflow:hidden}.account-visual:after{content:"";position:absolute;width:310px;height:310px;border:1px solid #ffffff20;border-radius:50%;left:-130px;bottom:-150px;box-shadow:0 0 0 35px #ffffff08,0 0 0 70px #ffffff06}.account-orbit{width:78px;height:78px;display:grid;place-items:center;background:#ffffff16;border:1px solid #ffffff25;border-radius:25px;font-size:35px;margin-bottom:27px}.account-kicker{font-size:12px;color:#c7bcff;font-weight:800}.account-visual h1{font-size:40px;line-height:1.35;margin:12px 0}.account-visual h1 span{color:#b7a6ff}.account-visual>p{max-width:350px;color:#e5e2f0;line-height:2;font-size:14px}.account-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.account-pills span{border:1px solid #ffffff22;border-radius:30px;padding:8px 12px;font-size:11px;color:#f1edff}.account-form-wrap{display:grid;align-content:center;padding:42px}.account-form h2,.demo-profile h2{font-size:27px;margin:10px 0 4px;color:#19172a}.account-form>p:not(.form-note){font-size:12px;color:#737285;line-height:1.9;margin:0 0 22px}.account-form label{display:block;font-size:12px;font-weight:800;color:#28263a;margin:14px 0 7px}.account-form input{width:100%;height:48px;border:1px solid #e5e3ed;border-radius:12px;padding:0 14px;background:#fcfbff;color:#242236;font:inherit;font-size:13px;outline:none;transition:border-color .2s,box-shadow .2s}.account-form input:focus{border-color:#8069e8;box-shadow:0 0 0 4px #8069e817}.account-submit{width:100%;margin-top:22px}.form-note{margin:14px 0 0;color:#848296;font-size:10px;line-height:1.9}.account-footnote{text-align:center;color:#77758a;font-size:11px;margin:20px 0}.demo-profile{text-align:center}.profile-avatar{width:74px;height:74px;display:grid;place-items:center;margin:0 auto 16px;border-radius:24px;background:#f0edff;color:#624ad0;font-size:30px;font-weight:900}.demo-profile>p{font-size:12px;line-height:1.9;color:#737285}.profile-badge{display:inline-flex;padding:7px 12px;border-radius:30px;background:#eff8f1;color:#40804e;font-size:11px;font-weight:800;margin:8px 0 20px}.profile-actions{display:grid;gap:9px;margin-top:10px}.profile-actions .button{width:100%}.account-nav{display:flex;gap:22px}@media(max-width:720px){.account-shell{margin-top:16px}.account-card{grid-template-columns:1fr;border-radius:24px}.account-visual{padding:30px;min-height:270px}.account-visual h1{font-size:31px}.account-orbit{width:58px;height:58px;border-radius:18px;font-size:27px;margin-bottom:15px}.account-form-wrap{padding:30px 24px}.account-nav{display:none}}
.account-delete{border:0;background:transparent;color:#88869a;font:inherit;font-size:11px;padding:8px;cursor:pointer}.account-delete:hover{color:#b54660}.account-mode-toggle,.account-reset{display:block;width:100%;padding:12px 8px 4px;border:0;background:none;color:#6650cc;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.account-reset{color:#77758a;padding-top:12px}.form-note.form-error{color:#b54660}.form-note.form-success{color:#40804e}.account-submit:disabled{opacity:.6;cursor:wait}
.social-divider{display:flex;align-items:center;gap:12px;margin:22px 0 12px;color:#9290a0;font-size:10px}.social-divider:before,.social-divider:after{content:"";height:1px;flex:1;background:#eeedf3}.social-signin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.social-button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 6px;border:1px solid #e6e4ed;border-radius:12px;background:#fff;color:#272536;font:inherit;font-size:11px;font-weight:800;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s}.social-button:hover{transform:translateY(-2px);border-color:#c9c2e8;box-shadow:0 8px 20px #33215d12}.social-mark{font-family:Arial,sans-serif;font-size:17px;font-weight:900}.social-google .social-mark{color:#4285f4}.social-apple .social-mark{color:#111;font-size:15px}.social-facebook .social-mark{color:#1877f2;font-size:20px}.social-button:disabled{opacity:.55;cursor:wait;transform:none}
.account-field-help{display:block;margin-top:5px;color:#858295;font-size:9px;line-height:1.7}.account-field-help.is-available{color:#438254}.account-field-help.is-taken{color:#b54660}
.account-form-wrap{min-width:0}.demo-profile{width:100%;min-width:0}.demo-profile h2{line-height:1.5}.account-profile-form{display:flex;flex-direction:column;gap:0;width:100%;min-width:0;margin-top:18px;padding:22px;border:1px solid #eceaf4;border-radius:20px;background:linear-gradient(145deg,#fff,#fbfaff);text-align:right;box-sizing:border-box}.account-profile-form h3{margin:0 0 12px;color:#19172a;font-size:17px}.account-profile-form>label{display:block;margin:13px 0 6px;color:#373449;font-size:12px;font-weight:800;line-height:1.6}.account-profile-form input,.account-profile-form textarea{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;border:1px solid #e3e0ec;border-radius:12px;padding:11px 13px;background:#fff;color:#222137;font:500 14px/1.6 'Cairo',sans-serif;outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.account-profile-form input{height:46px}.account-profile-form textarea{min-height:96px;resize:vertical}.account-profile-form input:focus,.account-profile-form textarea:focus{border-color:#8069e8;background:#fff;box-shadow:0 0 0 4px #8069e817}.account-profile-form input::placeholder,.account-profile-form textarea::placeholder{color:#aaa7b7}.account-username-field{display:flex;align-items:center;direction:ltr;gap:0;min-width:0;overflow:hidden;border:1px solid #e3e0ec;border-radius:12px;background:#fff;transition:border-color .2s,box-shadow .2s}.account-username-field:focus-within{border-color:#8069e8;box-shadow:0 0 0 4px #8069e817}.account-username-field>span{display:grid;place-items:center;flex:0 0 42px;height:44px;border-right:1px solid #eeecf3;color:#8069e8;font-size:17px;font-weight:800}.account-profile-form .account-username-field input{flex:1;width:0;height:44px;border:0;border-radius:0;box-shadow:none;background:transparent;text-align:left;direction:ltr}.account-field-help{margin:6px 2px 0;font-size:10px}.account-profile-note{margin:13px 0 0;color:#77758a;font-size:11px;line-height:1.8}.account-profile-note.is-error{color:#b54660}.account-profile-note.is-success{color:#40804e}.account-profile-form .account-submit{margin-top:18px}.profile-actions{margin-top:14px}.account-profile-form [hidden]{display:none!important}
.profile-avatar.has-photo{overflow:hidden;padding:0;background:#f0edff}.profile-avatar img{display:block;width:100%;height:100%;object-fit:cover}.account-profile-form input[type=file]{height:auto;padding:7px;font-size:11px}.account-profile-form input[type=file]::file-selector-button{margin-inline-end:10px;padding:7px 10px;border:0;border-radius:8px;background:#f0edff;color:#624ad0;font:700 10px 'Cairo',sans-serif;cursor:pointer}
.avatar-crop-dialog{width:min(420px,calc(100% - 28px));max-width:calc(100% - 28px);padding:0;border:1px solid #eceaf4;border-radius:22px;background:#fff;color:#19172a;box-shadow:0 24px 80px #14132835}.avatar-crop-dialog::backdrop{background:#111323a8;backdrop-filter:blur(4px)}.avatar-crop-panel{display:grid;justify-items:center;padding:24px;text-align:center}.avatar-crop-panel h3{margin:0;font-size:19px}.avatar-crop-panel p{margin:4px 0 16px;color:#77758a;font-size:11px;line-height:1.8}.avatar-crop-panel canvas{display:block;width:min(100%,320px);height:auto;aspect-ratio:1;border-radius:16px;background:#f0edff;cursor:grab;touch-action:none}.avatar-crop-panel canvas:active{cursor:grabbing}.avatar-crop-panel label{justify-self:start;margin:15px 0 6px;font-size:11px;font-weight:800}.avatar-crop-panel input[type=range]{width:100%;accent-color:#8069e8}.avatar-crop-actions{display:flex;width:100%;gap:9px;margin-top:17px}.avatar-crop-actions .button{flex:1;min-height:43px;font-size:11px}
@media(max-width:720px){.account-form-wrap{padding:25px 18px}.account-profile-form{padding:18px 15px;border-radius:17px}.demo-profile h2{font-size:23px}.account-profile-form input,.account-profile-form textarea{font-size:14px}.profile-actions{gap:8px}}