/* GENERATED by tools/build-theme.cjs from tools/theme/theme.src.css. Edit the source, then run: node tools/build-theme.cjs */
/* ============================================================
   ELEPHANT DASHBOARD — shared visual system
   The same silver / white / graphite system as Elephant Admin.
   Loaded after each page's own styles. Every rule starts with html.ep so it
   wins over the page rule it restyles without changing that page's style text.
   Light is the default; <html data-theme="dark"> is the night appearance.
   ============================================================ */

@font-face { font-family: "Inter Tight";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/inter-tight-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---------- Tokens: light ---------- */
html.ep { color-scheme: light !important; --ep-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter Tight", "Inter", "Helvetica Neue", system-ui, sans-serif; --ep-bg: #F5F6F8; --ep-canvas-glow: radial-gradient(ellipse at 75% 20%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.45) 28%, rgba(255,255,255,0) 65%), linear-gradient(135deg, #F8F9FA 0%, #F2F4F6 50%, #E9ECF0 100%); --ep-canvas-opacity: .95; --ep-surface: #FFFFFF; --ep-surface-soft: #FAFBFC; --ep-surface-2: #F2F4F7; --ep-surface-3: #E8EBEF; --ep-panel-gradient: linear-gradient(145deg, rgba(255,255,255,.88), rgba(245,247,249,.72)); --ep-panel-edge: rgba(255,255,255,.70); --ep-nav-hover: rgba(255,255,255,.55); --ep-nav-active: #FFFFFF; --ep-glass-strong: rgba(255,255,255,.88); --ep-search-gradient: linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,249,251,.76)); --ep-line: #ECEEF2; --ep-line-2: #E4E7EC; --ep-line-3: #D8DDE4; --ep-text: #111318; --ep-text-2: #536078; --ep-text-3: #7D899E; --ep-accent: #17191D; --ep-accent-gradient: linear-gradient(180deg, #292C31 0%, #17191D 100%); --ep-accent-gradient-hover: linear-gradient(180deg, #34383E 0%, #202329 100%); --ep-avatar-gradient: linear-gradient(145deg, #34373C 0%, #17191D 55%, #0C0E11 100%); --ep-on-accent: #FFFFFF; --ep-link: #007AFF; --ep-ring: rgba(0,122,255,.26); --ep-knob: #FFFFFF; --ep-good: #167A3A; --ep-good-tint: #EAF9EF; --ep-good-dot: #30D158; --ep-warn: #9C5A00; --ep-warn-tint: #FFF4E5; --ep-warn-dot: #FF9500; --ep-bad: #D32B22; --ep-bad-tint: #FFF0EF; --ep-bad-dot: #FF3B30; --ep-tint-blue: #007AFF; --ep-tint-blue-bg: linear-gradient(135deg, #EAF3FF, #F5F9FF); --ep-tint-violet: #AF52DE; --ep-tint-violet-bg: linear-gradient(135deg, #F5EAFE, #FCF8FE); --ep-tint-orange: #FF9500; --ep-tint-orange-bg: linear-gradient(135deg, #FFF4E5, #FFFAF4); --ep-tint-green: #30D158; --ep-tint-green-bg: linear-gradient(135deg, #EAF9EF, #F7FCF8); --ep-tint-red: #FF3B30; --ep-tint-red-bg: linear-gradient(135deg, #FFF0EF, #FFF7F6); --ep-tint-gray: #536078; --ep-tint-gray-bg: linear-gradient(135deg, #F0F2F5, #F7F8FA); --ep-shadow-card: 0 1px .1286rem rgba(15,23,42,.03), 0 .5143rem 1.5429rem rgba(15,23,42,.045); --ep-shadow-float: 0 1.5429rem 3.8571rem rgba(15,23,42,.09), 0 .1286rem .3857rem rgba(15,23,42,.05); --ep-shadow-pill: 0 1px .1286rem rgba(15,23,42,.04), 0 .3857rem 1.0286rem rgba(15,23,42,.06); --ep-shadow-panel: 0 .1286rem .3857rem rgba(15,23,42,.04), 0 1.1571rem 2.8286rem rgba(15,23,42,.08); --ep-shadow-primary: 0 .6429rem 1.5429rem rgba(15,23,42,.18); --ep-scrim: rgba(15,23,42,.3); --ep-r-panel: 1.5429rem; --ep-r-card: 1.1571rem; --ep-r-control: .7714rem; --ep-r-sm: .6429rem; --ep-r-pill: 642.793rem; --ep-sidebar: 19.1429rem; --ep-gutter: 1.2857rem; --ep-ease: cubic-bezier(.2,.7,.2,1); --ep-fast: 160ms; --ep-med: 240ms; --ep-hero-render: url("elephant-chrome.webp"); --ep-canvas-render: url("hero-background.webp"); /* the page's own tokens, mapped onto the same palette */
  --bg: var(--ep-surface); --fill: var(--ep-surface); --fill-2: var(--ep-surface-2);
  --text: var(--ep-text); --ink: var(--ep-text); --text-2: var(--ep-text-2); --text-3: var(--ep-text-3);
  --line: var(--ep-line); --line-2: var(--ep-line-2);
  --accent: var(--ep-link); --accent-fill: var(--ep-accent); --accent-pill: var(--ep-accent); --accent-press: #24272C;
  --accent-soft: var(--ep-surface-2); --accent-text: var(--ep-link); --on-accent: var(--ep-on-accent);
  --tint-fill: var(--ep-accent); --tint-fill-press: #24272C;
  --up: var(--ep-good); --down: var(--ep-bad); --navy: var(--ep-accent);
  --radius: var(--ep-r-control); --sidebar: var(--ep-sidebar); --font: var(--ep-font);

  /* Agent and Agency tokens */
  --ep-tint-soft: #EAF3FF;
  --card: var(--ep-surface); --card-hover: var(--ep-surface-2); --hairline: var(--ep-line); --canvas: var(--ep-bg); --chrome: var(--ep-surface);
  --tint: var(--ep-link); --tint-text: var(--ep-link); --tint-soft: var(--ep-tint-soft); --tint-press: #0066D6;
  --red: var(--ep-bad-dot); --red-text: var(--ep-bad); --red-soft: var(--ep-bad-tint); --red-ink: var(--ep-bad); --red-line: var(--ep-bad); --red-fill: var(--ep-bad-tint);
  --green: var(--ep-good-dot); --green-text: var(--ep-good); --green-soft: var(--ep-good-tint); --green-ink: var(--ep-good); --green-line: var(--ep-good); --green-fill: var(--ep-good-tint);
  --orange: var(--ep-warn-dot); --orange-text: var(--ep-warn); --orange-soft: var(--ep-warn-tint); --orange-ink: var(--ep-warn);
  --gray: var(--ep-text-3); --gray-soft: var(--ep-surface-2); --grey-line: var(--ep-text-3); --grey-fill: var(--ep-surface-2); --flat: var(--ep-text-2);
  --sev-critical: var(--ep-bad); --sev-high: var(--ep-warn); --sev-medium: var(--ep-warn); --sev-low: var(--ep-good);
  --r-chip: .4286rem; --r-control: var(--ep-r-control); --r-card: var(--ep-r-card); --r-pill: var(--ep-r-pill);
  --link: var(--ep-link); --sep: var(--ep-line); --control: var(--ep-surface-2); --control-hover: var(--ep-surface-3);
  --side-bg: transparent; --grouped: var(--ep-surface);
  --g: var(--ep-surface); --g-hover: var(--ep-surface-2); --g-sep: var(--ep-line);
  --agg-fill: var(--ep-surface); --agg-hover: var(--ep-surface-2); --agg-sep: var(--ep-line); --agg-card: var(--ep-surface);
  --mc-fill: var(--ep-surface); --mc-hover: var(--ep-surface-2); --mc-sep: var(--ep-line);
  --ovg-fill: var(--ep-surface); --ovg-hover: var(--ep-surface-2); --ovg-sep: var(--ep-line);
  --ovs-card: var(--ep-surface); --ovs-peek: var(--ep-surface-soft);
  --nc-bg: var(--ep-surface); --nc-card: var(--ep-surface); --nc-peek: var(--ep-surface-soft); --nc-line: var(--ep-line);
  --lane: var(--ep-surface-2); --lane-over: var(--ep-tint-soft); !important; }

/* ---------- Tokens: night ---------- */
html.ep[data-theme="dark"] { color-scheme: dark !important; --ep-bg: #0B0D10; --ep-canvas-glow: radial-gradient(ellipse at 75% 20%, rgba(255,255,255,.07) 0%, rgba(255,255,255,.03) 30%, rgba(255,255,255,0) 65%), linear-gradient(135deg, #111318 0%, #0B0D10 55%, #0B0D10 100%); --ep-canvas-opacity: .34; --ep-surface: #171A1F; --ep-surface-soft: #1B1E24; --ep-surface-2: #20242A; --ep-surface-3: #2A2E35; --ep-panel-gradient: linear-gradient(145deg, rgba(32,36,42,.9), rgba(23,26,31,.72)); --ep-panel-edge: rgba(255,255,255,.08); --ep-nav-hover: rgba(255,255,255,.05); --ep-nav-active: #2A2E35; --ep-glass-strong: rgba(23,26,31,.9); --ep-search-gradient: linear-gradient(180deg, rgba(32,36,42,.9), rgba(23,26,31,.8)); --ep-line: rgba(255,255,255,.07); --ep-line-2: rgba(255,255,255,.12); --ep-line-3: rgba(255,255,255,.18); --ep-text: #F5F6F8; --ep-text-2: #B9C0C9; --ep-text-3: #9DA5B0; --ep-accent: #F5F6F8; --ep-accent-gradient: linear-gradient(180deg, #FFFFFF 0%, #E8EBEF 100%); --ep-accent-gradient-hover: linear-gradient(180deg, #F8F9FA 0%, #DDE1E6 100%); --ep-avatar-gradient: linear-gradient(145deg, #FFFFFF 0%, #E8EBEF 55%, #CDD2D9 100%); --ep-on-accent: #0B0D10; --ep-link: #3395FF; --ep-ring: rgba(51,149,255,.35); --ep-good: #4CD964; --ep-good-tint: rgba(48,209,88,.14); --ep-good-dot: #30D158; --ep-warn: #FFB340; --ep-warn-tint: rgba(255,149,0,.14); --ep-warn-dot: #FF9500; --ep-bad: #FF6B5F; --ep-bad-tint: rgba(255,59,48,.14); --ep-bad-dot: #FF3B30; --ep-tint-blue: #3395FF; --ep-tint-blue-bg: rgba(51,149,255,.14); --ep-tint-violet: #C07BEA; --ep-tint-violet-bg: rgba(175,82,222,.16); --ep-tint-orange: #FFB340; --ep-tint-orange-bg: rgba(255,149,0,.14); --ep-tint-green: #4CD964; --ep-tint-green-bg: rgba(48,209,88,.14); --ep-tint-red: #FF6B5F; --ep-tint-red-bg: rgba(255,59,48,.14); --ep-tint-gray: #B9C0C9; --ep-tint-gray-bg: rgba(185,192,201,.12); --ep-shadow-card: none; --ep-shadow-float: 0 1.9286rem 3.8571rem rgba(0,0,0,.6); --ep-shadow-pill: none; --ep-shadow-panel: none; --ep-shadow-primary: 0 .6429rem 1.5429rem rgba(0,0,0,.4); --ep-scrim: rgba(0,0,0,.5); --accent-press: #E8EBEF; --tint-fill-press: #E8EBEF; --ep-tint-soft: rgba(51,149,255,.14); --tint-press: #66B0FF; }

/* Agency pages define their fills on <main>; the same mapping is repeated there so it wins. */
html.ep main, html.ep .drawer, html.ep .pdlg, html.ep .popover { --g: var(--ep-surface); --g-hover: var(--ep-surface-2); --g-sep: var(--ep-line); --agg-fill: var(--ep-surface); --agg-hover: var(--ep-surface-2); --agg-sep: var(--ep-line); --agg-card: var(--ep-surface-2); --mc-fill: var(--ep-surface); --mc-hover: var(--ep-surface-2); --mc-sep: var(--ep-line); --ovg-fill: var(--ep-surface); --ovg-hover: var(--ep-surface-2); --ovg-sep: var(--ep-line); --ovs-card: var(--ep-surface-2); --ovs-peek: var(--ep-surface-soft); --nc-bg: var(--ep-surface); --nc-card: var(--ep-surface); --nc-peek: var(--ep-surface-soft); --nc-line: var(--ep-line); --lane: var(--ep-surface); --lane-over: var(--ep-tint-soft); --grouped: var(--ep-surface); --card: var(--ep-surface); --card-hover: var(--ep-surface-2); --hairline: var(--ep-line); --sep: var(--ep-line); --control: var(--ep-surface-2); --control-hover: var(--ep-surface-3); }

/* ---------- Base ---------- */
/* Fluid scale, as in Admin: 1rem = 14px at a 1470px-wide window. Phones keep the reference size. */
html.ep { font-size: clamp(12.25px, .9524vw, 16px) !important; background: var(--ep-bg) !important; -webkit-text-size-adjust: 100% !important; }
@media (max-width: 820px) { html.ep { font-size: 14px !important; } }
html.ep body { background: transparent !important; color: var(--ep-text) !important; font-family: var(--ep-font) !important; font-size: .9rem !important; line-height: 1.45 !important; letter-spacing: -.005em !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; min-height: 100vh !important; overflow: visible !important; overflow-x: clip !important; position: relative !important; }
html.ep body::before { content: ""; position: fixed !important; inset: 0 !important; background: var(--ep-canvas-glow) !important; pointer-events: none; z-index: -1 !important; }
html.ep body::after { content: ""; position: absolute !important; top: 0 !important; right: 0 !important; width: min(62vw, 73.9286rem) !important; height: min(46vh, 34.7143rem) !important; background: var(--ep-canvas-render) right top / auto 100% no-repeat !important; opacity: var(--ep-canvas-opacity); pointer-events: none; z-index: -1 !important; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 38%), linear-gradient(0deg, transparent 0, #000 30%) !important; -webkit-mask-composite: source-in !important; mask-image: linear-gradient(90deg, transparent 0, #000 38%), linear-gradient(0deg, transparent 0, #000 30%) !important; mask-composite: intersect !important; }
html.ep.ep-booting body { visibility: hidden; }
html.ep :focus-visible { outline: .1286rem solid var(--ep-link) !important; outline-offset: .1286rem !important; }
html.ep ::selection { background: var(--ep-ring) !important; }
html.ep .ep-src { display: none !important; }
html.ep .ep-hide { display: none !important; }
html.ep .skip { background: var(--ep-accent) !important; color: var(--ep-on-accent) !important; border-radius: var(--ep-r-pill) !important; }

/* Monochrome elephant mark: masked so the style sheet controls its colour. */
html.ep .ep-mark { display: inline-block; width: 2.8571rem !important; height: 2.8571rem !important; flex: 0 0 auto !important; background: currentColor !important; -webkit-mask: url("elephant-mark.svg") center / contain no-repeat !important; mask: url("elephant-mark.svg") center / contain no-repeat !important; }

/* ---------- Shell ---------- */
html.ep .shell { position: relative !important; z-index: auto !important; display: grid; grid-template-columns: var(--ep-sidebar) minmax(0, 1fr) !important; gap: 1.4143rem !important; padding: var(--ep-gutter) !important; align-items: start !important; min-height: 100vh !important; }
html.ep main { position: relative !important; min-width: 0 !important; width: 100% !important; max-width: 90rem !important; margin: 0 auto !important; padding: 0 .2571rem 2.0571rem !important; animation: ep-pagein .3s var(--ep-ease); }
html.ep main, html.ep #view-live { background: transparent !important; }
html.ep #view-live, html.ep main > .pg, html.ep main .pg, html.ep main > .head, html.ep main > section, html.ep main > nav, html.ep main .wrap { max-width: none !important; }
@keyframes ep-pagein { from { opacity: 0; transform: translateY(.3857rem); } to { opacity: 1; transform: none; } }

/* ---------- Sidebar ---------- */
html.ep .side { position: sticky !important; top: var(--ep-gutter) !important; height: calc(100vh - var(--ep-gutter) * 2) !important; display: flex; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; border: 1px solid var(--ep-panel-edge) !important; border-radius: var(--ep-r-panel) !important; background: var(--ep-panel-gradient) !important; -webkit-backdrop-filter: saturate(160%) blur(1.5429rem) !important; backdrop-filter: saturate(160%) blur(1.5429rem) !important; box-shadow: var(--ep-shadow-panel) !important; padding: 1.4286rem 1.1429rem 1.1429rem !important; overflow: visible !important; width: auto !important; }
html.ep .ep-brand { display: flex; align-items: center !important; gap: .8571rem !important; padding: .1429rem .5714rem 1.2857rem !important; color: var(--ep-text) !important; }
html.ep .ep-brand-text { display: flex; flex-direction: column !important; line-height: 1.05 !important; }
html.ep .ep-brand-word { font-size: 1.1429rem !important; font-weight: 700 !important; letter-spacing: .06em !important; }
html.ep .ep-brand-sub { margin-top: .2143rem !important; font-size: .75rem !important; letter-spacing: .16em !important; color: var(--ep-text-2) !important; font-weight: 600 !important; }
html.ep .ep-nav { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; scrollbar-width: thin !important; margin: 0 -.2571rem !important; padding: 0 .2571rem !important; }
html.ep .ep-nav-item { width: 100% !important; border: 1px solid transparent !important; background: transparent !important; color: var(--ep-text-2) !important; display: flex; align-items: center !important; gap: .8571rem !important; border-radius: var(--ep-r-control) !important; padding: 0 1rem !important; min-height: 3rem !important; margin: .1429rem 0 !important; cursor: pointer; text-align: left !important; text-decoration: none !important; font-size: 1.0357rem !important; white-space: nowrap !important; font-weight: 500 !important; transition: background var(--ep-fast), color var(--ep-fast), box-shadow var(--ep-fast), transform var(--ep-fast) var(--ep-ease); }
html.ep .ep-nav-item svg { width: 1.3571rem !important; height: 1.3571rem !important; flex: 0 0 1.3571rem !important; stroke-width: 1.6 !important; color: inherit !important; }
html.ep .ep-nav-item:hover { background: var(--ep-nav-hover) !important; color: var(--ep-text) !important; }
html.ep .ep-nav-item:active { transform: scale(.99); }
html.ep .ep-nav-item.active { background: var(--ep-nav-active) !important; color: var(--ep-text) !important; border-color: var(--ep-panel-edge) !important; box-shadow: 0 1px .1286rem rgba(15,23,42,.04), 0 .5143rem 1.2857rem rgba(15,23,42,.07) !important; font-weight: 600 !important; }
html.ep[data-theme="dark"] .ep-nav-item.active { box-shadow: none !important; }

/* workspace switcher: kept, in the same quiet pill language */
html.ep .switchwrap, html.ep .agencyid { margin: 0 0 .5714rem !important; position: relative !important; }
html.ep .switcher, html.ep .agencyid { display: flex; align-items: center !important; gap: .7143rem !important; width: 100% !important; padding: .5rem .7857rem .5rem .5714rem !important; border: 1px solid var(--ep-line) !important; border-radius: 1.1429rem !important; background: var(--ep-surface) !important; box-shadow: var(--ep-shadow-pill) !important; color: var(--ep-text) !important; margin: 0 !important; text-align: left !important; }
html.ep .agencyid { margin-bottom: .5714rem !important; }
html.ep button.switcher { cursor: pointer; }
html.ep .switcher:hover, html.ep .switcher[aria-expanded="true"] { background: var(--ep-surface-2) !important; }
html.ep .switcher .badge, html.ep .agencyid .badge, html.ep .bizmenu .badge { width: 2.2857rem !important; height: 2.2857rem !important; border-radius: .7143rem !important; background: var(--ep-surface-2) !important; color: var(--ep-text) !important; border: 1px solid var(--ep-line) !important; font-size: .8571rem !important; font-weight: 600 !important; display: grid; place-items: center !important; flex: none !important; }
html.ep .switcher .who, html.ep .agencyid .who { min-width: 0 !important; flex: 1 !important; display: grid; line-height: 1.25 !important; }
html.ep .switcher .who b, html.ep .agencyid .who b { font-size: .9286rem !important; font-weight: 600 !important; color: var(--ep-text) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
html.ep .switcher .who span, html.ep .agencyid .who span { font-size: .8rem !important; color: var(--ep-text-2) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; display: block; }
html.ep .switcher > svg { color: var(--ep-text-3) !important; width: 1rem !important; height: 1rem !important; flex: none !important; display: block; }
html.ep .bizmenu { left: 0 !important; right: 0 !important; width: auto !important; top: auto !important; bottom: calc(100% + .4286rem) !important; max-height: 60vh !important; overflow: auto !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; background: var(--ep-surface) !important; box-shadow: var(--ep-shadow-float) !important; padding: .5143rem !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html.ep .bizmenu-head { color: var(--ep-text-3) !important; font-size: .7143rem !important; letter-spacing: .12em !important; font-weight: 600 !important; padding: .5rem .6rem .35rem !important; }
html.ep .bizmenu button { border-radius: var(--ep-r-sm) !important; color: var(--ep-text) !important; font-size: .9rem !important; }
html.ep .bizmenu button:hover { background: var(--ep-surface-2) !important; }
html.ep .bizmenu .plain { color: var(--ep-link) !important; }
html.ep .bizmenu button[aria-selected="true"]::after { background: var(--ep-text) !important; }
html.ep .bizmenu-sep { background: var(--ep-line) !important; }

/* account card */
html.ep .ep-user-wrap { position: relative !important; margin-top: .7143rem !important; }
html.ep .ep-user { width: 100% !important; display: flex; align-items: center !important; gap: .7857rem !important; padding: .5714rem .7857rem .5714rem .5714rem !important; border-radius: 1.1429rem !important; border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; box-shadow: var(--ep-shadow-pill) !important; cursor: pointer; text-align: left !important; color: var(--ep-text) !important; font: inherit !important; transition: background var(--ep-fast); }
html.ep .ep-user:hover { background: var(--ep-surface-2) !important; }
html.ep .ep-avatar, html.ep .topbar .avatar { width: 2.8286rem !important; height: 2.8286rem !important; border-radius: 50% !important; background: var(--ep-avatar-gradient) !important; color: var(--ep-on-accent) !important; display: grid; place-items: center !important; font-weight: 600 !important; font-size: .9rem !important; letter-spacing: .02em !important; box-shadow: var(--ep-shadow-pill) !important; flex: none !important; border: 0 !important; }
html.ep .ep-user .ep-avatar { width: 2.7143rem !important; height: 2.7143rem !important; font-size: .9286rem !important; box-shadow: none !important; }
html.ep .ep-who { min-width: 0 !important; flex: 1 1 auto !important; display: grid; line-height: 1.25 !important; }
html.ep .ep-who b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
html.ep .ep-who span { font-size: .8571rem !important; color: var(--ep-text-2) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html.ep .ep-user > svg { width: 1.2143rem !important; height: 1.2143rem !important; color: var(--ep-text-3) !important; flex: 0 0 auto !important; stroke-width: 1.7 !important; }
html.ep .ep-side-backdrop { display: none; }

/* ---------- Top right ---------- */
html.ep .topbar { position: relative !important; top: auto !important; right: auto !important; left: auto !important; z-index: 6 !important; display: flex; align-items: center !important; justify-content: flex-end !important; gap: .6429rem !important; height: auto !important; min-height: 2.8286rem !important; margin: 0 0 1.1571rem !important; padding: .1286rem 0 0 !important; background: none !important; border: 0 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html.ep body > .topbar { visibility: hidden; position: absolute !important; }
html.ep .topbar .lockup, html.ep .topbar .navtitle, html.ep .topbar > .spacer { display: none; }
html.ep .ep-top-tools { display: flex; align-items: center !important; gap: .6429rem !important; min-width: 0 !important; }
html.ep .ep-icon-btn, html.ep .topbar .iconbtn { width: 2.8286rem !important; height: 2.8286rem !important; min-width: 0 !important; min-height: 0 !important; border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text) !important; border-radius: 50% !important; display: grid; place-items: center !important; cursor: pointer; padding: 0 !important; box-shadow: var(--ep-shadow-pill) !important; position: relative !important; transition: background var(--ep-fast), transform var(--ep-fast) var(--ep-ease); }
html.ep .ep-icon-btn:hover, html.ep .topbar .iconbtn:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .ep-icon-btn:active, html.ep .topbar .iconbtn:active { transform: scale(.94); }
html.ep .topbar .ep-mobile-menu { display: none; }
html.ep .ep-icon-btn svg, html.ep .topbar .iconbtn svg { width: 1.1571rem !important; height: 1.1571rem !important; stroke-width: 1.7 !important; }
html.ep .topbar .iconbtn .dot { position: absolute !important; top: -.2857rem !important; right: -.2857rem !important; min-width: 1.2857rem !important; height: 1.2857rem !important; padding: 0 .3571rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-bad) !important; color: #fff !important; font-size: .6786rem !important; font-weight: 700 !important; line-height: 1 !important; display: grid; place-items: center !important; border: 2px solid var(--ep-bg) !important; box-sizing: border-box !important; }
html.ep .topbar .iconbtn .dot[hidden], html.ep .topbar .iconbtn .dot:empty { display: none; }
html.ep .topbar .me { border: 0 !important; background: transparent !important; padding: 0 !important; border-radius: 50% !important; cursor: pointer; display: flex; align-items: center !important; gap: 0 !important; min-width: 0 !important; min-height: 0 !important; }
html.ep .topbar .me:hover { background: transparent !important; }
html.ep .topbar .me .hide-sm, html.ep .topbar .me > svg { display: none; }
html.ep .ep-pill { display: flex; align-items: center !important; gap: .5786rem !important; height: 2.8286rem !important; padding: 0 1.0286rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; color: var(--ep-text) !important; font-size: .9rem !important; font-weight: 500 !important; white-space: nowrap !important; box-shadow: var(--ep-shadow-pill) !important; }
html.ep .ep-pill[hidden] { display: none; }
html.ep .ep-pill::before { content: ""; width: .5143rem !important; height: .5143rem !important; border-radius: 50% !important; background: var(--ep-good-dot) !important; box-shadow: 0 0 0 .1929rem var(--ep-good-tint) !important; }
/* Sample data is on screen: an amber dot, and the words stay visible on every screen size. */
html.ep .ep-pill.is-sample::before { background: var(--ep-warn-dot) !important; box-shadow: 0 0 0 .1929rem var(--ep-warn-tint) !important; }

/* Collapsible filter: an icon circle that opens into a field on hover, focus or while it holds text */
html.ep .ep-search { position: relative !important; display: block; width: 2.8286rem !important; height: 2.8286rem !important; flex: 0 0 auto !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; box-shadow: var(--ep-shadow-pill) !important; box-sizing: border-box !important; overflow: hidden !important; transition: width .22s ease, border-color var(--ep-fast), box-shadow var(--ep-fast); }
html.ep .ep-search:hover, html.ep .ep-search:focus-within, html.ep .ep-search.has-value { width: min(22rem, 34vw) !important; }
html.ep .ep-search:focus-within { border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; }
html.ep .ep-search > svg { position: absolute !important; left: .85rem !important; top: .85rem !important; width: 1.0286rem !important; height: 1.0286rem !important; color: var(--ep-text-2) !important; pointer-events: none; stroke-width: 1.7 !important; }
html.ep .ep-search input { width: 100% !important; height: 100% !important; border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 1rem 0 2.8286rem !important; font: inherit !important; font-size: .9rem !important; color: var(--ep-text) !important; opacity: 0; cursor: pointer; transition: opacity .15s ease; -webkit-appearance: none !important; appearance: none !important; }
html.ep .ep-search input::placeholder { color: var(--ep-text-3) !important; }
html.ep .ep-search input::-webkit-search-cancel-button { -webkit-appearance: none !important; }
html.ep .ep-search:hover input, html.ep .ep-search:focus-within input, html.ep .ep-search.has-value input { opacity: 1; cursor: text; }
html.ep .ep-search-empty { margin: 0 0 1rem !important; color: var(--ep-text-3) !important; font-size: .9rem !important; }

/* popovers under the top-right controls */
html.ep .popover { position: fixed !important; top: calc(var(--ep-gutter) + 3.4714rem) !important; right: calc(var(--ep-gutter) + .2571rem) !important; left: auto !important; bottom: auto !important; width: min(25rem, calc(100vw - 2rem)) !important; max-height: min(72vh, 42rem) !important; overflow: auto !important; border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-float) !important; padding: .5143rem !important; z-index: 60 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; color: var(--ep-text) !important; animation: ep-rise var(--ep-med) var(--ep-ease); transform-origin: top right; }
html.ep .popover::before { content: none; }
html.ep .me-menu { width: 16.0714rem !important; }
@keyframes ep-rise { from { opacity: 0; transform: translateY(.6429rem) scale(.98); } to { opacity: 1; transform: none; } }
html.ep.ep-menu-side .me-menu { top: auto !important; right: auto !important; left: calc(var(--ep-gutter) + 1.1429rem) !important; bottom: calc(var(--ep-gutter) + 5rem) !important; width: calc(var(--ep-sidebar) - 2.2857rem) !important; transform-origin: bottom left; }
html.ep .popover .pop-head { display: flex; align-items: center !important; gap: .6rem !important; padding: .45rem .6rem .65rem !important; border-bottom: 1px solid var(--ep-line) !important; min-height: 0 !important; }
html.ep .popover .pop-head b { font-size: .95rem !important; font-weight: 600 !important; flex: 1 !important; }
html.ep .popover .pop-head .link { min-height: 0 !important; color: var(--ep-link) !important; font-size: .8357rem !important; }
html.ep .popover .notif { display: flex; gap: .7rem !important; align-items: center !important; padding: .5rem .6rem .5rem .8rem !important; border-radius: var(--ep-r-sm) !important; min-height: 0 !important; position: relative !important; }
html.ep .popover .notif:hover { background: var(--ep-surface-2) !important; }
html.ep .popover .notif .unread { width: .4286rem !important; height: .4286rem !important; border-radius: 50% !important; background: var(--ep-tint-blue) !important; margin: 0 !important; flex: none !important; }
html.ep .popover .notif.read .unread { background: transparent !important; }
html.ep .popover .notif b { font-size: .9rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .popover .notif span { font-size: .8214rem !important; color: var(--ep-text-2) !important; }
html.ep .popover .notif time { font-size: .75rem !important; color: var(--ep-text-3) !important; }
html.ep .popover .pop-foot { display: flex; justify-content: center !important; align-items: center !important; min-height: 0 !important; margin-top: .4rem !important; border-top: 1px solid var(--ep-line) !important; padding: .75rem .6rem .45rem !important; color: var(--ep-link) !important; font-size: .85rem !important; font-weight: 500 !important; text-decoration: none !important; }
html.ep .popover .pop-empty { padding: .9rem .6rem !important; color: var(--ep-text-2) !important; font-size: .9rem !important; text-align: left !important; }
html.ep .popover .pop-id { display: flex; gap: .7143rem !important; align-items: center !important; padding: .7714rem !important; border-bottom: 1px solid var(--ep-line) !important; margin-bottom: .3857rem !important; }
html.ep .popover .pop-id .avatar { width: 2.4286rem !important; height: 2.4286rem !important; border-radius: 50% !important; background: var(--ep-avatar-gradient) !important; color: var(--ep-on-accent) !important; font-size: .8571rem !important; font-weight: 600 !important; display: grid; place-items: center !important; flex: none !important; }
html.ep .popover .pop-id b { display: block; font-size: .9rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .popover .pop-id span span { display: block; font-size: .7714rem !important; color: var(--ep-text-2) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html.ep .popover a[role="menuitem"], html.ep .popover button[role="menuitem"], html.ep .popover .pop-link { display: flex; align-items: center !important; width: 100% !important; min-height: 0 !important; text-align: left !important; border: 0 !important; background: transparent !important; padding: .6429rem .7714rem !important; border-radius: var(--ep-r-sm) !important; cursor: pointer; color: var(--ep-text) !important; font: inherit !important; font-size: .9rem !important; text-decoration: none !important; }
html.ep .popover a[role="menuitem"]:hover, html.ep .popover button[role="menuitem"]:hover, html.ep .popover .pop-link:hover { background: var(--ep-surface-2) !important; }
html.ep .popover button.danger, html.ep .popover .danger { color: var(--ep-bad) !important; }
html.ep .pop-sep { height: 1px !important; background: var(--ep-line) !important; margin: .3571rem .5714rem !important; }
html.ep .pop-scrim, html.ep .pop-scrim.on { background: transparent !important; }

/* ---------- Section buttons above a page ---------- */
html.ep .ep-subnav { display: flex; gap: .5143rem !important; flex-wrap: wrap !important; margin: 0 0 1.1571rem !important; position: relative !important; z-index: 1 !important; }
html.ep .ep-subnav-btn { display: inline-flex; align-items: center !important; gap: .5143rem !important; min-height: 2.3143rem !important; padding: 0 .9rem !important; border-radius: var(--ep-r-pill) !important; border: 1px solid var(--ep-line-2) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; font-size: .8357rem !important; font-weight: 500 !important; cursor: pointer; text-decoration: none !important; white-space: nowrap !important; box-shadow: var(--ep-shadow-pill) !important; transition: background var(--ep-fast), color var(--ep-fast), transform var(--ep-fast); }
html.ep .ep-subnav-btn svg { width: .9643rem !important; height: .9643rem !important; stroke-width: 1.7 !important; color: inherit !important; flex: none !important; }
html.ep .ep-subnav-btn:hover { color: var(--ep-text) !important; background: var(--ep-surface-2) !important; }
html.ep .ep-subnav-btn:active { transform: scale(.98); }
html.ep .ep-subnav-btn.active { color: var(--ep-on-accent) !important; background: var(--ep-accent-gradient) !important; border-color: transparent !important; font-weight: 600 !important; }

/* ---------- Page head ---------- */
/* The head sits above the tabs, toolbars and cards that follow it, so its date and export menus open over them. */
html.ep .head.ep-head { position: relative !important; z-index: 4 !important; display: flex; flex-wrap: wrap !important; align-items: center !important; gap: .6429rem !important; margin: 0 0 1.8rem !important; min-height: 0 !important; }
html.ep .head.ep-head::after { content: ""; position: absolute !important; left: 0 !important; right: 0 !important; bottom: -.9rem !important; height: 1px !important; background: linear-gradient(90deg, rgba(15,23,42,0) 0%, var(--ep-line-3) 6%, var(--ep-line-3) 94%, rgba(15,23,42,0) 100%) !important; pointer-events: none; }
html.ep .head.ep-head > .ep-head-copy { flex: 0 0 100% !important; max-width: none !important; position: relative !important; z-index: 1 !important; align-self: auto !important; margin: 0 0 .1286rem !important; }
html.ep .head.ep-head > .ep-head-copy > * { max-width: 33.4286rem !important; }
html.ep .head.ep-head { max-width: none !important; width: auto !important; margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; text-align: left !important; }
html.ep .head.ep-head > .spacer { display: none; }
/* The title block stays a block on every screen, so the label, the title and the line under it read in that order. */
html.ep .head.ep-head:not([hidden]) { display: flex !important; }
html.ep .head.ep-head > .ep-head-copy { display: block !important; }
html.ep .head.ep-head h1, html.ep .head.ep-head .when, html.ep .head.ep-head .sub { grid-area: auto !important; flex: 0 1 auto !important; }
html.ep .head.ep-head > .headtools { flex: 0 0 auto !important; width: auto !important; display: flex; align-items: center !important; gap: .6429rem !important; }
html.ep .head.ep-head > *:not(.ep-hero-art):not(.ep-hero-tagline) { position: relative !important; z-index: 1 !important; }
html.ep .head.ep-head > .datepill, html.ep .head.ep-head > .menuwrap, html.ep .head.ep-head > .btn, html.ep .head.ep-head > .chip, html.ep .head.ep-head > .headtools { margin: 0 !important; align-self: center !important; }
html.ep .ep-eyebrow { font-size: .7714rem !important; font-weight: 600 !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--ep-text-2) !important; }
html.ep main h1 { margin: .3857rem 0 !important; font-size: clamp(1.9286rem, 3vw, 2.8286rem) !important; line-height: 1.02 !important; letter-spacing: -.035em !important; font-weight: 700 !important; color: var(--ep-text) !important; text-wrap: balance !important; }
html.ep .head .when, html.ep .head .sub { margin: 0 !important; color: var(--ep-text-2) !important; font-size: .9643rem !important; line-height: 1.45 !important; }
/* The artwork never reaches past the head, so it cannot lie over the cards that follow. */
html.ep .ep-hero-art { position: absolute !important; z-index: 0 !important; pointer-events: none; width: clamp(15.4286rem, 27vw, 27rem) !important; top: -.7714rem !important; bottom: -.9rem !important; right: clamp(7.7143rem, 14vw, 14.7857rem) !important; }
html.ep .ep-hero-art::before { content: ""; position: absolute !important; inset: 0 !important; background: var(--ep-hero-render) right bottom / contain no-repeat !important; filter: drop-shadow(0 .3857rem .6429rem rgba(15,23,42,.18)) !important; }
html.ep .ep-hero-tagline { position: absolute !important; right: .5143rem !important; top: .5143rem !important; width: 11.3143rem !important; font-size: .9rem !important; line-height: 1.5 !important; color: var(--ep-text) !important; z-index: 1 !important; pointer-events: none; }
html.ep .ep-hero-tagline .ep-rule { display: block; width: 2.3143rem !important; height: 1px !important; background: var(--ep-line-2) !important; margin-top: .9rem !important; }
/* a head with no actions keeps the height of one that has them, so the elephant keeps its size */
@media (min-width: 821px) { html.ep .head.ep-head { min-height: 11.1714rem !important; align-content: flex-start !important; } }

/* ---------- Buttons and header controls ---------- */
html.ep .btn { min-height: 2.5714rem !important; height: auto !important; padding: 0 1.0286rem !important; border-radius: var(--ep-r-pill) !important; border: 1px solid transparent !important; background: var(--ep-accent-gradient) !important; color: var(--ep-on-accent) !important; font-weight: 600 !important; font-size: .9rem !important; cursor: pointer; display: inline-flex; gap: .5143rem !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; text-decoration: none !important; box-shadow: var(--ep-shadow-pill) !important; transition: transform var(--ep-fast) var(--ep-ease), background var(--ep-fast), border-color var(--ep-fast), box-shadow var(--ep-fast); }
/* Primary actions the pages address by id: same fill, and text that reads on it in light and at night. */
html.ep #on-invite, html.ep #drawer .actions #d-call, html.ep .dropzone .dropacts #snap { background: var(--ep-accent-gradient) !important; color: var(--ep-on-accent) !important; border-color: transparent !important; }
html.ep .dropzone > svg { color: var(--ep-text-3) !important; }
html.ep .dropzone .btn svg { color: currentColor !important; margin: 0 !important; }
html.ep .btn:hover { background: var(--ep-accent-gradient-hover) !important; transform: translateY(-1px); }
html.ep .btn:active { transform: scale(.98); }
html.ep .btn.quiet, html.ep .btn.secondary { background: var(--ep-surface) !important; color: var(--ep-text) !important; border-color: var(--ep-line-2) !important; font-weight: 500 !important; box-shadow: none !important; }
html.ep .btn.quiet:hover, html.ep .btn.secondary:hover { background: var(--ep-surface-2) !important; transform: none; }
html.ep .btn:disabled, html.ep .btn[disabled], html.ep .btn[aria-disabled="true"] { cursor: not-allowed; opacity: .4; transform: none !important; box-shadow: none !important; }
html.ep .btn:disabled:not(.busy) { background: var(--ep-accent-gradient) !important; color: var(--ep-on-accent) !important; }
html.ep .btn.quiet:disabled:not(.busy), html.ep .btn.secondary:disabled:not(.busy) { background: var(--ep-surface) !important; color: var(--ep-text) !important; }
html.ep .head .btn { min-height: 2.8286rem !important; height: 2.8286rem !important; padding: 0 1.1571rem !important; font-size: .9643rem !important; box-shadow: var(--ep-shadow-primary) !important; }
html.ep .head .btn.quiet, html.ep .head .btn.secondary { box-shadow: var(--ep-shadow-pill) !important; }
html.ep .link, html.ep a.link, html.ep button.link { color: var(--ep-link) !important; font-size: .8357rem !important; min-height: 0 !important; }

html.ep .datepill, html.ep .head .datepill { position: relative !important; display: inline-flex; align-items: center !important; height: 2.8286rem !important; min-height: 2.8286rem !important; padding: 0 .1929rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line-2) !important; box-shadow: var(--ep-shadow-pill) !important; width: auto !important; }
html.ep .datepill button { color: var(--ep-text) !important; }
html.ep .datepill .label, html.ep .head .datepill .label { height: 2.4429rem !important; min-height: 0 !important; padding: 0 .9rem !important; font-size: .9rem !important; font-weight: 600 !important; letter-spacing: -.01em !important; display: inline-flex; align-items: center !important; color: var(--ep-text) !important; border-radius: var(--ep-r-pill) !important; }
html.ep .datepill .label::after { content: none; }
html.ep .datepill .step, html.ep .head .datepill .step { width: 2.4429rem !important; height: 2.4429rem !important; min-height: 0 !important; border-radius: 50% !important; display: inline-grid; place-items: center !important; color: var(--ep-text-2) !important; }
html.ep .datepill .step:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .datepill .step:disabled { color: var(--ep-text-3) !important; opacity: .45; background: none !important; }
html.ep .rangemenu { border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; background: var(--ep-surface) !important; box-shadow: var(--ep-shadow-float) !important; padding: .5143rem !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; min-width: 15rem !important; z-index: 40 !important; }
html.ep .rangemenu button { color: var(--ep-text) !important; font-size: .9rem !important; border-radius: var(--ep-r-sm) !important; min-height: 0 !important; padding: .6rem .7714rem .6rem 2.1rem !important; }
html.ep .rangemenu [role="menuitem"] { padding-left: .7714rem !important; }
html.ep .rangemenu button:hover { background: var(--ep-surface-2) !important; }
html.ep .rangemenu button[aria-selected="true"] { font-weight: 600 !important; }
html.ep .rangemenu button[aria-selected="true"]::before { background: var(--ep-text) !important; }

html.ep .chip { border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; min-height: 2.3143rem !important; padding: 0 .9rem !important; border-radius: var(--ep-r-pill) !important; font-size: .8357rem !important; font-weight: 500 !important; cursor: pointer; box-shadow: var(--ep-shadow-pill) !important; display: inline-flex; align-items: center !important; gap: .3857rem !important; transition: background var(--ep-fast), color var(--ep-fast); }
html.ep .chip:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .chip[aria-pressed="true"], html.ep .chip.active { background: var(--ep-accent-gradient) !important; border-color: transparent !important; color: var(--ep-on-accent) !important; }
html.ep .chip.more, html.ep .head .chip.more { width: 2.8286rem !important; height: 2.8286rem !important; min-height: 0 !important; padding: 0 !important; border-radius: 50% !important; display: grid; place-items: center !important; color: var(--ep-text) !important; }

/* ---------- Cards: metrics, tiles, panels ---------- */
html.ep .metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1.0286rem !important; margin: 0 0 1.0286rem !important; }
html.ep .metric { position: relative !important; display: grid; grid-template-columns: auto minmax(0, 1fr) auto !important; grid-template-rows: auto 1fr auto !important; column-gap: .7714rem !important; align-items: center !important; align-content: space-between !important; min-height: 7.5857rem !important; padding: .9rem 1.2857rem .7714rem !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; overflow: hidden !important; cursor: pointer; transition: transform var(--ep-med) var(--ep-ease), box-shadow var(--ep-med); }
html.ep .metric:hover { background: var(--ep-surface) !important; transform: translateY(-.1286rem); box-shadow: var(--ep-shadow-float) !important; }
html.ep .metric.open { cursor: default; transform: none; }
html.ep .ep-metric-icon { grid-column: 1 !important; grid-row: 1 !important; width: 2.4429rem !important; height: 2.4429rem !important; border-radius: .7714rem !important; background: var(--ep-tint-bg, var(--ep-surface-2)) !important; color: var(--ep-tint, var(--ep-accent)) !important; display: grid; place-items: center !important; flex: 0 0 auto !important; }
html.ep .ep-metric-icon svg { width: 1.0929rem !important; height: 1.0929rem !important; stroke-width: 1.7 !important; }
html.ep .ep-tint-blue { --ep-tint: var(--ep-tint-blue); --ep-tint-bg: var(--ep-tint-blue-bg); }
html.ep .ep-tint-violet { --ep-tint: var(--ep-tint-violet); --ep-tint-bg: var(--ep-tint-violet-bg); }
html.ep .ep-tint-orange { --ep-tint: var(--ep-tint-orange); --ep-tint-bg: var(--ep-tint-orange-bg); }
html.ep .ep-tint-green { --ep-tint: var(--ep-tint-green); --ep-tint-bg: var(--ep-tint-green-bg); }
html.ep .ep-tint-red { --ep-tint: var(--ep-tint-red); --ep-tint-bg: var(--ep-tint-red-bg); }
html.ep .ep-tint-gray { --ep-tint: var(--ep-tint-gray); --ep-tint-bg: var(--ep-tint-gray-bg); }
html.ep .metric .label { grid-column: 2 / -1 !important; grid-row: 1 !important; color: var(--ep-text-2) !important; font-size: .8714rem !important; font-weight: 500 !important; line-height: 1.25 !important; letter-spacing: 0 !important; text-transform: none !important; min-width: 0 !important; }
html.ep .metric .value { grid-column: 1 / 3 !important; grid-row: 2 !important; margin-top: .3857rem !important; font-size: 1.9286rem !important; line-height: 1 !important; letter-spacing: -.035em !important; font-weight: 600 !important; color: var(--ep-text) !important; align-self: end !important; min-width: 0 !important; }
html.ep .metric .sub { grid-column: 1 / -1 !important; grid-row: 3 !important; margin-top: .3214rem !important; min-height: 1.0286rem !important; color: var(--ep-text-3) !important; font-size: .7714rem !important; line-height: 1.35 !important; letter-spacing: -.01em !important; }
html.ep .metric .spark { grid-column: 3 !important; grid-row: 2 !important; align-self: end !important; width: clamp(6.4286rem, 10.6vw, 10.0286rem) !important; height: 2.3143rem !important; margin: .1286rem -.3857rem 0 0 !important; overflow: hidden !important; }
html.ep .metric .spark svg { width: 100% !important; height: 100% !important; display: block; }
html.ep .metric .more { grid-column: 1 / -1 !important; grid-row: 4 !important; border-top: 1px solid var(--ep-line) !important; margin-top: .7714rem !important; padding: .7714rem 0 .2571rem !important; }
html.ep .metric .more div { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .metric .more div b { color: var(--ep-text) !important; font-weight: 600 !important; }
html.ep .metric .chev { top: .7714rem !important; right: .7714rem !important; color: var(--ep-text-3) !important; border-radius: 50% !important; }
html.ep .metric a { color: var(--ep-link) !important; }
html.ep .delta.up { color: var(--ep-good) !important; } html.ep .delta.down { color: var(--ep-bad) !important; }

html.ep .panel { border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; background: var(--ep-surface) !important; box-shadow: var(--ep-shadow-card) !important; }
html.ep .panel.bare { background: var(--ep-surface) !important; border-radius: var(--ep-r-card) !important; }
html.ep .panel + .panel { margin-top: 1.0286rem !important; }
html.ep .panel-head, html.ep .panel.bare .panel-head { display: flex; align-items: center !important; gap: .9rem !important; padding: 1.0286rem 1.4143rem .6429rem !important; }
html.ep .panel-head h2 { margin: 0 !important; font-size: 1.2214rem !important; line-height: 1.2 !important; letter-spacing: -.02em !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .panel-head a { font-size: .8357rem !important; color: var(--ep-link) !important; }
html.ep .panel-body, html.ep .panel.bare .panel-body { padding: .2571rem 1.4143rem 1.0286rem !important; }
html.ep .cols { gap: 1.0286rem !important; }
html.ep .legend { color: var(--ep-text-2) !important; font-size: .7714rem !important; }
html.ep .tip { background: var(--ep-accent) !important; color: var(--ep-on-accent) !important; border-radius: var(--ep-r-sm) !important; }

/* ---------- Lists ---------- */
html.ep .paylist { margin: 0 -1.4143rem !important; }
html.ep .payrow { padding: .6429rem 1.4143rem !important; min-height: 3.6rem !important; gap: .9rem !important; border-top: 1px solid var(--ep-line) !important; color: var(--ep-text) !important; }
html.ep .payrow:first-child { border-top: 0 !important; }
html.ep .payrow:hover { background: var(--ep-surface-2) !important; }
html.ep .payrow .mark { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: .4286rem !important; color: var(--ep-text-2) !important; }
html.ep .mark[style*="background"], html.ep .icon[style*="background"], html.ep .topic[style*="background"] { width: 2.4429rem !important; height: 2.4429rem !important; border-radius: 50% !important; border: 0 !important; background: var(--ep-tint-gray-bg) !important; color: var(--ep-tint-gray) !important; display: grid; place-items: center !important; flex: none !important; }
html.ep .mark[style*="--red"], html.ep .icon[style*="--red"], html.ep .topic[style*="--red"] { background: var(--ep-tint-red-bg) !important; color: var(--ep-tint-red) !important; }
html.ep .mark[style*="--orange"], html.ep .icon[style*="--orange"], html.ep .topic[style*="--orange"] { background: var(--ep-tint-orange-bg) !important; color: var(--ep-tint-orange) !important; }
html.ep .mark[style*="--green"], html.ep .icon[style*="--green"], html.ep .topic[style*="--green"] { background: var(--ep-tint-green-bg) !important; color: var(--ep-tint-green) !important; }
html.ep .mark[style*="--tint"], html.ep .icon[style*="--tint"], html.ep .topic[style*="--tint"] { background: var(--ep-tint-blue-bg) !important; color: var(--ep-tint-blue) !important; }
html.ep .mark[style*="--gray"], html.ep .icon[style*="--gray"], html.ep .topic[style*="--gray"] { background: var(--ep-tint-gray-bg) !important; color: var(--ep-tint-gray) !important; }
html.ep .mark[style*="background"] svg, html.ep .icon[style*="background"] svg, html.ep .item .mark.dev svg, html.ep .item .mark.doc svg, html.ep .offer .icon svg { width: 1.1571rem !important; height: 1.1571rem !important; }
html.ep .payrow .who b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .payrow .who span { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .payrow .money { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .payrow .go, html.ep .go { color: var(--ep-text-3) !important; }
html.ep .row { border-top-color: var(--ep-line) !important; padding: .7714rem 0 !important; }
html.ep .row .grow b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .row .grow span { color: var(--ep-text-2) !important; font-size: .8357rem !important; }
html.ep .listfoot { color: var(--ep-text-2) !important; font-size: .8357rem !important; padding: .7714rem 1.4143rem 0 !important; margin: 0 -1.4143rem !important; border-top: 1px solid var(--ep-line) !important; }

html.ep .pill { display: inline-flex; align-items: center !important; gap: .3857rem !important; min-height: 1.5429rem !important; padding: .1929rem .5786rem !important; border-radius: var(--ep-r-pill) !important; font-size: .7357rem !important; font-weight: 600 !important; letter-spacing: .01em !important; white-space: nowrap !important; background: var(--ep-surface-2) !important; color: var(--ep-text-2) !important; }
html.ep .pill.good { background: var(--ep-good-tint) !important; color: var(--ep-good) !important; }
html.ep .pill.warn { background: var(--ep-warn-tint) !important; color: var(--ep-warn) !important; }
html.ep .pill.bad { background: var(--ep-bad-tint) !important; color: var(--ep-bad) !important; }

/* needs attention */
html.ep .attention { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; overflow: hidden !important; margin: 0 0 1.0286rem !important; }
html.ep .att-row { background: transparent !important; padding: .6429rem 1.4143rem !important; min-height: 3.6rem !important; gap: .9rem !important; border-bottom: 1px solid var(--ep-line) !important; color: var(--ep-text) !important; }
html.ep .att-row:last-child { border-bottom: 0 !important; }
html.ep .att-row:hover { background: var(--ep-surface-2) !important; }
html.ep .att-icon { width: 2.4429rem !important; height: 2.4429rem !important; border-radius: 50% !important; }
html.ep .att-icon.warn { background: var(--ep-tint-orange-bg) !important; color: var(--ep-tint-orange) !important; }
html.ep .att-icon.bad { background: var(--ep-tint-red-bg) !important; color: var(--ep-tint-red) !important; }
html.ep .att-icon.info { background: var(--ep-tint-gray-bg) !important; color: var(--ep-tint-gray) !important; }
html.ep .att-text { min-width: 0 !important; }
html.ep .att-text b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .att-text span { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .att-act { font-size: .9rem !important; font-weight: 600 !important; color: var(--ep-text) !important; background: var(--ep-surface-2) !important; border-radius: var(--ep-r-pill) !important; padding: 0 1.0286rem !important; min-height: 2.3143rem !important; }
html.ep .att-more { background: transparent !important; border-top: 1px solid var(--ep-line) !important; color: var(--ep-text-2) !important; font-size: .8357rem !important; }
html.ep .att-more:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }

/* a stack of notices: each one is its own card, and the rest peek out under the first */
html.ep .attstack .att-row { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; padding: .9rem 1.2857rem !important; }
html.ep .attstack .att-row:hover { background: var(--ep-surface) !important; }
html.ep .attstack .att-row b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .attstack .att-row span { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .attstack .att-more, html.ep .attstack .att-less { border: 0 !important; background: none !important; color: var(--ep-text-2) !important; font-size: .8357rem !important; font-weight: 600 !important; }
html.ep .attstack .att-more:hover, html.ep .attstack .att-less:hover { background: none !important; color: var(--ep-text) !important; }

html.ep .stp .stp-link { white-space: nowrap !important; flex: none !important; color: var(--ep-link) !important; }
html.ep .stp .stp-id { min-width: 0 !important; overflow-wrap: anywhere !important; text-align: right !important; color: var(--ep-text-2) !important; }

/* states */
html.ep .pstate { background: transparent !important; border-radius: var(--ep-r-card) !important; color: var(--ep-text-2) !important; padding: 3.0857rem 1.4143rem !important; }
html.ep .pstate svg { color: var(--ep-text-3) !important; }
html.ep .pstate b { font-size: 1.0286rem !important; font-weight: 600 !important; color: var(--ep-text) !important; letter-spacing: -.01em !important; }
html.ep .pstate span { font-size: .8714rem !important; }
html.ep .empty { color: var(--ep-text-2) !important; font-size: .9rem !important; }
html.ep .note { color: var(--ep-text-3) !important; font-size: .8357rem !important; }
html.ep .pbanner, html.ep .banner { border-radius: var(--ep-r-card) !important; border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; box-shadow: var(--ep-shadow-card) !important; }
html.ep .pbanner.warn { background: var(--ep-warn-tint) !important; color: var(--ep-warn) !important; border-color: transparent !important; }
html.ep .pbanner.info { background: var(--ep-tint-blue-bg) !important; color: var(--ep-text) !important; border-color: transparent !important; }

/* ---------- In-page tabs: the same chips as Admin's filters ---------- */
html.ep .tabs { display: flex; gap: .5143rem !important; flex-wrap: wrap !important; border: 0 !important; margin: 0 0 1.0286rem !important; padding: 0 !important; overflow: visible !important; position: relative !important; z-index: 1 !important; }
html.ep .tabs button { border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; min-height: 2.3143rem !important; padding: 0 .9rem !important; border-radius: var(--ep-r-pill) !important; font-size: .8357rem !important; font-weight: 500 !important; cursor: pointer; box-shadow: var(--ep-shadow-pill) !important; white-space: nowrap !important; display: inline-flex; align-items: center !important; gap: .3857rem !important; transition: background var(--ep-fast), color var(--ep-fast); }
html.ep .tabs button:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .tabs button[aria-selected="true"] { background: var(--ep-accent-gradient) !important; border-color: transparent !important; color: var(--ep-on-accent) !important; font-weight: 600 !important; }
html.ep .tabs .count { color: inherit !important; opacity: .7; font-size: inherit !important; margin-left: 0 !important; font-weight: inherit !important; }
html.ep .tabs .count:empty { display: none; }
html.ep .seg, html.ep .seg2, html.ep .segs { display: inline-flex; gap: .1286rem !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-pill) !important; padding: .1929rem !important; box-shadow: var(--ep-shadow-pill) !important; flex-wrap: wrap !important; }
html.ep .seg button, html.ep .seg2 button, html.ep .segs button { border: 0 !important; background: transparent !important; border-radius: var(--ep-r-pill) !important; padding: 0 .9rem !important; min-height: 2.0571rem !important; font-size: .8357rem !important; font-weight: 500 !important; color: var(--ep-text-2) !important; cursor: pointer; box-shadow: none !important; }
html.ep .seg button[aria-pressed="true"], html.ep .seg2 button[aria-pressed="true"], html.ep .segs button[aria-pressed="true"], html.ep .segs button[aria-selected="true"] { background: var(--ep-accent) !important; color: var(--ep-on-accent) !important; font-weight: 600 !important; box-shadow: none !important; }
html.ep .segs button:disabled { opacity: .45; cursor: default; }

/* ---------- Tiles and stats: the same card as a metric ---------- */
html.ep .tiles, html.ep .stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1.0286rem !important; margin: 0 0 1.0286rem !important; }
html.ep .tile, html.ep .stat { position: relative !important; display: grid; grid-template-columns: auto minmax(0, 1fr) !important; grid-template-rows: auto 1fr auto !important; column-gap: .7714rem !important; row-gap: 0 !important; align-items: center !important; min-height: 7.5857rem !important; padding: .9rem 1.2857rem .7714rem !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; }
html.ep .tile .t-label, html.ep .stat .stat-label { grid-column: 2 !important; grid-row: 1 !important; color: var(--ep-text-2) !important; font-size: .8714rem !important; font-weight: 500 !important; line-height: 1.25 !important; letter-spacing: 0 !important; text-transform: none !important; }
html.ep .tile > .ep-metric-icon + .t-label { grid-column: 2 !important; }
html.ep .tile .t-value, html.ep .stat .stat-value { grid-column: 1 / -1 !important; grid-row: 2 !important; align-self: end !important; margin-top: .3857rem !important; font-size: 1.9286rem !important; line-height: 1 !important; letter-spacing: -.035em !important; font-weight: 600 !important; color: var(--ep-text) !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
html.ep .stat .stat-value .of { font-size: 1rem !important; color: var(--ep-text-2) !important; }
html.ep .tile .t-sub, html.ep .stat .stat-sub { grid-column: 1 / -1 !important; grid-row: 3 !important; margin-top: .3214rem !important; min-height: 1.0286rem !important; color: var(--ep-text-3) !important; font-size: .7714rem !important; line-height: 1.35 !important; }
html.ep .tile:not(:has(> .ep-metric-icon)) .t-label, html.ep .stat .stat-label { grid-column: 1 / -1 !important; }
html.ep .tile.link { display: flex; min-height: 0 !important; padding: 1.0286rem 1.2857rem !important; cursor: pointer; }
html.ep .tile.link:hover { background: var(--ep-surface-2) !important; }
html.ep .tile.link b { font-size: .9643rem !important; color: var(--ep-text) !important; }
html.ep .tile a, html.ep .tile .link { color: var(--ep-link) !important; }

/* ---------- Toolbar and search ---------- */
html.ep .toolbar, html.ep .listtools { display: flex; gap: .7714rem !important; align-items: center !important; flex-wrap: wrap !important; margin: 0 0 .9rem !important; position: static !important; top: auto !important; background: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; padding: 0 !important; z-index: 2 !important; }
html.ep main .search, html.ep .drawer .search { position: relative !important; flex: 1 !important; min-width: 14rem !important; height: auto !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; }
html.ep main .search input, html.ep .searchbig input { width: 100% !important; height: 2.5714rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; padding: 0 .9rem 0 2.5714rem !important; font-size: .8714rem !important; color: var(--ep-text) !important; outline: none !important; box-shadow: var(--ep-shadow-pill) !important; transition: box-shadow var(--ep-fast), background var(--ep-fast), border-color var(--ep-fast); }
html.ep main .search input::placeholder, html.ep .searchbig input::placeholder { color: var(--ep-text-3) !important; }
html.ep main .search input:focus, html.ep .searchbig input:focus { background: var(--ep-surface) !important; border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; }
html.ep main .search svg { position: absolute !important; left: .9rem !important; top: 50% !important; transform: translateY(-50%); width: .9643rem !important; height: .9643rem !important; color: var(--ep-text-3) !important; pointer-events: none; }
html.ep .searchbig { margin: 0 0 1.0286rem !important; }
html.ep .searchbig input { height: 3.3429rem !important; font-size: 1rem !important; padding-left: 3.0857rem !important; }
html.ep .searchbig svg { left: 1.1571rem !important; top: 50% !important; transform: translateY(-50%); color: var(--ep-text-3) !important; }
/* a search that opens from its own button in the page head */
html.ep .headtools .search { flex: 0 0 auto !important; min-width: 0 !important; width: 2.5714rem !important; height: 2.5714rem !important; border: 1px solid transparent !important; border-radius: var(--ep-r-pill) !important; overflow: hidden !important; transition: width var(--ep-med) var(--ep-ease), background var(--ep-fast), border-color var(--ep-fast); }
html.ep .headtools .search.open { width: min(21.4286rem, 46vw) !important; background: var(--ep-surface) !important; border-color: var(--ep-line) !important; box-shadow: var(--ep-shadow-pill) !important; padding-right: .7714rem !important; }
html.ep .headtools .search input { height: 100% !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; padding: 0 0 0 .2571rem !important; }
html.ep .headtools .search input:focus { box-shadow: none !important; background: none !important; }
html.ep .headtools .search svg { position: static !important; transform: none; }
html.ep .headtools .search.open .toolbtn { border: 0 !important; background: transparent !important; box-shadow: none !important; }
html.ep .headtools .search.open:focus-within { border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; }
@media (max-width: 743px) {
  html.ep .head.ep-head > .headtools { flex: 1 1 100% !important; width: 100% !important; }
  html.ep .headtools .search, html.ep .headtools .search.open { flex: 1 1 auto !important; width: auto !important; background: var(--ep-surface) !important; border-color: var(--ep-line) !important; box-shadow: var(--ep-shadow-pill) !important; padding-right: .7714rem !important; }
  html.ep .headtools .search .toolbtn { border: 0 !important; background: transparent !important; box-shadow: none !important; }
}
html.ep .toolbtn { width: 2.5714rem !important; height: 2.5714rem !important; min-height: 0 !important; border-radius: 50% !important; border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; display: grid; place-items: center !important; box-shadow: var(--ep-shadow-pill) !important; cursor: pointer; }
html.ep .toolbtn:hover, html.ep .toolbtn[aria-expanded="true"], html.ep .toolbtn[aria-pressed="true"] { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .chips { display: flex; gap: .5143rem !important; flex-wrap: wrap !important; margin: 0 0 1.0286rem !important; }
html.ep .chips button { border: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; color: var(--ep-text-2) !important; min-height: 2.3143rem !important; padding: 0 .9rem !important; border-radius: var(--ep-r-pill) !important; font-size: .8357rem !important; font-weight: 500 !important; cursor: pointer; box-shadow: var(--ep-shadow-pill) !important; }
html.ep .chips button:hover { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; }
html.ep .chips button[aria-pressed="true"] { background: var(--ep-accent-gradient) !important; border-color: transparent !important; color: var(--ep-on-accent) !important; }
html.ep .summary { color: var(--ep-text-2) !important; font-size: .8357rem !important; }
html.ep .summary b { color: var(--ep-text) !important; font-size: 1rem !important; }

/* ---------- Grouped lists ---------- */
html.ep .group-head, html.ep .headrow { display: flex; align-items: center !important; gap: .7714rem !important; padding: 1.1571rem .2571rem .5143rem !important; margin: 0 !important; background: none !important; position: static !important; border: 0 !important; }
html.ep .group-head:first-child { padding-top: 0 !important; }
html.ep .group-head h3, html.ep .headrow h3 { margin: 0 !important; font-size: .7357rem !important; letter-spacing: .06em !important; text-transform: uppercase !important; font-weight: 600 !important; color: var(--ep-text-3) !important; }
html.ep .group-head .total { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .list, html.ep .cardlist { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; overflow: hidden !important; }
html.ep #list-wrap:has(> .item), html.ep #hist-wrap:has(> .item), html.ep #table-wrap:has(> .item), html.ep #list-wrap:has(> .payrow), html.ep #hist-wrap:has(> .payrow) { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; overflow: hidden !important; }
html.ep .cardlist .paylist { margin: 0 !important; }
html.ep .panel .cardlist, html.ep .panel .list, html.ep .exportcard .list { border: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: transparent !important; }
html.ep .panel.bare > .cardlist { border-top: 1px solid var(--ep-line) !important; border-radius: 0 0 var(--ep-r-card) var(--ep-r-card) !important; }
/* a panel that only groups dated lists is a plain container; each list is its own card */
html.ep .panel.bare:has(.group-head), html.ep .panel.bare:has(> #table-wrap), html.ep .panel.bare:has(> #list-wrap), html.ep .panel.bare:has(> #hist-wrap) { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
html.ep .panel.bare:has(.group-head) .list, html.ep .panel.bare:has(> #table-wrap) .list, html.ep .panel.bare:has(> #list-wrap) .list, html.ep .panel.bare:has(> #hist-wrap) .list { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; }
html.ep .item, html.ep .setting, html.ep .offer { display: flex; align-items: center !important; gap: .9rem !important; padding: .7714rem 1.1571rem !important; min-height: 3.6rem !important; border-top: 1px solid var(--ep-line) !important; color: var(--ep-text) !important; background: transparent !important; transition: background var(--ep-fast); }
html.ep .item:first-child, html.ep .setting:first-child, html.ep .offer:first-child { border-top: 0 !important; }
html.ep .item:hover, html.ep .setting:hover, html.ep .offer:hover { background: var(--ep-surface-2) !important; }
html.ep .setting.readonly:hover { background: transparent !important; }
html.ep .item .who b, html.ep .setting .lab b, html.ep .offer .meta b { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .item .who span, html.ep .setting .lab span, html.ep .offer .meta span { font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .item .money, html.ep .offer .fig { font-size: .9643rem !important; font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .offer .fig span { font-size: .7714rem !important; color: var(--ep-text-3) !important; }
html.ep .item .state, html.ep .setting .val { font-size: .9rem !important; color: var(--ep-text-2) !important; }
html.ep .item .mark { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: .4286rem !important; color: var(--ep-text-2) !important; }
html.ep .item .mark.dev, html.ep .item .mark.doc, html.ep .offer .icon { width: 2.4429rem !important; height: 2.4429rem !important; border-radius: 50% !important; border: 0 !important; background: var(--ep-tint-gray-bg) !important; color: var(--ep-tint-gray) !important; }
html.ep .avatar-lg, html.ep .drawer .avatar-xl, html.ep .avatar-xl { background: var(--ep-surface-2) !important; color: var(--ep-text) !important; border: 1px solid var(--ep-line) !important; }
html.ep .avatar-lg.owner { background: var(--ep-avatar-gradient) !important; color: var(--ep-on-accent) !important; border: 0 !important; }
html.ep .badge-soft, html.ep .item .who b .badge-soft, html.ep .tagline, html.ep .listing span.tagline { color: var(--ep-text) !important; background: var(--ep-surface-2) !important; border: 1px solid var(--ep-line-2) !important; font-weight: 600 !important; }
html.ep .toggle-sw { width: 2.8286rem !important; height: 1.7357rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface-3) !important; }
html.ep .toggle-sw::after { top: .1929rem !important; left: .1929rem !important; width: 1.35rem !important; height: 1.35rem !important; background: var(--ep-knob) !important; box-shadow: 0 1px .1929rem rgba(0,0,0,.25) !important; }
html.ep .setting[aria-checked="true"] .toggle-sw, html.ep [role="switch"][aria-checked="true"] .toggle-sw { background: var(--ep-good-dot) !important; }
html.ep .setting[aria-checked="true"] .toggle-sw::after, html.ep [role="switch"][aria-checked="true"] .toggle-sw::after { transform: translateX(1.0929rem); }
html.ep .status-pill { display: inline-flex; align-items: center !important; min-height: 1.5429rem !important; padding: .1929rem .5786rem !important; border-radius: var(--ep-r-pill) !important; font-size: .7357rem !important; font-weight: 600 !important; background: var(--ep-surface-2) !important; color: var(--ep-text-2) !important; }
html.ep .status-pill.open, html.ep .status-pill.Open { background: var(--ep-warn-tint) !important; color: var(--ep-warn) !important; }
html.ep .status-pill.answered, html.ep .status-pill.Answered { background: var(--ep-good-tint) !important; color: var(--ep-good) !important; }
html.ep .status-pill.closed, html.ep .status-pill.Closed { background: var(--ep-surface-2) !important; color: var(--ep-text-2) !important; }

/* ---------- Content cards ---------- */
html.ep .hero, html.ep .panelcard, html.ep .matrixcard, html.ep .exportcard, html.ep .repcard, html.ep .listing { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; padding: 1.2857rem 1.4143rem !important; color: var(--ep-text) !important; }
html.ep .listing { box-shadow: none !important; background: var(--ep-surface-2) !important; border-color: transparent !important; }
html.ep .hero { margin: 0 0 1.0286rem !important; gap: 1.5429rem !important; }
html.ep .hero .amt-label { font-size: .8714rem !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ep-text-2) !important; }
html.ep .hero .amt { font-size: 2.8286rem !important; letter-spacing: -.035em !important; font-weight: 700 !important; color: var(--ep-text) !important; }
html.ep .hero .amt-sub { color: var(--ep-text-3) !important; font-size: .8357rem !important; }
html.ep .panelcard h2, html.ep .matrixcard h2, html.ep .exportcard h2 { font-size: 1.2214rem !important; line-height: 1.2 !important; letter-spacing: -.02em !important; font-weight: 600 !important; color: var(--ep-text) !important; margin: 0 !important; }
html.ep .panelcard .lede, html.ep .matrixcard .lede { color: var(--ep-text-2) !important; font-size: .8357rem !important; }
html.ep .split2 { gap: 1.0286rem !important; }
html.ep .repcard .who b { font-size: 1.0286rem !important; color: var(--ep-text) !important; }
html.ep .repcard .who span { color: var(--ep-text-2) !important; font-size: .8714rem !important; }
html.ep .kv { border-top: 1px solid var(--ep-line) !important; font-size: .9rem !important; color: var(--ep-text) !important; padding: .7714rem 0 !important; }
html.ep .kv span { color: var(--ep-text-2) !important; }
html.ep .kv b { font-weight: 600 !important; color: var(--ep-text) !important; }
html.ep .minibars i { background: var(--ep-tint-blue) !important; }
html.ep .msg { background: var(--ep-surface-2) !important; border-radius: var(--ep-r-card) !important; font-size: .9rem !important; color: var(--ep-text) !important; }
html.ep .msg.mine { background: var(--ep-tint-blue-bg) !important; }
html.ep .msg .meta { color: var(--ep-text-3) !important; font-size: .7714rem !important; }
html.ep .topic { border-radius: .7714rem !important; }

/* ---------- Tables ---------- */
html.ep main table { width: 100% !important; border-collapse: separate !important; border-spacing: 0 !important; }
html.ep main th { height: 2.8286rem !important; padding: 0 1.1571rem !important; text-align: left !important; color: var(--ep-text-3) !important; font-size: .7357rem !important; letter-spacing: .06em !important; text-transform: uppercase !important; font-weight: 600 !important; border-bottom: 1px solid var(--ep-line) !important; white-space: nowrap !important; }
html.ep main td { padding: .9rem 1.1571rem !important; border-top: 0 !important; border-bottom: 1px solid var(--ep-line) !important; font-size: .8714rem !important; color: var(--ep-text-2) !important; vertical-align: middle !important; }
html.ep main tr:last-child td { border-bottom: 0 !important; }
html.ep main tbody tr:hover, html.ep main tbody tr:hover td { background: var(--ep-surface-2) !important; }
html.ep main th.r, html.ep main td.r { text-align: right !important; }
html.ep .matrix th, html.ep .matrix td { text-align: center !important; }
html.ep .matrix th:first-child, html.ep .matrix td:first-child { text-align: left !important; color: var(--ep-text) !important; }
html.ep .matrix .yes { color: var(--ep-good) !important; } html.ep .matrix .no { color: var(--ep-text-3) !important; }
html.ep .matrix tbody tr:hover, html.ep .matrix tbody tr:hover td { background: transparent !important; }

/* ---------- Side panel (drawer) ---------- */
html.ep .drawer { top: 0 !important; right: 0 !important; bottom: 0 !important; height: auto !important; width: min(34.7143rem, 92vw) !important; background: var(--ep-surface) !important; border-left: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-panel) 0 0 var(--ep-r-panel) !important; box-shadow: var(--ep-shadow-float) !important; color: var(--ep-text) !important; z-index: 90 !important; }
html.ep .scrim { z-index: 80 !important; }
html.ep .drawer header { padding: 1.1571rem 1.4143rem !important; border-bottom: 1px solid var(--ep-line) !important; background: var(--ep-glass-strong) !important; }
html.ep .drawer header h2 { font-size: 1.4143rem !important; letter-spacing: -.025em !important; font-weight: 700 !important; color: var(--ep-text) !important; }
html.ep .drawer .iconbtn { width: 2.5714rem !important; height: 2.5714rem !important; border-radius: 50% !important; background: var(--ep-surface-2) !important; color: var(--ep-text) !important; border: 0 !important; }
html.ep .drawer .body { padding: 1.2857rem 1.4143rem !important; color: var(--ep-text) !important; }
html.ep .drawer .actions { padding: .9rem 1.4143rem !important; border-top: 1px solid var(--ep-line) !important; background: var(--ep-glass-strong) !important; gap: .6429rem !important; }
html.ep .drawer .name { color: var(--ep-text) !important; letter-spacing: -.025em !important; }
html.ep .drawer .since { color: var(--ep-text-2) !important; font-size: .9rem !important; }
html.ep .amount { font-size: 2.3143rem !important; letter-spacing: -.035em !important; font-weight: 700 !important; color: var(--ep-text) !important; }

/* ---------- Agency cards: the same card as everywhere else ---------- */
html.ep .ov-card, html.ep .nc-card, html.ep .agx-team, html.ep .agx-card, html.ep .agx-clear, html.ep .agx-dir, html.ep .agx-road,
html.ep .hl-sum, html.ep .hk, html.ep .hb-grp, html.ep .hp-list, html.ep .hp-none, html.ep .mc-box, html.ep .mc-sum,
html.ep .ovx-list, html.ep .ovx-clear, html.ep .ovw, html.ep .ovo, html.ep .ovb, html.ep .ovk, html.ep .pb-col,
html.ep .rp-tile, html.ep #rp-body, html.ep .rs-fig, html.ep .rg, html.ep .rt, html.ep .stg-box, html.ep .tk-sum, html.ep .tt,
html.ep .ov-state { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; }
html.ep .ovo-tile, html.ep .agx-person, html.ep .pb-card, html.ep .hm { background: var(--ep-surface-soft) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-control) !important; box-shadow: none !important; }
html.ep .pb-card:hover, html.ep .ovo-tile:hover, html.ep .agx-person:hover { background: var(--ep-surface-2) !important; }
html.ep .ov-sec-head h2, html.ep main h2 { color: var(--ep-text) !important; letter-spacing: -.02em !important; }
html.ep .ov-sec-head { margin-top: 1.5429rem !important; }
html.ep .ov-note { border-radius: var(--ep-r-control) !important; }
html.ep .opstat, html.ep .statuspill { border-radius: var(--ep-r-pill) !important; font-weight: 600 !important; }
html.ep .cmdk { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-panel) !important; box-shadow: var(--ep-shadow-float) !important; color: var(--ep-text) !important; }
html.ep .tour-card { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-float) !important; color: var(--ep-text) !important; }
html.ep .tour-next { color: var(--ep-link) !important; }

/* ---------- Footer ---------- */
html.ep .pagefoot { border-top: 1px solid var(--ep-line) !important; color: var(--ep-text-3) !important; font-size: .8357rem !important; margin-top: 2.0571rem !important; }
html.ep .pagefoot a { color: var(--ep-text-2) !important; min-height: 0 !important; }

/* ---------- Dialogs, toasts ---------- */
html.ep .pdlg-scrim, html.ep .scrim { background: var(--ep-scrim) !important; }
/* layers: page < side panel scrim < side panel < dialog scrim < dialog < toast */
html.ep .pdlg-scrim { z-index: 130 !important; }
html.ep .pdlg-wrap, html.ep .dialog-wrap { z-index: 140 !important; }
html.ep .ptoast { z-index: 160 !important; }
html.ep .pdlg-scrim.on, html.ep .scrim.on, html.ep .scrim.open { -webkit-backdrop-filter: blur(.1929rem) !important; backdrop-filter: blur(.1929rem) !important; }
html.ep .pdlg, html.ep .dialog { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-panel) !important; box-shadow: var(--ep-shadow-float) !important; color: var(--ep-text) !important; padding: 1.5429rem !important; }
html.ep .pdlg h2, html.ep .dialog h2 { font-size: 1.2857rem !important; letter-spacing: -.025em !important; font-weight: 700 !important; color: var(--ep-text) !important; }
html.ep .pdlg .pdlg-body, html.ep .pdlg .pdlg-body p { color: var(--ep-text-2) !important; font-size: .9rem !important; }
html.ep .pdlg .field-label, html.ep .dialog .field-label, html.ep .pdlg label.pf { font-size: .8357rem !important; font-weight: 500 !important; color: var(--ep-text) !important; text-transform: none !important; letter-spacing: 0 !important; }
html.ep .pdlg input, html.ep .pdlg textarea, html.ep .pdlg select, html.ep .dialog input, html.ep .dialog textarea, html.ep .dialog select { border: 1px solid transparent !important; border-radius: var(--ep-r-control) !important; background: var(--ep-surface-2) !important; color: var(--ep-text) !important; font-size: .9rem !important; min-height: 2.8286rem !important; }
html.ep .pdlg input:focus, html.ep .pdlg textarea:focus, html.ep .pdlg select:focus, html.ep .dialog input:focus, html.ep .dialog textarea:focus, html.ep .dialog select:focus { background: var(--ep-surface) !important; border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; outline: none !important; }
/* A checkbox in a dialog is a box to tick, not a field: the pages' field rules (full width, 44px tall) and the ones above stay off it. */
html.ep .pdlg input[type="checkbox"], html.ep .dialog input[type="checkbox"] { width: 1.1429rem !important; height: 1.1429rem !important; min-height: 0 !important; min-width: 0 !important; flex: none !important; margin: .1429rem 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: .2857rem !important; background: none !important; box-shadow: none !important; accent-color: var(--ep-text) !important; }
html.ep .pdlg input[type="checkbox"]:focus, html.ep .dialog input[type="checkbox"]:focus { background: none !important; border-color: transparent !important; box-shadow: none !important; }
html.ep .pdlg input[type="checkbox"]:focus-visible, html.ep .dialog input[type="checkbox"]:focus-visible { outline: 2px solid var(--ep-link) !important; outline-offset: 2px !important; }
/* The Statement analyser's chosen offer: the dot in its radio takes the colour that reads on the accent, which is dark at night. */
html.ep .s-opt[aria-checked="true"] .radio::after { background: var(--ep-on-accent) !important; }
html.ep .pdlg-actions button, html.ep .dialog-actions button, html.ep .dialog-actions .btn { border-radius: var(--ep-r-pill) !important; min-height: 2.5714rem !important; padding: 0 1.1571rem !important; font-size: .9rem !important; font-weight: 600 !important; border: 1px solid transparent !important; }
html.ep .pdlg-actions .pcancel, html.ep .dialog-actions .btn.secondary { background: var(--ep-surface) !important; color: var(--ep-text) !important; border-color: var(--ep-line-2) !important; font-weight: 500 !important; }
html.ep .pdlg-actions .pgo, html.ep .dialog-actions .btn:not(.secondary) { background: var(--ep-accent-gradient) !important; color: var(--ep-on-accent) !important; box-shadow: var(--ep-shadow-pill) !important; }
html.ep .pdlg-actions .pgo.danger { background: var(--ep-bad) !important; color: #fff !important; }
html.ep .pdlg-actions .pgo:disabled { opacity: .4; cursor: not-allowed; }
html.ep .pdlg .pfail, html.ep .pdlg .perr, html.ep [data-action-error] { color: var(--ep-bad) !important; font-size: .8357rem !important; }
html.ep .pdlg .pchoice, html.ep .choice, html.ep .dialog .choice { border-radius: var(--ep-r-control) !important; color: var(--ep-text) !important; font-size: .9rem !important; }
html.ep .pdlg .pchoice:hover, html.ep .choice:hover { background: var(--ep-surface-2) !important; }
html.ep .pdlg .pchoice[aria-selected="true"], html.ep .choice[aria-selected="true"] { background: var(--ep-surface-2) !important; }
html.ep .pdlg .pchoice[aria-selected="true"] .tk, html.ep .choice[aria-selected="true"] .tick { background: var(--ep-accent) !important; border-color: var(--ep-accent) !important; color: var(--ep-on-accent) !important; }
html.ep .pdlg .pchoice .tk, html.ep .choice .tick { border-color: var(--ep-line-3) !important; }
html.ep .pdlg .pchoice span, html.ep .choice span { color: var(--ep-text-2) !important; }
html.ep .pspin { border-color: color-mix(in srgb, currentColor 35%, transparent) !important; border-top-color: currentColor !important; }
html.ep .ptoast { background: var(--ep-accent) !important; color: var(--ep-on-accent) !important; border-radius: var(--ep-r-pill) !important; padding: .7071rem 1.0286rem !important; font-size: .8357rem !important; font-weight: 500 !important; box-shadow: var(--ep-shadow-float) !important; bottom: 1.8rem !important; }
html.ep .ptoast.bad { background: var(--ep-bad) !important; color: #fff !important; }

/* ---------- Statement analyser: checking what was read ---------- */
/* Everything read from a statement, in a sheet over the result, to be checked and corrected before the quote goes out.
   Above the drawer, under the shared dialogs and the toast; the whole screen on a phone. */
html.ep.an-rv-open, html.ep.an-rv-open body { overflow: hidden !important; }
html.ep .an-rv-scrim { position: fixed !important; inset: 0 !important; z-index: 118 !important; background: var(--ep-scrim) !important; -webkit-backdrop-filter: blur(.1929rem) !important; backdrop-filter: blur(.1929rem) !important; }
html.ep .an-rv { position: fixed !important; inset: 0 !important; z-index: 120 !important; display: flex; align-items: center !important; justify-content: center !important; padding: 1.8rem !important; pointer-events: none; }
html.ep .an-rv[hidden], html.ep .an-rv-scrim[hidden] { display: none; }
html.ep .an-rv-panel { pointer-events: auto; display: flex; flex-direction: column !important; width: min(74rem, 100%) !important; max-height: 100% !important; background: var(--ep-surface) !important; color: var(--ep-text) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-panel) !important; box-shadow: var(--ep-shadow-float) !important; overflow: hidden !important; animation: ep-rise var(--ep-med) var(--ep-ease); }
html.ep .an-rv-panel:focus { outline: none !important; }
html.ep .an-rv-head { display: flex; align-items: flex-start !important; gap: 1rem !important; padding: 1.3rem 1.5429rem 1rem !important; border-bottom: 1px solid var(--ep-line) !important; }
html.ep .an-rv-head > div { flex: 1 !important; min-width: 0 !important; }
html.ep .an-rv-head h2 { margin: 0 !important; font-size: 1.2857rem !important; font-weight: 700 !important; letter-spacing: -.025em !important; line-height: 1.25 !important; text-transform: none !important; color: var(--ep-text) !important; }
html.ep .an-rv-sub { margin: .3rem 0 0 !important; font-size: .9rem !important; line-height: 1.45 !important; color: var(--ep-text-2) !important; }
html.ep .an-rv-sub b { color: var(--ep-text) !important; font-weight: 600 !important; overflow-wrap: anywhere !important; }
html.ep .an-rv-x { flex: none !important; width: 2.5714rem !important; height: 2.5714rem !important; min-width: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; display: inline-flex; align-items: center !important; justify-content: center !important; border: 0 !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface-2) !important; color: var(--ep-text-2) !important; cursor: pointer; }
html.ep .an-rv-x:hover { background: var(--ep-surface-3) !important; color: var(--ep-text) !important; }
html.ep .an-rv-x:focus-visible, html.ep .an-rv-actions button:focus-visible, html.ep .an-rv-notes summary:focus-visible { outline: 2px solid var(--ep-link) !important; outline-offset: 2px !important; }
html.ep .an-rv-body { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overscroll-behavior: contain !important; padding: .2rem 1.5429rem 1.3rem !important; }
html.ep .an-rv-sec { margin: 1.2rem 0 0 !important; }
html.ep .an-rv-sec h3 { margin: 0 0 .5rem !important; font-size: .7357rem !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--ep-text-3) !important; }
html.ep .an-rv-empty { margin: 0 !important; font-size: .8357rem !important; line-height: 1.45 !important; color: var(--ep-text-3) !important; }
html.ep .an-rv-wrap { overflow-x: auto !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; background: var(--ep-surface) !important; }
html.ep .an-rv-table { width: 100% !important; margin: 0 !important; border-collapse: collapse !important; font-size: .8714rem !important; }
html.ep .an-rv-table th { height: auto !important; padding: .5rem .5rem !important; text-align: left !important; font-size: .7rem !important; font-weight: 600 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--ep-text-3) !important; background: var(--ep-surface-soft) !important; border-top: 0 !important; border-bottom: 1px solid var(--ep-line) !important; white-space: nowrap !important; }
html.ep .an-rv-table td { padding: .4rem .5rem !important; border-top: 0 !important; border-bottom: 1px solid var(--ep-line) !important; font-size: .8714rem !important; line-height: 1.35 !important; color: var(--ep-text) !important; vertical-align: middle !important; background: none !important; }
html.ep .an-rv-table tbody tr:last-child td { border-bottom: 0 !important; }
html.ep .an-rv-table tbody tr:hover { background: none !important; }
html.ep .an-rv-table th.num, html.ep .an-rv-table td.num { text-align: right !important; }
html.ep .an-rv-table td.fit { width: 1% !important; white-space: nowrap !important; }
html.ep .an-rv-table td.an-rv-ro { color: var(--ep-text-2) !important; white-space: nowrap !important; }
html.ep .an-rv-table td:first-child { color: var(--ep-text) !important; }
html.ep .an-rv-table tr.flagged td:first-child { box-shadow: inset .2143rem 0 0 var(--ep-warn-dot) !important; }
html.ep .an-rv-printed { display: block; margin-top: .1rem !important; font-size: .7714rem !important; color: var(--ep-text-3) !important; }
html.ep .an-rv-tag { display: inline-block; margin-left: .35rem !important; padding: .0714rem .45rem !important; border-radius: var(--ep-r-pill) !important; font-size: .7rem !important; font-weight: 600 !important; line-height: 1.5 !important; vertical-align: middle !important; background: color-mix(in srgb, var(--ep-link) 12%, transparent) !important; color: var(--ep-link) !important; }
html.ep .an-rv-in { display: block; width: 100% !important; min-width: 6.4286rem !important; height: 2.2857rem !important; min-height: 2.2857rem !important; margin: 0 !important; padding: 0 .55rem !important; font: inherit !important; font-size: .8714rem !important; line-height: 1.2 !important; color: var(--ep-text) !important; background: var(--ep-surface-2) !important; border: 1px solid transparent !important; border-radius: var(--ep-r-sm) !important; box-shadow: none !important; box-sizing: border-box !important; }
html.ep .an-rv-in.num { width: 6.2rem !important; min-width: 0 !important; margin-left: auto !important; text-align: right !important; font-variant-numeric: tabular-nums !important; }
html.ep .an-rv-in.wide { min-width: 12rem !important; }
html.ep select.an-rv-in { width: 12.2rem !important; min-width: 0 !important; padding-right: 1.8rem !important; cursor: pointer; }
html.ep .an-rv-in::placeholder { color: var(--ep-text-3) !important; }
html.ep .an-rv-in:focus { background: var(--ep-surface) !important; border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; outline: none !important; }
html.ep .an-rv-in.changed { background: color-mix(in srgb, var(--ep-link) 9%, var(--ep-surface)) !important; border-color: color-mix(in srgb, var(--ep-link) 55%, transparent) !important; }
html.ep .an-rv-in.bad, html.ep .an-rv-why textarea.bad { border-color: var(--ep-bad) !important; box-shadow: 0 0 0 .1929rem var(--ep-bad-tint) !important; }
html.ep .an-rv-flag { display: flex; align-items: center !important; gap: .9rem !important; margin: 0 0 .5rem !important; padding: .7rem .9rem !important; border-radius: var(--ep-r-card) !important; background: var(--ep-warn-tint) !important; color: var(--ep-text) !important; }
html.ep .an-rv-flag.blocking { background: var(--ep-bad-tint) !important; }
html.ep .an-rv-flag p { flex: 1 !important; min-width: 0 !important; margin: 0 !important; font-size: .8714rem !important; line-height: 1.45 !important; color: var(--ep-text) !important; }
html.ep .an-rv-flag select.an-rv-in { flex: none !important; width: auto !important; min-width: 13rem !important; background: var(--ep-surface) !important; }
html.ep .an-rv-notes { margin: 1rem 0 0 !important; font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .an-rv-notes summary { cursor: pointer; color: var(--ep-link) !important; width: fit-content !important; }
html.ep .an-rv-notes ul { margin: .45rem 0 0 !important; padding-left: 1.15rem !important; line-height: 1.45 !important; }
html.ep .an-rv-notes li + li { margin-top: .25rem !important; }
html.ep .an-rv-foot { flex: none !important; padding: .9rem 1.5429rem 1.1rem !important; border-top: 1px solid var(--ep-line) !important; background: var(--ep-surface) !important; }
html.ep .an-rv-why[hidden], html.ep .an-rv-fail[hidden] { display: none; }
html.ep .an-rv-why label { display: block; margin: 0 0 .35rem !important; font-size: .8357rem !important; font-weight: 600 !important; color: var(--ep-text) !important; text-transform: none !important; letter-spacing: 0 !important; }
html.ep .an-rv-why textarea { display: block; width: 100% !important; height: auto !important; min-height: 3.6rem !important; margin: 0 !important; padding: .55rem .7rem !important; font: inherit !important; font-size: .9rem !important; line-height: 1.4 !important; color: var(--ep-text) !important; background: var(--ep-surface-2) !important; border: 1px solid transparent !important; border-radius: var(--ep-r-control) !important; box-shadow: none !important; box-sizing: border-box !important; resize: vertical !important; }
html.ep .an-rv-why textarea:focus { background: var(--ep-surface) !important; border-color: var(--ep-link) !important; box-shadow: 0 0 0 .1929rem var(--ep-ring) !important; outline: none !important; }
html.ep .an-rv-hint { margin: .3rem 0 0 !important; font-size: .7714rem !important; line-height: 1.4 !important; color: var(--ep-text-3) !important; }
html.ep .an-rv-fail { margin: .55rem 0 0 !important; font-size: .8357rem !important; line-height: 1.4 !important; color: var(--ep-bad) !important; }
html.ep .an-rv-actions { display: flex; align-items: center !important; gap: .6rem !important; margin-top: .8rem !important; }
html.ep .an-rv-count { flex: 1 !important; min-width: 0 !important; font-size: .8357rem !important; color: var(--ep-text-2) !important; }
html.ep .an-rv-actions button { width: auto !important; min-height: 2.5714rem !important; height: auto !important; margin: 0 !important; padding: 0 1.1571rem !important; display: inline-flex; align-items: center !important; justify-content: center !important; gap: .45rem !important; border: 1px solid transparent !important; border-radius: var(--ep-r-pill) !important; font: inherit !important; font-size: .9rem !important; font-weight: 600 !important; cursor: pointer; white-space: nowrap !important; }
html.ep .an-rv-actions .an-rv-cancel { background: var(--ep-surface) !important; color: var(--ep-text) !important; border-color: var(--ep-line-2) !important; font-weight: 500 !important; }
html.ep .an-rv-actions .an-rv-cancel:hover { background: var(--ep-surface-2) !important; }
html.ep .an-rv-actions .an-rv-go { background: var(--ep-accent-gradient) !important; color: var(--ep-on-accent) !important; box-shadow: var(--ep-shadow-pill) !important; }
html.ep .an-rv-actions .an-rv-go:hover { background: var(--ep-accent-gradient-hover) !important; }
html.ep .an-rv-actions .an-rv-go:disabled { opacity: .55; cursor: progress; }
@media (max-width: 760px) {
  html.ep .an-rv { padding: 0 !important; align-items: stretch !important; }
  html.ep .an-rv-panel { width: 100% !important; height: 100% !important; max-height: none !important; border: 0 !important; border-radius: 0 !important; }
  html.ep .an-rv-head { padding: calc(.9rem + env(safe-area-inset-top)) 1.1429rem .8rem !important; }
  html.ep .an-rv-head h2 { font-size: 1.2143rem !important; }
  html.ep .an-rv-body { padding: 0 1.1429rem 1rem !important; }
  html.ep .an-rv-foot { padding: .8rem 1.1429rem calc(.9rem + env(safe-area-inset-bottom)) !important; }
  html.ep .an-rv-wrap { overflow: visible !important; border: 0 !important; border-radius: 0 !important; background: none !important; }
  html.ep .an-rv-table thead { display: none; }
  html.ep .an-rv-table, html.ep .an-rv-table tbody { display: block; width: 100% !important; }
  html.ep .an-rv-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: .55rem .7rem !important; margin: 0 0 .6rem !important; padding: .75rem .85rem !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; background: var(--ep-surface) !important; }
  html.ep .an-rv-table tr.flagged { box-shadow: inset .2143rem 0 0 var(--ep-warn-dot) !important; }
  html.ep .an-rv-table tr.flagged td:first-child { box-shadow: none !important; }
  html.ep .an-rv-table td, html.ep .an-rv-table td.an-rv-ro, html.ep .an-rv-table td.fit { width: auto !important; display: flex; flex-direction: column !important; gap: .2rem !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; text-align: left !important; white-space: normal !important; }
  html.ep .an-rv-table td.num { text-align: left !important; }
  html.ep .an-rv-table td::before { content: attr(data-label); font-size: .7rem !important; font-weight: 600 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--ep-text-3) !important; }
  html.ep .an-rv-table td.span { grid-column: 1 / -1 !important; }
  /* A field and its value: the field names the card, so the column names are not repeated on every one. */
  html.ep .an-rv-table.pair tr { gap: .35rem !important; padding: .65rem .85rem !important; }
  html.ep .an-rv-table.pair td::before { content: none; display: none; }
  html.ep .an-rv-table.pair td:first-child { font-size: .8357rem !important; font-weight: 600 !important; color: var(--ep-text-2) !important; }
  html.ep .an-rv-in, html.ep .an-rv-in.wide, html.ep select.an-rv-in { width: 100% !important; min-width: 0 !important; height: 2.8571rem !important; min-height: 2.8571rem !important; font-size: 1.1429rem !important; }
  html.ep .an-rv-in.num { width: 100% !important; margin-left: 0 !important; text-align: left !important; }
  html.ep .an-rv-why textarea { font-size: 1.1429rem !important; }
  html.ep .an-rv-flag { flex-direction: column !important; align-items: stretch !important; gap: .55rem !important; }
  html.ep .an-rv-flag select.an-rv-in { width: 100% !important; min-width: 0 !important; }
  html.ep .an-rv-actions { flex-wrap: wrap !important; }
  html.ep .an-rv-count { flex: 0 0 100% !important; }
  html.ep .an-rv-actions button { flex: 1 1 0 !important; min-height: 2.8571rem !important; }
}

/* ---------- Appearance card (Settings) ---------- */
html.ep .ep-card { background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; border-radius: var(--ep-r-card) !important; box-shadow: var(--ep-shadow-card) !important; margin: 0 0 1.0286rem !important; position: relative !important; z-index: 1 !important; }
html.ep .ep-card-head { padding: 1.0286rem 1.4143rem .6429rem !important; }
html.ep .ep-card-head h2 { margin: 0 !important; font-size: 1.2214rem !important; line-height: 1.2 !important; letter-spacing: -.02em !important; font-weight: 600 !important; color: var(--ep-text) !important; text-transform: none !important; }
html.ep .stp #st-body, html.ep .stp #st-body > .ov-state { max-width: none !important; }
html.ep .ep-card-head p { margin: .1286rem 0 0 !important; color: var(--ep-text-2) !important; font-size: .8357rem !important; line-height: 1.5 !important; }
html.ep .ep-card-body { padding: 0 1.4143rem 1.0286rem !important; }
html.ep .ep-settings-theme { display: flex; align-items: center !important; justify-content: space-between !important; gap: .7714rem !important; }
html.ep .ep-settings-theme > span { font-size: .9rem !important; font-weight: 500 !important; color: var(--ep-text) !important; }
html.ep .ep-connection-badge { display: inline-flex; align-items: center !important; gap: .3857rem !important; min-height: 1.5429rem !important; padding: .1929rem .6429rem !important; border-radius: var(--ep-r-pill) !important; font-size: .7357rem !important; font-weight: 600 !important; white-space: nowrap !important; background: var(--ep-surface-2) !important; color: var(--ep-text-2) !important; }
html.ep .ep-connection-badge.is-live { background: var(--ep-good-tint) !important; color: var(--ep-good) !important; }
html.ep .ep-connection-badge.is-sample { background: var(--ep-warn-tint) !important; color: var(--ep-warn) !important; }
html.ep .ep-connection-problem { position: fixed !important; inset: 0 !important; z-index: 400 !important; background: var(--ep-bg) !important; overflow: auto !important; }
html.ep .ep-connection-problem .ep-state-note { text-align: center !important; }
html.ep .ep-theme-switch { display: inline-flex; align-items: center !important; gap: .1286rem !important; height: 2.8286rem !important; padding: .1929rem !important; border-radius: var(--ep-r-pill) !important; background: var(--ep-surface) !important; border: 1px solid var(--ep-line) !important; box-shadow: var(--ep-shadow-pill) !important; flex: 0 0 auto !important; }
html.ep .ep-theme-switch button { width: 2.3143rem !important; height: 2.3143rem !important; border: 0 !important; border-radius: 50% !important; background: transparent !important; color: var(--ep-text-3) !important; display: grid; place-items: center !important; cursor: pointer; padding: 0 !important; margin: 0 !important; transition: background var(--ep-fast), color var(--ep-fast), transform var(--ep-fast) var(--ep-ease); }
html.ep .ep-theme-switch button svg { width: 1.0286rem !important; height: 1.0286rem !important; stroke-width: 1.8 !important; }
html.ep .ep-theme-switch button:hover { color: var(--ep-text) !important; background: var(--ep-surface-2) !important; }
html.ep .ep-theme-switch button[aria-pressed="true"] { background: var(--ep-accent) !important; color: var(--ep-on-accent) !important; }

/* ---------- Responsive ---------- */
@media (max-width: 1360px) {
  html.ep { --ep-sidebar: 16.8571rem; --ep-gutter: 1.0286rem; }
  html.ep .shell { gap: 1.1571rem !important; }
  html.ep .ep-hero-art { right: 2.5714rem !important; }
  html.ep .ep-hero-tagline { display: none; }
  html.ep .head.ep-head > .ep-head-copy > * { max-width: 34.7143rem !important; }
}
@media (max-width: 1120px) {
  html.ep .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html.ep .cols { grid-template-columns: minmax(0, 1fr) !important; }
  html.ep .ep-hero-art { right: .6429rem !important; width: 14rem !important; }
}
@media (max-width: 820px) {
  html.ep { --ep-gutter: .7714rem; }
  html.ep .shell { display: block; padding: var(--ep-gutter) !important; }
  html.ep .side { display: flex !important; position: fixed !important; top: var(--ep-gutter) !important; left: var(--ep-gutter) !important; bottom: var(--ep-gutter) !important; height: auto !important; width: 19.1429rem !important; max-width: calc(100vw - 2 * var(--ep-gutter)) !important; transform: translateX(calc(-100% - var(--ep-gutter) - .5143rem)); transition: transform var(--ep-med) var(--ep-ease); z-index: 70 !important; box-shadow: var(--ep-shadow-float) !important; }
  html.ep .side.ep-open { transform: translateX(0); }
  html.ep .ep-side-backdrop { display: block; position: fixed !important; inset: 0 !important; background: var(--ep-scrim) !important; -webkit-backdrop-filter: blur(.1286rem) !important; backdrop-filter: blur(.1286rem) !important; opacity: 0; pointer-events: none; transition: opacity var(--ep-med); z-index: 65 !important; }
  html.ep .ep-side-backdrop.ep-open { opacity: 1; pointer-events: auto; }
  html.ep .topbar { justify-content: flex-start !important; padding: .5143rem 0 0 !important; margin-bottom: 1.2857rem !important; }
  html.ep .topbar .ep-mobile-menu { display: grid; margin-right: auto !important; }
  html.ep .ep-icon-btn, html.ep .topbar .iconbtn, html.ep .topbar .avatar, html.ep .ep-search { width: 2.7rem !important; height: 2.7rem !important; }
  html.ep .ep-pill { height: 2.7rem !important; padding: 0 .9rem !important; font-size: .8357rem !important; }
  html.ep .ep-search:hover, html.ep .ep-search:focus-within, html.ep .ep-search.has-value { width: min(22rem, 46vw) !important; }
  html.ep main { padding: 0 .2571rem 3.0857rem !important; max-width: none !important; }
  html.ep .head.ep-head { margin-bottom: 1.1571rem !important; min-height: 0 !important; }
  html.ep .head.ep-head::after, html.ep .ep-hero-art { display: none; }
  html.ep .tabbar, html.ep .moresheet { display: none !important; }
  html.ep .ep-subnav { flex-wrap: nowrap !important; overflow-x: auto !important; padding-bottom: .2571rem !important; scrollbar-width: none !important; }
  html.ep .ep-subnav-btn { flex: 0 0 auto !important; }
  html.ep .popover { right: var(--ep-gutter) !important; left: var(--ep-gutter) !important; top: 4.6rem !important; width: auto !important; max-height: 70vh !important; border-radius: var(--ep-r-card) !important; }
  html.ep.ep-menu-side .me-menu { left: var(--ep-gutter) !important; right: var(--ep-gutter) !important; bottom: auto !important; top: 4.6rem !important; width: auto !important; }
}
@media (max-width: 743px) {
  /* The pages lay a setting out as label and value on one line with the explanation under it. */
  html.ep .setting { display: grid; grid-template-columns: minmax(0, 1fr) auto auto !important; column-gap: .7714rem !important; row-gap: .0714rem !important; align-items: center !important; }
}
@media (max-width: 620px) {
  html.ep .metrics, html.ep .tiles, html.ep .stats { grid-template-columns: minmax(0, 1fr) !important; gap: .7714rem !important; }
  html.ep main h1 { font-size: 2.1857rem !important; }
}
@media (max-width: 520px) { html.ep .ep-pill:not(.is-sample) { display: none !important; } html.ep .ep-pill.is-sample { padding: 0 .7714rem !important; font-size: .7714rem !important; } }
@media (prefers-reduced-motion: reduce) { html.ep *, html.ep *::before, html.ep *::after { transition-duration: 0s !important; animation-duration: 0s !important; } }

/* ---------- Night: details the tokens alone do not reach ---------- */
/* card brands keep their white tile at night; icon marks stay tinted */
html.ep[data-theme="dark"] .payrow .mark:not(.cash):not([style*="background"]), html.ep[data-theme="dark"] .item .mark:not(.cash):not(.dev):not(.doc):not([style*="background"]) { background: #FFFFFF !important; border-color: transparent !important; }
html.ep[data-theme="dark"] main svg line, html.ep[data-theme="dark"] main svg path[stroke="#E8E8E8"], html.ep[data-theme="dark"] main svg path[stroke="#EFEFEF"] { stroke: rgba(255,255,255,.12) !important; }
html.ep[data-theme="dark"] main *:not(.mark) > svg text { fill: var(--ep-text-3) !important; }
html.ep[data-theme="dark"] .ep-hero-art::before { filter: drop-shadow(0 .3857rem .9rem rgba(0,0,0,.6)) !important; }
html.ep[data-theme="dark"] .head.ep-head::after { background: linear-gradient(90deg, rgba(255,255,255,0) 0%, var(--ep-line-3) 6%, var(--ep-line-3) 94%, rgba(255,255,255,0) 100%) !important; }