/* Dark application finish. Only screen chrome is styled here: feature layouts,
   document paper and model/chart colors retain their own contracts. */
@media screen {
  html[data-scheme="dark"] body {
    background-color: var(--wf-page);
  }
  html[data-scheme="dark"] body :is(.ac-side, .bk-sidebar) {
    background: linear-gradient(180deg, var(--wf-ink-2), var(--wf-ink) 220px);
    border-right-color: var(--wf-line-soft);
    box-shadow: 1px 0 0 rgba(0, 0, 0, .25);
  }
  html[data-scheme="dark"] body :is(.ac-top, .bk-topbar, .site-nav) {
    background: var(--wf-header);
    border-color: var(--wf-line-soft);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .3);
  }
  html[data-scheme="dark"] body .ac-top .av-owner {
    box-shadow: 0 0 0 2px var(--wf-card), 0 0 0 3px var(--wf-brand);
  }
  html[data-scheme="dark"] body .ac-logo {
    background: var(--wf-action-gradient);
    border: 1px solid var(--wf-edge);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 4px 16px var(--wf-glow-soft);
  }
  html[data-scheme="dark"] body .ac-nav.is-active {
    color: var(--wf-on-ink);
    border-color: var(--wf-edge);
    background: linear-gradient(105deg, var(--wf-brand-soft), var(--wf-ink-2));
    box-shadow: inset 0 1px 0 var(--wf-ink-soft);
  }
  html[data-scheme="dark"] body .ac-nav.is-active::before {
    background: var(--wf-brand);
  }
  html[data-scheme="dark"] body .owner-pill {
    color: var(--wf-on-accent);
  }
  html[data-scheme="dark"] body .ac-side-foot {
    background: var(--wf-ink);
    border-color: var(--wf-line-soft);
  }
  html[data-scheme="dark"] body :is(.ac-main, .account-main) {
    background: radial-gradient(ellipse 80% 440px at 70% 0%, var(--wf-glow-soft), transparent), var(--wf-page);
  }

  /* A fine top edge separates each working surface from the canvas. */
  html[data-scheme="dark"] body :is(.account-card, .overview-preview-card, .p2-card, .cv-card, .cv-create, .cv-form-section, .learning-panel, .learning-card, .pv-navigation, .pv-canvas, .pv-feature, .cc-card, .fc-card, .fc-work, .fr-request-card, .fr-friend-card, .fr-outgoing-card, .stat) {
    background: linear-gradient(155deg, color-mix(in srgb, var(--wf-elevated) 45%, var(--wf-card)), var(--wf-card) 55%);
    border-color: var(--wf-line);
    box-shadow: var(--wf-shadow-sm);
  }
  html[data-scheme="dark"] body :is(a.account-card, a.pv-feature, .overview-preview-card:has(> a)) {
    transition: border-color .16s ease, box-shadow .16s ease;
  }
  html[data-scheme="dark"] body :is(.account-card-icon, .stat .ic) {
    border: 1px solid var(--wf-edge);
    background: var(--wf-brand-soft);
    color: var(--wf-brand);
  }
  html[data-scheme="dark"] body :is(.account-hero, .profile-vault-hero, .accounting-vault-hero, .accounting-hub-hero, .pv-hero, .cv-manager-hero, .cv-editor-head, .learning-hero, .fr-hero) {
    border-color: var(--wf-edge);
    background-color: var(--wf-ink-2);
    background-image:
      radial-gradient(ellipse at 90% 0%, var(--wf-glow), transparent 62%),
      linear-gradient(var(--wf-ink-soft) 1px, transparent 1px),
      linear-gradient(90deg, var(--wf-ink-soft) 1px, transparent 1px),
      linear-gradient(115deg, var(--wf-ink-2), var(--wf-ink));
    background-size: auto, 64px 64px, 64px 64px, auto;
    box-shadow: inset 0 1px 0 var(--wf-ink-line), var(--wf-shadow-sm);
  }
  html[data-scheme="dark"] body :is(.account-avatar, .profile-vault-avatar, .pv-seal) {
    background: var(--wf-surface-gradient);
    border-color: var(--wf-edge);
    box-shadow: inset 0 1px 0 var(--wf-ink-line);
  }

  /* Primary actions use saturated paint; links and destructive actions keep
     their separate semantic colors. No blanket button or document override. */
  html[data-design][data-scheme="dark"] body :is(.account-primary, .cv-primary, .learning-action, .learning-button, .cc-pri, .btn-pri, .fr-primary, .company-card .btn) {
    background: var(--wf-action-gradient);
    color: var(--wf-on-action);
    border-color: color-mix(in srgb, var(--wf-action-end) 75%, var(--wf-brand));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13), 0 3px 12px var(--wf-glow-soft);
    filter: none;
    transform: none;
  }
  html[data-design][data-scheme="dark"] body :is(.account-primary, .cv-primary, .learning-action, .learning-button, .cc-pri, .btn-pri, .fr-primary, .company-card .btn):hover {
    background: var(--wf-action-end);
    color: var(--wf-on-action);
    border-color: var(--wf-brand);
    filter: none;
  }
  html[data-design][data-scheme="dark"] body :is(.account-primary, .cv-primary, .learning-action, .learning-button, .cc-pri, .btn-pri, .fr-primary, .company-card .btn):disabled {
    opacity: .5;
    box-shadow: none;
    cursor: not-allowed;
  }
  html[data-design][data-scheme="dark"] body.account-site :is(.cv-public-control, .cv-editor-savebar) .cv-primary {
    background: var(--wf-accent);
    border-color: var(--wf-accent);
    color: var(--wf-on-accent);
    box-shadow: none;
  }
  html[data-scheme="dark"] body :is(.account-secondary, .cv-secondary, .cv-add, .pv-button, .cc-sec, .btn-ghost, .fr-btn:not(.fr-primary)) {
    background: var(--wf-card);
    border-color: var(--wf-line);
    color: var(--wf-muted-strong);
    box-shadow: inset 0 1px 0 var(--wf-ink-soft);
  }
  html[data-scheme="dark"] body :is(.account-form, .finance-form, .finance-edit-form, .details-fields, .business-share, .business-create-form, .company-card, .cv-create, .cv-fields, .cv-full-label, .fc-field, .cc-link-fields, .learning-note-form, .learning-free-text, .personal-edoc-lock, .personal-edoc-invite) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select, textarea) {
    background: var(--wf-input);
    border-color: var(--wf-line);
    color: var(--wf-text);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, .12);
  }
  html[data-scheme="dark"] body :is(.account-form, .finance-form, .finance-edit-form, .details-fields, .business-share, .business-create-form, .company-card, .cv-create, .cv-fields, .cv-full-label, .fc-field, .cc-link-fields, .learning-note-form, .learning-free-text, .personal-edoc-lock, .personal-edoc-invite) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select, textarea):focus {
    border-color: var(--wf-focus);
    box-shadow: 0 0 0 3px var(--wf-focus-soft);
  }
  html[data-scheme="dark"] body :is(.account-form, .details-fields, .cv-fields) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select, textarea)[readonly] {
    background: var(--wf-page);
    color: var(--wf-muted);
  }
  html[data-scheme="dark"] :is(.company-entry-dialog, .wf-dialog, dialog[data-appearance-dialog]) {
    background: var(--wf-surface-gradient);
    border-color: var(--wf-edge);
    box-shadow: var(--wf-shadow-popover);
  }
  html[data-scheme="dark"] body :is(.account-page, .ac-content) .tbl thead th {
    background: var(--wf-elevated);
    color: var(--wf-muted-strong);
    border-color: var(--wf-line);
  }
  html[data-scheme="dark"] body :is(.account-page, .ac-content) .tbl td {
    border-color: var(--wf-line-soft);
  }
  html[data-scheme="dark"] body :is(.account-page, .ac-content) .tbl tbody tr:hover {
    background: var(--wf-hover);
  }

  html[data-scheme="dark"] .wf-appearance > summary {
    background: var(--wf-surface-gradient);
    border-color: var(--wf-edge);
    color: var(--wf-muted-strong);
    box-shadow: inset 0 1px 0 var(--wf-ink-soft);
  }
  html[data-scheme="dark"] .wf-appearance[open] > summary {
    background: var(--wf-brand-soft);
    border-color: var(--wf-brand);
    color: var(--wf-brand-hover);
  }
  html[data-scheme="dark"] .wf-appearance-panel {
    background: var(--wf-surface-gradient);
    border-color: var(--wf-edge);
    box-shadow: var(--wf-shadow-popover);
  }
  html[data-scheme="dark"] .wf-appearance-panel label {
    background: var(--wf-input);
    border-color: var(--wf-line);
  }
  html[data-scheme="dark"] .wf-appearance-panel label:has(input:checked) {
    background: var(--wf-brand-soft);
    border-color: var(--wf-brand);
    color: var(--wf-brand-hover);
    box-shadow: inset 3px 0 0 var(--wf-brand);
  }
}
@media screen and (hover: hover) {
  html[data-scheme="dark"] body :is(a.account-card, a.pv-feature, .overview-preview-card:has(> a)):hover {
    border-color: var(--wf-edge);
    box-shadow: var(--wf-shadow);
  }
}
@media screen and (prefers-reduced-motion: reduce) {
  html[data-scheme="dark"] body :is(a.account-card, a.pv-feature, .overview-preview-card:has(> a)) {
    transition: none;
  }
}