/* JulyLearn RC50 personal center: native light/dark variables; no separate theme storage. */
.jl-account-page{--a-bg:var(--inner-bg,#f8f5f0);--a-card:var(--inner-surface,#fff);--a-text:var(--inner-ink,#171923);--a-muted:var(--inner-muted,#666);--a-border:var(--inner-line,#ddd);--a-soft:var(--inner-paper-2,#f6f2eb);--a-accent:var(--inner-purple,#6857df);max-width:1160px;padding:40px 0 90px;color:var(--a-text)}
.jl-account-page [hidden]{display:none!important}
.jl-account-head{padding-bottom:22px}.jl-account-head h1{font-size:clamp(30px,4vw,44px);margin:5px 0 8px;letter-spacing:-.035em}.jl-account-head p{margin:0}.jl-account-muted{color:var(--a-muted);line-height:1.6;font-size:13px}.jl-account-card{background:var(--a-card);border:1px solid var(--a-border);border-radius:17px;padding:22px;box-shadow:0 6px 24px rgba(18,22,31,.025)}.jl-account-page h2{font-size:24px;line-height:1.3;margin:0}.jl-account-page h3{font-size:17px;margin:0 0 12px}.jl-account-page h4{font-size:15px;margin:0}
.jl-account-userbar{display:flex;gap:16px;align-items:center;margin-bottom:19px}.jl-user-avatar{width:55px;height:55px;border-radius:50%;display:grid;place-items:center;background:var(--a-soft);color:var(--a-accent);font-size:17px;font-weight:800;flex:none}.jl-user-profile{display:flex;flex:1;flex-direction:column;gap:3px;min-width:0}.jl-user-profile strong{font-size:19px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.jl-user-profile span{overflow-wrap:anywhere}.jl-status-pill{display:inline-flex;align-items:center;border-radius:999px;font-size:12px;font-weight:700;line-height:1.5;background:var(--a-soft);color:var(--a-accent);padding:6px 11px;white-space:nowrap}
.jl-account-layout{display:grid;grid-template-columns:225px minmax(0,1fr);gap:20px;align-items:start}.jl-account-sidebar{padding:16px;position:sticky;top:88px}.jl-sidebar-caption{font-size:12px;color:var(--a-muted);font-weight:700;padding:9px 12px 13px}.jl-account-sidebar nav{display:grid;gap:5px}.jl-account-sidebar nav button,.jl-sidebar-link{display:block;text-align:left;width:100%;font:600 14px/1.5 inherit;font-family:inherit;font-size:14px;font-weight:650;border:0;border-radius:10px;padding:12px 13px;color:var(--a-text);background:transparent;text-decoration:none;cursor:pointer}.jl-account-sidebar nav button:hover,.jl-sidebar-link:hover{background:var(--a-soft)}.jl-account-sidebar nav button.is-active{color:var(--a-accent);background:var(--a-soft)}.jl-sidebar-separator{border-top:1px solid var(--a-border);margin:16px 6px 10px}
.jl-account-content{min-width:0}.jl-panel{display:grid;gap:17px}.jl-panel-heading{padding:8px 2px 3px}.jl-panel-heading p{margin:7px 0 0}.jl-overview-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.jl-stat{display:flex;flex-direction:column;gap:6px}.jl-stat strong{font-size:19px;line-height:1.4;overflow-wrap:anywhere}.jl-section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:15px}.jl-section-head h3{margin:0}.jl-text-button{background:transparent;border:0;font-size:13px;color:var(--a-accent);font-weight:650;cursor:pointer}.jl-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.jl-quick-link{min-height:97px;padding:17px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;border:1px solid var(--a-border);background:var(--a-card);border-radius:14px;color:var(--a-text);font:inherit;text-align:left;text-decoration:none;cursor:pointer}.jl-quick-link strong{font-size:15px}.jl-quick-link span{font-size:12px;color:var(--a-muted)}.jl-quick-link:hover,.jl-owned-course:hover,.jl-learning-course:hover{border-color:var(--a-accent)}
.jl-course-tabs{display:flex;gap:8px;flex-wrap:wrap}.jl-course-tabs button{border:1px solid var(--a-border);background:var(--a-card);color:var(--a-muted);font:600 13px/1.5 inherit;font-family:inherit;font-weight:650;padding:9px 15px;border-radius:9px;cursor:pointer}.jl-course-tabs button.is-active{border-color:var(--a-accent);background:var(--a-soft);color:var(--a-accent)}.jl-course-grid{display:grid;gap:11px}.jl-owned-course,.jl-learning-course{display:flex;gap:15px;align-items:center;padding:16px;border:1px solid var(--a-border);border-radius:13px;background:var(--a-card);color:var(--a-text);text-decoration:none;min-width:0}.jl-learning-cover{flex:none;width:92px;height:63px;object-fit:cover;border-radius:9px;background:var(--a-soft)}.jl-learning-placeholder{display:grid;place-items:center;font-size:12px;color:var(--a-muted);font-weight:700}.jl-learning-detail{min-width:0;flex:1}.jl-learning-detail b{display:block;font-size:15px;margin-bottom:5px}.jl-learning-detail small{color:var(--a-muted);font-size:12px}.jl-learning-progress{margin-top:10px;height:6px;border-radius:99px;background:var(--a-soft);overflow:hidden}.jl-learning-progress i{display:block;height:100%;border-radius:inherit;background:var(--a-accent)}.jl-course-action{font-size:13px;font-weight:700;color:var(--a-accent);white-space:nowrap}.jl-empty{padding:18px;border:1px dashed var(--a-border);border-radius:12px;color:var(--a-muted);font-size:13px;line-height:1.7}
.jl-primary-value{display:block;font-size:24px;line-height:1.4;margin:8px 0}.jl-code-row{display:flex;gap:10px}.jl-account-page input{color:var(--a-text);background:var(--a-card);border:1px solid var(--a-border);border-radius:9px;outline:0;min-width:0;padding:12px 14px;font-size:14px;font-family:inherit}.jl-account-page input:focus-visible,.jl-account-page button:focus-visible,.jl-account-page a:focus-visible{outline:3px solid var(--a-accent);outline-offset:3px}.jl-code-row input{flex:1}.jl-code-row .btn{white-space:nowrap}.jl-field-label{display:block;margin:14px 0 8px;font-weight:680;font-size:13px}.jl-preview-card{padding:18px;margin-top:15px;background:var(--a-soft);border:1px solid var(--a-border);border-radius:13px}.jl-preview-card dl{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px 15px;margin:0}.jl-preview-card dt{font-size:13px;color:var(--a-muted)}.jl-preview-card dd{font-size:14px;font-weight:650;margin:0;overflow-wrap:anywhere}.jl-confirm-actions,.jl-settings-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:17px}.jl-message{font-size:13px;line-height:1.6;margin:10px 0 0;min-height:1.4em;color:var(--a-muted)}.jl-message.is-error{color:#b43d39}.jl-message.is-success{color:#25794e}html[data-theme="dark"] .jl-message.is-error{color:#ffa6a3}html[data-theme="dark"] .jl-message.is-success{color:#86e2b1}.jl-history-grid{display:grid}.jl-history-item{padding:13px 0;border-bottom:1px solid var(--a-border);display:flex;justify-content:space-between;gap:12px;font-size:13px}.jl-history-item:last-child{border-bottom:0}.jl-history-item span{color:var(--a-muted)}.jl-danger-button{border:1px solid #cc6965!important;color:#b33838!important;background:transparent!important}html[data-theme="dark"] .jl-danger-button{color:#ffaaa5!important;border-color:#975957!important}#jl-delete-panel{margin-top:18px}#jl-delete-confirm{width:100%}
@media(max-width:790px){.jl-account-page{padding:26px 0 70px}.jl-account-layout{display:block}.jl-account-sidebar{position:static;margin-bottom:18px;padding:11px}.jl-sidebar-caption{display:none}.jl-account-sidebar nav{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}.jl-account-sidebar nav button{flex:none;width:auto;white-space:nowrap;padding:10px 12px}.jl-sidebar-separator,.jl-sidebar-link{display:none}.jl-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.jl-account-page{padding-inline:12px}.jl-account-card{padding:17px}.jl-overview-stats{gap:9px}.jl-stat strong{font-size:16px}.jl-account-userbar{gap:10px;align-items:center}.jl-user-avatar{width:45px;height:45px}.jl-user-profile strong{font-size:15px}.jl-user-profile span{font-size:11px}.jl-status-pill{font-size:10px;padding:5px 7px}.jl-quick-grid{grid-template-columns:1fr}.jl-quick-link{min-height:70px}.jl-code-row{flex-direction:column}.jl-owned-course,.jl-learning-course{padding:11px;gap:10px}.jl-learning-cover{width:72px;height:53px}.jl-course-action{display:none}.jl-preview-card dl{grid-template-columns:86px minmax(0,1fr)}}

/* Responsive, accessible touches: interactive zones stay legible in both themes. */
.jl-account-page .jl-quick-link:focus-visible,.jl-account-page .jl-learning-course:focus-visible{outline:3px solid var(--a-accent);outline-offset:3px}
.jl-account-page .jl-quick-link:hover{transform:translateY(-1px)}
@media(prefers-reduced-motion:reduce){.jl-account-page .jl-quick-link:hover{transform:none}}