/* ============================================================
   ANNOTATED NOTEBOOK SKIN - account and billing family.
   COLORS ONLY. The legacy acct-hub/acg/pv/bm/bc layouts stay 1:1;
   this file re-points their ink, paper, and status colors to nb tokens.
   Loaded only when nb_active from pages/includes/nb_account_skin.html.
   ============================================================ */

html.theme-light body,
html:not(.theme-light) body {
  background-color: var(--nb-paper);
  background-image: radial-gradient(var(--nb-grid-dot) 1px, transparent 1px);
  background-size: var(--nb-grid-size) var(--nb-grid-size);
}

html.theme-light .lp-atmosphere,
html:not(.theme-light) .lp-atmosphere,
html.theme-light .pg-page-glow,
html:not(.theme-light) .pg-page-glow {
  display: none;
}

html.theme-light .acct-hub-hero,
html.theme-light .acct-hub-content,
html.theme-light .acg-page,
html.theme-light .pv-page,
html.theme-light .bc-page,
html:not(.theme-light) .acct-hub-hero,
html:not(.theme-light) .acct-hub-content,
html:not(.theme-light) .acg-page,
html:not(.theme-light) .pv-page,
html:not(.theme-light) .bc-page {
  --text: var(--nb-ink);
  --text-muted: var(--nb-ink-2);
  --muted: var(--nb-ink-2);
  --faint: var(--nb-ink-3);
  --placeholder: var(--nb-ink-2);
  --surface: var(--nb-paper-raised);
  --surface-soft: var(--nb-paper-sunken);
  --surface-elevated: var(--nb-paper-raised);
  --bg-elevated: var(--nb-paper-raised);
  --bg-3: var(--nb-paper-sunken);
  --border: var(--nb-border);
  --border-2: var(--nb-border-strong);
  --border-control: var(--nb-control-border);
  --border-focus: var(--nb-blue);
  --focus-ring: var(--nb-blue);
  --accent: var(--nb-blue);
  --accent-2: var(--nb-blue);
  --accent-soft: var(--nb-blue-wash);
  --accent-border: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  --text-link: var(--nb-blue);
  --text-link-hover: var(--nb-blue-strong);
  --success: var(--nb-success);
  --success-subtle-bg: color-mix(in srgb, var(--nb-success) 12%, transparent);
  --success-border: color-mix(in srgb, var(--nb-success) 28%, transparent);
  --danger: var(--nb-error);
  --danger-subtle-bg: color-mix(in srgb, var(--nb-error) 12%, transparent);
  --danger-border: color-mix(in srgb, var(--nb-error) 30%, transparent);
  --warning: var(--nb-error);
  --warning-subtle-bg: color-mix(in srgb, var(--nb-error) 12%, transparent);
  --warning-border: color-mix(in srgb, var(--nb-error) 30%, transparent);
  --premium-pill-bg: var(--nb-premium-wash);
  --premium-border: color-mix(in srgb, var(--nb-premium) 30%, transparent);
  --premium-pill-text: var(--nb-premium);
  --shadow-sm: var(--nb-shadow-1);
  --shadow-md: var(--nb-shadow-2);
  --shadow-lg: var(--nb-shadow-2);
  --shadow-hover: var(--nb-shadow-2);
  --glow-accent: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .pv-deco,
html:not(.theme-light) .pv-deco {
  display: none;
}

/* Account hub and billing manage */
html.theme-light .acct-hub-hero .pg-hero-title,
html:not(.theme-light) .acct-hub-hero .pg-hero-title {
  color: var(--nb-ink);
}

html.theme-light .acct-hub-hero .pg-hero-body,
html:not(.theme-light) .acct-hub-hero .pg-hero-body {
  color: var(--nb-ink-2);
}

html.theme-light .acct-hub-card,
html:not(.theme-light) .acct-hub-card {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-2);
  color: var(--nb-ink);
}

html.theme-light .acct-hub-profile,
html:not(.theme-light) .acct-hub-profile {
  background: var(--nb-paper-sunken);
  border-bottom-color: var(--nb-border);
}

html.theme-light .acct-hub-avatar,
html:not(.theme-light) .acct-hub-avatar {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  color: var(--nb-blue);
}

html.theme-light .acct-hub-name,
html.theme-light .acct-hub-free-name,
html:not(.theme-light) .acct-hub-name,
html:not(.theme-light) .acct-hub-free-name {
  color: var(--nb-ink);
}

html.theme-light .acct-hub-email,
html.theme-light .acct-hub-premium-note,
html.theme-light .acct-hub-free-desc,
html:not(.theme-light) .acct-hub-email,
html:not(.theme-light) .acct-hub-premium-note,
html:not(.theme-light) .acct-hub-free-desc {
  color: var(--nb-ink-2);
}

html.theme-light .acct-hub-section-label,
html.theme-light .acct-hub-signout-label,
html:not(.theme-light) .acct-hub-section-label,
html:not(.theme-light) .acct-hub-signout-label {
  color: var(--nb-blue);
}

html.theme-light .acct-hub-col + .acct-hub-col,
html.theme-light .acct-hub-signout,
html.theme-light .bm-footer,
html:not(.theme-light) .acct-hub-col + .acct-hub-col,
html:not(.theme-light) .acct-hub-signout,
html:not(.theme-light) .bm-footer {
  border-color: var(--nb-border);
}

html.theme-light .acct-hub-premium-status,
html:not(.theme-light) .acct-hub-premium-status {
  background: color-mix(in srgb, var(--nb-success) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-success) 28%, transparent);
  color: var(--nb-success);
}

html.theme-light .acct-hub-action-link,
html:not(.theme-light) .acct-hub-action-link {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink);
}

html.theme-light .acct-hub-action-link:hover,
html.theme-light .acct-hub-action-link:focus-visible,
html:not(.theme-light) .acct-hub-action-link:hover,
html:not(.theme-light) .acct-hub-action-link:focus-visible {
  background: var(--nb-blue-wash);
  border-color: var(--nb-blue);
  color: var(--nb-blue);
}

html.theme-light .acct-hub-action-arrow,
html:not(.theme-light) .acct-hub-action-arrow {
  color: var(--nb-ink-3);
}

html.theme-light .acct-hub-action-link:hover .acct-hub-action-arrow,
html.theme-light .acct-hub-action-link:focus-visible .acct-hub-action-arrow,
html:not(.theme-light) .acct-hub-action-link:hover .acct-hub-action-arrow,
html:not(.theme-light) .acct-hub-action-link:focus-visible .acct-hub-action-arrow {
  color: var(--nb-blue);
}

html.theme-light .acct-hub-upgrade-btn,
html.theme-light .bc-btn--primary,
html:not(.theme-light) .acct-hub-upgrade-btn,
html:not(.theme-light) .bc-btn--primary {
  background: var(--nb-blue);
  border: 1px solid var(--nb-blue);
  color: var(--nb-on-blue);
  box-shadow: none;
  text-shadow: none;
}

html.theme-light .acct-hub-upgrade-btn:hover,
html.theme-light .acct-hub-upgrade-btn:focus-visible,
html.theme-light .bc-btn--primary:hover,
html.theme-light .bc-btn--primary:focus-visible,
html:not(.theme-light) .acct-hub-upgrade-btn:hover,
html:not(.theme-light) .acct-hub-upgrade-btn:focus-visible,
html:not(.theme-light) .bc-btn--primary:hover,
html:not(.theme-light) .bc-btn--primary:focus-visible {
  background: var(--nb-blue-strong);
  border-color: var(--nb-blue-strong);
  color: var(--nb-on-blue);
  box-shadow: var(--nb-shadow-1);
  opacity: 1;
}

html.theme-light .acct-hub-upgrade-btn:focus-visible,
html.theme-light .acct-hub-action-link:focus-visible,
html.theme-light .acct-hub-logout-btn:focus-visible,
html.theme-light .bm-secondary-btn:focus-visible,
html.theme-light .bm-footer-link:focus-visible,
html:not(.theme-light) .acct-hub-upgrade-btn:focus-visible,
html:not(.theme-light) .acct-hub-action-link:focus-visible,
html:not(.theme-light) .acct-hub-logout-btn:focus-visible,
html:not(.theme-light) .bm-secondary-btn:focus-visible,
html:not(.theme-light) .bm-footer-link:focus-visible {
  outline: 2px solid var(--nb-blue);
  outline-offset: 3px;
}

html.theme-light .acct-hub-logout-btn,
html.theme-light .bm-notice,
html.theme-light .bm-status-badge--warning,
html:not(.theme-light) .acct-hub-logout-btn,
html:not(.theme-light) .bm-notice,
html:not(.theme-light) .bm-status-badge--warning {
  background: color-mix(in srgb, var(--nb-error) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-error) 30%, transparent);
  color: var(--nb-error);
}

html.theme-light .acct-hub-logout-btn:hover,
html.theme-light .acct-hub-logout-btn:focus-visible,
html:not(.theme-light) .acct-hub-logout-btn:hover,
html:not(.theme-light) .acct-hub-logout-btn:focus-visible {
  background: color-mix(in srgb, var(--nb-error) 16%, transparent);
  border-color: color-mix(in srgb, var(--nb-error) 40%, transparent);
  color: var(--nb-error);
}

html.theme-light .bm-status-badge--ended,
html:not(.theme-light) .bm-status-badge--ended {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink-2);
}

html.theme-light .bm-secondary-btn {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  color: var(--nb-ink-2);
}
html:not(.theme-light) .bm-secondary-btn {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink-2);
}

html.theme-light .bm-secondary-btn:hover,
html.theme-light .bm-secondary-btn:focus-visible,
html:not(.theme-light) .bm-secondary-btn:hover,
html:not(.theme-light) .bm-secondary-btn:focus-visible {
  background: var(--nb-paper-raised);
  border-color: var(--nb-blue);
  color: var(--nb-blue);
}

html.theme-light .bm-footer-link,
html:not(.theme-light) .bm-footer-link {
  color: var(--nb-blue);
}

html.theme-light .bm-footer-link:hover,
html.theme-light .bm-footer-link:focus-visible,
html:not(.theme-light) .bm-footer-link:hover,
html:not(.theme-light) .bm-footer-link:focus-visible {
  color: var(--nb-blue-strong);
}

@media (max-width: 800px) {
  html.theme-light .acct-hub-col + .acct-hub-col,
  html:not(.theme-light) .acct-hub-col + .acct-hub-col {
    border-top-color: var(--nb-border);
  }
}

/* Logged-out account gateway */
html.theme-light .acg-pill,
html:not(.theme-light) .acg-pill {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  color: var(--nb-ink-2);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light .acg-pill-dot,
html.theme-light .acg-benefit-dot,
html:not(.theme-light) .acg-pill-dot,
html:not(.theme-light) .acg-benefit-dot {
  background: var(--nb-blue);
  box-shadow: none;
}

html.theme-light .acg-heading,
html.theme-light .acg-card-title,
html.theme-light .acg-benefit-text strong,
html:not(.theme-light) .acg-heading,
html:not(.theme-light) .acg-card-title,
html:not(.theme-light) .acg-benefit-text strong {
  color: var(--nb-ink);
}

html.theme-light .acg-body,
html.theme-light .acg-card-body,
html.theme-light .acg-benefit-text span,
html:not(.theme-light) .acg-body,
html:not(.theme-light) .acg-card-body,
html:not(.theme-light) .acg-benefit-text span {
  color: var(--nb-ink-2);
}

html.theme-light .acg-benefit,
html.theme-light .acg-card,
html:not(.theme-light) .acg-benefit,
html:not(.theme-light) .acg-card {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light .acg-benefit::before,
html.theme-light .acg-card::before,
html:not(.theme-light) .acg-benefit::before,
html:not(.theme-light) .acg-card::before {
  background: var(--nb-border-strong);
}

html.theme-light .acg-card-eyebrow,
html:not(.theme-light) .acg-card-eyebrow {
  color: var(--nb-blue);
}

html.theme-light a.acg-btn-primary,
html.theme-light a.acg-btn-primary:link,
html.theme-light a.acg-btn-primary:visited,
html:not(.theme-light) a.acg-btn-primary,
html:not(.theme-light) a.acg-btn-primary:link,
html:not(.theme-light) a.acg-btn-primary:visited {
  background: var(--nb-blue);
  border-color: var(--nb-blue);
  color: var(--nb-on-blue);
  box-shadow: none;
}

html.theme-light a.acg-btn-primary:hover,
html.theme-light a.acg-btn-primary:focus-visible,
html:not(.theme-light) a.acg-btn-primary:hover,
html:not(.theme-light) a.acg-btn-primary:focus-visible {
  background: var(--nb-blue-strong);
  border-color: var(--nb-blue-strong);
  color: var(--nb-on-blue);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light a.acg-btn-secondary,
html.theme-light a.acg-btn-secondary:link,
html.theme-light a.acg-btn-secondary:visited {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  color: var(--nb-ink);
  box-shadow: none;
}
html:not(.theme-light) a.acg-btn-secondary,
html:not(.theme-light) a.acg-btn-secondary:link,
html:not(.theme-light) a.acg-btn-secondary:visited {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink);
  box-shadow: none;
}

html.theme-light a.acg-btn-secondary:hover,
html.theme-light a.acg-btn-secondary:focus-visible,
html:not(.theme-light) a.acg-btn-secondary:hover,
html:not(.theme-light) a.acg-btn-secondary:focus-visible {
  background: var(--nb-blue-wash);
  border-color: var(--nb-blue);
  color: var(--nb-blue);
}

html.theme-light .acg-forgot,
html:not(.theme-light) .acg-forgot {
  color: var(--nb-blue);
}

html.theme-light .acg-forgot:hover,
html.theme-light .acg-forgot:focus-visible,
html:not(.theme-light) .acg-forgot:hover,
html:not(.theme-light) .acg-forgot:focus-visible {
  color: var(--nb-blue-strong);
}

html.theme-light a.acg-btn-primary:focus-visible,
html.theme-light a.acg-btn-secondary:focus-visible,
html.theme-light .acg-forgot:focus-visible,
html:not(.theme-light) a.acg-btn-primary:focus-visible,
html:not(.theme-light) a.acg-btn-secondary:focus-visible,
html:not(.theme-light) .acg-forgot:focus-visible {
  outline-color: var(--nb-blue);
}

/* Profile editor */
html.theme-light .pv-page,
html:not(.theme-light) .pv-page {
  background: transparent;
}

html.theme-light .pv-title,
html.theme-light .pv-name,
html.theme-light .pv-section-title,
html.theme-light .pv-side-title,
html.theme-light .pv-subject-name,
html.theme-light .pv-toggle-label,
html:not(.theme-light) .pv-title,
html:not(.theme-light) .pv-name,
html:not(.theme-light) .pv-section-title,
html:not(.theme-light) .pv-side-title,
html:not(.theme-light) .pv-subject-name,
html:not(.theme-light) .pv-toggle-label {
  color: var(--nb-ink);
}

html.theme-light .pv-subtitle,
html.theme-light .pv-email,
html.theme-light .pv-card-sub,
html.theme-light .pv-hint,
html.theme-light .pv-side-empty,
html.theme-light .pv-setup-item,
html:not(.theme-light) .pv-subtitle,
html:not(.theme-light) .pv-email,
html:not(.theme-light) .pv-card-sub,
html:not(.theme-light) .pv-hint,
html:not(.theme-light) .pv-side-empty,
html:not(.theme-light) .pv-setup-item {
  color: var(--nb-ink-2);
}

html.theme-light .pv-card,
html.theme-light .pv-side-card,
html.theme-light .pv-lb-pop,
html.theme-light .pv-toast,
html:not(.theme-light) .pv-card,
html:not(.theme-light) .pv-side-card,
html:not(.theme-light) .pv-lb-pop,
html:not(.theme-light) .pv-toast {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .pv-card::after,
html:not(.theme-light) .pv-card::after {
  background: var(--nb-border-strong);
}

html.theme-light .pv-top,
html.theme-light .pv-foot,
html:not(.theme-light) .pv-top,
html:not(.theme-light) .pv-foot {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
}

html.theme-light .pv-grid,
html.theme-light .pv-col + .pv-col,
html.theme-light .pv-prefs,
html.theme-light .pv-track-row,
html:not(.theme-light) .pv-grid,
html:not(.theme-light) .pv-col + .pv-col,
html:not(.theme-light) .pv-prefs,
html:not(.theme-light) .pv-track-row {
  border-color: var(--nb-border);
}

html.theme-light .pv-token,
html.theme-light .pv-avatar,
html.theme-light .pv-section-icon,
html.theme-light .pv-chip,
html.theme-light .pv-side-count,
html.theme-light .pv-mini-badge,
html:not(.theme-light) .pv-token,
html:not(.theme-light) .pv-avatar,
html:not(.theme-light) .pv-section-icon,
html:not(.theme-light) .pv-chip,
html:not(.theme-light) .pv-side-count,
html:not(.theme-light) .pv-mini-badge {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  color: var(--nb-blue);
  box-shadow: none;
}

html.theme-light .pv-chip-dot,
html.theme-light .pv-chip-dot--teal,
html.theme-light .pv-track-dot,
html.theme-light .pv-subject-dot,
html:not(.theme-light) .pv-chip-dot,
html:not(.theme-light) .pv-chip-dot--teal,
html:not(.theme-light) .pv-track-dot,
html:not(.theme-light) .pv-subject-dot {
  background: var(--nb-blue);
}

html.theme-light .pv-chip-dot--green,
html:not(.theme-light) .pv-chip-dot--green {
  background: var(--nb-success);
}

html.theme-light .pv-field > label,
html.theme-light .pv-track-subject,
html.theme-light .pv-track-glabel,
html:not(.theme-light) .pv-field > label,
html:not(.theme-light) .pv-track-subject,
html:not(.theme-light) .pv-track-glabel {
  color: var(--nb-ink);
}

html.theme-light .pv-field input,
html.theme-light .pv-field select,
html.theme-light .pv-select--sm select,
html.theme-light .pv-lb-btn,
html.theme-light .pv-lb-search {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  color: var(--nb-ink);
}

html:not(.theme-light) .pv-field input,
html:not(.theme-light) .pv-field select,
html:not(.theme-light) .pv-select--sm select,
html:not(.theme-light) .pv-lb-btn,
html:not(.theme-light) .pv-lb-search {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink);
}

html.theme-light .pv-field input:hover,
html.theme-light .pv-field select:hover,
html.theme-light .pv-select--sm select:hover,
html.theme-light .pv-lb-btn:hover {
  border-color: var(--nb-control-border);
}

html:not(.theme-light) .pv-field input:hover,
html:not(.theme-light) .pv-field select:hover,
html:not(.theme-light) .pv-select--sm select:hover,
html:not(.theme-light) .pv-lb-btn:hover {
  border-color: var(--nb-border-strong);
}

html.theme-light .pv-field input:focus,
html.theme-light .pv-field select:focus,
html.theme-light .pv-select--sm select:focus,
html.theme-light .pv-lb-btn:focus-visible,
html.theme-light .pv-lb-btn[aria-expanded="true"],
html.theme-light .pv-lb-search:focus,
html:not(.theme-light) .pv-field input:focus,
html:not(.theme-light) .pv-field select:focus,
html:not(.theme-light) .pv-select--sm select:focus,
html:not(.theme-light) .pv-lb-btn:focus-visible,
html:not(.theme-light) .pv-lb-btn[aria-expanded="true"],
html:not(.theme-light) .pv-lb-search:focus {
  background: var(--nb-paper-raised);
  border-color: var(--nb-blue);
  box-shadow: 0 0 0 3px var(--nb-blue-wash);
}

html.theme-light .pv-select::after,
html.theme-light .pv-lb-chev,
html:not(.theme-light) .pv-select::after,
html:not(.theme-light) .pv-lb-chev {
  border-color: var(--nb-ink-2);
}

html.theme-light .pv-error,
html.theme-light .pv-verified--no,
html.theme-light .pv-track-gap--gap,
html.theme-light .pv-track-remove:hover,
html:not(.theme-light) .pv-error,
html:not(.theme-light) .pv-verified--no,
html:not(.theme-light) .pv-track-gap--gap,
html:not(.theme-light) .pv-track-remove:hover {
  color: var(--nb-error);
}

html.theme-light .pv-verified--no,
html.theme-light .pv-track-gap--gap,
html:not(.theme-light) .pv-verified--no,
html:not(.theme-light) .pv-track-gap--gap {
  background: color-mix(in srgb, var(--nb-error) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-error) 30%, transparent);
}

html.theme-light .pv-verified,
html.theme-light .pv-toast-icon,
html.theme-light .pv-check,
html.theme-light .pv-track-gap--ahead,
html.theme-light .pv-track-gap--met,
html:not(.theme-light) .pv-verified,
html:not(.theme-light) .pv-toast-icon,
html:not(.theme-light) .pv-check,
html:not(.theme-light) .pv-track-gap--ahead,
html:not(.theme-light) .pv-track-gap--met {
  background: color-mix(in srgb, var(--nb-success) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-success) 28%, transparent);
  color: var(--nb-success);
}

html.theme-light .pv-tracker-empty,
html:not(.theme-light) .pv-tracker-empty {
  border-color: var(--nb-border-strong);
  color: var(--nb-ink-2);
}

html.theme-light .pv-add-plus,
html.theme-light .pv-add-select,
html:not(.theme-light) .pv-add-plus,
html:not(.theme-light) .pv-add-select {
  color: var(--nb-blue);
}

html.theme-light .pv-add-select,
html:not(.theme-light) .pv-add-select {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  box-shadow: none;
}

html.theme-light .pv-add-select:not(:disabled) {
  border-color: var(--nb-control-border);
}

html.theme-light .pv-add-select:hover:not(:disabled),
html:not(.theme-light) .pv-add-select:hover:not(:disabled) {
  border-color: var(--nb-blue);
}

html.theme-light .pv-switch-track,
html:not(.theme-light) .pv-switch-track {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border-strong);
}

html.theme-light .pv-switch-track::after,
html:not(.theme-light) .pv-switch-track::after {
  background: var(--nb-paper-raised);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light .pv-switch:has(input:checked) .pv-switch-track,
html:not(.theme-light) .pv-switch:has(input:checked) .pv-switch-track {
  background: var(--nb-blue);
  border-color: var(--nb-blue);
}

html.theme-light .pv-switch:has(input:focus-visible) .pv-switch-track,
html.theme-light .pv-track-remove:focus-visible,
html.theme-light .pv-add-select:focus-visible,
html.theme-light .pv-back:focus-visible,
html.theme-light .pv-save:focus-visible,
html.theme-light .pv-toast-x:focus-visible,
html:not(.theme-light) .pv-switch:has(input:focus-visible) .pv-switch-track,
html:not(.theme-light) .pv-track-remove:focus-visible,
html:not(.theme-light) .pv-add-select:focus-visible,
html:not(.theme-light) .pv-back:focus-visible,
html:not(.theme-light) .pv-save:focus-visible,
html:not(.theme-light) .pv-toast-x:focus-visible {
  outline-color: var(--nb-blue);
}

html.theme-light .pv-back,
html:not(.theme-light) .pv-back {
  color: var(--nb-blue);
}

html.theme-light .pv-back:hover,
html.theme-light .pv-back:focus-visible,
html:not(.theme-light) .pv-back:hover,
html:not(.theme-light) .pv-back:focus-visible {
  color: var(--nb-blue-strong);
}

html.theme-light .pv-save,
html:not(.theme-light) .pv-save {
  background: var(--nb-blue);
  border-color: var(--nb-blue);
  color: var(--nb-on-blue);
  box-shadow: none;
}

html.theme-light .pv-save:hover,
html.theme-light .pv-save:focus-visible,
html:not(.theme-light) .pv-save:hover,
html:not(.theme-light) .pv-save:focus-visible {
  background: var(--nb-blue-strong);
  border-color: var(--nb-blue-strong);
  color: var(--nb-on-blue);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light .pv-save.is-loading .pv-save-spinner,
html:not(.theme-light) .pv-save.is-loading .pv-save-spinner {
  border-color: color-mix(in srgb, var(--nb-on-blue) 45%, transparent);
  border-top-color: var(--nb-on-blue);
}

html.theme-light .pv-lb-opt,
html:not(.theme-light) .pv-lb-opt {
  color: var(--nb-ink);
}

html.theme-light .pv-lb-opt:hover,
html:not(.theme-light) .pv-lb-opt:hover {
  background: var(--nb-paper-sunken);
}

html.theme-light .pv-lb-opt[aria-selected="true"],
html:not(.theme-light) .pv-lb-opt[aria-selected="true"],
html.theme-light .pv-lb-opt.is-active,
html:not(.theme-light) .pv-lb-opt.is-active {
  background: var(--nb-blue-wash);
  color: var(--nb-blue);
}

html.theme-light .pv-lb-empty,
html.theme-light .pv-toast-x,
html.theme-light .pv-cd-unit,
html.theme-light .pv-cd-date,
html:not(.theme-light) .pv-lb-empty,
html:not(.theme-light) .pv-toast-x,
html:not(.theme-light) .pv-cd-unit,
html:not(.theme-light) .pv-cd-date {
  color: var(--nb-ink-2);
}

html.theme-light .pv-toast-x:hover,
html.theme-light .pv-toast-x:focus-visible,
html:not(.theme-light) .pv-toast-x:hover,
html:not(.theme-light) .pv-toast-x:focus-visible {
  background: var(--nb-paper-sunken);
  color: var(--nb-ink);
}

html.theme-light .pv-side-card--exam,
html:not(.theme-light) .pv-side-card--exam {
  background: var(--nb-paper-raised);
}

html.theme-light .pv-cd-n,
html.theme-light .pv-cd-word,
html:not(.theme-light) .pv-cd-n,
html:not(.theme-light) .pv-cd-word {
  color: var(--nb-blue);
}

html.theme-light .pv-cd-word--past,
html:not(.theme-light) .pv-cd-word--past {
  color: var(--nb-ink-3);
}

/* Billing success/cancel */
html.theme-light .bc-card,
html:not(.theme-light) .bc-card {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-2);
  color: var(--nb-ink);
}

html.theme-light .bc-title,
html:not(.theme-light) .bc-title {
  color: var(--nb-ink);
}

html.theme-light .bc-body,
html:not(.theme-light) .bc-body {
  color: var(--nb-ink-2);
}

html.theme-light .bc-note,
html:not(.theme-light) .bc-note {
  color: var(--nb-ink-2);
}

html.theme-light .bc-note-link,
html:not(.theme-light) .bc-note-link {
  color: var(--nb-blue);
}

html.theme-light .bc-note-link:hover,
html.theme-light .bc-note-link:focus-visible,
html:not(.theme-light) .bc-note-link:hover,
html:not(.theme-light) .bc-note-link:focus-visible {
  color: var(--nb-blue-strong);
}

html.theme-light .bc-icon--success,
html:not(.theme-light) .bc-icon--success {
  background: color-mix(in srgb, var(--nb-success) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-success) 28%, transparent);
  color: var(--nb-success);
}

html.theme-light .bc-icon--cancel,
html:not(.theme-light) .bc-icon--cancel {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink-3);
}

html.theme-light .bc-btn--secondary {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  color: var(--nb-ink);
}
html:not(.theme-light) .bc-btn--secondary {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  color: var(--nb-ink);
}

html.theme-light .bc-btn--secondary:hover,
html.theme-light .bc-btn--secondary:focus-visible,
html:not(.theme-light) .bc-btn--secondary:hover,
html:not(.theme-light) .bc-btn--secondary:focus-visible {
  background: var(--nb-blue-wash);
  border-color: var(--nb-blue);
  color: var(--nb-blue);
}

html.theme-light .bc-btn:focus-visible,
html:not(.theme-light) .bc-btn:focus-visible {
  outline-color: var(--nb-blue);
}

/* Auth chain and shared auth form internals */
html.theme-light .auth-page,
html.theme-light .pwd-page,
html.theme-light .status-page,
html:not(.theme-light) .auth-page,
html:not(.theme-light) .pwd-page,
html:not(.theme-light) .status-page {
  --text: var(--nb-ink);
  --text-muted: var(--nb-ink-2);
  --muted: var(--nb-ink-2);
  --faint: var(--nb-ink-3);
  --placeholder: var(--nb-ink-2);
  --surface: var(--nb-paper-raised);
  --surface-soft: var(--nb-paper-sunken);
  --surface-elevated: var(--nb-paper-raised);
  --bg: var(--nb-paper);
  --bg-elevated: var(--nb-paper-raised);
  --bg-3: var(--nb-paper-sunken);
  --border: var(--nb-border);
  --border-2: var(--nb-border-strong);
  --border-control: var(--nb-control-border);
  --border-focus: var(--nb-blue);
  --focus-ring: var(--nb-blue);
  --accent: var(--nb-blue);
  --accent-2: var(--nb-blue);
  --accent-soft: var(--nb-blue-wash);
  --accent-border: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  --text-link: var(--nb-blue);
  --text-link-hover: var(--nb-blue-strong);
  --success: var(--nb-success);
  --success-subtle-bg: color-mix(in srgb, var(--nb-success) 12%, transparent);
  --success-border: color-mix(in srgb, var(--nb-success) 28%, transparent);
  --danger: var(--nb-error);
  --danger-subtle-bg: color-mix(in srgb, var(--nb-error) 12%, transparent);
  --danger-border: color-mix(in srgb, var(--nb-error) 30%, transparent);
  --shadow-sm: var(--nb-shadow-1);
  --shadow-md: var(--nb-shadow-2);
  --shadow-lg: var(--nb-shadow-3);
  color: var(--nb-ink);
}

html.theme-light .auth-page,
html.theme-light .pwd-page,
html.theme-light .status-page,
html:not(.theme-light) .auth-page,
html:not(.theme-light) .pwd-page,
html:not(.theme-light) .status-page {
  background: transparent;
}

html.theme-light .auth-page--login::before,
html.theme-light .auth-page--signup::before,
html.theme-light .pwd-page::before,
html:not(.theme-light) .auth-page--login::before,
html:not(.theme-light) .auth-page--signup::before,
html:not(.theme-light) .pwd-page::before {
  display: none;
}

html.theme-light .auth-card,
html.theme-light .pwd-form-panel,
html.theme-light .status-card,
html:not(.theme-light) .auth-card,
html:not(.theme-light) .pwd-form-panel,
html:not(.theme-light) .status-card {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  border-top-color: var(--nb-border);
  box-shadow: var(--nb-shadow-2);
  color: var(--nb-ink);
}

html.theme-light .auth-context-panel,
html:not(.theme-light) .auth-context-panel {
  color: var(--nb-ink);
}

html.theme-light .auth-context-eyebrow,
html.theme-light .pwd-eyebrow,
html:not(.theme-light) .auth-context-eyebrow,
html:not(.theme-light) .pwd-eyebrow {
  color: var(--nb-blue);
}

html.theme-light .auth-context-eyebrow::before,
html:not(.theme-light) .auth-context-eyebrow::before {
  background: var(--nb-blue);
}

html.theme-light .auth-title,
html.theme-light .auth-context-title,
html.theme-light .pwd-title,
html.theme-light .status-title,
html:not(.theme-light) .auth-title,
html:not(.theme-light) .auth-context-title,
html:not(.theme-light) .pwd-title,
html:not(.theme-light) .status-title {
  background: none;
  color: var(--nb-ink);
  text-shadow: none;
  -webkit-text-fill-color: currentColor;
}

html.theme-light .auth-subtitle,
html.theme-light .auth-context-sub,
html.theme-light .pwd-subtitle,
html.theme-light .pwd-done-body,
html.theme-light .status-body,
html.theme-light .status-body--sm,
html:not(.theme-light) .auth-subtitle,
html:not(.theme-light) .auth-context-sub,
html:not(.theme-light) .pwd-subtitle,
html:not(.theme-light) .pwd-done-body,
html:not(.theme-light) .status-body,
html:not(.theme-light) .status-body--sm {
  color: var(--nb-ink-2);
}

html.theme-light .auth-context-list li,
html:not(.theme-light) .auth-context-list li {
  color: var(--nb-ink);
}

html.theme-light .auth-context-dot,
html:not(.theme-light) .auth-context-dot {
  background: var(--nb-blue);
  box-shadow: none;
}

html.theme-light .google-btn {
  background: var(--nb-paper-raised);
  border-color: var(--nb-control-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}
html:not(.theme-light) .google-btn {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .google-btn:hover,
html.theme-light .google-btn:focus-visible {
  background: var(--nb-blue-wash);
  border-color: var(--nb-blue);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html:not(.theme-light) .google-btn:hover,
html:not(.theme-light) .google-btn:focus-visible {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .google-btn:focus-visible,
html:not(.theme-light) .google-btn:focus-visible {
  outline: 2px solid var(--nb-blue);
  outline-offset: 3px;
}

html.theme-light .auth-divider::before,
html.theme-light .auth-divider::after,
html:not(.theme-light) .auth-divider::before,
html:not(.theme-light) .auth-divider::after {
  background: var(--nb-border);
}

html.theme-light .auth-divider span,
html:not(.theme-light) .auth-divider span {
  color: var(--nb-ink-2);
}

html.theme-light .auth-field label,
html:not(.theme-light) .auth-field label {
  color: var(--nb-ink);
}

html.theme-light .auth-field input,
html.theme-light .auth-field select {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html:not(.theme-light) .auth-field input,
html:not(.theme-light) .auth-field select {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .auth-field input::placeholder,
html:not(.theme-light) .auth-field input::placeholder {
  color: var(--nb-ink-2);
  opacity: 1;
}

html.theme-light .auth-field input:hover,
html.theme-light .auth-field select:hover {
  border-color: var(--nb-control-border);
}

html:not(.theme-light) .auth-field input:hover,
html:not(.theme-light) .auth-field select:hover {
  border-color: var(--nb-border-strong);
}

html.theme-light .auth-field input:focus,
html.theme-light .auth-field select:focus,
html:not(.theme-light) .auth-field input:focus,
html:not(.theme-light) .auth-field select:focus {
  background: var(--nb-paper-raised);
  border-color: var(--nb-blue);
  box-shadow: 0 0 0 3px var(--nb-blue-wash);
  outline: none;
}

html.theme-light .auth-page .auth-card .auth-field input:not(:focus),
html.theme-light .auth-page .auth-card .auth-field select:not(:focus) {
  background: var(--nb-paper-sunken);
  border-color: var(--nb-control-border);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-ink);
}

html.theme-light .auth-page .auth-card .auth-field input:focus,
html.theme-light .auth-page .auth-card .auth-field select:focus {
  background: var(--nb-paper-raised);
  border-color: var(--nb-blue);
  box-shadow: 0 0 0 3px var(--nb-blue-wash);
  outline: none;
}

html.theme-light .auth-field input:-webkit-autofill,
html.theme-light .auth-field input:-webkit-autofill:hover,
html.theme-light .auth-field input:-webkit-autofill:focus,
html.theme-light .auth-field input:-webkit-autofill:active,
html:not(.theme-light) .auth-field input:-webkit-autofill,
html:not(.theme-light) .auth-field input:-webkit-autofill:hover,
html:not(.theme-light) .auth-field input:-webkit-autofill:focus,
html:not(.theme-light) .auth-field input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--nb-paper-sunken) inset;
  -webkit-text-fill-color: var(--nb-ink);
  caret-color: var(--nb-ink);
}

html.theme-light .auth-field select option,
html:not(.theme-light) .auth-field select option {
  background: var(--nb-paper-raised);
  color: var(--nb-ink);
}

html.theme-light .auth-field-hint,
html.theme-light .date-label,
html:not(.theme-light) .auth-field-hint,
html:not(.theme-light) .date-label {
  color: var(--nb-ink-2);
}

html.theme-light .auth-page--login .auth-btn,
html.theme-light .auth-page--signup .auth-btn,
html.theme-light .pwd-form-panel .auth-btn,
html.theme-light .auth-btn,
html.theme-light .status-btn,
html:not(.theme-light) .auth-btn,
html:not(.theme-light) .status-btn {
  background: var(--nb-blue);
  border-color: var(--nb-blue);
  box-shadow: none;
  color: var(--nb-on-blue);
  text-shadow: none;
}

html.theme-light .auth-page--login .auth-btn:hover,
html.theme-light .auth-page--login .auth-btn:focus-visible,
html.theme-light .auth-page--signup .auth-btn:hover,
html.theme-light .auth-page--signup .auth-btn:focus-visible,
html.theme-light .pwd-form-panel .auth-btn:hover,
html.theme-light .pwd-form-panel .auth-btn:focus-visible,
html.theme-light .auth-btn:hover,
html.theme-light .auth-btn:focus-visible,
html.theme-light .status-btn:hover,
html.theme-light .status-btn:focus-visible,
html:not(.theme-light) .auth-btn:hover,
html:not(.theme-light) .auth-btn:focus-visible,
html:not(.theme-light) .status-btn:hover,
html:not(.theme-light) .status-btn:focus-visible {
  background: var(--nb-blue-strong);
  border-color: var(--nb-blue-strong);
  box-shadow: var(--nb-shadow-1);
  color: var(--nb-on-blue);
}

html.theme-light .auth-btn:focus-visible,
html.theme-light .status-btn:focus-visible,
html:not(.theme-light) .auth-btn:focus-visible,
html:not(.theme-light) .status-btn:focus-visible {
  outline: 2px solid var(--nb-blue);
  outline-offset: 3px;
}

html.theme-light .auth-links,
html.theme-light .auth-links span,
html.theme-light .pwd-footer-links,
html.theme-light .pwd-footer-sep,
html:not(.theme-light) .auth-links,
html:not(.theme-light) .auth-links span,
html:not(.theme-light) .pwd-footer-links,
html:not(.theme-light) .pwd-footer-sep {
  border-color: var(--nb-border);
  color: var(--nb-ink-2);
}

html.theme-light .auth-links a,
html.theme-light .pwd-footer-link,
html.theme-light .status-body--sm a,
html:not(.theme-light) .auth-links a,
html:not(.theme-light) .pwd-footer-link,
html:not(.theme-light) .status-body--sm a {
  color: var(--nb-blue);
  text-shadow: none;
}

html.theme-light .auth-links a:hover,
html.theme-light .auth-links a:focus-visible,
html.theme-light .pwd-footer-link:hover,
html.theme-light .pwd-footer-link:focus-visible,
html.theme-light .status-body--sm a:hover,
html.theme-light .status-body--sm a:focus-visible,
html:not(.theme-light) .auth-links a:hover,
html:not(.theme-light) .auth-links a:focus-visible,
html:not(.theme-light) .pwd-footer-link:hover,
html:not(.theme-light) .pwd-footer-link:focus-visible,
html:not(.theme-light) .status-body--sm a:hover,
html:not(.theme-light) .status-body--sm a:focus-visible {
  color: var(--nb-blue-strong);
  text-decoration-color: currentColor;
  text-shadow: none;
}

html.theme-light .auth-links a:focus-visible,
html.theme-light .pwd-footer-link:focus-visible,
html.theme-light .status-body--sm a:focus-visible,
html:not(.theme-light) .auth-links a:focus-visible,
html:not(.theme-light) .pwd-footer-link:focus-visible,
html:not(.theme-light) .status-body--sm a:focus-visible {
  border-radius: var(--nb-r-sm);
  outline: 2px solid var(--nb-blue);
  outline-offset: 3px;
  box-shadow: none;
}

html.theme-light .auth-error,
html.theme-light .pwd-form-error,
html.theme-light .auth-change-msg--error,
html.theme-light .auth-change-msg--warning,
html:not(.theme-light) .auth-error,
html:not(.theme-light) .pwd-form-error,
html:not(.theme-light) .auth-change-msg--error,
html:not(.theme-light) .auth-change-msg--warning {
  color: var(--nb-error);
}

html.theme-light .auth-error--block,
html.theme-light .pwd-form-error,
html.theme-light .auth-change-msg--error,
html.theme-light .auth-change-msg--warning,
html:not(.theme-light) .auth-error--block,
html:not(.theme-light) .pwd-form-error,
html:not(.theme-light) .auth-change-msg--error,
html:not(.theme-light) .auth-change-msg--warning {
  background: color-mix(in srgb, var(--nb-error) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-error) 30%, transparent);
}

html.theme-light .auth-change-msg--success,
html:not(.theme-light) .auth-change-msg--success {
  background: color-mix(in srgb, var(--nb-success) 12%, transparent);
  border-color: color-mix(in srgb, var(--nb-success) 28%, transparent);
  color: var(--nb-success);
}

html.theme-light .auth-change-msg--info,
html:not(.theme-light) .auth-change-msg--info {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  color: var(--nb-ink-2);
}

html.theme-light .pwd-done-icon,
html.theme-light .status-icon,
html:not(.theme-light) .pwd-done-icon,
html:not(.theme-light) .status-icon {
  background: var(--nb-blue-wash);
  border-color: color-mix(in srgb, var(--nb-blue) 30%, transparent);
  box-shadow: none;
  color: var(--nb-blue);
}

/* ============================================================
   GROUP C - errors + legal (404, 500, privacy, terms).
   Page bg drops the banned gold radial glow for notebook paper +
   dotted grid; card/text/links re-point to nb tokens. Buttons
   (.auth-btn) and .pwd-footer-link already skinned above.
   ============================================================ */
html.theme-light .error-page,
html.theme-light .legal-page,
html:not(.theme-light) .error-page,
html:not(.theme-light) .legal-page {
  background-color: var(--nb-paper);
  background-image: radial-gradient(var(--nb-grid-dot) 1px, transparent 1px);
  background-size: var(--nb-grid-size) var(--nb-grid-size);
  color: var(--nb-ink);
}

html.theme-light .error-card,
html.theme-light .legal-card,
html:not(.theme-light) .error-card,
html:not(.theme-light) .legal-card {
  background: var(--nb-paper-raised);
  border-color: var(--nb-border);
  box-shadow: var(--nb-shadow-1);
}

html.theme-light .error-eyebrow,
html.theme-light .legal-eyebrow,
html:not(.theme-light) .error-eyebrow,
html:not(.theme-light) .legal-eyebrow {
  color: var(--nb-blue);
}

html.theme-light .error-title,
html.theme-light .legal-title,
html.theme-light .legal-section h2,
html:not(.theme-light) .error-title,
html:not(.theme-light) .legal-title,
html:not(.theme-light) .legal-section h2 {
  color: var(--nb-ink);
}

html.theme-light .error-lede,
html.theme-light .legal-lede,
html.theme-light .legal-section p,
html:not(.theme-light) .error-lede,
html:not(.theme-light) .legal-lede,
html:not(.theme-light) .legal-section p {
  color: var(--nb-ink-2);
}

html.theme-light .legal-section + .legal-section,
html:not(.theme-light) .legal-section + .legal-section {
  border-top-color: var(--nb-border);
}

html.theme-light .legal-section a,
html:not(.theme-light) .legal-section a {
  color: var(--nb-blue);
}

html.theme-light .legal-section a:hover,
html.theme-light .legal-section a:focus-visible,
html:not(.theme-light) .legal-section a:hover,
html:not(.theme-light) .legal-section a:focus-visible {
  color: var(--nb-blue-strong);
}