.account-settings-dialog { width:min(560px,calc(100vw - 28px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid #dbe4f0; border-radius:18px; color:#172339; background:#fff; box-shadow:0 24px 80px #0f172a40; overflow:auto; }
.account-settings-dialog::backdrop { background:#0f172a85; }
.account-settings-heading { position:sticky; top:0; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; background:#fff; border-bottom:1px solid #e5ebf3; }
.account-settings-heading h2 { margin:0; font-size:22px; }
.account-settings-heading p { margin:5px 0 0; color:#64748b; font-size:14px; }
.account-settings-body { padding:20px 24px 24px; }
.account-identity { display:grid; gap:6px; padding:16px; background:#f2f6fc; border:1px solid #e0e9f6; border-radius:12px; overflow-wrap:anywhere; }
.account-identity small,.account-hint,.account-change-form small { color:#64748b; font-size:13px; line-height:1.6; }
.account-change-form { display:grid; gap:14px; padding:22px 0; border-bottom:1px solid #e5ebf3; }
.account-change-form h3 { margin:0; font-size:17px; }
.account-change-form .field { margin:0; min-width:0; }
.account-change-form input { width:100%; box-sizing:border-box; min-height:46px; font-size:16px; }
.account-change-form .btn { min-height:46px; justify-self:start; white-space:normal; }
.account-hint { margin:0; }
.account-settings-body > .account-hint { margin-top:12px; }
.account-change-status { margin:16px 0 0; color:#166534; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.account-change-status:empty { display:none; }
.account-change-status.error { color:#b91c1c; }
@media (max-width:600px) { .account-settings-heading { padding:16px; } .account-settings-body { padding:16px; } .account-settings-dialog { max-height:calc(100dvh - 24px); } .account-change-form .btn { width:100%; } }

.account-settings-heading > div { flex:1; min-width:0; }
.account-settings-heading > .btn { width:auto; flex:0 0 auto; min-width:64px; min-height:44px; }

.account-password-input { position:relative; }
.account-password-input input { padding-right:52px; }
.account-password-eye { position:absolute; right:3px; top:3px; display:flex; align-items:center; justify-content:center; width:42px; min-width:42px; height:40px; padding:0; border:0; border-radius:8px; background:transparent; color:#52647f; cursor:pointer; }
.account-password-eye:hover,.account-password-eye[aria-pressed="true"] { color:#1d4ed8; background:#eff6ff; }
.account-password-eye:focus-visible { outline:2px solid #2563eb; outline-offset:1px; }
.account-password-eye:disabled { opacity:.5; cursor:wait; }
