.theme-swatches{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:8px;flex:1 0 auto;width:auto;min-width:0;padding:4px;margin:0 auto}
.theme-swatches button{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;box-sizing:border-box;width:36px;height:36px;min-width:36px;min-height:36px;max-height:36px;border:1px solid var(--line);border-radius:7px;padding:0;margin:0;font-family:inherit;font-size:16px;font-weight:700;line-height:1;cursor:pointer;background:var(--swatch-bg);color:var(--swatch-ink);box-shadow:none}
.theme-check{visibility:hidden;position:absolute;inset:0;pointer-events:none;color:var(--swatch-ink)}
.theme-check svg{position:absolute;width:calc(100% + 7px);height:100%;left:0;top:-6px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-swatches button[aria-pressed=true]{border-color:var(--swatch-ink);outline:none}
.theme-swatches button[aria-pressed=true] .theme-check{visibility:visible}
.theme-swatches button:focus-visible{outline:3px solid var(--accent,var(--aqua));outline-offset:3px}
.theme-tooltip{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);z-index:100;white-space:nowrap;pointer-events:none;padding:7px 10px;border:1px solid var(--line);border-radius:5px;background:var(--paper,var(--surface));color:var(--ink,var(--text));font-size:13px;line-height:1.3;font-weight:600;visibility:hidden}
.theme-swatches button:hover .theme-tooltip,.theme-swatches button:focus-visible .theme-tooltip{visibility:visible}
.theme-save-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
body>header,.brand-header,.topbar{flex-wrap:wrap}
.sidebar-theme,#theme-switcher,.theme-fieldset,.sidebar-theme-switcher,.theme-panel{display:none!important}
@media(max-width:760px){.theme-swatches{flex:0 0 auto;align-self:center;max-width:100%;margin-inline:auto}.theme-swatches button{width:40px;height:40px;min-width:40px;min-height:40px;max-height:40px;flex-basis:40px}}
/* Console theme controls live in the navigation pane; public headers retain their row. */
.theme-swatches-sidebar{display:grid;grid-template-columns:repeat(3,36px);justify-content:center;gap:10px;flex:none;width:auto;margin:18px 0 24px;padding:4px 0;overflow:visible}
.theme-swatches-sidebar:before{content:'Theme';grid-column:1/-1;font-size:12px;font-weight:600;color:var(--ink,var(--text));text-align:center;margin-bottom:2px}
.theme-swatches-sidebar .theme-tooltip{left:0;transform:none}
body.sidebar-collapsed .theme-swatches-sidebar,body.subscriber-sidebar-collapsed .theme-swatches-sidebar{grid-template-columns:36px}
body.sidebar-collapsed .theme-swatches-sidebar:before,body.subscriber-sidebar-collapsed .theme-swatches-sidebar:before{font-size:10px}
.sidebar>.console-shared-brand{display:flex;justify-content:center;align-items:center;background:#ddd;border-radius:10px;padding:6px;height:64px;min-height:64px;isolation:isolate;width:100%;margin-bottom:24px}
.sidebar>.console-shared-brand img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.sidebar>.console-shared-brand .console-logo-small{display:none}
body.sidebar-collapsed .sidebar>.console-shared-brand .console-logo-wide{display:none}
body.sidebar-collapsed .sidebar>.console-shared-brand .console-logo-small{display:block}
.user-menu-icon{width:18px;height:18px;flex:0 0 18px}
.profile-menu [role=menuitem]{display:flex;align-items:center;gap:10px}
.avatar,.account-menu-profile>span,[data-user-initials],#current-user-avatar,#profile-user-avatar{background:var(--bg)!important;color:var(--ink,var(--text))!important;border:1px solid var(--line)!important}
@media(max-width:760px){.theme-swatches-sidebar{grid-template-columns:repeat(3,40px)}body.sidebar-collapsed .theme-swatches-sidebar,body.subscriber-sidebar-collapsed .theme-swatches-sidebar{grid-template-columns:40px}}
/* Keep the pane toggle below, and flush with, the logo backing. */
body .sidebar > .console-shared-brand,
body .subscriber-sidebar > .sidebar-brand { margin-bottom:0; flex-shrink:0; }
body .sidebar > .sidebar-collapse,
body .subscriber-sidebar > .sidebar-collapse {
  position:relative; top:auto; right:auto; bottom:auto; left:auto;
  align-self:flex-end; flex:0 0 30px; margin:12px 0 0;
}
.theme-swatches-sidebar:before { content:none; display:none; }

/* Five choices fit across the expanded navigation footer. */
body .theme-swatches-sidebar{grid-template-columns:repeat(5,36px);gap:6px;width:100%;margin:16px 0;padding:4px 0;justify-content:center}
body.sidebar-collapsed .theme-swatches-sidebar,body.subscriber-sidebar-collapsed .theme-swatches-sidebar{grid-template-columns:36px}
.theme-swatches-sidebar .theme-tooltip{top:auto;bottom:calc(100% + 10px)}

html[data-theme=light],html[data-theme=light] body{color-scheme:light;--bg:#f3f1ec!important;--canvas:#f3f1ec!important;--surface:#ffffff!important;--paper:#ffffff!important;--header:#fbfaf7!important;--sidebar:#fbfaf7!important;--topbar:#fbfaf7!important;--ink:#1f2928!important;--text:#1f2928!important;--muted:#44514f!important;--text-secondary:#44514f!important;--muted-2:#44514f!important;--line:#ddd9d0!important;--line-strong:#ddd9d0!important;--accent:#087f70!important;--aqua:#087f70!important;--aqua-strong:#087f70!important;--mint:#087f70!important;--mint-deep:#087f70!important;--control:#087f70!important;--control-fill:#087f70!important;--control-fill-hover:#087f70!important;--portal-control-fill:#087f70!important;--portal-control-fill-hover:#087f70!important;--on-accent:#fff!important;--shade:#e8f1ed!important;--surface-2:#e8f1ed!important;--surface-3:#e8f1ed!important;--mint-soft:#e8f1ed!important;--aqua-soft:#e8f1ed!important;--portal-surface-2:#e8f1ed!important;--portal-hover:#e8f1ed!important;--hover:#e8f1ed!important;--input:#ffffff!important;--night:#0d1b1c!important;--focus:#087f70!important}
.theme-swatches button[data-theme-choice=light]{--swatch-bg:#f3f1ec;--swatch-ink:#1f2928;--swatch-accent:#087f70}
html[data-theme=dark],html[data-theme=dark] body{color-scheme:dark;--bg:#071311!important;--canvas:#071311!important;--surface:#102321!important;--paper:#102321!important;--header:#0d201e!important;--sidebar:#0d201e!important;--topbar:#0d201e!important;--ink:#f4f8f7!important;--text:#f4f8f7!important;--muted:#a6b7b4!important;--text-secondary:#a6b7b4!important;--muted-2:#a6b7b4!important;--line:#29413e!important;--line-strong:#29413e!important;--accent:#79e8d3!important;--aqua:#79e8d3!important;--aqua-strong:#79e8d3!important;--mint:#79e8d3!important;--mint-deep:#79e8d3!important;--control:#087f70!important;--control-fill:#087f70!important;--control-fill-hover:#087f70!important;--portal-control-fill:#087f70!important;--portal-control-fill-hover:#087f70!important;--on-accent:#fff!important;--shade:#193730!important;--surface-2:#193730!important;--surface-3:#193730!important;--mint-soft:#193730!important;--aqua-soft:#193730!important;--portal-surface-2:#193730!important;--portal-hover:#193730!important;--hover:#193730!important;--input:#102321!important;--night:#071311!important;--focus:#79e8d3!important}
.theme-swatches button[data-theme-choice=dark]{--swatch-bg:#071311;--swatch-ink:#f4f8f7;--swatch-accent:#087f70}
html[data-theme=contrast],html[data-theme=contrast] body{color-scheme:dark;--bg:#000000!important;--canvas:#000000!important;--surface:#000000!important;--paper:#000000!important;--header:#000000!important;--sidebar:#000000!important;--topbar:#000000!important;--ink:#ffffff!important;--text:#ffffff!important;--muted:#ffffff!important;--text-secondary:#ffffff!important;--muted-2:#ffffff!important;--line:#ffffff!important;--line-strong:#ffffff!important;--accent:#00ffd5!important;--aqua:#00ffd5!important;--aqua-strong:#00ffd5!important;--mint:#00ffd5!important;--mint-deep:#00ffd5!important;--control:#006b5f!important;--control-fill:#006b5f!important;--control-fill-hover:#006b5f!important;--portal-control-fill:#006b5f!important;--portal-control-fill-hover:#006b5f!important;--on-accent:#fff!important;--shade:#000000!important;--surface-2:#000000!important;--surface-3:#000000!important;--mint-soft:#000000!important;--aqua-soft:#000000!important;--portal-surface-2:#000000!important;--portal-hover:#000000!important;--hover:#000000!important;--input:#000000!important;--night:#000000!important;--focus:#00ffd5!important}
.theme-swatches button[data-theme-choice=contrast]{--swatch-bg:#000000;--swatch-ink:#ffffff;--swatch-accent:#006b5f}
html[data-theme=violet],html[data-theme=violet] body{color-scheme:light;--bg:#f5eaff!important;--canvas:#f5eaff!important;--surface:#fdfaff!important;--paper:#fdfaff!important;--header:#fbf7ff!important;--sidebar:#fbf7ff!important;--topbar:#fbf7ff!important;--ink:#240046!important;--text:#240046!important;--muted:#5a189a!important;--text-secondary:#5a189a!important;--muted-2:#5a189a!important;--line:#d8b6ed!important;--line-strong:#d8b6ed!important;--accent:#5a189a!important;--aqua:#5a189a!important;--aqua-strong:#5a189a!important;--mint:#5a189a!important;--mint-deep:#5a189a!important;--control:#7b2cbf!important;--control-fill:#7b2cbf!important;--control-fill-hover:#7b2cbf!important;--portal-control-fill:#7b2cbf!important;--portal-control-fill-hover:#7b2cbf!important;--on-accent:#fff!important;--shade:#ebc9ff!important;--surface-2:#ebc9ff!important;--surface-3:#ebc9ff!important;--mint-soft:#ebc9ff!important;--aqua-soft:#ebc9ff!important;--portal-surface-2:#ebc9ff!important;--portal-hover:#ebc9ff!important;--hover:#ebc9ff!important;--input:#fdfaff!important;--night:#10002b!important;--focus:#5a189a!important}
.theme-swatches button[data-theme-choice=violet]{--swatch-bg:#f5eaff;--swatch-ink:#240046;--swatch-accent:#7b2cbf}
html[data-theme=amber],html[data-theme=amber] body{color-scheme:light;--bg:#ffedc1!important;--canvas:#ffedc1!important;--surface:#fffdf7!important;--paper:#fffdf7!important;--header:#fffaf0!important;--sidebar:#fffaf0!important;--topbar:#fffaf0!important;--ink:#3d2108!important;--text:#3d2108!important;--muted:#795019!important;--text-secondary:#795019!important;--muted-2:#795019!important;--line:#e7c58d!important;--line-strong:#e7c58d!important;--accent:#914500!important;--aqua:#914500!important;--aqua-strong:#914500!important;--mint:#914500!important;--mint-deep:#914500!important;--control:#a94700!important;--control-fill:#a94700!important;--control-fill-hover:#a94700!important;--portal-control-fill:#a94700!important;--portal-control-fill-hover:#a94700!important;--on-accent:#fff!important;--shade:#ffcd7a!important;--surface-2:#ffcd7a!important;--surface-3:#ffcd7a!important;--mint-soft:#ffcd7a!important;--aqua-soft:#ffcd7a!important;--portal-surface-2:#ffcd7a!important;--portal-hover:#ffcd7a!important;--hover:#ffcd7a!important;--input:#fffdf7!important;--night:#35200c!important;--focus:#914500!important}
.theme-swatches button[data-theme-choice=amber]{--swatch-bg:#ffedc1;--swatch-ink:#3d2108;--swatch-accent:#a94700}
html[data-theme=aqua],html[data-theme=aqua] body{color-scheme:light;--bg:#d0fff9!important;--canvas:#d0fff9!important;--surface:#f7fffd!important;--paper:#f7fffd!important;--header:#f1fffc!important;--sidebar:#f1fffc!important;--topbar:#f1fffc!important;--ink:#073c37!important;--text:#073c37!important;--muted:#30635d!important;--text-secondary:#30635d!important;--muted-2:#30635d!important;--line:#8acfc4!important;--line-strong:#8acfc4!important;--accent:#006c60!important;--aqua:#006c60!important;--aqua-strong:#006c60!important;--mint:#006c60!important;--mint-deep:#006c60!important;--control:#006da3!important;--control-fill:#006da3!important;--control-fill-hover:#006da3!important;--portal-control-fill:#006da3!important;--portal-control-fill-hover:#006da3!important;--on-accent:#fff!important;--shade:#a0fff4!important;--surface-2:#a0fff4!important;--surface-3:#a0fff4!important;--mint-soft:#a0fff4!important;--aqua-soft:#a0fff4!important;--portal-surface-2:#a0fff4!important;--portal-hover:#a0fff4!important;--hover:#a0fff4!important;--input:#f7fffd!important;--night:#07312c!important;--focus:#006c60!important}
.theme-swatches button[data-theme-choice=aqua]{--swatch-bg:#d0fff9;--swatch-ink:#073c37;--swatch-accent:#006da3}
/* Shared raised tabs across public, subscriber and operations pages. */
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]){display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;border-bottom:0;background:linear-gradient(var(--line),var(--line)) left bottom/100% 1px no-repeat;padding:0;margin-bottom:0}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button{display:inline-flex;align-items:center;justify-content:center;gap:10px;position:relative;flex-shrink:0;white-space:nowrap;min-height:48px;margin:0;padding:17px 23px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--muted);font-family:inherit;font-size:1rem;font-weight:700;line-height:1.4;box-shadow:none;cursor:pointer}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button:hover{color:var(--accent);background:var(--surface-2)}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button:is([aria-selected=true],[aria-pressed=true],.is-active){border-color:var(--line);border-bottom-color:var(--bg);background:var(--bg);color:var(--accent);z-index:1}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button::after{content:none}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button:focus-visible{outline:2px solid var(--accent);outline-offset:-5px}
:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button[hidden]{display:none}
body .tabs~.panel,body .journey-panel{margin-top:0;border-radius:0}
@media(max-width:600px){:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]){gap:4px}:root body :is(.journey-tabs,.service-tabs,.tabs,.case-tabs):is(nav,div,[role=tablist]) button{padding:12px 14px;font-size:.9rem}}


/* Panel tabs match the panel; case tabs retain the surrounding workspace colour. */
/* Overlap the panel border so the selected Discovery tab opens into its panel. */
:root body .ops-companion .tabs[role=tablist]{position:relative;z-index:1;margin-bottom:-1px}
:root body :is(.journey-tabs,.service-tabs,.tabs):is(nav,div,[role=tablist]) button:is([aria-selected=true],[aria-pressed=true],.is-active){background:var(--surface);border-bottom-color:var(--surface)}

/* Source selection cards: shared by App and Ops. */
:root body #source-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px;padding:8px 0}
:root body #source-choices label.source-choice{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:start;gap:12px;box-sizing:border-box;margin:0;padding:16px;border:1px solid var(--muted,#506875);border-radius:7px;background:var(--paper,#fff);color:var(--ink,#203330);cursor:pointer;line-height:1.5}
:root body #source-choices .source-choice input[type=checkbox]{display:block;position:static;align-self:start;justify-self:start;transform:none;inset:auto;width:18px;height:18px;min-width:18px;min-height:18px;max-height:18px;margin:1px 0 0;padding:0;accent-color:var(--accent,#087f70)}
:root body #source-choices .source-choice span{display:block;margin:0;padding:0;min-width:0}
:root body #source-choices .source-choice small{display:block;margin:0 0 6px;color:var(--muted,#506875);font-size:.85rem}
:root body #source-choices .source-choice strong{display:block;margin:0;font-size:.95rem;font-weight:600;line-height:1.5}
:root body #source-choices .source-choice:has(input:checked){border-color:var(--accent,#087f70);box-shadow:inset 0 0 0 1px var(--accent,#087f70);background:var(--shade,#e8f1ed)}
:root body #source-choices .source-choice:hover{border-color:var(--accent,#087f70)}
:root body #source-choices .source-choice:focus-within{outline:2px solid var(--accent,#087f70);outline-offset:3px}

/* Numeric notification badge, matching App. */
:root body #ops-notification-bell .ops-notification-count{position:absolute;top:0;right:0;min-width:17px;padding:1px 4px;border-radius:12px;background:var(--mint-deep,#087f70);color:#fff;font:700 11px/1.4 Arial,sans-serif;box-sizing:border-box}
:root body #ops-notification-bell .ops-notification-count[hidden]{display:none}

/* Keep attention filter checkbox and caption together. */
.record-filters label:has(input[type=checkbox]){display:flex;flex-direction:row;align-items:center;gap:8px;white-space:nowrap}.record-filters label input[type=checkbox]{width:18px;flex:none;margin:0;}
