/* Global appearance foundation. Attribute state is owned by appearance.js.
   Default: modern/system. Feature styles consume these semantic tokens; document
   paper, images, video, canvas and charts keep their own rendering contracts. */
@media screen {
:root {
  color-scheme: light;
  --wf-page: #f5f7fb;
  --wf-card: #fff;
  --wf-elevated: #fff;
  --wf-input: #fff;
  --wf-line: #dee2e6;
  --wf-line-soft: #e9ecef;
  --wf-control-line: #8995a5;
  --wf-text: #495057;
  --wf-muted: #68707f;
  --wf-muted-strong: #596273;
  --wf-muted-soft: #6d7684;
  --wf-brand: #3069bb;
  --wf-brand-hover: #2d60aa;
  --wf-brand-soft: #e9f1fc;
  --wf-on-brand: #fff;
  --wf-brand-on-ink: #a5c6f4;
  --wf-accent: #3069bb;
  --wf-on-accent: #fff;
  --wf-lime: #b6ef62;
  --wf-lime-ink: #3f651e;
  --wf-ink: #19222c;
  --wf-ink-2: #222e3c;
  --wf-ink-3: #2b3949;
  --wf-on-ink: #eef1f8;
  --wf-ink-muted: #b7c0d3;
  --wf-ink-line: rgba(255, 255, 255, .16);
  --wf-ink-soft: rgba(255, 255, 255, .06);
  --wf-positive: #0d7b57;
  --wf-positive-soft: #e8f6ef;
  --wf-positive-on-ink: #8ce0bd;
  --wf-warning: #9c570b;
  --wf-warning-soft: #fff4e5;
  --wf-warning-on-ink: #ffca89;
  --wf-danger: #ad3d52;
  --wf-danger-soft: #fff0f3;
  --wf-danger-on-ink: #ffafbd;
  --wf-info: #315bc2;
  --wf-info-soft: #edf2ff;
  --wf-info-on-ink: #a7c4ff;
  --wf-display: 'Sora', 'Inter', system-ui, sans-serif;
  --wf-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --wf-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  --wf-radius: 14px;
  --wf-radius-sm: 10px;
  --wf-shadow: 0 8px 24px rgba(11, 16, 32, .07);
  --wf-shadow-sm: 0 1px 2px rgba(11, 16, 32, .05);
  --wf-shadow-popover: 0 16px 48px rgba(11, 16, 32, .16);
  --wf-backdrop: rgba(11, 16, 32, .62);
  --wf-focus: #3b7ddd;
  --wf-focus-soft: rgba(59, 125, 221, .18);
  --wf-header: rgba(255, 255, 255, .96);
  --wf-hover: #edf2f8;
  --wf-selection: #dce9fa;
  --wf-selection-text: #2d60aa;
}

html[data-design="classic"] {
  --wf-page: #f5f4ef;
  --wf-card: #fff;
  --wf-elevated: #fdfcf9;
  --wf-input: #fff;
  --wf-line: #e3e0d6;
  --wf-line-soft: #efede5;
  --wf-text: #1c1b17;
  --wf-muted: #6f706c;
  --wf-muted-strong: #5f5b50;
  --wf-muted-soft: #777368;
  --wf-brand: #7a6a3d;
  --wf-brand-hover: #5f5128;
  --wf-brand-soft: #f2efe6;
  --wf-on-brand: #fff;
  --wf-brand-on-ink: #ddd0a8;
  --wf-accent: #c9b98a;
  --wf-on-accent: #1c1809;
  --wf-ink: #0b0c10;
  --wf-ink-2: #13151c;
  --wf-ink-3: #1b1e28;
  --wf-on-ink: #f5f3ec;
  --wf-ink-muted: #c0bbaa;
  --wf-ink-line: rgba(201, 185, 138, .24);
  --wf-ink-soft: rgba(201, 185, 138, .075);
  --wf-positive: #45674f;
  --wf-positive-soft: #edf4eb;
  --wf-positive-on-ink: #b0d3b7;
  --wf-warning: #956013;
  --wf-warning-soft: #faf2df;
  --wf-warning-on-ink: #e6c789;
  --wf-danger: #9e4039;
  --wf-danger-soft: #fbefeb;
  --wf-danger-on-ink: #eeb3a9;
  --wf-info: #53678e;
  --wf-info-soft: #eef1f6;
  --wf-info-on-ink: #b9c9e7;
  --wf-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --wf-radius: 16px;
  --wf-radius-sm: 10px;
  --wf-shadow: 0 10px 28px rgba(30, 28, 20, .08);
  --wf-shadow-sm: 0 1px 2px rgba(30, 28, 20, .05);
  --wf-shadow-popover: 0 18px 48px rgba(28, 25, 18, .18);
  --wf-backdrop: rgba(11, 12, 16, .65);
  --wf-focus: #7c6c3f;
  --wf-focus-soft: rgba(124, 108, 63, .16);
  --wf-header: rgba(253, 252, 249, .96);
  --wf-hover: #f2efe6;
  --wf-selection: #e7ddbd;
  --wf-selection-text: #4b3e1f;
}

/* Screen-only dark palettes leave the document/print color contract independent.
   data-mode=system is resolved to data-scheme by the boot script before paint. */
@media screen {
  html[data-scheme="dark"] {
    color-scheme: dark;
    --wf-page: #19222c;
    --wf-card: #222e3c;
    --wf-elevated: #283646;
    --wf-input: #222e3c;
    --wf-line: #3b4856;
    --wf-line-soft: #303e4e;
    --wf-control-line: #6a7c92;
    --wf-text: #bdc0c4;
    --wf-muted: #adb5bd;
    --wf-muted-strong: #dee2e6;
    --wf-muted-soft: #a6afb8;
    --wf-brand: #8eb6ef;
    --wf-brand-hover: #b0cef6;
    --wf-brand-soft: #293e58;
    --wf-on-brand: #19222c;
    --wf-brand-on-ink: #a5c6f4;
    --wf-accent: #8eb6ef;
    --wf-on-accent: #19222c;
    --wf-lime: #b6ef62;
    --wf-lime-ink: #b6ef62;
    --wf-ink: #19222c;
    --wf-ink-2: #222e3c;
    --wf-ink-3: #2b3949;
    --wf-on-ink: #e9ecef;
    --wf-ink-muted: #adb5bd;
    --wf-ink-line: rgba(233, 236, 239, .15);
    --wf-ink-soft: rgba(233, 236, 239, .05);
    --wf-positive: #83d9b5;
    --wf-positive-soft: #15382d;
    --wf-warning: #f3c081;
    --wf-warning-soft: #3c2b19;
    --wf-danger: #ffa4b5;
    --wf-danger-soft: #422532;
    --wf-info: #a7c4ff;
    --wf-info-soft: #203454;
    --wf-shadow: 0 12px 32px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(237, 242, 250, .035);
    --wf-shadow-sm: 0 3px 10px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(237, 242, 250, .035);
    --wf-shadow-popover: 0 24px 64px rgba(0, 0, 0, .48), 0 0 0 1px rgba(7, 11, 18, .3);
    --wf-backdrop: rgba(3, 6, 12, .8);
    --wf-focus: #8eb6ef;
    --wf-focus-soft: rgba(59, 125, 221, .2);
    --wf-header: #19222c;
    --wf-hover: #2b3949;
    --wf-selection: #3069bb;
    --wf-selection-text: #fff;
    /* Links stay luminous; primary actions have their own accessible blue. */
    --wf-action-start: #3069bb;
    --wf-action-end: #3069bb;
    --wf-on-action: #fff;
    --wf-action-gradient: linear-gradient(115deg, var(--wf-action-start), var(--wf-action-end));
    --wf-surface-gradient: linear-gradient(#222e3c, #222e3c);
    --wf-glow: rgba(59, 125, 221, .16);
    --wf-glow-soft: rgba(59, 125, 221, .06);
    --wf-edge: #3b4856;
  }
  html[data-design="classic"][data-scheme="dark"] {
    --wf-page: #10110f;
    --wf-card: #1b1c19;
    --wf-elevated: #272821;
    --wf-input: #11130f;
    --wf-line: #414239;
    --wf-line-soft: #2d3028;
    --wf-text: #f2eee5;
    --wf-muted: #b9b5a8;
    --wf-muted-strong: #d1cdbf;
    --wf-muted-soft: #aaa596;
    --wf-brand: #d5bd85;
    --wf-brand-hover: #eadbb7;
    --wf-brand-soft: #332f22;
    --wf-on-brand: #1a1408;
    --wf-brand-on-ink: #e0cea4;
    --wf-accent: #c9b98a;
    --wf-on-accent: #1c1809;
    --wf-ink: #0a0c09;
    --wf-ink-2: #151811;
    --wf-ink-3: #24271e;
    --wf-on-ink: #f2eee5;
    --wf-ink-muted: #c0baa9;
    --wf-ink-line: rgba(213, 189, 133, .20);
    --wf-ink-soft: rgba(213, 189, 133, .055);
    --wf-positive: #add1b3;
    --wf-positive-soft: #25352b;
    --wf-warning: #e6c789;
    --wf-warning-soft: #393020;
    --wf-danger: #eeb3a9;
    --wf-danger-soft: #3d2828;
    --wf-info: #b9c9e7;
    --wf-info-soft: #283244;
    --wf-focus: #dccb9c;
    --wf-focus-soft: rgba(210, 191, 137, .16);
    --wf-header: rgba(21, 23, 19, .97);
    --wf-hover: #303229;
    --wf-selection: #655632;
    --wf-selection-text: #fff8e6;
    --wf-action-start: #b99a5b;
    --wf-action-end: #d5bd85;
    --wf-on-action: #1a1408;
    --wf-surface-gradient: linear-gradient(145deg, #303126 0%, #21231c 38%, #191c16 100%);
    --wf-glow: rgba(213, 189, 133, .18);
    --wf-glow-soft: rgba(213, 189, 133, .07);
    --wf-edge: #4b4c3d;
  }
}

/* Compatibility aliases. Local feature declarations are mapped at their source;
   a text alias such as login-ink is different from the fixed dark hero --ink. */
:root, html[data-design] {
  --surface: var(--wf-page); --bg: var(--wf-page);
  --card: var(--wf-card); --card2: var(--wf-elevated);
  --cardA: var(--wf-card); --cardB: var(--wf-elevated);
  --text: var(--wf-text); --tx: var(--wf-text);
  --muted: var(--wf-muted); --muted-2: var(--wf-muted-strong);
  --tx2: var(--wf-muted); --tx3: var(--wf-muted-soft);
  --line: var(--wf-line); --bord: var(--wf-line);
  --line-2: var(--wf-line-soft); --line2: var(--wf-line-soft);
  --brand: var(--wf-brand); --brand-deep: var(--wf-brand-hover); --brand-soft: var(--wf-brand-soft);
  --blue: var(--wf-brand); --blue-deep: var(--wf-brand-hover); --blue-soft: var(--wf-brand-soft);
  --primary: var(--wf-brand);
  --volt: var(--wf-accent); --volt-ink: var(--wf-on-accent);
  --ink: var(--wf-ink); --ink-2: var(--wf-ink-2); --ink-3: var(--wf-ink-3);
  --pos: var(--wf-positive); --positive: var(--wf-positive); --pos-soft: var(--wf-positive-soft);
  --green: var(--wf-positive); --green-soft: var(--wf-positive-soft);
  --warn: var(--wf-warning); --warning: var(--wf-warning); --warn-soft: var(--wf-warning-soft);
  --amber: var(--wf-warning); --amber-soft: var(--wf-warning-soft);
  --bad: var(--wf-danger); --bad-soft: var(--wf-danger-soft);
  --red: var(--wf-danger); --red-soft: var(--wf-danger-soft);
  --display: var(--wf-display); --body: var(--wf-body); --mono: var(--wf-mono);
  --radius: var(--wf-radius); --radius-sm: var(--wf-radius-sm);
  --shadow: var(--wf-shadow); --shadow-sm: var(--wf-shadow-sm); --shadow-l: var(--wf-shadow-popover);
  --overlay: var(--wf-backdrop); --head-bg: var(--wf-header);
  --hover-bg: var(--wf-hover); --soft-bg: var(--wf-elevated);
  --btn-bg: var(--wf-card); --btn-bord: var(--wf-line); --btn-hover: var(--wf-hover);
  --tag-bg: var(--wf-brand-soft); --panel-bord: var(--wf-line); --track: var(--wf-line-soft);
  --account-ink: var(--wf-text); --account-muted: var(--wf-muted); --account-line: var(--wf-line);
  --account-bg: var(--wf-page); --account-blue: var(--wf-brand); --account-lime: var(--wf-accent);
  --pv-ink: var(--wf-text); --pv-muted: var(--wf-muted); --pv-line: var(--wf-line); --pv-paper: var(--wf-card);
  --pv-gold: var(--wf-brand); --pv-gold-dark: var(--wf-brand-hover);
  --cv-ink: var(--wf-text); --cv-muted: var(--wf-muted); --cv-line: var(--wf-line);
  --cv-paper: var(--wf-card); --cv-bg: var(--wf-page); --cv-gold: var(--wf-brand); --cv-danger: var(--wf-danger);
  --learning-ink: var(--wf-text); --learning-muted: var(--wf-muted); --learning-line: var(--wf-line);
  --learning-paper: var(--wf-card); --learning-gold: var(--wf-brand); --learning-gold-soft: var(--wf-brand-soft);
  --login-ink: var(--wf-text); --login-ink-soft: var(--wf-muted-strong);
  --login-surface: var(--wf-page); --login-card: var(--wf-card);
  --login-line: var(--wf-line); --login-line-strong: var(--wf-muted-soft);
  --login-muted: var(--wf-muted); --login-muted-soft: var(--wf-muted-soft);
  --login-accent: var(--wf-brand); --login-accent-deep: var(--wf-brand-hover); --login-accent-soft: var(--wf-brand-soft);
  --login-positive: var(--wf-positive); --login-danger: var(--wf-danger);
  --bk-bg: var(--wf-page); --bk-tile-bg: var(--wf-card); --bk-thead-bg: var(--wf-elevated);
  --bk-ink: var(--wf-text); --bk-ink-soft: var(--wf-muted-strong); --bk-muted: var(--wf-muted); --bk-faint: var(--wf-muted-soft);
  --bk-border: var(--wf-line); --bk-divider: var(--wf-line-soft); --bk-gray-bg: var(--wf-elevated);
  --bk-blue: var(--wf-brand); --bk-blue-deep: var(--wf-brand-hover); --bk-blue-bg: var(--wf-brand-soft); --bk-lime: var(--wf-accent);
  --bk-green: var(--wf-positive); --bk-green-bg: var(--wf-positive-soft); --bk-green-dot: var(--wf-positive);
  --bk-red: var(--wf-danger); --bk-red-bg: var(--wf-danger-soft); --bk-red-dot: var(--wf-danger);
  --bk-amber: var(--wf-warning); --bk-amber-bg: var(--wf-warning-soft); --bk-amber-dot: var(--wf-warning);
  --bk-font: var(--wf-body); --bk-font-display: var(--wf-display); --bk-font-mono: var(--wf-mono);
  --team-accent: var(--wf-brand); --team-accent-strong: var(--wf-brand-hover); --team-accent-soft: var(--wf-brand-soft);
  --team-surface: var(--wf-card); --team-surface-soft: var(--wf-elevated);
  --team-text: var(--wf-text); --team-muted: var(--wf-muted); --team-line: var(--wf-line); --team-line-soft: var(--wf-line-soft);
  --wa-brand: var(--wf-brand); --wa-brand-strong: var(--wf-brand-hover); --wa-brand-soft: var(--wf-brand-soft);
  --wa-ink: var(--wf-text); --wa-muted: var(--wf-muted); --wa-line: var(--wf-line);
  --wa-surface: var(--wf-card); --wa-surface-soft: var(--wf-elevated); --wa-surface-strong: var(--wf-hover);
  --wa-success: var(--wf-positive); --wa-success-soft: var(--wf-positive-soft);
  --wa-warn: var(--wf-warning); --wa-warn-soft: var(--wf-warning-soft);
  --wa-danger: var(--wf-danger); --wa-danger-soft: var(--wf-danger-soft); --wa-shadow: var(--wf-shadow);
  --access-ink: var(--wf-text); --access-muted: var(--wf-muted); --access-line: var(--wf-line); --access-paper: var(--wf-card);
  --ledger-ink: var(--wf-text); --ledger-line: var(--wf-line); --ledger-soft: var(--wf-elevated);
  --economics-ink: var(--wf-text); --economics-muted: var(--wf-muted); --economics-accent: var(--wf-brand);
  --economics-surface: var(--wf-card); --economics-subtle: var(--wf-elevated); --economics-border: var(--wf-line);
  --economics-positive: var(--wf-positive); --economics-negative: var(--wf-danger);
  --uo-ink: var(--wf-text); --uo-muted: var(--wf-muted); --uo-blue: var(--wf-brand); --uo-green: var(--wf-positive);
}

/* One viewport-anchored chooser, outside the page's scrolling and sticky shells. */
.wf-appearance {
  --wf-appearance-bottom: 24px;
  position: fixed; bottom: calc(var(--wf-appearance-bottom) + env(safe-area-inset-bottom, 0px)); right: calc(24px + env(safe-area-inset-right, 0px)); z-index: 50;
  min-width: 0; max-width: calc(100vw - 24px); margin: 0; color: var(--wf-text);
  font: 400 12px/1.5 var(--wf-body); text-align: left;
}
.wf-appearance > summary {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  box-sizing: border-box; width: 48px; height: 48px; padding: 0; border: 1px solid var(--wf-line);
  border-radius: 50%; background: var(--wf-card); color: var(--wf-muted-strong);
  box-shadow: var(--wf-shadow); transition: border-color .16s, background-color .16s, color .16s;
  font: 600 12px/1.4 var(--wf-body); list-style: none; cursor: pointer;
}
.wf-appearance > summary::-webkit-details-marker { display: none; }
.wf-appearance > summary::marker { content: ''; }
.wf-appearance > summary svg { display: block; width: 22px; height: 22px; flex: none; }
.wf-appearance-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.wf-appearance > summary:hover,
.wf-appearance[open] > summary { border-color: var(--wf-brand); background: var(--wf-brand-soft); color: var(--wf-brand-hover); }
/* A small segmented selector, with native radios retained for keyboard use. */
.wf-appearance-panel {
  position: absolute; bottom: 50%; right: calc(100% + 10px); transform: translateY(50%);
  box-sizing: border-box; width: min(316px,calc(100vw - 96px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))); margin: 0; padding: 6px;
  border: 1px solid var(--wf-line); border-radius: 26px;
  background: var(--wf-elevated); color: var(--wf-text); box-shadow: var(--wf-shadow-popover);
}
.wf-appearance[open] .wf-appearance-panel { animation: wf-appearance-left .18s ease-out; }
@keyframes wf-appearance-left { from { opacity: 0; transform: translate(8px,50%); } to { opacity: 1; transform: translate(0,50%); } }
@media (prefers-reduced-motion: reduce) { .wf-appearance[open] .wf-appearance-panel { animation: none; } }
.wf-appearance-panel fieldset { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 3px; min-width: 0; margin: 0; padding: 0; border: 0; }
.wf-appearance-panel legend, .wf-appearance-panel input[type="radio"], .wf-appearance-status {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.wf-appearance-panel label {
  position: relative; display: flex; flex-direction: row; justify-content: center; align-items: center;
  gap: 6px; min-width: 0; min-height: 40px; margin: 0; padding: 9px 4px;
  border: 1px solid transparent; border-radius: 20px; background: transparent; color: var(--wf-muted);
  font: 500 11px/1.3 var(--wf-body); cursor: pointer; text-align: center;
}
.wf-appearance-panel label:hover { background: var(--wf-hover); color: var(--wf-text); }
.wf-appearance-panel label:has(input:checked) { background: var(--wf-hover); color: var(--wf-text); border-color: var(--wf-line); }
.wf-appearance-panel label:has(input:checked) > svg { color: var(--wf-lime-ink); }
.wf-appearance-panel label:has(input:focus-visible) { outline: 2px solid var(--wf-focus); outline-offset: 1px; }
.wf-appearance-panel label > svg { width: 20px; height: 20px; flex: none; }
.wf-appearance-panel label > span { overflow-wrap: anywhere; }
@media (max-width: 420px) { .wf-appearance-panel label { flex-direction: column; gap: 3px; padding: 6px 2px; font-size: 10px; } }

.wf-appearance :is(summary, input):focus-visible { outline: 3px solid var(--wf-focus); outline-offset: 3px; }

/* Only known application form containers. Document editors and rendered paper
   intentionally have no broad element-level overrides here. */
@media screen {
  /* Reader chrome follows the theme; the controlled document below it does not. */
  html[data-design] :is(.edoc-reader-head, .edoc-document-commandbar) {
    --ed-ink: var(--wf-text); --ed-muted: var(--wf-muted); --ed-line: var(--wf-line);
    --ed-accent: var(--wf-brand); --ed-gold: var(--wf-brand);
  }
  html[data-design] :is(.edoc-controlled-copy, .edoc-live-controlled-copy, .edoc-live-prosemirror, .edoc-prosemirror, .edoc-language-column, .edoc-paper) {
    --display: 'Sora', 'Inter', system-ui, sans-serif;
    --body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --wf-display: 'Sora', 'Inter', system-ui, sans-serif;
    --wf-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --ed-ink: #181a20; --ed-muted: #687180; --ed-line: #dedbd4;
    --ed-paper: #fbfaf6; --ed-accent: #7a2432; --ed-gold: #b69759;
  }
  html[data-design] :is(.account-form, .details-fields, .finance-form, .finance-edit-form, .fc-field, .cv-fields, .cv-create, .company-card, .accountant-form, .login-form, .personal-edoc-lock, .personal-edoc-invite)
    :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select, textarea) {
    border-color: var(--wf-line); background-color: var(--wf-input); color: var(--wf-text); caret-color: var(--wf-text);
  }
  html[data-design] :is(.account-form, .details-fields, .finance-form, .finance-edit-form, .fc-field, .cv-fields, .cv-create, .company-card, .accountant-form, .login-form, .personal-edoc-lock, .personal-edoc-invite)
    :where(input, select, textarea):focus { border-color: var(--wf-focus); }
  html[data-design] :is(.account-form, .details-fields, .cv-fields, .company-card) input[readonly] { background-color: var(--wf-page); color: var(--wf-muted); }
  html[data-design] :is(.account-form, .details-fields, .cv-fields, .company-card) :is(input, textarea)::placeholder { color: var(--wf-muted-soft); opacity: 1; }
  html[data-design] :is(.account-page, .ac-content) .tbl thead th { border-color: var(--wf-line); background-color: var(--wf-elevated); color: var(--wf-muted-strong); }
  html[data-design] :is(.account-page, .ac-content) .tbl td { border-color: var(--wf-line-soft); }
  html[data-design] :is(.company-entry-dialog, .wf-dialog, dialog[data-appearance-dialog]) { border-color: var(--wf-line); background-color: var(--wf-card); color: var(--wf-text); }
  html[data-design] :is(.company-entry-dialog, .wf-dialog, dialog[data-appearance-dialog])::backdrop { background: var(--wf-backdrop); }
}

@media (max-width: 620px) {
  .wf-appearance { --wf-appearance-bottom: 16px; right: calc(16px + env(safe-area-inset-right, 0px)); }
  .wf-appearance-panel { padding: 6px; }
  .wf-appearance-panel label { min-height: 40px; }
}
@media (max-width: 720px) {
  /* Leave the worker's four-tab bottom navigation available. */
  .worker-mobile-ready .wf-appearance { --wf-appearance-bottom: 82px; }
}
@media (prefers-reduced-motion: reduce) {
  .wf-appearance > summary { transition: none; }
}

/* Navigation is a scheme-aware surface. Fixed dark heroes elsewhere keep their
   ink tokens; only the sidebar remaps them to the current navigation surface. */
html[data-design][data-scheme] body :is(.ac-side, .bk-sidebar) {
  --wf-ink: var(--wf-card);
  --wf-ink-2: var(--wf-hover);
  --wf-ink-3: var(--wf-elevated);
  --wf-on-ink: var(--wf-text);
  --wf-ink-muted: var(--wf-muted);
  --wf-brand-on-ink: var(--wf-brand);
  --wf-ink-line: var(--wf-line);
  --wf-ink-soft: var(--wf-hover);
  --wf-danger-on-ink: var(--wf-danger);
  --wf-positive-on-ink: var(--wf-positive);
  --ink: var(--wf-card);
  --ink-2: var(--wf-hover);
  background: var(--wf-card); color: var(--wf-text);
  border-right: 1px solid var(--wf-line-soft); box-shadow: none;
}
html[data-design][data-scheme] body :is(.ac-side-foot, .bk-user) {
  background: var(--wf-card); border-color: var(--wf-line-soft);
}
html[data-design][data-scheme] body :is(.ac-side, .bk-sidebar) :is(.ac-nav:not(.ac-nav-vault), .bk-nav-item):hover {
  background: var(--wf-hover); color: var(--wf-text);
}
html[data-design][data-scheme] body :is(.ac-side, .bk-sidebar) :is(.ac-nav:not(.ac-nav-vault), .bk-nav-item).is-active {
  background: var(--wf-hover); color: var(--wf-text);
  border-color: transparent; box-shadow: none;
}
html[data-design][data-scheme] body .bk-nav-item.is-active span { color: inherit; }
html[data-design="modern"][data-scheme] body :is(.ac-main, .account-main) {
  background: var(--wf-page);
}
html[data-design="modern"][data-scheme] body :is(.ac-top, .bk-topbar) {
  background: var(--wf-header); color: var(--wf-text); box-shadow: none;
}
html[data-design="modern"][data-scheme] body .ac-top :is(h1, .ac-burger) { color: var(--wf-text); }
html[data-design="modern"][data-scheme] body .ac-side :is(.ac-nav-feature, .ac-nav-priority, .ac-nav-chain) {
  background: var(--wf-card); border-color: var(--wf-line); box-shadow: none;
}
html[data-design="modern"][data-scheme] body .ac-nav.is-active::before { background: var(--wf-lime); }
html[data-design][data-scheme] body .ac-nav:not(.ac-nav-vault).is-active svg { color: var(--wf-lime-ink); }
html[data-design][data-scheme] .wf-appearance > summary {
  background: var(--wf-card); box-shadow: var(--wf-shadow);
}
html[data-design][data-scheme] .wf-appearance > summary:hover,
html[data-design][data-scheme] .wf-appearance[open] > summary {
  background: var(--wf-hover); color: var(--wf-text); border-color: var(--wf-line);
}
html[data-design][data-scheme] .wf-appearance-panel label {
  background: transparent; border-color: transparent; box-shadow: none;
}
html[data-design][data-scheme] .wf-appearance-panel label:has(input:checked) {
  background: var(--wf-hover); color: var(--wf-text); border-color: transparent; box-shadow: none;
}
/* Navigation choices share the sidebar selection surface and its lime marker. */
html[data-design][data-scheme] body :is([role="tab"][aria-selected="true"],
  .wo-tabs [aria-pressed="true"], .wo-client[aria-pressed="true"], .wo-client-row [aria-pressed="true"],
  .ac-persp a.on, .ac-lang a.on, .crm-tabs a.on, .team-tabs a.on, .cli-tab.on,
  .billing-segment button.on, .ac-tabs a.on, .tabs a.active, .tabs button.active) {
  background: var(--wf-hover); color: var(--wf-text); border-color: var(--wf-control-line);
  box-shadow: inset 0 -2px var(--wf-lime);
}
html[data-design][data-scheme] body :is([role="tab"], .wo-tabs button, .wo-tabs a,
  .ac-persp a, .ac-lang a, .crm-tabs a, .team-tabs a, .cli-tab):hover {
  background: var(--wf-hover); color: var(--wf-text);
}
.portal-runtime[hidden] { display: none; }
@media screen and (prefers-contrast: more) {
  :root, html[data-design] { --wf-line: #8c96a6; --wf-line-soft: #b4bac4; --wf-muted: #424b5c; --wf-muted-soft: #596273; }
  html[data-design][data-scheme="dark"] { --wf-line: #7a879b; --wf-line-soft: #536178; --wf-muted: #d1d8e5; --wf-muted-soft: #b7c0d3; }
}
}
@media print {
  html { color-scheme: light !important; }
  [data-appearance-control], .wf-appearance { display: none !important; }
}