#member-account-open{border:1px solid var(--line,#e4e4e8);background:var(--surface,#fff);color:var(--text,#252633);border-radius:24px;padding:9px 16px;font-size:12px;white-space:nowrap;max-width:260px;overflow:hidden;text-overflow:ellipsis}.account-dialog{border:1px solid #e7e2dc;border-radius:22px;padding:28px;width:min(480px,calc(100% - 32px));max-height:85vh;overflow:auto;color:#292a35;background:#fffdf9;box-shadow:0 24px 100px #1a152638}.account-dialog::backdrop{background:#15152170;backdrop-filter:blur(5px)}.account-dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.account-dialog-heading p{font-size:10px;letter-spacing:2px;color:#99714e;margin:0 0 8px}.account-dialog-heading h2{font-size:23px;line-height:1.4;margin:0;overflow-wrap:anywhere}.account-dialog-heading>button{background:transparent;border:0;font-size:25px;line-height:1;padding:5px 9px;color:#75737b}.account-dialog>p,.account-dialog small,#member-history>p{color:#797782;font-size:13px;line-height:1.8}.account-dialog form{display:grid;gap:16px;margin-top:24px}.account-dialog label{display:grid;gap:8px;font-size:13px;font-weight:600}.account-dialog input{padding:13px;border:1px solid #dedce2;border-radius:10px;width:100%;box-sizing:border-box;background:#fff;color:#292a35}.account-dialog button{cursor:pointer}.account-dialog button:disabled{opacity:.5;cursor:wait}#member-login-submit,#copy-extraction{background:#383347;color:white;border:0;border-radius:10px;padding:13px 18px;font-weight:600}#copy-extraction{width:100%}#member-account-error{color:#a33e35;min-height:24px}.extraction-fields{display:grid;gap:8px;margin:24px 0}.extraction-fields dt{font-size:12px;color:#807b86}.extraction-fields dd{margin:0 0 10px;padding:12px;background:#f3f0eb;border-radius:10px;overflow-wrap:anywhere;user-select:text}.extraction-fields a{color:#725342}.member-extract-button:disabled{opacity:.55;cursor:wait}#member-history-list{display:grid;gap:8px;margin:16px 0}#member-history-list button{text-align:left;border:1px solid #e6e0d9;background:white;padding:10px;border-radius:8px;color:#635144}#member-account-logout{background:transparent;border:1px solid #d8d5df;border-radius:8px;padding:10px 16px;color:#6f667c}@media(max-width:760px){#member-account-open{font-size:10px;max-width:135px;padding:8px}.topbar .search-wrap{width:115px}.account-dialog{padding:22px}.account-dialog-heading h2{font-size:20px}}
/* Keep search and account controls on their own row, clear of the brand and navigation. */
.topbar{position:relative;top:auto;right:auto;width:calc(100% - 2 * var(--page-gutter));height:auto;margin:16px var(--page-gutter) 0;display:flex;justify-content:flex-end;gap:10px}.topbar .search-wrap{width:auto;flex:1;max-width:380px;min-width:80px}.topbar .text-button{flex-shrink:0}#member-account-open{color:var(--ink)}
@media(max-width:760px){.topbar{top:auto;right:auto;width:calc(100% - 28px);margin:12px auto 0;gap:8px}.topbar .search-wrap{width:auto;max-width:none;height:36px}.topbar .search-wrap input{font-size:12px}#member-account-open{max-width:160px}.topbar .text-button{font-size:12px;padding:8px 10px}#main-content{padding-top:14px}}

/* History stays compact even when the member has collected many courses. */
#member-account-dialog{width:min(560px,calc(100% - 32px));box-sizing:border-box}
#member-history{border-top:1px solid #e7e2dc;margin:22px 0;padding-top:20px}
.member-history-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.member-history-heading h3{font-size:16px;margin:0}.member-history-heading span{font-size:12px;color:#8b7259;white-space:nowrap}
#member-history>p{margin:8px 0 16px}.member-history-search{color:#655e6b}
#member-history-list{max-height:360px;overflow-y:auto;overscroll-behavior:contain;padding-right:3px;font-size:13px;line-height:1.7;color:#797782}
.member-history-item{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid #e7e1d8;border-radius:12px;padding:13px;background:#fff}
.member-history-item>div{min-width:0}.member-history-item h4{font-size:13px;font-weight:600;line-height:1.65;margin:0;color:#393240;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.member-history-item p{font-size:11px;color:#96909a;margin:6px 0 0}
#member-history-list .member-history-item button{flex-shrink:0;font-size:12px;padding:8px 10px;background:#f8f3eb;border-color:#e9dfd0;white-space:nowrap}
.member-history-pager{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:#797782}.member-history-pager>div{display:flex;gap:8px}
.member-history-pager button,#member-history-retry{border:1px solid #e0dbd4;background:white;color:#635144;padding:8px 12px;border-radius:8px}
.member-history-pager button:disabled,#member-history-list button:disabled{cursor:default}
@media(max-width:760px){#member-account-dialog{padding:20px}.member-history-item{gap:10px;padding:11px}#member-history-list{max-height:32vh}.member-history-pager button{padding:8px 10px}}

#member-account-error:empty{display:none}

/* Detail-only extraction mirrors the full-width VIP selection action. */
.member-extract-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-width:0;min-height:48px;box-sizing:border-box;margin:12px 0 0;padding:11px 15px;border:1px solid #8bbcaf;border-radius:11px;background:#edf7f3;color:#216653;cursor:pointer;font-size:15px;font-weight:750;line-height:1.5;transition:background .18s ease,border-color .18s ease}
.member-extract-button svg{width:19px;height:19px;flex-shrink:0}
.member-extract-button:hover:not(:disabled){background:#dfefe8;border-color:#5e9d89}
.member-extract-button:focus-visible{outline:3px solid #8bbcaf;outline-offset:3px}
[data-theme="dark"] .member-extract-button{background:#213c33;border-color:#5e9d89;color:#b0e2ce}
[data-theme="dark"] .member-extract-button:hover:not(:disabled){background:#2b4b40}
#member-history-list .member-history-item button:focus-visible{outline:3px solid #ed9ca5;outline-offset:3px}
#member-history-list .member-history-item button{min-width:96px;min-height:44px;padding:10px 14px;border:1px solid #594552;border-radius:10px;background:#594552;color:#fff;font-size:13px;font-weight:600}
#member-history-list .member-history-item button:hover:not(:disabled){background:#42313d}
#member-history-list .member-history-item button:disabled{background:#f0ece9;border-color:#e4ddd7;color:#8c8288;opacity:1}
@media(max-width:760px){#member-history-list .member-history-item button{min-width:90px;padding:10px 12px}}

/* Keep the sign-in form compact; the signed-in history retains its wider layout. */
#member-account-dialog[data-state="login"]{width:min(380px,calc(100% - 48px));padding:26px;border-radius:20px}
#member-account-dialog[data-state="login"] .account-dialog-heading h2{font-size:22px}
#member-account-dialog[data-state="login"] #member-account-summary{margin:14px 0 0;line-height:1.7}
#member-account-dialog[data-state="login"] form{margin-top:22px;gap:18px}
#member-account-dialog[data-state="login"] input{font-size:16px;min-height:46px}
#member-account-dialog[data-state="login"] small{font-size:12px;line-height:1.6}
@media(max-width:760px){#member-account-dialog[data-state="login"]{width:min(340px,calc(100% - 48px));padding:22px;max-height:calc(100dvh - 48px)}#member-account-dialog[data-state="login"] .account-dialog-heading h2{font-size:20px}}
