/* Member panels use the same tokens, pixel typography and frames as the site.
   Keep legacy JS classes and IDs; this last layer scopes the visual system. */
body:has(.workspace-site),
body:has(.login-site) {
  --font-sans: Inter, system-ui, sans-serif;
  --font-display: SFPixel, ui-monospace, monospace;
  --gold: var(--sf-orange);
  --gold-bright: #ffad75;
  --gold-ring: #f07e3466;
  --text-muted: var(--marketing-copy-muted);
  --text-dim: var(--marketing-copy-muted);
  --bg-card: var(--sf-panel);
  --bg-elevated: var(--sf-panel-2);
  --border: var(--marketing-line);
  padding-top: 0;
  background: var(--sf-bg);
  color: var(--sf-text);
  font-family: var(--font-sans);
}
.workspace-site { overflow: visible; }
.workspace-site :is(button, input, select) { font: inherit; }
.workspace-site [hidden] { display: none !important; }
.workspace-site :is(a, button, input, select, summary):focus-visible {
  outline: 2px solid var(--sf-lime);
  outline-offset: 4px;
}
.workspace-site .skip-link { z-index: 100; }

/* Site rail, with member destinations and identity. */
.workspace-nav { width: var(--marketing-rail); border-color: var(--sf-line); }
.workspace-nav .sf-wordmark { margin-bottom: 2.5rem; }
.workspace-nav .sf-nav-block { min-height: 46px; }
.workspace-nav .sf-nav-block > span { display: inline-flex; align-items: center; gap: .7rem; }
.workspace-nav svg { width: 17px; height: 17px; flex-shrink: 0; }
.workspace-nav .sf-nav-block > svg { width: 14px; color: var(--sf-muted); }
.workspace-nav .sf-nav-block[aria-current="page"] {
  background: #28291e;
  border-color: #d4e55f80;
  color: var(--sf-lime);
  box-shadow: inset 3px 0 0 var(--sf-lime);
}
.workspace-nav .sf-nav-block[aria-current="page"] > svg { color: var(--sf-lime); }
.workspace-nav .dashboard-topbar-admin { display: flex; justify-content: space-between; padding: .8rem; color: var(--sf-lime); font-size: .85rem; }
.workspace-nav-footer { margin-top: auto; padding-top: 2rem; }
.workspace-signed-in { padding: 1rem .75rem; border-top: 1px solid var(--sf-line); color: var(--sf-muted); font-size: .75rem; }
.workspace-signed-in strong { display: block; margin-top: .25rem; color: var(--sf-text); font-size: .94rem; font-weight: 500; overflow-wrap: anywhere; }
.workspace-public-link { display: flex; justify-content: space-between; padding: .6rem .75rem; color: var(--sf-muted); text-decoration: none; font-size: .8rem; }
.workspace-public-link:hover { color: var(--sf-lime); }
.workspace-logout { display: flex; align-items: center; justify-content: center; gap: .6rem; width: 100%; min-height: 44px; margin-top: .5rem; border: 1px solid var(--sf-line); background: #1e1e20; color: var(--sf-text); cursor: pointer; }
.workspace-logout:hover { border-color: var(--sf-lime); background: #29292b; }
.workspace-topbar {
  position: relative;
  z-index: 85;
  margin-left: var(--marketing-rail);
  height: 64px;
  padding-inline: var(--marketing-gutter);
  justify-content: space-between;
  border-color: var(--marketing-line);
}
.workspace-breadcrumb { display: flex; gap: .7rem; align-items: center; margin: 0; color: var(--sf-muted); font: .72rem/1.4 SFPixel, monospace; }
.workspace-breadcrumb strong { color: var(--sf-text); font-weight: 400; }
.workspace-topbar-actions { display: flex; align-items: center; gap: 1rem; }
.workspace-topbar .workspace-plan-link { display: inline-flex; align-items: center; gap: .45rem; color: var(--sf-muted); font: .7rem SFPixel, monospace; }
.workspace-plan-link svg { width: 15px; height: 15px; }
.workspace-mobile-brand, .workspace-menu { display: none; }
.workspace-menu { position: relative; }
.workspace-menu summary { display: flex; align-items: center; gap: .4rem; min-height: 44px; padding: .5rem .7rem; border: 1px solid var(--sf-line); color: var(--sf-text); font: .7rem SFPixel, monospace; cursor: pointer; list-style: none; }
.workspace-menu summary::-webkit-details-marker { display: none; }
.workspace-menu summary svg { width: 18px; height: 18px; }
.workspace-menu nav { position: absolute; right: 0; top: calc(100% + .7rem); width: min(280px, calc(100vw - 2rem)); padding: .65rem; border: 1px solid var(--sf-line); background: #151516; box-shadow: 5px 5px 0 #070708; }
.workspace-menu-identity { margin: 0 0 .4rem; padding: .7rem; border-bottom: 1px solid var(--sf-line); color: var(--sf-muted); font: .85rem Inter, sans-serif; overflow-wrap: anywhere; }
.workspace-menu nav :is(a, button) { display: block; width: 100%; min-height: 44px; padding: .7rem; border: 0; color: var(--sf-text); background: transparent; text-align: left; text-decoration: none; font: .88rem/1.5 Inter, sans-serif; cursor: pointer; }
.workspace-menu nav :is(a, button):hover { background: #272729; color: var(--sf-lime); }
.workspace-menu nav [aria-current="page"] { color: var(--sf-lime); background: #28291e; }

/* A single content measure and heading hierarchy for the entire workspace. */
.workspace-site .workspace-panel {
  width: calc(100% - var(--marketing-rail));
  max-width: none;
  min-height: calc(100vh - 64px);
  margin: 0 0 0 var(--marketing-rail);
  padding: clamp(2rem, 4vw, 3.5rem) var(--marketing-gutter) 5rem;
}
.workspace-panel > :is(.dashboard-workspace, .container) { width: min(var(--marketing-content), 100%); max-width: none; margin-inline: auto; padding: 0; }
.workspace-panel .dashboard-label {
  display: block;
  width: fit-content;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  margin-bottom: .85rem;
  color: var(--sf-orange) !important;
  font: .72rem/1.4 SFPixel, monospace !important;
  letter-spacing: .09em;
}
.workspace-panel :is(.section-title, .dashboard-page-head h1) {
  margin: 0;
  color: #fff;
  font: 400 clamp(2.3rem, 4vw, 3.5rem)/1.12 SFPixel, monospace;
  letter-spacing: .01em;
}
.workspace-title-dot { color: var(--sf-lime); }
.workspace-panel .section-subtitle { max-width: 62ch; margin: 1rem 0 0; color: var(--sf-muted); font: .97rem/1.7 Inter, sans-serif; }
.workspace-panel :is(.dashboard-page-head, .account-hero) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 1.5rem; background: transparent; padding-bottom: 2rem; border-bottom: 1px solid var(--sf-line); margin-bottom: 0; }
.workspace-panel .dashboard-title-block { min-width: 0; }
.workspace-panel :is(.dashboard-head-actions, .dashboard-hero-actions, .dashboard-toolbar-right) { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.workspace-panel .account-hero { margin-bottom: 2rem; }
.workspace-panel .account-hero-actions { max-width: 280px; justify-content: flex-end; }

/* Primary actions match the orange framed buttons on public pages. */
.workspace-site :is(.glass-button, .btn, .dashboard-create-button, .dashboard-upgrade-link),
body:has(.workspace-site) .app-modal .glass-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 44px;
  min-width: 0;
  padding: .8rem 1.05rem;
  border: 1px solid #ffad75;
  border-radius: 0;
  background: var(--sf-orange);
  color: #140e0a;
  box-shadow: 3px 3px 0 #070708;
  font: 400 .78rem/1.4 SFPixel, monospace;
  text-shadow: none;
  text-decoration: none;
  cursor: pointer;
  backdrop-filter: none;
  transition: background .16s ease, border-color .16s ease;
}
.workspace-site :is(.glass-button, .btn, .dashboard-create-button):hover,
body:has(.workspace-site) .app-modal .glass-button:hover { background: #ff914c; border-color: #ffd0a8; transform: none; filter: none; }
.workspace-site .glass-button > span, body:has(.workspace-site) .app-modal .glass-button > span { color: inherit !important; font-family: inherit !important; }
.workspace-site .glass-button::before, .workspace-site .glass-button::after,
body:has(.workspace-site) .app-modal .glass-button::before,
body:has(.workspace-site) .app-modal .glass-button::after { content: none; }
.workspace-site :is(.btn-secondary, .btn-muted, .glass-button--muted, .dashboard-upgrade-link),
.workspace-site .account-hero-actions .glass-button,
body:has(.workspace-site) .app-modal .glass-button:first-child { background: #202023; border-color: var(--sf-line); color: var(--sf-text); box-shadow: none; }
.workspace-site :is(.btn-secondary, .btn-muted, .glass-button--muted, .dashboard-upgrade-link):hover,
.workspace-site .account-hero-actions .glass-button:hover { background: #2c2c30; border-color: var(--sf-lime); }
.workspace-site :is(.glass-button--danger, .btn-danger), body:has(.workspace-site) .app-modal .is-danger { background: #351b1e; border-color: #ae535a; color: #ffc0be; }
.workspace-site .glass-button--danger:hover, body:has(.workspace-site) .app-modal .is-danger:hover { background: #51282d; border-color: #ffb3ae; }
.workspace-site button:disabled { cursor: not-allowed; opacity: .5; }
.workspace-site .dashboard-create-button.is-disabled { opacity: .72; }
.workspace-site .dashboard-create-button svg, .workspace-site .dashboard-upgrade-link svg { width: 18px; height: 18px; flex-shrink: 0; }
.workspace-site .dashboard-create-form { display: inline-flex; margin: 0; }

/* Library summaries, search and map cards. */
.workspace-site .dashboard-workspace { display: flex; flex-direction: column; gap: 1.6rem; }
.workspace-panel .dashboard-summary { margin-bottom: 0; background: transparent; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.workspace-panel .summary-card { display: flex; flex-direction: row; align-items: center; gap: 1rem; min-width: 0; padding: 1.25rem !important; border: 1px solid var(--sf-line) !important; border-radius: 0 !important; background: var(--sf-panel) !important; box-shadow: 3px 3px 0 #070708 !important; backdrop-filter: none; }
.workspace-panel .summary-card:hover { border-color: #727275 !important; }
.workspace-panel .summary-icon-wrap { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; background: #252528; border: 1px solid var(--sf-line); color: var(--sf-lime); }
.workspace-panel .summary-icon-wrap--recent { color: #a7b4ff; }
.workspace-panel .summary-icon-wrap--status { color: var(--sf-orange); }
.workspace-panel .summary-icon-wrap svg { width: 20px; height: 20px; }
.workspace-panel .summary-details { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.workspace-panel .summary-label { color: var(--sf-muted); font: .68rem/1.4 SFPixel, monospace; letter-spacing: .04em; }
.workspace-panel .summary-value { color: var(--sf-text) !important; font: 500 1.05rem/1.4 Inter, sans-serif !important; overflow-wrap: anywhere; }
.workspace-panel .summary-progress { width: min(150px, 100%); height: 4px; background: #3e3e40; margin-top: .3rem; }
.workspace-panel .summary-progress span { display: block; width: 0; height: 100%; background: var(--sf-lime); }
.workspace-panel .dashboard-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.workspace-panel .dashboard-search-wrap { min-width: 0; }
.workspace-panel :is(.dashboard-search, .dashboard-sort) { position: relative; display: flex; align-items: center; min-width: 0; max-width: none; }
.workspace-panel .dashboard-search { width: 100%; }
.workspace-panel .dashboard-search .form-input { width: 100%; padding-left: 2.65rem; }
.workspace-panel .dashboard-sort .form-input { min-width: 195px; padding-left: 2.4rem; cursor: pointer; }
.workspace-panel :is(.search-icon, .sort-icon) { position: absolute; left: .85rem; width: 17px; height: 17px; color: var(--sf-muted); pointer-events: none; }
.workspace-panel .dashboard-result-count { color: var(--sf-muted); font-size: .8rem; white-space: nowrap; }
.workspace-panel .dashboard-grid { background: transparent; grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); gap: 1.25rem; }
.workspace-panel .map-card { border: 1px solid var(--sf-line) !important; border-radius: 0 !important; background: var(--sf-panel) !important; backdrop-filter: none; box-shadow: 4px 4px 0 #070708; transition: border-color .16s ease; }
.workspace-panel .map-card:hover { transform: none; border-color: var(--sf-orange) !important; box-shadow: 4px 4px 0 #070708; }
.workspace-panel .map-card-thumb { aspect-ratio: 16 / 10; border-color: var(--sf-line); background-color: #111114; }
.workspace-panel .map-card-body { padding: 1.15rem; gap: .7rem; }
.workspace-panel .map-card-title { color: var(--sf-text); font: 400 1.08rem/1.4 SFPixel, monospace !important; overflow-wrap: anywhere; }
.workspace-panel .map-card-meta { flex-direction: column; gap: .3rem; color: var(--sf-muted); font: .8rem/1.5 Inter, sans-serif; letter-spacing: 0; }
.workspace-panel .map-card-identity { color: var(--sf-muted); }
.workspace-panel .map-card-badge { border-radius: 0; backdrop-filter: none; font: .65rem/1.5 SFPixel, monospace; letter-spacing: .04em; padding: .3rem .55rem; }
.workspace-panel .map-card-badge-saved { color: var(--sf-lime); background: #252c19; border-color: #7c8845; }
.workspace-panel .map-card-badge-new { color: #ffbe92; background: #352317; border-color: #8f5c35; }
.workspace-panel .map-card-empty-preview { color: var(--sf-muted); background-color: #151519; background-image: linear-gradient(#ffffff0a 1px, transparent 1px), linear-gradient(90deg, #ffffff0a 1px, transparent 1px); background-size: 24px 24px; }
.workspace-panel .map-card-empty-preview::before, .workspace-panel .map-card-empty-preview::after { background: #48484c; }
.workspace-panel .map-card-actions { gap: .75rem; margin-top: .5rem; }
.workspace-panel .map-card-menu-trigger { width: 44px; height: 44px; border-radius: 0; background: #252528; color: var(--sf-text); border-color: var(--sf-line); }
.workspace-panel .map-card-menu-trigger:hover { border-color: var(--sf-lime); }
.workspace-panel .map-card-menu-popover { border-radius: 0; background: #252528; border-color: #737378; min-width: 180px; }
.workspace-panel .map-card-menu-popover button { min-height: 44px; border-radius: 0; color: var(--sf-text); font-size: .9rem; }
.workspace-panel .map-card-menu-popover .is-danger { color: #ffb3ae; }
.workspace-panel .map-card-lock { display: flex; align-items: center; gap: .4rem; color: #ffbe92; font-size: .78rem; }
.workspace-panel .map-card.is-locked .map-card-thumb { filter: grayscale(.35); }
.workspace-panel :is(.dashboard-empty, .dashboard-no-results) { padding: clamp(2rem, 5vw, 4.5rem) 1.25rem; border: 1px dashed #606064; border-radius: 0; background: var(--sf-panel); text-align: center; }
.workspace-panel :is(.dashboard-empty h2, .dashboard-no-results h3) { margin: 0 0 .8rem; color: var(--sf-text); font: 400 clamp(1.4rem, 2vw, 1.8rem)/1.4 SFPixel, monospace; }
.workspace-panel :is(.dashboard-empty p, .dashboard-no-results p) { max-width: 44ch; margin: 0 auto 1.5rem; color: var(--sf-muted); }
.workspace-panel .dashboard-empty-icon { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 1.5rem; border: 1px solid #7c8845; background: #252c19; color: var(--sf-lime); }
.workspace-panel .dashboard-empty-icon svg { width: 30px; height: 30px; }
.workspace-empty-link { display: block; width: fit-content; margin: 1.4rem auto 0; color: var(--sf-muted); font-size: .85rem; text-underline-offset: .25rem; }
.workspace-empty-link:hover { color: var(--sf-lime); }
@keyframes workspace-shimmer { to { background-position: 200% 0; } }
.workspace-panel .map-card-skeleton { border: 1px solid var(--sf-line); background: var(--sf-panel); }
.workspace-panel .skel-thumb { aspect-ratio: 16 / 10; }
.workspace-panel .skel-body { padding: 1.15rem; display: grid; gap: .8rem; }
.workspace-panel .skel-line { height: 14px; }
.workspace-panel .skel-line-short { width: 60%; }
.workspace-panel :is(.skel-thumb, .skel-line) { background: linear-gradient(110deg, #ffffff05 0%, #ffffff12 45%, #ffffff05 65%); background-size: 200% 100%; animation: workspace-shimmer 1.5s ease-in-out infinite; }

/* All account sections, including dynamically rendered billing controls. */
.workspace-panel .account-layout { grid-template-columns: 170px minmax(0, 1fr); gap: 2rem; align-items: start; }
.workspace-panel .account-sidebar { position: sticky; top: 1.5rem; }
.workspace-panel .account-toc-heading { margin-bottom: .85rem; color: var(--sf-muted); font: .62rem SFPixel, monospace; }
.workspace-panel .account-toc ul { flex-direction: column; gap: .3rem; }
.workspace-panel .account-toc li a { min-height: 44px; padding: .7rem; border: 1px solid transparent; border-radius: 0 !important; color: var(--sf-muted); font: .82rem/1.5 Inter, sans-serif; }
.workspace-panel .account-toc li a:hover { background: #242426; border-color: var(--sf-line); color: var(--sf-lime); }
.workspace-panel .account-toc .account-toc-danger { color: #ffb3ae; }
.workspace-panel .account-main { gap: 1.5rem; }
.workspace-panel .account-card { padding: clamp(1.2rem, 2.5vw, 1.75rem); border: 1px solid var(--sf-line) !important; border-radius: 0 !important; background: var(--sf-panel) !important; box-shadow: 4px 4px 0 #070708 !important; backdrop-filter: none; }
.workspace-panel .account-card:hover { border-color: #626267 !important; }
.workspace-panel .account-card > header { padding-bottom: 1.2rem; margin-bottom: 1.35rem; border-bottom: 1px solid var(--sf-line) !important; }
.workspace-panel .account-card > header h2 { margin: 0 0 .65rem; color: var(--sf-text) !important; font: 400 1.45rem/1.3 SFPixel, monospace !important; }
.workspace-panel .account-card > header p { max-width: 68ch; color: var(--sf-muted) !important; font: .88rem/1.65 Inter, sans-serif; }
.workspace-panel .account-avatar { width: 64px; height: 64px; border: 1px solid #7c8845; border-radius: 0; background: #282e1c; box-shadow: 3px 3px 0 #070708; }
.workspace-panel .account-avatar-letter { color: var(--sf-lime); font: 400 1.6rem SFPixel, monospace; }
.workspace-panel .account-list { gap: .7rem; }
.workspace-panel .account-list > div { grid-template-columns: 110px minmax(0, 1fr); padding-block: .35rem; align-items: center; }
.workspace-panel .account-list dt { color: var(--sf-muted) !important; font: .8rem/1.5 Inter, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; }
.workspace-panel .account-list dd { color: var(--sf-text) !important; font-size: .9rem; overflow-wrap: anywhere; min-width: 0; }
.workspace-panel .account-value-mono { font: .85rem/1.5 Inter, sans-serif; }
.workspace-panel .account-list code { background: #27272a !important; color: var(--sf-muted) !important; border-color: var(--sf-line) !important; border-radius: 0 !important; }
.workspace-panel .account-plan-pill { border-radius: 0; font: .65rem/1.5 SFPixel, monospace; letter-spacing: .03em; padding: .4rem .6rem; }
.workspace-panel .account-plan-pill--studio { background: #252c19; border-color: #7c8845; color: var(--sf-lime); }
.workspace-panel .account-subscription-note { color: var(--sf-muted); }
.workspace-panel #subscription-status[aria-busy="true"] :is(.account-skel-label, .account-skel-value) { border-radius: 0; }
.workspace-panel .account-form { max-width: none; }
.workspace-panel #account-password-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.3rem; }
.workspace-panel #account-password-form > :is(.form-group:first-child, .form-feedback, .account-form-actions) { grid-column: 1 / -1; }
.workspace-panel #account-password-form .form-group { margin: 0; min-width: 0; }
.workspace-panel .form-label { color: var(--sf-text); font: 500 .85rem/1.5 Inter, sans-serif; text-transform: none; letter-spacing: 0; }
.workspace-panel .account-pw-toggle { min-height: 32px; padding: .25rem .6rem; border-radius: 0; background: #29292c; border-color: var(--sf-line); color: var(--sf-muted); font: .7rem Inter, sans-serif; text-transform: none; letter-spacing: 0; }
.workspace-panel .account-pw-toggle:hover { border-color: var(--sf-lime); color: var(--sf-text); }
.workspace-panel .form-hint { color: var(--sf-muted); font-size: .78rem; line-height: 1.55; }
.workspace-panel .account-link-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.workspace-panel .account-quick-link { min-height: 48px; border-radius: 0; background: #252528; border-color: var(--sf-line); font-size: .85rem; }
.workspace-panel .account-quick-link:hover { background: #303034; border-color: var(--sf-lime); }
.workspace-panel .account-quick-chev { color: var(--sf-lime); }
.workspace-panel .account-danger-details { border-radius: 0; border-color: #ae535a80; background: #211517; }
.workspace-panel .account-danger-summary { min-height: 60px; color: #ffb3ae; font: .7rem/1.5 SFPixel, monospace; }
.workspace-panel .account-card-danger { background: #211517 !important; border-color: #ae535a80 !important; box-shadow: none !important; }
.workspace-panel .account-card-danger > header h2 { color: #ffc0be !important; }
.workspace-panel .account-card-danger-inner { margin: 0 1rem 1rem; }
.workspace-panel .account-section { scroll-margin-top: 1.5rem; background: transparent; }

/* Inputs and confirmation dialogs belong to the same user surface. */
.workspace-site :is(.form-input, .wizard-text-input),
body:has(.workspace-site) .app-modal .form-input {
  min-height: 46px;
  border: 1px solid #626267;
  border-radius: 0;
  background: #141416;
  color: var(--sf-text);
  padding: .75rem .85rem;
  font: .9rem/1.5 Inter, sans-serif;
  box-shadow: none;
}
.workspace-site .form-input::placeholder { color: var(--sf-muted); opacity: 1; }
.workspace-site :is(.form-input, .wizard-text-input):focus,
.workspace-panel .account-card .form-input:focus,
body:has(.workspace-site) .app-modal .form-input:focus { border-color: var(--sf-lime) !important; background: #141416; box-shadow: 0 0 0 2px #d4e55f26 !important; }
.workspace-site select option { background: #1c1c1f; color: var(--sf-text); }
body:has(.workspace-site) .app-modal { min-width: 0; width: min(450px, calc(100vw - 2rem)); padding: 1.75rem; border: 1px solid #737378; border-radius: 0; background: var(--sf-panel); box-shadow: 6px 6px 0 #070708; }
body:has(.workspace-site) .app-modal h2 { color: var(--sf-text); font: 400 1.35rem/1.4 SFPixel, monospace !important; }
body:has(.workspace-site) .app-modal p { color: var(--sf-muted); }
body:has(.workspace-site) .app-modal-overlay { background: #070708cc; backdrop-filter: none; }
body:has(.workspace-site) .app-modal :is(a, button, input):focus-visible { outline: 2px solid var(--sf-lime); outline-offset: 4px; }
body:has(.workspace-site) .app-modal-actions { flex-wrap: wrap; }
body:has(.workspace-site) #toast { border: 1px solid var(--sf-line); border-radius: 0; background: #252528; color: var(--sf-text); }

/* Sign-in, registration and password recovery views use the site's frames. */
.login-site { --auth-gold: var(--sf-orange); --auth-gold-soft: #ffbe92; --auth-panel: var(--sf-panel); --auth-text: var(--sf-text); --auth-muted: var(--sf-muted); --auth-border: var(--sf-line); }
.login-site .login-page { background: var(--sf-bg); }
.login-site .auth-page--minimal::before { background: none; }
.login-site .login-page .auth-card { border: 1px solid var(--sf-line); border-radius: 0; background: var(--sf-panel); box-shadow: 5px 5px 0 #070708; backdrop-filter: none; }
.login-site :is(.auth-page-title, .auth-card-view h2) { color: var(--sf-text); font: 400 1.5rem/1.4 SFPixel, monospace !important; }
.login-site .auth-card-kicker { color: var(--sf-orange); }
.login-site :is(.auth-chooser-btn, .auth-card .form-input, .auth-alert, .auth-intent) { border-radius: 0; }
.login-site .auth-chooser-btn { background: #252528; border-color: #626267; color: var(--sf-text); box-shadow: none; }
.login-site .auth-chooser-btn:hover { border-color: var(--sf-lime); background: #303034; transform: none; }
.login-site .auth-card .form-input { min-height: 46px; background: #141416; color: var(--sf-text); border-color: #626267; box-shadow: none; }
.login-site .auth-card .form-input:focus { border-color: var(--sf-lime); box-shadow: 0 0 0 2px #d4e55f26; }
.login-site .auth-card-cta { width: 100%; min-height: 46px; display: flex; align-items: center; justify-content: center; border-radius: 0; background: var(--sf-orange); color: #140e0a; border: 1px solid #ffad75; box-shadow: 3px 3px 0 #070708; text-shadow: none; font: .8rem/1.4 SFPixel, monospace; }
.login-site .auth-card-cta:hover { background: #ff914c; transform: none; }
.login-site :is(.auth-toggle-link, .form-link-inline, .auth-card .form-link) { color: var(--sf-lime); }
.login-site .recovery-page .auth-shell { width: min(460px, 100%); }
.login-site .recovery-page .auth-card { gap: 1.2rem; }
.login-site .recovery-page .form-label { color: var(--sf-text); font: 500 .85rem/1.5 Inter, sans-serif; text-transform: none; letter-spacing: 0; }
.workspace-site .form-input-toggle, .login-site .form-input-toggle { width: 3.5rem; min-height: 40px; border-radius: 0; font-size: 0; color: var(--sf-muted); }
.workspace-site .form-input-toggle::after, .login-site .form-input-toggle::after { content: "Show"; font: .7rem/1.4 Inter, sans-serif; }
.workspace-site .form-input-toggle[aria-label="Hide password"]::after, .login-site .form-input-toggle[aria-label="Hide password"]::after { content: "Hide"; }
.workspace-site .form-input-wrap .form-input, .login-site .form-input-wrap .form-input { padding-right: 3.7rem; }
.login-site :is(a, button, input):focus-visible { outline: 2px solid var(--sf-lime); outline-offset: 4px; }

/* Keep onboarding's existing steps, within the common navigable workspace. */
.workspace-site .onboarding-shell { position: relative; inset: auto; display: block; isolation: isolate; overflow: clip; }
.workspace-onboarding .onboarding-step { position: relative; inset: auto; display: none; opacity: 1; background: transparent; padding: 2rem 0; transition: none; }
.workspace-onboarding .onboarding-step.is-active { display: flex; }
.workspace-onboarding .onboarding-content { width: min(720px, 100%); padding: 0; }
.workspace-onboarding .onboarding-title { color: var(--sf-text); font: 400 clamp(1.8rem, 4vw, 3rem)/1.25 SFPixel, monospace !important; }
.workspace-onboarding .onboarding-subtitle { color: var(--sf-muted); font: 1rem/1.7 Inter, sans-serif; }
.workspace-onboarding .onboarding-step-label { color: var(--sf-orange) !important; font-family: SFPixel, monospace !important; }
.workspace-onboarding :is(.onboarding-pill, .onboarding-card) { box-sizing: border-box; border: 1px solid var(--sf-line); border-radius: 0; background: var(--sf-panel); color: var(--sf-text); box-shadow: 3px 3px 0 #070708; backdrop-filter: none; transform: none; }
.workspace-onboarding .onboarding-pill { min-height: 44px; padding: .65rem 1rem; font-family: SFPixel, monospace !important; }
.workspace-onboarding :is(.onboarding-pill, .onboarding-card):hover { background: #28282b; border-color: var(--sf-lime); transform: none; box-shadow: 3px 3px 0 #070708; }
.workspace-onboarding :is(.onboarding-pill, .onboarding-card).is-active { color: var(--sf-lime); border-color: var(--sf-lime); background: #282e1c; transform: none; box-shadow: 3px 3px 0 #070708; }
.workspace-onboarding .onboarding-card-title { font: 400 1.05rem/1.4 SFPixel, monospace !important; }
.workspace-onboarding .onboarding-card-desc { color: var(--sf-muted); }
.workspace-onboarding .onboarding-cards { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.workspace-onboarding .onboarding-nav { position: relative; bottom: auto; left: auto; transform: none; flex-wrap: wrap; justify-content: center; margin-top: 2.5rem; }
.workspace-onboarding .genre-bg { position: absolute; inset: 0; opacity: 0; transform: none; filter: none; }
.workspace-onboarding .genre-bg.is-active { opacity: .12; }
.workspace-onboarding .genre-flash { display: none; }
.workspace-onboarding .onboarding-logo { max-width: min(320px, 100%); }

@media (min-width: 900px) and (max-height: 740px) {
  .workspace-nav { overflow-y: auto; padding-top: 1.25rem; }
  .workspace-nav .sf-wordmark { margin-bottom: 1.6rem; }
  .workspace-nav .sf-nav-label:not(:first-of-type) { margin-top: 1.25rem; }
  .workspace-nav-footer { padding-top: 1rem; }
}
@media (min-width: 900px) and (max-width: 1199px) {
  .workspace-site { --marketing-rail: var(--marketing-rail-tablet); }
  .workspace-nav .sf-wordmark { font-size: 22px; }
  .workspace-panel .account-layout { grid-template-columns: minmax(0, 1fr); }
  .workspace-panel .account-sidebar { position: static; }
  .workspace-panel .account-toc ul { flex-direction: row; flex-wrap: wrap; }
  .workspace-panel .account-toc li a { border-color: var(--sf-line); }
  .workspace-panel .account-sidebar-hint { display: none; }
  .workspace-panel .dashboard-toolbar { grid-template-columns: 1fr; }
  .workspace-panel .dashboard-toolbar-right { justify-content: space-between; }
}
@media (max-width: 899px) {
  .workspace-site .workspace-nav { display: none; }
  .workspace-topbar { margin-left: 0; padding-inline: 1rem; }
  .workspace-site .workspace-panel { width: 100%; margin-left: 0; padding-inline: clamp(1rem, 3.5vw, 2rem); }
  .workspace-mobile-brand { display: block; color: #fff; font: .95rem SFPixel, monospace; white-space: nowrap; }
  .workspace-mobile-brand span { color: var(--sf-lime); }
  .workspace-breadcrumb { display: none; }
  .workspace-menu { display: block; }
  .workspace-topbar .workspace-plan-link { display: none; }
  .workspace-panel .account-layout { grid-template-columns: 1fr; gap: 1.5rem; }
  .workspace-panel .account-sidebar { position: static; }
  .workspace-panel .account-toc ul { flex-direction: row; flex-wrap: wrap; gap: .5rem; }
  .workspace-panel .account-toc li a { border-color: var(--sf-line); }
  .workspace-panel .account-sidebar-hint { display: none; }
}
@media (max-width: 640px) {
  .workspace-panel :is(.dashboard-page-head, .account-hero) { grid-template-columns: 1fr; align-items: start; }
  .workspace-panel .account-hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: none; }
  .workspace-panel .account-hero-actions .glass-button { width: 100%; padding-inline: .5rem; font-size: .68rem; }
  .workspace-panel .dashboard-head-actions { width: 100%; }
  .workspace-panel .dashboard-head-actions .dashboard-create-form { flex: 1; }
  .workspace-panel .dashboard-head-actions .dashboard-create-button { width: 100%; }
  .workspace-panel .dashboard-summary { grid-template-columns: 1fr; gap: .75rem; }
  .workspace-panel .summary-card { padding: 1rem !important; }
  .workspace-panel .dashboard-toolbar { grid-template-columns: 1fr; gap: .75rem; }
  .workspace-panel .dashboard-toolbar-right { justify-content: space-between; gap: .75rem; }
  .workspace-panel .dashboard-sort { flex: 1; }
  .workspace-panel .dashboard-sort .form-input { width: 100%; min-width: 0; }
  .workspace-panel #account-password-form { grid-template-columns: 1fr; }
  .workspace-panel .account-profile-body { flex-direction: column; }
  .workspace-panel .account-list > div { grid-template-columns: 1fr; gap: .25rem; padding-block: .5rem; }
  .workspace-panel .account-avatar { width: 56px; height: 56px; }
  .workspace-panel .account-link-grid { grid-template-columns: 1fr; }
  .workspace-panel .account-danger-summary { padding-inline: 1rem; }
  .workspace-onboarding .onboarding-cards { grid-template-columns: 1fr; }
  .workspace-onboarding .onboarding-card { width: 100%; }
  body:has(.workspace-site) .app-modal { padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .workspace-site *, .workspace-site *::before, .workspace-site *::after,
  .login-site *, body:has(.workspace-site) :is(.app-modal, .app-modal-overlay) { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}