#account-button { white-space: nowrap; max-width: 15rem; overflow: hidden; text-overflow: ellipsis; }
#account-dialog { color: var(--ink, #e8eef2); background: var(--surface); border: 1px solid var(--line, #42515d); border-radius: 16px; padding: 24px; width: min(540px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; }
#account-dialog::backdrop { background: #000b; }
#account-dialog [hidden] { display: none !important; }
#account-dialog h2, #account-dialog h3 { margin: 0; }
#account-dialog p { line-height: 1.5; color: var(--muted); }
#account-dialog .account-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
#account-dialog label { display: block; margin: 16px 0 6px; }
#account-dialog input, #account-dialog select { width: 100%; color: inherit; background: var(--surface-strong); border: 1px solid var(--line, #42515d); border-radius: 8px; padding: 12px; font: inherit; }
#account-dialog .account-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
#account-dialog .utility-button { min-height: 44px; white-space: normal; }
#account-dialog button:disabled { opacity: .5; cursor: wait; }
#account-import { padding-top: 20px; margin-top: 20px; border-top: 1px solid var(--line, #42515d); }
#account-retry { margin-top: 12px; }
#account-status { min-height: 3em; }
@media (max-width: 520px) { #account-button { max-width: 9rem; } #account-dialog { padding: 18px; } }

#account-button[hidden] { display: none !important; }

#account-dialog .account-import-options { border: 0; padding: 0; margin: 16px 0; min-width: 0; }
#account-dialog .account-import-options legend { margin-bottom: 8px; }
#account-dialog .account-import-option { display: flex; align-items: flex-start; gap: 10px; border: 1px solid var(--line, #42515d); border-radius: 10px; padding: 12px; margin: 8px 0; cursor: pointer; }
#account-dialog .account-import-option:has(input:checked) { border-color: var(--accent, #63d5c4); background: var(--surface-strong); }
#account-dialog .account-import-option:has(input:focus-visible) { outline: 2px solid var(--accent, #63d5c4); outline-offset: 2px; }
#account-dialog .account-import-option input { width: auto; flex: 0 0 auto; margin: 4px 0 0; accent-color: var(--accent, #63d5c4); }
#account-dialog .account-import-option small { display: block; line-height: 1.5; color: var(--muted); margin-top: 4px; }
#account-dialog .account-recommended { display: inline-block; font-size: .8rem; margin-left: 8px; color: var(--accent, #63d5c4); }
#account-dialog .account-import-note { font-size: .9rem; }
#account-import-continue { width: 100%; }
