.account-page { max-width: 920px; margin: 0 auto; gap: 14px; }
.account-resources { display: grid; overflow: hidden; border: 1px solid var(--anki-line); border-radius: 7px; background: #fff; }
.profile-entry { display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: 14px; width: 100%; min-height: 70px; box-sizing: border-box; margin: 0; padding: 10px 4px 14px; border: 0; border-bottom: 1px solid var(--anki-line); border-radius: 0; background: transparent; color: var(--anki-ink); text-align: left; }
.profile-entry:hover .profile-name { color: var(--anki-blue); }
.profile-avatar { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #dbeafe; color: #1d4ed8; font-size: 18px; font-weight: 700; }
.profile-avatar.large { width: 58px; height: 58px; font-size: 23px; }
.profile-name { font-size: 18px; font-weight: 700; }
.profile-arrow { color: var(--anki-muted); font-size: 27px; }
.profile-dialog { width:min(500px,calc(100vw - 32px)); max-height:min(760px,calc(100vh - 32px)); overflow:auto; padding:26px; text-align:left; }
.profile-dialog-head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.profile-dialog-head h2 { margin: 0; }
.profile-dialog-head small { display:block; margin-top:4px; color:var(--anki-muted); }
.profile-dialog-section { padding:18px 0; border:0; border-top:1px solid var(--anki-line); border-bottom:1px solid var(--anki-line); border-radius:0; }
.profile-dialog-section h3 { margin:0 0 14px; font-size:14px; }
.profile-editor { display:grid; grid-template-columns:1fr; gap:13px; max-width:none; }
.profile-email-field,.profile-editor button { grid-column:1; }
.profile-editor label { display: grid; gap: 6px; color: var(--anki-muted); font-size: 12px; font-weight: 600; }
.profile-editor input { width:100%; height:44px; box-sizing:border-box; margin:0; padding:10px 13px; color:var(--anki-ink); }
.profile-editor input[readonly] { background: #f1f5f9; color: var(--anki-muted); cursor: not-allowed; }
.profile-editor button { width:100%; height:44px; box-sizing:border-box; margin:3px 0 0; background:var(--anki-blue); color:#fff; border-color:var(--anki-blue); }
.profile-dialog dl { margin: 0; }
.profile-dialog dl>div { display: grid; grid-template-columns: 90px 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--anki-line); }
.profile-dialog dt { color: var(--anki-muted); }
.profile-dialog dd { margin: 0; overflow-wrap: anywhere; color: var(--anki-ink); font-weight: 600; }
.password-editor, .delete-account { margin-top: 16px; border-top: 1px solid var(--anki-line); }
.password-editor { padding:0 14px 14px; border:1px solid var(--anki-line); border-radius:8px; background:#f8fafc; }
.password-editor summary, .delete-account summary { display:flex; align-items:center; justify-content:space-between; width:100%; height:44px; box-sizing:border-box; padding:0; cursor:pointer; color:var(--anki-blue); font-weight:600; list-style:none; }
.password-editor summary::-webkit-details-marker, .delete-account summary::-webkit-details-marker { display: none; }
.password-editor summary::after { content:'›'; color:var(--anki-muted); font-size:20px; line-height:1; transition:transform .15s; }
.password-editor[open] summary::after { transform: rotate(90deg); }
.password-editor form, .delete-account form { display:grid; gap:11px; max-width:none; }
.password-editor label,.delete-account label { display:grid; gap:6px; color:var(--anki-muted); font-size:12px; font-weight:600; }
.password-editor input, .delete-account input { width:100%; height:44px; box-sizing:border-box; margin:0; padding:10px 13px; }
.password-editor button, .delete-account button { width:100%; height:44px; box-sizing:border-box; margin:0; }
.password-editor button[type="submit"] { background: var(--anki-blue); color: #fff; border-color: var(--anki-blue); }
.profile-actions { display: grid; gap: 6px; margin-top: 18px; }
.profile-actions>form { display: block; max-width: none; }
.profile-actions>form button { width:100%; height:44px; box-sizing:border-box; margin:0; background:transparent; color:var(--anki-ink); border:1px solid var(--anki-line); }
.profile-actions>form button:hover { color: var(--anki-blue); border-color: var(--anki-blue); }
.delete-account summary { color: #b91c1c; }
.sponsor-entry { display:flex; align-items:center; justify-content:space-between; min-height:58px; box-sizing:border-box; padding:10px 16px; border:1px solid #dfb85f; border-radius:7px; background:#fff9eb; color:#563b0d; text-decoration:none; }
.sponsor-entry strong,.sponsor-entry small { display:block; }
.sponsor-entry strong { font-size:16px; }
.sponsor-entry small { margin-top:4px; color:#8a6525; font-size:12px; }
.sponsor-entry b { font-size:26px; font-weight:400; }
html[data-theme="night"] .sponsor-entry { border-color:#806323; border-left-color:#d1a038; background:#312a1d; color:#f8e3ae; }
html[data-theme="night"] .sponsor-entry small { color:#d4bc82; }
html[data-theme="night"] .profile-entry { background: #172033; }
html[data-theme="night"] .profile-avatar { background: #1e3a8a; color: #bfdbfe; }
html[data-theme="night"] .password-editor { background: #111827; }
html[data-theme="night"] .profile-editor input[readonly] { background: #111827; }
.account-summary { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 0; padding: 0; border: 1px solid var(--anki-line); border-radius:7px; overflow:hidden; background:#fff; }
.account-summary article { min-width: 0; padding: 16px 18px; border: 0; border-left: 1px solid var(--anki-line); border-radius: 0; background: transparent; box-shadow: none; }
.account-summary article:first-child { border-left: 0; }
.account-summary span { color: var(--anki-muted); font-size: 13px; }
.account-summary strong { margin: 6px 0 4px; color: var(--anki-ink); font-size: 25px; line-height: 1.15; }
.account-summary small { color: var(--anki-muted); font-size: 12px; line-height: 1.5; }
html[data-theme="night"] .account-summary article { background: transparent; }
.account-lower { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); gap:14px; align-items:start; }
.account-progress { min-height:206px; box-sizing:border-box; padding:20px; border:1px solid var(--anki-line); border-radius:7px; background:#fff; }
.account-progress h2 { font-size:16px; }
.account-progress progress { height:10px; margin-top:22px; }
.account-auth-launcher { display: grid; justify-items: center; gap: 22px; max-width: 520px; margin: 12vh auto 0; padding: 38px 24px; text-align: center; }
.account-auth-launcher h1 { margin: 0; }
.account-brand { width:96px; height:96px; border-radius:12px; overflow:hidden; }
.account-brand-logo { display:block; width:96px; height:96px; object-fit:cover; }
.account-brand-logo-light { display:none; }
html[data-theme="light"] .account-brand-logo-light { display:block; }
html[data-theme="light"] .account-brand-logo-night { display:none; }
.auth-intro { max-width:360px; margin:-10px 0 0; color:var(--anki-muted); font-size:14px; line-height:1.7; }
.account-auth-launcher>div { display: grid; grid-template-columns: repeat(2, 140px); gap: 12px; }
.account-auth-launcher>div button { height: 46px; margin: 0; }
.secondary-auth { background: #fff; color: var(--anki-ink); border: 1px solid var(--anki-line); }
.auth-dialog { position: relative; width: min(430px, calc(100vw - 32px)); box-sizing: border-box; padding: 28px; border: 1px solid var(--anki-line); border-radius: 10px; background: #fff; color: var(--anki-ink); box-shadow: 0 24px 60px rgba(15,23,42,.24); text-align: left; }
.auth-dialog::backdrop { background: rgba(15,23,42,.58); }
.auth-dialog h2 { margin: 0 0 22px; }
.auth-dialog .dialog-close { position: absolute; top: 9px; right: 9px; display: block; }
.auth-dialog .dialog-close button { width: 34px; height: 34px; margin: 0; padding: 0; border: 0; background: transparent; color: var(--anki-muted); font-size: 24px; }
.dialog-error { margin: -8px 0 16px; padding: 10px 12px; border-radius: 7px; font-size: 13px; line-height: 1.55; }
.auth-dialog .account-form { display: grid; gap: 16px; max-width: none; }
.auth-dialog .account-form label { display: grid; gap: 8px; color: var(--anki-ink); font-size: 13px; font-weight: 600; }
.auth-dialog .account-form input { width: 100%; min-height: 44px; box-sizing: border-box; margin: 0; padding: 10px 13px; }
.auth-dialog .account-form>button { height: 44px; margin-top: 4px; }
.auth-dialog .account-form .legal-consent { display:grid; grid-template-columns:18px minmax(0,1fr); align-items:start; gap:8px; color:var(--anki-muted); font-size:12px; font-weight:400; line-height:1.6; }
.auth-dialog .account-form .legal-consent input { width:16px; height:16px; min-height:0; margin:2px 0 0; padding:0; accent-color:var(--anki-blue); }
.legal-consent a { color:var(--anki-blue); text-decoration:none; }.legal-consent a:hover { text-decoration:underline; }
.legal-page { max-width:760px; margin:0 auto; padding:26px 30px; border:1px solid var(--anki-line); border-radius:8px; background:#fff; color:var(--anki-ink); }
.legal-page h1 { margin:0; font-size:25px; }.legal-page h2 { margin:28px 0 8px; font-size:16px; }.legal-page p { margin:0; color:var(--anki-muted); font-size:14px; line-height:1.9; }.legal-page .legal-date { margin-top:7px; font-size:12px; }.legal-page a { color:var(--anki-blue); }
html[data-theme="night"] .legal-page { background:#172033; }
html[data-theme="night"] .auth-dialog { background: #172033; }
html[data-theme="night"] .secondary-auth { background: #1e293b; color: #e2e8f0; }
.account-resource { width: 100%; box-sizing: border-box; border: 0; border-top: 1px solid var(--anki-line); border-radius: 0; background: transparent; color: var(--anki-ink); text-align: left; }
.account-resource:first-child { border-top: 0; }
button.account-resource, .account-resource summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; box-sizing: border-box; margin: 0; padding: 0 18px; cursor: pointer; font-size: 14px; font-weight: 600; list-style: none; }
.account-resource[href] { display: flex; align-items: center; justify-content: space-between; min-height: 52px; box-sizing: border-box; margin: 0; padding: 0 18px; color: var(--anki-ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.account-resource summary::-webkit-details-marker { display: none; }
.account-resource summary span, button.account-resource span { color: var(--anki-muted); font-size: 22px; transition: transform .15s; }
.account-resource[open] summary span { transform: rotate(90deg); }
.account-resource>div { padding: 0 18px 17px; color: var(--anki-muted); font-size: 13px; line-height: 1.75; }
.account-resource>div p { margin: 8px 0 0; }
.support-dialog { width: min(380px, calc(100vw - 32px)); box-sizing: border-box; padding: 28px; border: 1px solid var(--anki-line); border-radius: 10px; background: #fff; color: var(--anki-ink); text-align: center; box-shadow: 0 24px 60px rgba(15,23,42,.24); }
.support-dialog::backdrop { background: rgba(15,23,42,.58); }
.support-dialog>form:first-child { position: absolute; top: 10px; right: 10px; display: block; }
.support-dialog>form:first-child>button { width: 34px; height: 34px; margin: 0; padding: 0; border: 0; background: transparent; color: var(--anki-muted); font-size: 24px; }
.support-dialog h2 { margin: 0 0 6px; }
.support-dialog p { margin: 0 0 18px; color: var(--anki-muted); }
.support-dialog img { display: block; width: 220px; height: 220px; margin: 0 auto 14px; border: 8px solid #fff; border-radius: 7px; }
.support-dialog strong, .support-dialog small { display: block; }
.support-dialog small { margin-top: 7px; color: var(--anki-muted); }
.info-dialog { text-align: left; }
.info-dialog h2 { padding-right: 28px; }
.info-dialog-content { margin-top: 18px; color: var(--anki-muted); font-size: 14px; line-height: 1.9; white-space: pre-wrap; }
html[data-theme="night"] .account-resources, html[data-theme="night"] .account-summary, html[data-theme="night"] .account-progress, html[data-theme="night"] .support-dialog { background: #172033; }
html[data-theme="night"] .account-resource { background: transparent; }
.download-dialog-actions { display:grid; grid-template-columns:1fr 1.2fr; gap:10px; margin-top:22px; }
.download-dialog-actions form { display:block; max-width:none; }
.download-dialog-actions button,.download-dialog-actions a { display:flex; align-items:center; justify-content:center; width:100%; min-height:42px; box-sizing:border-box; margin:0; padding:0 14px; border-radius:6px; font-size:14px; font-weight:700; text-decoration:none; }
.download-dialog-actions button { border:1px solid var(--anki-line); background:transparent; color:var(--anki-ink); }
.download-dialog-actions a { border:1px solid var(--anki-blue); background:var(--anki-blue); color:#fff; }
.quota-sponsor-dialog { position:relative; width:min(400px,calc(100vw - 32px)); box-sizing:border-box; padding:28px; border:1px solid var(--anki-line); border-radius:9px; background:#fff; color:var(--anki-ink); text-align:left; box-shadow:0 24px 60px rgba(15,23,42,.26); }
.quota-sponsor-dialog::backdrop { background:rgba(15,23,42,.58); }
.quota-sponsor-dialog>strong { display:block; padding-right:34px; font-size:19px; }
.quota-sponsor-dialog>p { margin:12px 0 22px; color:var(--anki-muted); font-size:14px; line-height:1.7; }
.quota-dialog-close { position:absolute; top:9px; right:9px; display:block; }
.quota-dialog-close button { width:34px; height:34px; margin:0; padding:0; border:0; background:transparent; color:var(--anki-muted); font-size:24px; }
.quota-sponsor-dialog>div { display:grid; grid-template-columns:1fr 1.2fr; gap:10px; }
.quota-sponsor-dialog>div form { display:block; max-width:none; }
.quota-sponsor-dialog .quota-later,.quota-sponsor-dialog>div>a { display:flex; align-items:center; justify-content:center; width:100%; min-height:42px; box-sizing:border-box; margin:0; padding:0 14px; border-radius:6px; font-size:14px; font-weight:700; text-decoration:none; }
.quota-sponsor-dialog .quota-later { border:1px solid var(--anki-line); background:transparent; color:var(--anki-ink); }
.quota-sponsor-dialog>div>a { border:1px solid #c78c22; background:#c78c22; color:#fff; }
html[data-theme="night"] .quota-sponsor-dialog { background:#172033; }
@media (max-width: 760px) { .account-lower { grid-template-columns:1fr; }.account-progress { min-height:0; }.account-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }.account-summary article:nth-child(3) { border-left: 0; }.account-summary article:nth-child(n+3) { border-top: 1px solid var(--anki-line); } }
@media (max-width: 520px) { .account-auth-launcher { margin-top: 7vh; padding: 28px 16px; }.account-auth-launcher>div { grid-template-columns: repeat(2, minmax(0,1fr)); width: 100%; }.auth-dialog,.support-dialog { padding: 24px 18px; }.support-dialog img { width: 190px; height: 190px; }.profile-dialog dl>div{grid-template-columns:76px 1fr}.account-summary article{padding:14px 12px}.account-summary strong{font-size:24px} }
@media (max-width: 520px) { .account-page { gap:12px; }.profile-entry { min-height:62px; padding-top:2px; }.profile-name { font-size:17px; }.profile-dialog { padding:20px 16px; }.profile-editor { grid-template-columns:1fr; }.profile-email-field,.profile-editor button { grid-column:1; }.profile-dialog-section { padding:15px 0; }.sponsor-entry { min-height:56px; }.sponsor-entry small { max-width:230px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.account-summary article { min-height:104px; }.account-summary small { display:block; min-height:36px; } }
@media (max-width: 520px) { .quota-sponsor-dialog { padding:24px 18px; }.quota-sponsor-dialog>div { grid-template-columns:1fr; } }
@media (max-width: 520px) { .legal-page { padding:22px 17px; border-radius:6px; }.legal-page h1 { font-size:22px; } }
