.account-page { margin:0; min-height:100vh; background:#0b1220; color:#e9f0fc; font:16px/1.55 system-ui,sans-serif; color-scheme:dark; }
.account-shell { max-width:720px; margin:0 auto; padding:32px 20px 80px; }
.account-page { height:auto; overflow:auto; }
.account-page .account-shell { padding-top:88px; }
.standalone-header .top-bar { font-family:'DM Sans',sans-serif; }
.standalone-header .top-bar-inner { grid-template-columns:auto auto auto; justify-content:center; }
.standalone-header .top-bar-search { margin:0; }
@media(min-width:769px) and (max-width:1100px) {
  .standalone-header .top-bar-inner { gap:12px; }
  .standalone-header .top-bar-search { width:150px; }
  .standalone-header .top-bar-clock { display:none; }
}
/* Follow the application's theme in every account window view. */
html[data-theme="light"] #mobileAccountOverlay.profile-popover {
  background:var(--surface-glass, rgba(255,255,255,.96)); color:var(--text-main, #0f172a);
  border-color:var(--border-glass, #cbd5e1);
  box-shadow:0 8px 28px var(--shadow-color, #0f172a2e); color-scheme:light;
}
html[data-theme="light"] #mobileAccountOverlay.profile-popover .mobile-search-header-logo,
html[data-theme="light"] #mobileAccountOverlay.profile-popover .mobile-search-close,
html[data-theme="light"] .profile-popover .account-root { color:var(--text-main, #0f172a); }
html[data-theme="light"] .profile-popover .account-root section {
  background:var(--card-bg-soft, #f8fafc); border-color:var(--border-glass, #cbd5e1);
}
html[data-theme="light"] .profile-popover .account-root button,
html[data-theme="light"] .profile-popover .account-root .profile-links > * { border-color:var(--border-glass, #cbd5e1); }
html[data-theme="light"] .profile-popover .account-root input,
html[data-theme="light"] .profile-popover .account-root select {
  background:var(--input-bg, #f1f5f9); border-color:#94a3b8;
}
html[data-theme="light"] .profile-popover .account-root .profile-links > *:hover,
html[data-theme="light"] .profile-popover .account-root .profile-password:hover,
html[data-theme="light"] .profile-popover .account-root .profile-favorites button { color:var(--accent, #b45309); }
html[data-theme="light"] .profile-popover .account-root .profile-upgrade {
  background:#eff6ff; border-color:#93c5fd; color:#1d4ed8;
}
html[data-theme="light"] .profile-popover .account-root .profile-upgrade:hover { background:#dbeafe; border-color:#60a5fa; }
html[data-theme="light"] .profile-popover .profile-favorite-group h4,
html[data-theme="light"] .profile-popover .profile-favorite-empty { color:var(--text-muted, #475569); }
html[data-theme="light"] .profile-popover .account-password-error { color:#b91c1c; }

@media(max-width:768px) {
  .standalone-header .top-bar { display:flex; height:auto; min-height:56px; padding:10px 20px; background:var(--surface-glass); }
  .standalone-header .top-bar-inner { display:flex; gap:12px; }
  .standalone-header .top-bar-center { display:none; }
  .standalone-header .top-bar-left { flex:0 0 auto; gap:12px; }
  .standalone-header .top-bar-right { flex:1; min-width:0; gap:12px; }
  .standalone-header .top-bar-clock { display:none; }
  .standalone-header .top-bar-search { flex:1; width:auto; min-width:0; }
  .standalone-header .top-bar-search-input { height:34px; padding-left:30px; font-size:12px; }
  .standalone-header .update-release-restore { width:30px; min-width:30px; height:30px; padding:0; }
  .standalone-header .top-bar-live { scale:.85; }
  .standalone-header .top-bar .account-nav-link { width:64px; min-height:34px; padding:5px 6px; border-color:var(--border-glass); background:var(--hover-bg-strong); color:var(--text-main); }
  .account-page .account-shell { padding-top:88px; }
  .standalone-header #mobileAccountOverlay.profile-popover { top:68px; max-height:calc(100dvh - 84px); }
}
.account-shell h1 { font-size:30px; margin:24px 0 8px; }
.account-shell h1 span,.account-intro { color:#a5b8d2; }
.account-back,.account-nav-link { color:inherit; text-decoration:none; }
.account-nav-link { display:flex; flex-direction:column; align-items:center; gap:2px; flex-shrink:0; width:76px; box-sizing:border-box; padding:8px; border:1px solid #64748b; border-radius:10px; font-size:14px; }
.account-nav-nickname { display:block; width:100%; min-width:0; text-align:center; color:#60a5fa; font-size:12px; line-height:16px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html[data-theme="light"] .account-nav-nickname { color:var(--brand-domain, #1d4ed8); }
.account-nav-nickname[hidden] { display:none; }
.account-root { font:14px/1.5 system-ui,sans-serif; color:var(--text-main,#e9f0fc); text-align:left; width:100%; }
.account-root * { box-sizing:border-box; }
.account-root [hidden] { display:none !important; }
.account-root section { padding:20px; background:var(--bg-panel,#142034); border:1px solid #64748b55; border-radius:16px; margin-bottom:16px; }
.account-root h2 { font-size:20px; margin:0 0 14px; }
.account-root h3 { font-size:16px; margin:0 0 12px; }
.account-details { margin:0 0 20px; }
.account-details dt { color:var(--text-muted,#a5b8d2); font-size:13px; }
.account-details dd { margin:3px 0 12px; overflow-wrap:anywhere; }
.account-root label { display:block; margin-bottom:12px; }
.account-root input,.account-root select { display:block; width:100%; padding:11px 12px; margin-top:5px; background:var(--bg-main,#0c1627); color:inherit; border:1px solid #64748b; border-radius:8px; font:inherit; }
.account-root button { cursor:pointer; border:1px solid #64748b; border-radius:9px; padding:10px 14px; color:inherit; background:var(--bg-main,#22334c); font:inherit; }
.account-root button[type=submit] { background:#2563eb; border-color:#2563eb; color:white; }
.account-root button:disabled { opacity:.6; cursor:wait; }
.account-root input.account-username-locked { color:#94a3b8; background:#64748b22; border-color:#64748b66; -webkit-text-fill-color:#94a3b8; opacity:1; pointer-events:none; user-select:none; }
.account-root :focus-visible { outline:3px solid #60a5fa; outline-offset:3px; }
.account-tabs,.account-actions { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.account-profile-actions { display:flex; align-items:center; gap:8px; }
.account-profile-actions button { white-space:nowrap; }
.account-tabs [aria-pressed=true] { background:#2563eb; color:white; }
.account-notice { padding:12px 14px; border-radius:10px; background:#1d4ed833; border:1px solid #3b82f6; margin:0 0 16px; overflow-wrap:anywhere; }
.account-notice[data-error=true] { border-color:#f87171; background:#dc262622; }
.account-root small { display:block; color:var(--text-muted,#a5b8d2); margin:8px 0; }
.account-root .account-danger { border-color:#f87171; }
.account-root .account-danger button { background:#b91c1c; border-color:#b91c1c; color:white; }
.account-password-field { display:block; position:relative; margin-top:5px; }
.account-root .account-password-field input { margin-top:0; padding-right:54px; }
.account-root .account-password-toggle { position:absolute; right:2px; top:2px; bottom:2px; width:44px; padding:0; display:grid; place-items:center; border:0; background:transparent; }
.account-password-toggle[aria-pressed="false"] .account-eye-slash { display:none; }
.account-root form[data-action="register"] input[aria-invalid="true"] { border-color:#f87171; box-shadow:0 0 0 1px #f87171; }
.account-root .account-password-error { color:#f87171; margin:-4px 0 12px; font-size:13px; }
.account-root label .account-password-error { margin:6px 0 0; }
.mobile-account-content:has(.account-root) { padding:16px; overflow-y:auto; min-height:0; flex:1; text-align:left; align-items:stretch; display:block; }
.mobile-account-overlay:has(.account-root) { height:85vh; max-height:calc(100dvh - 16px); }
@media(max-width:480px) { .account-root section { padding:16px; } .account-shell { padding:20px 14px 60px; } .account-shell h1 { font-size:25px; } }

/* Compact account window shared by the desktop and mobile account buttons. */
button.account-nav-link { background:transparent; cursor:pointer; font-family:inherit; }
#mobileAccountOverlay.profile-popover {
  display:flex; flex-direction:column; position:fixed; top:64px; right:40px;
  bottom:auto; left:auto; width:336px; min-height:0; height:auto;
  max-height:calc(100dvh - 80px); z-index:1100; padding:16px;
  background:var(--surface-glass, rgba(11,14,20,.85)); color:#ddd; border:1px solid var(--border-glass, #282828); border-radius:9px;
  box-shadow:0 8px 28px #0006; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  visibility:hidden; opacity:0; pointer-events:none; transform:translateY(-6px);
  transition:opacity .15s ease, transform .15s ease; color-scheme:dark;
}
#mobileAccountOverlay.profile-popover.open { visibility:visible; opacity:1; pointer-events:auto; transform:none; }
#mobileAccountOverlay.profile-popover > .mobile-search-handle { display:none; }
#mobileAccountOverlay.profile-popover > .mobile-search-header { display:flex; align-items:center; justify-content:center; position:relative; padding:0 32px 16px; border:0; flex-shrink:0; }
#mobileAccountOverlay.profile-popover .mobile-search-header-logo { color:#ddd; font:500 23px/1.3 system-ui,sans-serif; }
#mobileAccountOverlay.profile-popover .mobile-search-close { position:absolute; right:0; top:0; width:30px; height:30px; padding:0; background:none; border:0; color:#ddd; font-size:21px; cursor:pointer; }
#mobileAccountOverlay.profile-popover .mobile-account-content { padding:0; overflow-y:auto; min-height:0; text-align:left; }
.profile-popover .account-root { color:#ddd; font-size:16px; }
.profile-popover .account-root section { background:var(--card-bg-soft, rgba(255,255,255,.03)); border-color:var(--border-glass, #262626); border-radius:6px; }
.profile-popover .account-root button { background:transparent; border-color:#262626; border-radius:6px; }
.profile-popover .account-root .account-tabs button[aria-pressed="true"] { background:#2563eb; border-color:#2563eb; color:#fff; }
.profile-popover .account-root input { background:#161616; }
.profile-popover .account-root button[type=submit] { background:#2563eb; }
.profile-summary dl { margin:0; }
.profile-summary dt { font-size:13px; font-weight:700; text-transform:uppercase; margin-bottom:5px; }
.profile-summary dd { margin:0 0 20px; overflow-wrap:anywhere; }
.profile-summary .profile-username { color:var(--brand-domain, #38bdf8); }
.profile-popover .account-root .profile-free-plan { color:#4ade80; }
html[data-theme="light"] .profile-popover .account-root .profile-free-plan { color:#15803d; }
.profile-popover .account-root .profile-password { border:0; padding:0; text-align:left; }
.profile-links { display:flex; flex-direction:column; margin:0 0 20px; }
.profile-popover .account-root .profile-links > * { display:block; padding:12px 4px; border:0; border-bottom:1px solid #242424; border-radius:0; text-align:left; color:inherit; font:inherit; text-decoration:none; }
.profile-popover .account-root .profile-links > *:hover,.profile-popover .account-root .profile-password:hover { color:#ffce00; }
.profile-popover .account-root .profile-upgrade,.profile-popover .account-root .profile-logout { width:100%; font-weight:600; padding:11px; }
.profile-popover .account-root .profile-upgrade { margin-bottom:10px; background:#12263d; border-color:#315d87; color:#b9dcff; }
.profile-popover .account-root .profile-upgrade:hover { background:#193653; border-color:#4b83b7; }
.profile-popover .account-root .profile-back { margin-bottom:14px; }
.profile-favorites { list-style:none; margin:0; padding:0; }
.profile-favorite-group + .profile-favorite-group { margin-top:20px; }
.profile-favorite-group h4 { margin:0 0 6px; color:#aaa; font-size:13px; font-weight:700; text-transform:uppercase; }
.profile-favorite-empty { margin:8px 0; color:#999; font-size:13px; }
.profile-plan-card { width:240px; max-width:100%; min-height:268px; margin:20px auto 0; padding:36px 16px 32px; border:1px solid #ddd; border-top:10px solid #999; border-radius:8px 8px 0 0; background:#fff; color:#171717; text-align:center; box-shadow:0 3px 12px #0002; }
.profile-plan-purpose { display:flex; align-items:center; justify-content:center; gap:5px; margin:0 0 8px; font-size:14px; }
.profile-plan-badge { display:block; width:40px; height:40px; margin:0 auto 6px; }
.profile-plan-card h4 { margin:0; font-size:23px; line-height:1.3; font-weight:400; }
.profile-plan-description { margin:44px 0 0; font-size:12px; line-height:1.5; }
.profile-plan-active { display:flex; align-items:center; justify-content:center; gap:8px; margin:24px 0 0; padding:10px 14px; border:1px solid #86c99a; border-radius:6px; background:#eaf7ee; color:#166534; font-size:14px; font-weight:600; }
.profile-favorites li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid #64748b44; }
.profile-favorites li > a { flex:1; }
.profile-favorites .favorite-live-link { display:inline-flex; align-items:center; padding:5px 8px; border-radius:4px; background:#facc15; color:#000; font-size:11px; font-weight:700; white-space:nowrap; }
.profile-favorites .favorite-live-link:hover { background:#f6c400; }
.profile-favorites a { color:inherit; text-decoration:none; }
.account-root .profile-favorites button { color:#ffce00; padding:6px 10px; }
.train-favorite-btn { font-family:system-ui,sans-serif; }
.close-btn.train-favorite-btn, .train-action-bar .train-favorite-btn .tab-ic { font-size:22px; }
.train-favorite-btn[aria-pressed="true"], .train-favorite-btn[aria-pressed="true"]:hover, .train-favorite-btn[aria-pressed="true"] .tab-ic { color:#ffce00; }
.train-favorite-btn:disabled { opacity:.5; cursor:wait; }
.favorite-choice-dialog { position:fixed; inset:auto; margin:0; width:220px; max-width:calc(100vw - 16px); box-sizing:border-box; padding:8px; border:1px solid #343434; border-radius:8px; background:#0c0c0c; color:#ddd; box-shadow:0 5px 18px #0006; font:13px/1.4 system-ui,sans-serif; }
.favorite-choice-dialog::backdrop { background:transparent; }
.favorite-choice-dialog h2 { margin:2px 2px 8px; color:#ddd; font-size:13px; font-weight:600; }
.favorite-choice-dialog button { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; padding:8px 10px; margin-top:6px; border:0; border-radius:8px; background:#1d1d1d; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.favorite-choice-copy { display:flex; flex-direction:column; gap:2px; min-width:0; }
.favorite-choice-label { color:#ccc; font-size:12px; line-height:1.2; font-weight:700; text-transform:uppercase; }
.favorite-choice-number { color:#ddd; font-size:16px; line-height:1.2; font-weight:600; }
.favorite-choice-star { color:#999; flex-shrink:0; font-size:22px; line-height:1; }
.favorite-choice-dialog button[aria-pressed="true"] .favorite-choice-star { color:#ffce00; }
.favorite-choice-dialog button:hover:not(:disabled) { background:#292929; }
.favorite-choice-dialog button:disabled { opacity:.4; cursor:default; }
.favorite-choice-dialog button:focus-visible { outline:2px solid #ffce00; outline-offset:-2px; }
@media(max-width:768px) {
  #mobileAccountOverlay.profile-popover { top:68px; right:12px; width:min(336px, calc(100vw - 24px)); max-height:calc(100dvh - 84px); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
}
@media(prefers-reduced-motion:reduce) { #mobileAccountOverlay.profile-popover { transition:none; } }
