/* Accent selection is independent of light/dark appearance and business status. */
.themePickerTrigger{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin-bottom:12px;padding:10px 12px;border:1px solid var(--hairline);border-radius:10px;background:var(--mail-paper);color:var(--coffee-ink);font:600 13px var(--sans);cursor:pointer}
.themePickerTrigger [data-accent-label]{margin-left:auto;color:var(--secondary-ink)}
.themePickerTrigger:hover{background:var(--raised-paper)}
.themePickerTrigger:focus-visible{outline:2px solid var(--system-blue);outline-offset:2px}
.themePickerDialog{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid var(--hairline);border-radius:20px;background:var(--mail-paper);color:var(--coffee-ink);box-shadow:var(--dialog-shadow)}
.themePickerDialog::backdrop{background:rgba(20,16,28,.4);backdrop-filter:blur(4px)}
.themePickerDialog header{display:flex;align-items:center;justify-content:space-between;gap:16px}
.themePickerDialog h2{font-size:20px;margin:0}
.themePickerDialog header button{min-width:44px;min-height:44px;font-size:22px}
.themePickerDialog p{margin:12px 0 20px;color:var(--secondary-ink);font-size:13px;line-height:1.6}
.themePickerDialog .themeChoice{flex-direction:column;min-height:128px;gap:12px}
.themePickerDialog .themeSwatch{width:32px;height:32px}
.themePickerDialog .themePicker{margin:0}
.themeSwatchTeal{background:#087F78}
.themePicker{margin:0 0 12px}
.themePickerLabel{display:block;margin:0 0 8px;color:var(--secondary-ink);font:600 12px/1.5 var(--sans)}
.themePickerOptions{display:flex;gap:8px}
.themeChoice{display:flex;flex:1;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:8px;border:1px solid var(--hairline);border-radius:10px;background:var(--mail-paper);color:var(--coffee-ink);font:600 12px/1.5 var(--sans);cursor:pointer}
.themeChoice:hover{border-color:var(--hairline-strong);background:var(--raised-paper)}
.themeChoice[aria-pressed="true"]{border-color:var(--system-blue);background:var(--system-blue-soft)}
.themeChoice:focus-visible{outline:2px solid var(--system-blue);outline-offset:2px}
.themeChoiceCheck{visibility:hidden;font-weight:700}
.themeChoice[aria-pressed="true"] .themeChoiceCheck{visibility:visible}
.themeSwatch{width:12px;height:12px;flex:none;border-radius:50%;border:1px solid rgba(0,0,0,.12)}
.themeSwatchBlue{background:#007AFF}
.themeSwatchPurple{background:#7541CA}
@media(pointer:coarse){.themeChoice{min-height:44px}}
@media(forced-colors:active){.themeChoice[aria-pressed="true"]{outline:2px solid Highlight}.themeSwatch{forced-color-adjust:none}}

:root[data-accent="purple"]{
  --canvas-fog:#F6F4FA;
  --raised-paper:#FCFAFF;
  --system-blue:#7541CA;
  --system-blue-hover:#6231B1;
  --system-blue-soft:#F0E8FC;
  --focus-ring:rgba(117,65,202,.26);
  --sidebar-surface:rgba(246,243,251,.94);
  --theme-on-accent:#FFFFFF;
}
:root[data-accent="purple"][data-theme="dark"]{
  --canvas-fog:#151219;
  --mail-paper:#211C29;
  --raised-paper:#2A2334;
  --system-blue:#BA9AEE;
  --system-blue-hover:#C9ADF5;
  --system-blue-soft:#342744;
  --focus-ring:rgba(186,154,238,.38);
  --sidebar-surface:rgba(25,21,32,.95);
  --theme-on-accent:#211C29;
}
:root[data-accent="teal"]{--canvas-fog:#F2F8F7;--raised-paper:#FAFDFC;--system-blue:#087F78;--system-blue-hover:#066861;--system-blue-soft:#E1F3EF;--focus-ring:rgba(8,127,120,.26);--sidebar-surface:rgba(240,248,245,.94);--theme-on-accent:#FFFFFF}
:root[data-accent="teal"][data-theme="dark"]{--canvas-fog:#101A19;--mail-paper:#192725;--raised-paper:#223430;--system-blue:#79D7C8;--system-blue-hover:#9BE5D9;--system-blue-soft:#203F39;--focus-ring:rgba(121,215,200,.38);--sidebar-surface:rgba(18,31,28,.95);--theme-on-accent:#192725}
:root:is([data-accent="purple"],[data-accent="teal"]) .nav .ico,
:root:is([data-accent="purple"],[data-accent="teal"]) .nav a.on .ico,
:root:is([data-accent="purple"],[data-accent="teal"]) .nav-group.is-active>summary .ico,
:root:is([data-accent="purple"],[data-accent="teal"]) .nav a.nav-child.on .navChildIco{background:var(--system-blue-soft);color:var(--system-blue)}
:root:is([data-accent="purple"],[data-accent="teal"]) .nav a.on,
:root:is([data-accent="purple"],[data-accent="teal"]) .nav-group.is-active>summary,
:root:is([data-accent="purple"],[data-accent="teal"]) .nav a.nav-child.on{background:var(--system-blue-soft);color:var(--coffee-ink)}
:root:is([data-accent="purple"],[data-accent="teal"]) .btn:not(.ghost):not(.danger):active{background:var(--system-blue-hover)}
:root:is([data-accent="purple"],[data-accent="teal"]) .btn:hover{box-shadow:0 2px 7px var(--focus-ring)}
:root:is([data-accent="purple"],[data-accent="teal"]) .btn.ghost.onBtn,
:root:is([data-accent="purple"],[data-accent="teal"]) .onBtn,
:root:is([data-accent="purple"],[data-accent="teal"]) .wizard-steps span.on,
:root:is([data-accent="purple"],[data-accent="teal"]) .sendFlowRail .isCurrent,
:root:is([data-accent="purple"],[data-accent="teal"]) .sendFlowRail b,
:root:is([data-accent="purple"],[data-accent="teal"]) .threadContext a:hover,
:root:is([data-accent="purple"],[data-accent="teal"]) .message.outbound .messageDirectionIcon,
:root:is([data-accent="purple"],[data-accent="teal"]) .emailAttachmentAction{color:var(--system-blue)}
:root:is([data-accent="purple"],[data-accent="teal"]) .sendFlowRail .isCurrent b,
:root:is([data-accent="purple"],[data-accent="teal"]) .threadUnread{color:var(--theme-on-accent)}
:root:is([data-accent="purple"],[data-accent="teal"]) .thread-list-item.on{background:var(--system-blue-soft)}
/* External SVG images carry their own blue fills; preserve their white details. */
:root:is([data-accent="purple"],[data-accent="teal"]) .nav .ico .navIconImage{filter:hue-rotate(65deg)}
:root[data-accent="purple"][data-theme="dark"] .nav .ico .navIconImage{filter:hue-rotate(65deg) brightness(1.3) saturate(.8)}
:root[data-accent="purple"][data-theme="dark"] .nav .ico .navIconImageDarkInk{filter:hue-rotate(65deg) brightness(2.15) saturate(.8)}
:root:is([data-accent="purple"],[data-accent="teal"]) .inbox-folders>a.on{background:var(--system-blue-soft);color:var(--system-blue)}
:root:is([data-accent="purple"],[data-accent="teal"]) .thread-list-item.on{color:var(--system-blue)}
:root:is([data-accent="purple"],[data-accent="teal"]) .thread-list-item:hover{background:color-mix(in srgb,var(--system-blue-soft) 55%,transparent)}
:root:is([data-accent="purple"],[data-accent="teal"]) .emailAttachment:not(.is-pdf):not(.is-sheet):not(.is-archive) .emailAttachmentIcon{color:var(--system-blue)}
/* Information/verification badges retain their established blue semantics. */
:root[data-accent="teal"] .nav .ico .navIconImage{filter:hue-rotate(-45deg)}
:root[data-accent="teal"][data-theme="dark"] .nav .ico .navIconImage{filter:hue-rotate(-45deg) brightness(1.3) saturate(.8)}
:root[data-accent="teal"][data-theme="dark"] .nav .ico .navIconImageDarkInk{filter:hue-rotate(-45deg) brightness(2.15) saturate(.8)}
:root:is([data-accent="purple"],[data-accent="teal"]) .t-info{background:#EAF3FF;color:#005FC7}
:root:is([data-accent="purple"],[data-accent="teal"])[data-theme="dark"] .t-info{background:#26394F;color:#9BC5FF}