:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;

  --workspace-gutter: 24px;

  --control-sm: 32px;
  --control-md: 40px;
  --control-touch: 44px;
  --control-lg: 48px;

  --radius-control: 6px;
  --radius-panel: 8px;
  --radius-modal: 12px;
  --radius-pill: 999px;

  --font-meta: 12px;
  --font-data: 13px;
  --font-body: 14px;
  --font-public: 16px;
  --font-title-sm: 18px;
  --font-title-md: 24px;
  --font-title-lg: 28px;

  --leading-tight: 1.2;
  --leading-body: 1.45;
  --leading-copy: 1.55;

  --motion-fast: 120ms;
  --motion-base: 160ms;
  --motion-slow: 220ms;
  --press-offset: 1px;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);

  --focus-ring-width: 2px;
  --focus-ring-offset: 1px;

  --z-sticky: 80;
  --z-menu: 160;
  --z-modal: 1100;
  --z-toast: 1200;
  --z-tooltip: 1300;
  --z-drag: 2400;

  --analytics-sticky-offset: 90px;
  --mobile-sticky-top: 0px;
}

@font-face {
  font-family: "Google Sans";
  src: url("/assets/GoogleSans-Variable-vT3J372L.ttf") format("truetype");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: "Google Sans", "Product Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --brand-navy: #00163c;
  --brand-blue: #278fff;
  --brand-cyan: #00ddd7;
  --brand-gradient: linear-gradient(90deg, var(--brand-blue), var(--brand-cyan));
  --focus-ring: #0b63ce;
  --control-border: #8495a7;
  --control-border-strong: #7d8ea2;
  --control-border-disabled: #c8d2de;
  --control-disabled-bg: #f1f4f8;
  --floating-surface: #ffffff;
  --floating-border: #c2cdda;
  --floating-shadow: 0 6px 12px rgba(11, 31, 51, 0.08);
  --text: #0b1f33;
  --page: #f5f7fa;
  --sidebar-bg: #ffffff;
  --sidebar-text: #0b1f33;
  --sidebar-active: #eaf3ff;
  --sidebar-border: #dce3ed;
  --panel: #fff;
  --panel-border: #dce3ed;
  --subtle-border: #eef2f7;
  --muted: #657487;
  --muted-strong: #53657a;
  --label: #2e3d52;
  --input-bg: #fff;
  --button-bg: #fff;
  --action-hover-bg: #eef6ff;
  --action-hover-border: #9bc5ff;
  --primary: #0b63ce;
  --primary-text: #fff;
  --code-bg: #eef2f7;
  --code-border: #dce3ed;
  --selected-bg: #eaf3ff;
  --selected-border: #9bc5ff;
  --control-active-bg: #f4f9ff;
  --control-active-border: #79b1f2;
  --details-bg: #f8fafc;
  --accordion-bg: #fbfcfe;
  --accordion-summary-bg: #f1f5fa;
  --accordion-open-bg: #eaf3ff;
  --accordion-border: #c8d7ea;
  --accordion-accent: #0b63ce;
  --inner-panel-bg: #f3f6fa;
  --inner-panel-border: #d4dfec;
  --status-bg: #f6f8fb;
  --success-bg: #eaf8f0;
  --success-border: #9ed8b8;
  --success-text: #176b45;
  --warn-bg: #fff6df;
  --warn-border: #eac46d;
  --warn-text: #7a4a00;
  --danger-bg: #fff0ef;
  --danger-border: #e8a09c;
  --danger-text: #a92d2d;
  --info-bg: #eef6ff;
  --info-border: #9bc5ff;
  --info-text: #0b56ae;
  --icon-muted: #71849a;
  --chart-click: #0b63ce;
  --chart-view: #007d80;
  --chart-grid: #dce3ed;
  color: var(--text);
  background: var(--page);
  font-family: var(--font-sans);
}

:root[data-theme="dark"] {
  --text: #f3f7fc;
  --page: #061225;
  --sidebar-bg: #07162a;
  --sidebar-text: #f3f7fc;
  --sidebar-active: #123a68;
  --sidebar-border: #1b2e47;
  --panel: #0b1b31;
  --panel-border: #273a52;
  --subtle-border: #1e3149;
  --muted: #a7b5c6;
  --muted-strong: #bdc8d5;
  --label: #d5deea;
  --input-bg: #08172a;
  --button-bg: #10243d;
  --action-hover-bg: #102b4b;
  --action-hover-border: #438de2;
  --primary: #5aa6ff;
  --primary-text: #061225;
  --focus-ring: #438de2;
  --control-border: #536a84;
  --control-border-strong: #60758f;
  --control-border-disabled: #31465f;
  --control-disabled-bg: #091629;
  --floating-surface: #0b1b31;
  --floating-border: #273a52;
  --floating-shadow: 0 6px 12px rgba(0, 0, 0, 0.24);
  --code-bg: #07182b;
  --code-border: #28405e;
  --selected-bg: #123a68;
  --selected-border: #438de2;
  --control-active-bg: #0d2743;
  --control-active-border: #438de2;
  --details-bg: #09192d;
  --accordion-bg: #08172a;
  --accordion-summary-bg: #0c2038;
  --accordion-open-bg: #102b4b;
  --accordion-border: #294563;
  --accordion-accent: #5aa6ff;
  --inner-panel-bg: #08192c;
  --inner-panel-border: #263f5b;
  --status-bg: #09192d;
  --success-bg: #10291c;
  --success-border: #2f8d55;
  --success-text: #95e2b3;
  --warn-bg: #2a220f;
  --warn-border: #a67925;
  --warn-text: #f0ca75;
  --danger-bg: #2a1514;
  --danger-border: #a65248;
  --danger-text: #ffb4aa;
  --info-bg: #102b4b;
  --info-border: #438de2;
  --info-text: #9bc5ff;
  --icon-muted: #91a3b8;
  --chart-click: #5aa6ff;
  --chart-view: #27d5d1;
  --chart-grid: #2a405a;
}

* { box-sizing: border-box; }

body { margin: 0; }

button, input, select, textarea { font: inherit; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

.appShell {
  height: 100vh;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  overflow: hidden;
  transition: grid-template-columns 180ms ease;
}

.appShell.sidebarCollapsed {
  grid-template-columns: 76px minmax(0, 1fr);
}

.sidebar {
  background: var(--sidebar-bg);
  color: var(--sidebar-text);
  border-right: 1px solid var(--sidebar-border);
  padding: 22px 16px;
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  max-height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  overflow: hidden;
  transition: padding 180ms ease;
}

.sidebarCollapsed .sidebar {
  padding: 22px 10px;
}

.brand {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  font-weight: 760;
  font-size: 20px;
  margin-bottom: 26px;
}

.logoBrand {
  position: relative;
  width: fit-content;
  max-width: 100%;
  color: inherit;
  text-decoration: none;
}

.sidebar .logoBrand {
  position: relative;
  align-items: center;
  width: 164px;
  overflow: hidden;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  height: 50px;
  transition: width var(--motion-slow) var(--ease-emphasized);
}

.brandLogo {
  position: relative;
  z-index: 1;
  display: block;
  width: 164px;
  max-width: 100%;
  height: auto;
  transform-origin: left center;
  transition: opacity var(--motion-base) var(--ease-standard), transform var(--motion-slow) var(--ease-emphasized);
}

.brandLogoDark {
  display: none;
}

.brandIconLogo {
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 2;
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
  opacity: 0;
  transform: translateY(-50%) scale(0.82);
  transform-origin: center;
  transition: opacity var(--motion-base) var(--ease-standard), transform var(--motion-slow) var(--ease-emphasized);
}

.brandIconLogoDark {
  display: none;
}

:root[data-theme="dark"] .brandLogoLight {
  display: none;
}

:root[data-theme="dark"] .brandLogoDark {
  display: block;
}

:root[data-theme="dark"] .brandIconLogoLight {
  display: none;
}

:root[data-theme="dark"] .brandIconLogoDark {
  display: block;
}

.sidebarCollapsed .sidebar .logoBrand {
  width: 40px;
  margin-inline: auto;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.sidebarCollapsed .sidebar .logoBrand .brandLogo {
  opacity: 0;
  transform: translateX(-6px) scale(0.96);
}

.sidebarCollapsed .sidebar .logoBrand .brandIconLogo {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}

.brand.dark {
  color: var(--text);
  margin-bottom: 20px;
}

.authLogoBrand .brandLogo {
  width: 190px;
}

.authLogoBrand .brandIconLogo {
  display: none;
}

.logoOptionsPage {
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(22, 31, 27, 0.92), rgba(8, 14, 11, 0.98)),
    var(--page);
  padding: 34px;
  color: var(--text);
}

.logoOptionsHeader {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: end;
  max-width: 1380px;
  margin: 0 auto 24px;
}

.logoOptionsHeader h1 {
  margin: 0;
  font-size: 36px;
  line-height: 1.05;
}

.logoOptionsHeader p {
  margin: 0;
}

.logoOptionsHeader .eyebrow {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 8px !important;
}

.logoOptionsGrid {
  max-width: 1380px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.logoOptionCard {
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: var(--panel);
  padding: 16px;
  display: grid;
  gap: 16px;
  min-width: 0;
}

.logoOptionMeta {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.logoOptionNumber {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
  font-weight: 850;
  font-size: 18px;
}

.logoOptionCard h2 {
  margin: 0 0 5px;
  font-size: 18px;
}

.logoOptionCard p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
}

.logoPreviewRail {
  display: grid;
  place-items: center;
  min-height: 116px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(0, 0, 0, 0.16));
  background-size: 18px 18px, auto;
  padding: 20px;
}

.metalPreview {
  --metal-bg: linear-gradient(122deg, #ffffff 0%, #eef4f8 35%, #c3ced8 70%, #6e7f8d 100%);
  --metal-sheen: linear-gradient(118deg, transparent 23%, rgba(255, 255, 255, 0.78) 42%, rgba(255, 255, 255, 0.2) 59%, transparent 78%);
  --metal-transform: translateX(-8px) rotate(9deg);
  position: relative;
  width: 204px;
  min-height: 74px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 8px;
  padding: 10px 13px;
  background: var(--metal-bg);
  border: 1px solid rgba(255, 255, 255, 0.62);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    inset 0 -1px 0 rgba(40, 52, 62, 0.22),
    0 12px 26px rgba(0, 0, 0, 0.28);
}

.metalPreview::before,
.metalPreview::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.metalPreview::before {
  inset: 1px;
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.34), transparent 32%, rgba(0, 0, 0, 0.1) 100%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.13) 0 1px, rgba(0, 0, 0, 0.03) 1px 3px);
  opacity: var(--metal-texture-opacity, 0.72);
}

.metalPreview::after {
  inset: -26px -44px;
  background: var(--metal-sheen);
  transform: var(--metal-transform);
  opacity: var(--metal-sheen-opacity, 1);
}

.metalPreview img {
  position: relative;
  z-index: 1;
  display: block;
  width: 174px;
  max-width: 100%;
  height: auto;
}

.metalOption1 {
  --metal-bg:
    linear-gradient(122deg, rgba(255, 255, 255, 0.96) 0%, rgba(250, 253, 255, 0.98) 24%, rgba(230, 237, 244, 0.96) 42%, rgba(255, 255, 255, 0.96) 58%, rgba(181, 194, 207, 0.98) 79%, rgba(111, 128, 143, 0.96) 100%),
    linear-gradient(180deg, #ffffff 0%, #c9d3dc 100%);
  --metal-transform: translateX(-8px) rotate(9deg);
}

.metalOption2 {
  --metal-bg:
    linear-gradient(132deg, #ffffff 0%, #f9fcff 31%, #eef4f9 50%, #d1dce6 72%, #758796 100%);
  --metal-sheen: linear-gradient(128deg, transparent 17%, rgba(255, 255, 255, 0.88) 36%, rgba(255, 255, 255, 0.42) 56%, transparent 74%);
  --metal-transform: translateX(6px) rotate(16deg);
}

.metalOption3 {
  --metal-bg:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.18) 0 1px, rgba(55, 73, 84, 0.08) 1px 3px),
    linear-gradient(90deg, #f8fafb 0%, #cfd8df 22%, #fbfcfd 45%, #aab7c1 72%, #f0f4f6 100%);
  --metal-sheen: linear-gradient(112deg, transparent 28%, rgba(255, 255, 255, 0.52) 47%, transparent 68%);
  --metal-sheen-opacity: 0.75;
}

.metalOption4 {
  --metal-bg:
    linear-gradient(126deg, #eff4f8 0%, #9daab4 32%, #485865 59%, #1d2930 100%);
  --metal-sheen: linear-gradient(122deg, transparent 20%, rgba(255, 255, 255, 0.52) 42%, rgba(255, 255, 255, 0.15) 58%, transparent 73%);
  --metal-texture-opacity: 0.48;
  border-color: rgba(180, 196, 208, 0.54);
}

.metalOption5 {
  --metal-bg:
    linear-gradient(118deg, #ffffff 0%, #f6f8f8 28%, #e7edef 54%, #d0d9dd 100%);
  --metal-sheen: linear-gradient(130deg, transparent 24%, rgba(255, 255, 255, 0.78) 45%, rgba(255, 255, 255, 0.2) 60%, transparent 80%);
  --metal-sheen-opacity: 0.66;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    inset 0 -1px 0 rgba(67, 80, 88, 0.12),
    0 10px 22px rgba(0, 0, 0, 0.18);
}

.metalOption6 {
  --metal-bg:
    linear-gradient(124deg, #ffffff 0%, #e8f4ff 27%, #bcd1df 56%, #6e8495 100%);
  --metal-sheen: linear-gradient(116deg, transparent 19%, rgba(255, 255, 255, 0.75) 38%, rgba(214, 239, 255, 0.28) 58%, transparent 76%);
  --metal-transform: translateX(-2px) rotate(12deg);
}

.metalOption7 {
  --metal-bg:
    linear-gradient(118deg, #ffffff 0%, #9eaab3 18%, #ffffff 36%, #c6d0d8 52%, #687b89 72%, #f4f7fa 100%);
  --metal-sheen: linear-gradient(126deg, transparent 18%, rgba(255, 255, 255, 0.9) 33%, rgba(255, 255, 255, 0.22) 46%, transparent 62%);
  --metal-transform: translateX(10px) rotate(13deg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    inset 0 -2px 0 rgba(30, 43, 52, 0.24),
    inset 1px 0 0 rgba(255, 255, 255, 0.45),
    0 14px 30px rgba(0, 0, 0, 0.3);
}

.metalOption8 {
  --metal-bg:
    radial-gradient(ellipse at 68% 50%, rgba(224, 237, 245, 0.5) 0%, rgba(176, 196, 209, 0.28) 24%, transparent 50%),
    linear-gradient(122deg, #c8d4dc 0%, #74858f 28%, #33424c 58%, #172229 100%);
  --metal-sheen: linear-gradient(124deg, transparent 20%, rgba(255, 255, 255, 0.5) 39%, rgba(255, 255, 255, 0.24) 58%, transparent 80%);
  --metal-sheen-opacity: 0.84;
  --metal-texture-opacity: 0.38;
  border-color: rgba(138, 156, 168, 0.48);
}

.metalOption9 {
  --metal-bg:
    linear-gradient(126deg, #ffffff 0%, #fbfdfe 34%, #e2eaf0 62%, #8394a2 100%);
  --metal-sheen: linear-gradient(127deg, transparent 35%, rgba(255, 255, 255, 0.92) 45%, rgba(255, 255, 255, 0.3) 52%, transparent 62%);
  --metal-transform: translateX(16px) rotate(15deg);
}

.metalOption10 {
  --metal-bg:
    linear-gradient(120deg, #ffffff 0%, #ffffff 44%, #e9eff3 72%, #a9b8c3 100%);
  --metal-sheen: linear-gradient(132deg, transparent 25%, rgba(255, 255, 255, 0.82) 43%, transparent 61%);
  --metal-sheen-opacity: 0.58;
  border-color: rgba(220, 228, 234, 0.86);
}

.metalOption11 {
  --metal-bg:
    radial-gradient(circle at 36% 42%, rgba(255, 255, 255, 0.98) 0%, rgba(246, 250, 252, 0.92) 28%, transparent 58%),
    linear-gradient(124deg, #dde6ec 0%, #f9fbfc 35%, #bcc8d0 69%, #536775 100%);
  --metal-sheen: linear-gradient(118deg, transparent 20%, rgba(255, 255, 255, 0.72) 42%, rgba(255, 255, 255, 0.18) 57%, transparent 75%);
  --metal-transform: translateX(0) rotate(14deg);
}

.metalOption12 {
  --metal-bg:
    linear-gradient(123deg, #ffffff 0%, #f1f5f7 38%, #dce5ea 71%, #9aaab6 100%);
  --metal-sheen: linear-gradient(126deg, transparent 29%, rgba(255, 255, 255, 0.5) 45%, transparent 66%);
  --metal-sheen-opacity: 0.56;
  --metal-texture-opacity: 0.42;
}

.homePage {
  --home-bg: #061225;
  --home-band: #0b1b31;
  --home-panel: rgba(11, 27, 49, 0.84);
  --home-border: rgba(90, 166, 255, 0.24);
  --home-line: rgba(39, 143, 255, 0.25);
  --home-text: #f3f7fc;
  --home-muted: #a7b5c6;
  --home-soft: #d5deea;
  --home-blue: #5aa6ff;
  --home-cyan: #27d5d1;
  --home-success: #55c98a;
  --home-amber: #e9c46a;
  min-height: 100vh;
  color: var(--home-text);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(180deg, #061225 0%, #0b1b31 44%, #06101f 100%);
  background-size: 48px 48px, auto;
}

.homeHeader {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 72px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 14px clamp(18px, 4vw, 54px);
  border-bottom: 1px solid rgba(144, 176, 214, 0.16);
  background: rgba(5, 17, 34, 0.9);
  backdrop-filter: blur(18px);
}

.homeBrand img {
  display: block;
  width: 164px;
  height: auto;
}

.homeNav,
.homeHeaderActions,
.homeHeroActions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.homeMobileMenu { display: none; }

.homeNav {
  justify-content: center;
  gap: 18px;
}

.homeNav a {
  color: var(--home-muted);
  text-decoration: none;
  font-weight: 720;
  font-size: 14px;
}

.homeNav a:hover {
  color: var(--home-text);
}

.homeButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-touch);
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid var(--home-border);
  color: var(--home-text);
  text-decoration: none;
  font-weight: 800;
  white-space: nowrap;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.homeButton:focus-visible {
  outline: 2px solid var(--home-cyan);
  outline-offset: 3px;
}

.homeButton.primary {
  border-color: rgba(90, 166, 255, 0.76);
  background: linear-gradient(180deg, #126bd4, #0b63ce);
  color: #ffffff;
  box-shadow: 0 8px 26px rgba(39, 143, 255, 0.2);
}

.homeButton.primary:hover,
.homeButton.primary:focus-visible {
  border-color: rgba(90, 166, 255, 0.92);
  background: linear-gradient(180deg, #1066c8, #084ea8);
}

.homeButton.ghost {
  background: rgba(255, 255, 255, 0.04);
}

.homeButton.large {
  min-height: var(--control-lg);
  padding: 0 20px;
}

.homeHero {
  position: relative;
  min-height: clamp(590px, 78svh, 760px);
  display: grid;
  align-items: center;
  overflow: hidden;
  padding: clamp(48px, 8vw, 96px) clamp(18px, 4vw, 54px);
  border-bottom: 1px solid rgba(144, 176, 214, 0.14);
}

.homeHero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(6, 18, 37, 0.99) 0%, rgba(6, 18, 37, 0.88) 38%, rgba(6, 18, 37, 0.22) 100%),
    linear-gradient(180deg, rgba(39, 143, 255, 0.12), rgba(0, 221, 215, 0.07));
  pointer-events: none;
}

.homeHeroContent {
  position: relative;
  z-index: 2;
  width: min(880px, 100%);
}

.homeEyebrow {
  margin: 0 0 12px;
  color: var(--home-cyan);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.homeHero h1 {
  max-width: 850px;
  margin: 0;
  font-size: clamp(42px, 6vw, 78px);
  line-height: 0.96;
  letter-spacing: 0;
}

.homeHeroLead {
  max-width: 720px;
  margin: 22px 0 0;
  color: var(--home-soft);
  font-size: clamp(18px, 2.1vw, 23px);
  line-height: 1.45;
}

.homeHeroActions {
  margin-top: 30px;
  flex-wrap: wrap;
}

.homeHeroChips {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.homeHeroChips span,
.homePillList span,
.homeBoundaryList span {
  border: 1px solid var(--home-border);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--home-soft);
  padding: 8px 11px;
  font-weight: 760;
  font-size: 13px;
}

.homeHeroArtwork {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: clamp(-120px, -4vw, -22px);
  width: min(1120px, 72vw);
  transform: translateY(-50%);
  opacity: 0.86;
  pointer-events: none;
  filter: drop-shadow(0 34px 70px rgba(0, 0, 0, 0.42));
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 13%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 13%, #000 100%);
}

.homeHeroArtwork img {
  display: block;
  width: 100%;
  height: auto;
  filter: hue-rotate(58deg) saturate(1.12);
}

.homeSection,
.homeFinalCta {
  padding: clamp(54px, 8vw, 92px) clamp(18px, 4vw, 54px);
}

.homeBand {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    var(--home-band);
  background-size: 48px 48px, auto;
  border-block: 1px solid rgba(144, 176, 214, 0.12);
}

.homeSectionHeader {
  width: min(880px, 100%);
  margin-bottom: 26px;
}

.homeSectionHeader h2,
.homeFinalCta h2 {
  margin: 0;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: 0;
}

.homeSectionHeader p:not(.homeEyebrow),
.homeFinalCta p:not(.homeEyebrow) {
  max-width: 780px;
  margin: 14px 0 0;
  color: var(--home-muted);
  font-size: 17px;
  line-height: 1.5;
}

.homeCardGrid,
.homeFeatureGrid,
.homePrivacyGrid {
  display: grid;
  gap: 14px;
}

.homeCardGrid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.homeCardGrid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.homeCardGrid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.homeCard,
.homeFeature,
.homeMetricPanel {
  border: 1px solid var(--home-border);
  border-radius: 8px;
  background: var(--home-panel);
  padding: 20px;
  min-width: 0;
}

.homeCard.compact {
  padding: 18px;
}

.homeCardTitle {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.homeCardTitle svg {
  color: var(--home-blue);
}

.homeCard h3,
.homeFeature h3 {
  margin: 0 0 10px;
  font-size: 19px;
}

.homeCardTitle h3 {
  margin: 0;
}

.homeCard p,
.homeFeature p {
  margin: 0;
  color: var(--home-muted);
  line-height: 1.5;
}

.homeCard p + p {
  margin-top: 12px;
}

.homeCard ul {
  display: grid;
  gap: 9px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.homeCard li {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--home-soft);
  font-size: 14px;
  line-height: 1.35;
}

.homeCard li svg {
  margin-top: 2px;
  color: var(--home-cyan);
}

.homeFeatureGrid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.homeFeature {
  min-height: 196px;
}

.homeFeature:nth-child(n) {
  grid-column: span 2;
}

.homeFeature span {
  display: inline-flex;
  margin-top: 18px;
  color: var(--home-amber);
  font-size: 13px;
  font-weight: 800;
}

.homeValueNote {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 16px;
  border: 1px solid rgba(39, 143, 255, 0.34);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(39, 143, 255, 0.13), rgba(0, 221, 215, 0.06)),
    var(--home-panel);
  padding: 18px 20px;
}

.homeValueNote .homeEyebrow {
  margin-bottom: 8px;
}

.homeValueNote h3,
.homeValueNote p {
  margin: 0;
}

.homeValueNote h3 {
  font-size: 20px;
  line-height: 1.15;
}

.homeValueNote > p {
  color: var(--home-soft);
  line-height: 1.45;
}

.homeAttributionLayout {
  display: grid;
  grid-template-columns: minmax(320px, 0.86fr) minmax(0, 1.14fr);
  gap: 14px;
  align-items: stretch;
}

.homeJourneyPanel {
  display: grid;
  align-content: start;
  gap: 20px;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--home-border);
  border-radius: 8px;
  background: var(--home-panel);
}

.homeJourneyPath {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.homeJourneyPath li {
  position: relative;
  display: grid;
  gap: 4px;
  min-height: 70px;
  padding: 4px 8px 18px 30px;
  border-left: 2px solid rgba(90, 166, 255, 0.42);
}

.homeJourneyPath li:last-child {
  min-height: 0;
  padding-bottom: 4px;
  border-left-color: transparent;
}

.homeJourneyPath li::before {
  content: "";
  position: absolute;
  top: 7px;
  left: -7px;
  width: 12px;
  height: 12px;
  border: 2px solid #0b1b31;
  border-radius: 50%;
  background: var(--home-cyan);
  box-shadow: 0 0 0 2px rgba(39, 143, 255, 0.26);
}

.homeJourneyPath li:nth-child(2)::before {
  background: var(--home-amber);
  box-shadow: 0 0 0 2px rgba(233, 196, 106, 0.2);
}

.homeJourneyPath li:nth-child(3)::before,
.homeJourneyPath li:nth-child(4)::before {
  background: var(--home-success);
  box-shadow: 0 0 0 2px rgba(85, 201, 138, 0.24);
}

.homeJourneyPath small {
  color: var(--home-muted);
  font-size: 12px;
  font-weight: 780;
}

.homeJourneyPath strong {
  color: var(--home-text);
  font-size: 16px;
}

.homeJourneySignals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--home-line);
}

.homeJourneySignals span {
  display: grid;
  gap: 4px;
  padding: 16px 10px 0;
  color: var(--home-muted);
  font-size: 12px;
  line-height: 1.3;
}

.homeJourneySignals span:first-child {
  padding-left: 0;
}

.homeJourneySignals strong {
  color: var(--home-text);
  font-size: 20px;
}

.homeAnalyticsLayout {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  gap: 14px;
  align-items: stretch;
}

.homeMetricPanel {
  display: grid;
  align-content: start;
  gap: 20px;
}

.homePanelHeader {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--home-text);
  font-weight: 840;
}

.homePanelHeader svg {
  color: var(--home-cyan);
}

.homeSignalRows {
  display: grid;
  gap: 13px;
}

.homeSignalRow {
  display: grid;
  gap: 7px;
}

.homeSignalRow span {
  color: var(--home-muted);
  font-weight: 740;
}

.homeSignalRow i {
  display: block;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--home-blue), var(--home-cyan));
}

.homePrivacyGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.homePillList,
.homeCodeList,
.homeBoundaryList {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.homeCodeList code {
  border: 1px solid rgba(90, 166, 255, 0.24);
  border-radius: 6px;
  background: rgba(5, 17, 34, 0.68);
  color: var(--home-soft);
  padding: 7px 9px;
  font-size: 13px;
}

.homeBoundaries {
  background: #081629;
  border-block: 1px solid rgba(144, 176, 214, 0.12);
}

.homeFinalCta {
  text-align: center;
  display: grid;
  justify-items: center;
  background:
    linear-gradient(180deg, rgba(39, 143, 255, 0.11), rgba(0, 221, 215, 0.05)),
    #061225;
}

.homeFinalCta .homeHeroActions {
  justify-content: center;
}

.homeFooter {
  display: grid;
  grid-template-columns: minmax(260px, 1.3fr) repeat(3, minmax(150px, 0.6fr));
  gap: 28px;
  padding: 34px clamp(18px, 4vw, 54px);
  border-top: 1px solid rgba(144, 176, 214, 0.16);
  background: rgba(5, 17, 34, 0.94);
}

.homeFooterBrand img {
  display: block;
  width: 148px;
  height: auto;
}

.homeFooter p {
  max-width: 440px;
  margin: 14px 0 0;
  color: var(--home-muted);
  line-height: 1.5;
}

.homeFooter h2 {
  margin: 0 0 12px;
  color: var(--home-soft);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0;
}

.homeFooter a {
  display: block;
  width: fit-content;
  margin-top: 8px;
  color: var(--home-muted);
  text-decoration: none;
  font-weight: 720;
}

.homeFooter a:hover {
  color: var(--home-text);
}

.contactPage {
  min-height: 100vh;
}

.contactShell {
  width: min(1040px, 100%);
  margin: 0 auto;
  padding: clamp(44px, 7vh, 88px) clamp(18px, 4vw, 54px);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3.2vw, 34px);
  align-items: start;
}

.contactIntro {
  display: grid;
  gap: 20px;
  max-width: 900px;
}

.contactIntro h1 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(40px, 6vw, 68px);
  line-height: 0.98;
  letter-spacing: 0;
}

.contactDirectGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.contactDirectCard,
.contactFormPanel {
  border: 1px solid var(--home-border);
  border-radius: 8px;
  background: var(--home-panel);
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.18);
}

.contactDirectCard {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  color: var(--home-text);
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease;
}

.contactDirectCard::after {
  content: attr(data-action);
  position: absolute;
  right: 16px;
  top: 16px;
  color: var(--home-cyan);
  font-size: 12px;
  font-weight: 850;
  opacity: 0;
  transition: opacity 160ms ease;
}

.contactDirectCard:hover,
.contactDirectCard:focus-visible {
  border-color: rgba(90, 166, 255, 0.62);
  background:
    linear-gradient(180deg, rgba(39, 143, 255, 0.11), rgba(0, 221, 215, 0.05)),
    var(--home-panel);
}

.contactDirectCard:hover::after,
.contactDirectCard:focus-visible::after {
  opacity: 1;
}

.contactDirectCard span {
  color: var(--home-muted);
  font-size: 13px;
  font-weight: 760;
}

.contactDirectCard strong {
  font-size: 18px;
  overflow-wrap: anywhere;
}

.contactFormPanel {
  display: grid;
  gap: 18px;
  padding: clamp(18px, 3vw, 26px);
}

.contactFormIntro {
  max-width: 820px;
  margin: 0 0 2px;
  color: var(--home-soft);
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.5;
}

.contactHoneypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contactFieldGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.contactFormPanel label {
  display: grid;
  gap: 8px;
  min-width: 0;
  color: var(--home-soft);
  font-size: 14px;
  font-weight: 800;
}

.contactRequired {
  margin-left: 3px;
  color: var(--home-cyan);
}

.contactFormPanel input,
.contactFormPanel select,
.contactFormPanel textarea {
  width: 100%;
  border: 1px solid rgba(90, 166, 255, 0.3);
  border-radius: 8px;
  background-color: rgba(5, 17, 34, 0.76);
  color: var(--home-text);
  padding: 12px 13px;
  font: inherit;
  min-height: 46px;
  min-width: 0;
}

.contactFormPanel textarea {
  resize: vertical;
  min-height: 148px;
}

.contactFormPanel input:focus-visible,
.contactFormPanel select:focus-visible,
.contactFormPanel textarea:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
}

.contactFormPanel textarea::placeholder {
  color: rgba(167, 181, 198, 0.58);
}

.contactFormFooter {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.contactFormFooter .homeButton {
  border: 1px solid rgba(90, 166, 255, 0.7);
  cursor: pointer;
}

.contactFormFooter p {
  flex: 1 1 260px;
  margin: 0;
  color: var(--home-muted);
  font-size: 14px;
  line-height: 1.4;
}

.legalPage {
  min-height: 100vh;
}

.legalShell {
  width: min(1040px, 100%);
  margin: 0 auto;
  padding: clamp(42px, 7vw, 86px) clamp(18px, 4vw, 54px);
}

.legalHero {
  max-width: 860px;
  margin-bottom: 30px;
}

.legalHero h1 {
  margin: 0;
  font-size: clamp(42px, 6vw, 70px);
  line-height: 0.98;
}

.legalHero p:not(.homeEyebrow) {
  margin: 18px 0 0;
  color: var(--home-soft);
  font-size: 18px;
  line-height: 1.55;
}

.legalHero span {
  display: inline-flex;
  margin-top: 16px;
  color: var(--home-muted);
  font-weight: 760;
}

.legalBody {
  display: grid;
  gap: 14px;
}

.legalSection {
  border: 1px solid var(--home-border);
  border-radius: 8px;
  background: var(--home-panel);
  padding: clamp(18px, 3vw, 26px);
}

.legalSection h2 {
  margin: 0 0 12px;
  color: var(--home-text);
  font-size: 21px;
}

.legalSection p,
.legalSection li {
  color: var(--home-soft);
  line-height: 1.58;
}

.legalSection p {
  margin: 0;
}

.legalSection p + p {
  margin-top: 12px;
}

.legalSection ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 20px;
}

@media (max-width: 1368px) {
  .homeHero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding-block: clamp(46px, 7vw, 74px) 38px;
  }
  .homeHero::before {
    background:
      linear-gradient(180deg, rgba(6, 18, 37, 0.99) 0%, rgba(6, 18, 37, 0.92) 50%, rgba(6, 18, 37, 0.66) 100%),
      linear-gradient(180deg, rgba(39, 143, 255, 0.12), rgba(0, 221, 215, 0.07));
  }
  .homeHeroContent {
    order: 1;
    max-width: 960px;
  }
  .homeHero h1 {
    max-width: 920px;
    font-size: clamp(40px, 6vw, 64px);
  }
  .homeHeroLead {
    max-width: 820px;
  }
  .homeHeroArtwork {
    order: 2;
    position: relative;
    inset: auto;
    width: min(100%, 1120px);
    margin-top: 34px;
    transform: none;
    opacity: 0.96;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .homeCardGrid.four,
  .homePrivacyGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .homeAnalyticsLayout {
    grid-template-columns: 1fr;
  }
  .homeAttributionLayout {
    grid-template-columns: 1fr;
  }
  .homeFooter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .contactDirectGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .homeHeader {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .homeNav {
    display: none;
  }
  .homeMobileMenu {
    position: relative;
    display: block;
    justify-self: end;
  }
  .homeMobileMenu summary {
    display: grid;
    width: var(--control-touch);
    height: var(--control-touch);
    place-items: center;
    border: 1px solid var(--home-border);
    border-radius: var(--radius-control);
    cursor: pointer;
    list-style: none;
  }
  .homeMobileMenu summary::-webkit-details-marker { display: none; }
  .homeMobileMenu nav {
    position: absolute;
    z-index: var(--z-menu);
    top: calc(100% + 8px);
    right: 0;
    display: grid;
    min-width: 190px;
    padding: var(--space-2);
    border: 1px solid rgba(90, 166, 255, 0.34);
    border-radius: var(--radius-panel);
    background: #0b1b31;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
  }
  .homeMobileMenu nav a {
    min-height: var(--control-touch);
    display: flex;
    align-items: center;
    padding: 0 var(--space-3);
    color: var(--home-text);
    text-decoration: none;
  }
  .homeHero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding-block: 46px 36px;
  }
  .homeHero::before {
    background:
      linear-gradient(180deg, rgba(6, 18, 37, 0.99) 0%, rgba(6, 18, 37, 0.92) 50%, rgba(6, 18, 37, 0.66) 100%),
      linear-gradient(180deg, rgba(39, 143, 255, 0.12), rgba(0, 221, 215, 0.07));
  }
  .homeHeroContent {
    order: 1;
    max-width: 100%;
  }
  .homeHeroArtwork {
    order: 2;
    position: relative;
    inset: auto;
    width: 100%;
    margin-top: 34px;
    transform: none;
    opacity: 0.96;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .homeCardGrid.three,
  .homeCardGrid.two,
  .homeCardGrid.four,
  .homePrivacyGrid,
  .homeFeatureGrid {
    grid-template-columns: 1fr;
  }
  .homeFooter {
    grid-template-columns: 1fr;
  }
  .homeFeature:nth-child(n) {
    grid-column: auto;
  }
  .homeValueNote {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .homeJourneySignals {
    grid-template-columns: 1fr;
  }
  .homeJourneySignals span,
  .homeJourneySignals span:first-child {
    padding: 10px 0;
    border-bottom: 1px solid var(--home-line);
  }
  .homeJourneySignals span:last-child {
    border-bottom: 0;
  }
  .contactDirectGrid,
  .contactFieldGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .homeHeader {
    gap: 12px;
    padding-inline: 14px;
  }
  .homeBrand img {
    width: 132px;
  }
  .homeHeaderActions {
    gap: 6px;
  }
  .homeHeaderActions .homeButton {
    min-height: var(--control-touch);
    padding: 0 10px;
    font-size: 13px;
  }
  .homeHeaderActions .homeButton.ghost { display: none; }
  .homeHero {
    padding-inline: 16px;
  }
  .homeHero h1 {
    font-size: 38px;
    line-height: 1;
  }
  .homeHeroLead {
    font-size: 17px;
  }
  .homeHeroArtwork {
    margin-top: 28px;
    width: calc(100% + 12px);
    margin-inline: -6px;
  }
  .legalHero h1 {
    font-size: 38px;
  }
}

.authShell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--page);
}

.authPanel {
  width: min(440px, 100%);
  background: var(--panel);
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  padding: 22px;
}

nav { display: block; }

.navItems { display: grid; gap: 6px; }

nav button, .rowButton {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  border: 0;
  border-radius: 6px;
  padding: 10px 12px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: left;
  transition: background-color 160ms ease, border-color 160ms ease, padding 180ms ease, gap 180ms ease;
}

nav button.active, nav button:hover { background: var(--sidebar-active); }

.sidebar nav {
  flex: 1;
  align-content: start;
  min-height: 0;
  overflow-y: auto;
  padding-bottom: 10px;
}

.sidebar nav button {
  align-items: center;
  height: 42px;
  min-width: 0;
  overflow: hidden;
}

.sidebar nav button > svg {
  flex: 0 0 18px;
}

.sidebar nav button span {
  display: block;
  min-width: 0;
  max-width: 180px;
  overflow: hidden;
  white-space: nowrap;
  opacity: 1;
  transform: translateX(0);
  transition: max-width 180ms ease, opacity 120ms ease, transform 180ms ease;
}

.sidebarCollapsed nav button {
  justify-content: center;
  padding: 10px;
  gap: 0;
}

.sidebarCollapsed nav button span {
  max-width: 0;
  opacity: 0;
  transform: translateX(-6px);
}

.sidebarCollapseButton {
  justify-content: center;
  width: 100%;
  margin-top: auto;
  border-color: var(--sidebar-border);
  color: var(--sidebar-text);
  background: transparent;
}

.sidebarCollapseButton:hover {
  background: var(--sidebar-active);
}

.workspace {
  height: 100vh;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: var(--workspace-gutter);
}

.topbar {
  position: relative;
  z-index: 100;
  display: flex;
  min-height: 40px;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  overflow: visible;
}

.topbarTitle {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--space-3);
}

.mobileMenuButton,
.mobileNavDrawer { display: none; }

.mobileNavDrawer::backdrop { background: rgba(6, 18, 37, 0.58); }

.topbarActions {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 10px;
}

.topbarContextActions {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.profileMenu {
  position: relative;
  height: 40px;
  flex: 0 0 auto;
}

.profileMenuTrigger {
  width: auto;
  max-width: 240px;
  height: 40px;
  min-height: 40px;
  gap: 9px;
  padding: 4px 9px 4px 5px;
  background: var(--panel);
}

.profileMenuAvatar {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border: 1px solid var(--selected-border);
  border-radius: 50%;
  background: var(--selected-bg);
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
}

.profileMenuTriggerText {
  display: grid;
  min-width: 0;
  gap: 1px;
  text-align: left;
}

.profileMenuTriggerText strong,
.profileMenuTriggerText small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profileMenuTriggerText strong {
  font-size: 12px;
}

.profileMenuTriggerText small {
  color: var(--muted);
  font-size: 10px;
  text-transform: capitalize;
}

.profileMenuChevron {
  flex: 0 0 auto;
  color: var(--muted);
}

.profileMenuPopover {
  position: absolute;
  z-index: var(--z-menu);
  top: calc(100% + 8px);
  right: 0;
  width: min(290px, calc(100vw - 28px));
  overflow: hidden;
  border: 1px solid var(--floating-border);
  border-radius: var(--radius-panel);
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
}

.profileMenuIdentity {
  display: grid;
  gap: 3px;
  padding: 14px;
}

.profileMenuIdentity strong,
.profileMenuIdentity span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profileMenuIdentity span {
  color: var(--muted);
  font-size: 12px;
}

.profileMenuItems {
  display: grid;
  gap: 2px;
  padding: 0 6px;
}

.profileMenuItems button,
.profileMenuLogout {
  width: 100%;
  min-height: 40px;
  justify-content: flex-start;
  gap: 10px;
  border-color: transparent;
  background: transparent;
}

.profileMenuItems button:hover,
.profileMenuLogout:hover {
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.profileMenuDivider {
  height: 1px;
  margin: 7px 0;
  background: var(--subtle-border);
}

.profileMenuLogout {
  margin: 0 6px 6px;
  width: calc(100% - 12px);
  color: var(--danger-text);
}

.workspaceSelect {
  width: min(280px, 32vw);
  margin-bottom: 0;
}

.trackerStatusSelect {
  width: min(220px, 24vw);
}

.campaignListActions {
  align-items: flex-end;
}

h1, h2, h3, p { margin-top: 0; }

h1 { font-size: 28px; margin-bottom: 4px; }

h2 { font-size: 18px; }

.topbar p, .muted { color: var(--muted); }

.titleLine {
  display: flex;
  align-items: center;
  gap: 8px;
}

.titleLine h1 { margin-bottom: 4px; }

.sectionTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.sectionTitleText {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.sectionTitle h2,
.sectionTitle h3,
.sectionTitle h4 { margin: 0; }

.sectionActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.helpWrap {
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.helpIcon {
  width: 20px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  border-radius: 6px;
  justify-content: center;
  border-color: var(--subtle-border);
  color: var(--icon-muted);
  background: transparent;
}

.helpIcon svg {
  width: 13px;
  height: 13px;
}

.helpIcon:hover,
.helpIcon:focus-visible {
  color: var(--primary);
  border-color: var(--selected-border);
}

.helpBubble {
  position: fixed;
  z-index: var(--z-tooltip);
  pointer-events: none;
  border: 1px solid var(--floating-border);
  background: var(--floating-surface);
  color: var(--text);
  box-shadow: var(--floating-shadow);
  border-radius: var(--radius-panel);
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.helpBubble.interactive {
  pointer-events: auto;
}

.helpBubble > span {
  display: block;
}

.helpBubble a {
  display: inline-block;
  margin-top: 8px;
  color: var(--primary);
  font-weight: 700;
}

.grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}

.span2 { grid-column: span 2; }

.span4 { grid-column: span 4; }

.split { display: grid; grid-template-columns: 420px 1fr; gap: 16px; align-items: start; }

.entityPage {
  display: grid;
  gap: 16px;
}

.panel, .metric {
  background: var(--panel);
  border: 1px solid var(--panel-border);
  border-radius: var(--radius-panel);
  padding: var(--space-4);
  min-width: 0;
  max-width: 100%;
}

.metric span { display: block; color: var(--muted); font-size: 13px; }

.metric .labelText,
.metric .helpWrap {
  display: inline-flex;
}

.metric strong {
  display: block;
  max-width: 100%;
  margin-top: 8px;
  overflow-wrap: anywhere;
  font-size: 32px;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}

.dashboardPage {
  display: grid;
  gap: 24px;
  min-width: 0;
}

.dashboardSection {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.dashboardSection > .sectionTitle {
  margin: 0 2px;
}

.dashboardMetricGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.dashboardHeadlineMetric {
  min-height: 118px;
}

.dashboardHeadlineMetric > span:last-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
  padding-top: 9px;
  border-top: 1px solid var(--subtle-border);
  color: var(--muted);
}

.dashboardHeadlineMetric > span:last-child b {
  color: var(--muted-strong);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

.dashboardOutcomeGrid,
.dashboardCompositionGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}

.dashboardPrimaryTrend,
.dashboardAudiencePanel {
  grid-column: 1 / -1;
}

.dashboardExplorePanel {
  padding: 0;
  overflow: hidden;
}

.dashboardExplorePanel > summary {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
}

.dashboardExplorePanel > summary::-webkit-details-marker {
  display: none;
}

.dashboardExplorePanel > summary > span {
  display: grid;
  gap: 3px;
}

.dashboardExplorePanel > summary strong {
  color: var(--text);
}

.dashboardExplorePanel > summary small {
  color: var(--muted);
}

.dashboardExplorePanel > summary svg {
  flex: 0 0 auto;
  color: var(--icon-muted);
  transition: transform var(--motion-base) var(--ease-standard);
}

.dashboardExplorePanel[open] > summary {
  border-bottom: 1px solid var(--subtle-border);
  background: var(--inner-panel-bg);
}

.dashboardExplorePanel[open] > summary svg {
  transform: rotate(180deg);
}

.dashboardExploreBody {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.dashboardTrendBars {
  display: grid;
  grid-template-columns: repeat(24, minmax(10px, 1fr));
  align-items: end;
  gap: 6px;
  min-height: 220px;
  padding-top: 8px;
}

.dashboardTrendBar {
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: end;
  gap: 8px;
  min-width: 0;
  height: 220px;
}

.dashboardTrendBar span {
  display: block;
  width: 100%;
  border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, var(--primary), rgba(39, 143, 255, 0.32));
}

.dashboardTrendBar em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  text-align: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  justify-self: center;
}

.dashboardFunnel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.dashboardFunnelRow {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.dashboardFunnelMeta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content max-content;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.dashboardFunnelMeta span {
  color: var(--muted-strong);
  font-weight: 700;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardFunnelMeta strong {
  font-size: 18px;
  min-width: 0;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.dashboardFunnelMeta em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}

.dashboardFunnelBar {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--input-bg);
  border: 1px solid var(--subtle-border);
}

.dashboardFunnelBar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--primary);
}

.dashboardTrafficComposition {
  display: grid;
  gap: 16px;
}

.dashboardTrafficSection {
  min-width: 0;
}

.dashboardTrafficSection + .dashboardTrafficSection {
  padding-top: 16px;
  border-top: 1px solid var(--subtle-border);
}

.dashboardTrafficSection .sectionTitle {
  margin-bottom: 10px;
}

.dashboardTrafficSection .sectionTitle h3 {
  font-size: 16px;
}

.dashboardDonutMetricSwitch {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  min-width: min(100%, 300px);
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.dashboardDonutMetricSwitch button {
  min-height: 30px;
  justify-content: center;
  padding: 0 9px;
  border-color: transparent;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
}

.dashboardDonutMetricSwitch button.active {
  color: var(--text);
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.dashboardDonutLayout {
  display: grid;
  grid-template-columns: minmax(132px, 154px) minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  min-height: 154px;
}

.dashboardDonutChart {
  position: relative;
  display: grid;
  place-items: center;
  width: min(100%, 154px);
  aspect-ratio: 1;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.dashboardDonutChart::after {
  content: "";
  position: absolute;
  inset: 20%;
  border-radius: 50%;
  background: var(--panel);
  border: 1px solid var(--panel-border);
}

.dashboardDonutChart > div {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 4px;
  max-width: 76%;
  text-align: center;
}

.dashboardDonutChart span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.dashboardDonutChart strong {
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.05;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95), 0 0 6px rgba(0, 0, 0, 0.7);
}

.dashboardDonutChart strong.dashboardDonutValueDense {
  font-size: 16px;
}

.dashboardDonutChart strong.dashboardDonutValueVeryDense {
  font-size: 14px;
}

.dashboardDonutEmpty {
  display: grid;
  place-items: center;
  min-height: 154px;
  margin: 0;
  text-align: center;
}

.dashboardDonutLegend {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.dashboardDonutLegendRow {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.dashboardDonutSwatch {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.dashboardDonutLegendRow strong {
  overflow: hidden;
  color: var(--muted-strong);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardDonutLegendRow em {
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.dashboardDonutLegendRow small {
  color: var(--muted);
  font-size: 12px;
}

.dashboardAudienceTechnology {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.dashboardAudienceMetricSwitch {
  min-width: 310px;
}

.dashboardAudienceBody {
  min-height: 180px;
  transition: opacity 140ms ease;
}

.dashboardAudienceBody.loading {
  opacity: 0.58;
}

.dashboardAudiencePlaceholder {
  display: grid;
  place-items: center;
  min-height: 180px;
  border-top: 1px solid var(--subtle-border);
  text-align: center;
}

.dashboardAudiencePlaceholder p {
  margin: 0;
}

.dashboardAudienceSnapshotGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0;
}

.dashboardAudienceSnapshot {
  display: grid;
  align-content: start;
  gap: 11px;
  min-width: 0;
  padding: 0 18px;
}

.dashboardAudienceSnapshot:first-child {
  padding-left: 0;
}

.dashboardAudienceSnapshot:last-child {
  padding-right: 0;
}

.dashboardAudienceSnapshot + .dashboardAudienceSnapshot {
  border-left: 1px solid var(--subtle-border);
}

.dashboardAudienceSnapshotTitle {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.dashboardAudienceSnapshotTitle h3 {
  overflow: hidden;
  margin: 0;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardAudienceSnapshotTitle span {
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.dashboardAudienceHeadline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  min-width: 0;
}

.dashboardAudienceHeadline strong {
  overflow: hidden;
  font-size: 19px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardAudienceHeadline em {
  color: var(--text);
  font-size: 22px;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}

.dashboardAudienceStack,
.dashboardAudienceCoverageTrack {
  display: flex;
  width: 100%;
  height: 10px;
  overflow: hidden;
  border-radius: 4px;
  background: var(--input-bg);
}

.dashboardAudienceStack span,
.dashboardAudienceCoverageTrack span {
  display: block;
  min-width: 1px;
  height: 100%;
  transition: width 180ms ease;
}

.dashboardAudienceStack span + span {
  box-shadow: -1px 0 0 rgba(0, 0, 0, 0.22);
}

.dashboardAudienceCoverageTrack span {
  background: var(--primary);
}

.dashboardAudienceDetails {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.dashboardAudienceDetails > div {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.dashboardAudienceDetails strong {
  overflow: hidden;
  color: var(--muted-strong);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardAudienceDetails small {
  color: var(--muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.dashboardAudienceEmpty {
  display: grid;
  place-items: center;
  min-height: 104px;
  margin: 0;
  text-align: center;
}

.dashboardReachPanel {
  display: grid;
  gap: 14px;
}

.dashboardReachPeriodSwitch {
  min-width: min(100%, 300px);
}

.dashboardReachBody {
  display: grid;
  gap: 14px;
  min-height: 350px;
}

.dashboardReachPlaceholder {
  place-items: center;
  min-height: 350px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
  text-align: center;
}

.dashboardReachPlaceholder p {
  margin: 0;
}

.dashboardReachStats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboardReachStats div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.025);
}

.dashboardReachStats span {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardReachStats strong {
  display: block;
  overflow-wrap: anywhere;
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.1;
}

.dashboardReachStats small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.dashboardReachChart svg {
  display: block;
  width: 100%;
  height: 260px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent);
  background-size: 48px 48px, auto;
}

.dashboardReachChart .axis {
  stroke: var(--subtle-border);
  stroke-width: 1.4;
}

.dashboardReachChart .gridLine {
  stroke: var(--subtle-border);
  stroke-width: 1;
  opacity: 0.55;
}

.dashboardReachChart .xTick {
  stroke: var(--muted);
  opacity: 0.7;
}

.dashboardReachChart .axisLabel {
  fill: var(--muted);
  font-size: 12px;
}

.dashboardReachChart .yAxisLabel {
  text-anchor: end;
}

.dashboardReachChart .xAxisLabel {
  text-anchor: middle;
}

.dashboardReachChart .reachArea {
  fill: rgba(39, 143, 255, 0.16);
}

.dashboardReachChart .reachLine {
  fill: none;
  stroke: var(--primary);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dashboardReachChart circle {
  fill: var(--primary);
  stroke: var(--panel);
  stroke-width: 2;
}

.dashboardControlRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}

.dashboardControlRow label {
  display: grid;
  gap: 5px;
}

.dashboardControlRow label > span {
  color: var(--muted);
  font-size: 12px;
}

.compactError {
  padding: 8px 10px;
  margin-bottom: 10px;
}

.dashboardParamFunnel {
  display: grid;
  gap: 12px;
}

.dashboardParamFunnelItem {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.dashboardParamFunnelTitle {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.dashboardParamFunnelTitle strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardParamFunnelTitle span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
}

.dashboardParamFunnelSteps {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: end;
  gap: 5px;
  min-height: 74px;
}

.dashboardParamFunnelStep {
  display: grid;
  grid-template-rows: 46px auto auto;
  align-items: end;
  gap: 3px;
  min-width: 0;
}

.dashboardParamFunnelStep span {
  display: block;
  width: 100%;
  border-radius: 4px 4px 2px 2px;
  background: linear-gradient(180deg, var(--primary), rgba(39, 143, 255, 0.3));
}

.dashboardParamFunnelStep em {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardParamFunnelStep small {
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardCountryTraffic {
  min-height: 100%;
}

.dashboardCountryTraffic > .geoDataAttribution {
  display: block;
  margin-top: 14px;
  text-align: right;
}

.dashboardCountryControls {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.dashboardCountryRows {
  display: grid;
  gap: 13px;
  margin-top: 18px;
  transition: opacity 160ms ease;
}

.dashboardCountryRows.loading {
  opacity: 0.55;
}

.dashboardCountryRow {
  min-width: 0;
}

.dashboardCountryMeta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
}

.dashboardCountryMeta strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboardCountryMeta span {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.dashboardCountryMeta em {
  margin-left: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
}

.dashboardCountryBar {
  height: 7px;
  overflow: hidden;
  background: var(--code-bg);
  border-radius: 3px;
}

.dashboardCountryBar span {
  display: block;
  min-width: 2px;
  height: 100%;
  background: var(--primary);
  border-radius: inherit;
}

.dashboardCountryEmpty {
  display: grid;
  min-height: 220px;
  margin: 0;
  place-items: center;
}

.launchPanel { display: grid; gap: 12px; }

.launchHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.launchHeader h2 { margin-bottom: 0; }

.launchHeader span { color: var(--muted); font-size: 13px; }

.launchHeader .sectionTitle,
.sectionHeader .sectionTitle,
.insightHeader .sectionTitle {
  margin-bottom: 0;
}

.sectionHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.sectionHeader h3 { margin-bottom: 0; font-size: 15px; }

.destinationEditor {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.destinationRow {
  display: grid;
  grid-template-columns: minmax(120px, 1.1fr) 94px 104px minmax(180px, 2fr) 42px;
  gap: 8px;
  align-items: end;
  border-top: 1px solid var(--subtle-border);
  padding-top: 10px;
}

.destinationRow label { margin-bottom: 0; }

.destinationRow button {
  width: 42px;
  height: 39px;
  justify-content: center;
}

.checklist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.checkItem {
  min-height: 78px;
  display: grid;
  grid-template-columns: 20px 1fr 16px;
  align-items: center;
  gap: 10px;
  text-align: left;
  border-color: var(--panel-border);
}

.checkItem.done { background: var(--success-bg); border-color: var(--success-border); }

.checkItem.warning { background: var(--warn-bg); border-color: var(--warn-border); }

.checkItem svg:first-child { color: var(--icon-muted); }

.checkItem.done svg:first-child { color: var(--primary); }

.checkItem.warning svg:first-child { color: var(--warn-text); }

.checkItem span { min-width: 0; }

.checkItem strong, .checkItem small { display: block; overflow-wrap: anywhere; }

.checkItem strong { font-size: 14px; }

.checkItem small { margin-top: 3px; color: var(--muted); }

.narrow { max-width: 560px; }

.wide { max-width: 100%; }

.reportsPage { display: grid; gap: 14px; }

.analyticsPage {
  display: grid;
  gap: 14px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
}

.analyticsToolbar {
  display: flex;
  gap: 12px;
  align-items: flex-end;
  position: sticky;
  top: calc(-1 * var(--workspace-gutter));
  z-index: var(--z-sticky);
  min-height: var(--analytics-sticky-offset);
  min-width: 0;
  flex-wrap: nowrap;
  padding: 12px 16px;
  overflow: visible;
  border-color: var(--floating-border);
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
}

.analyticsToolbar label,
.analyticsToolbarField {
  display: grid;
  color: var(--label);
  font-size: 14px;
  margin-bottom: 0;
  min-width: 0;
  flex: 1 1 220px;
  gap: 4px;
}

.analyticsToolbarField {
  flex: 1.25 1 300px;
}

.analyticsToolbarField.compactField {
  flex: 0 0 200px;
  min-width: 200px;
}

.analyticsToolbar .labelText {
  min-height: 20px;
  align-items: center;
}

.segmentedControl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  min-height: 42px;
  border: 1px solid var(--control-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.segmentedControl button {
  min-height: 32px;
  justify-content: center;
  padding: 0 10px;
  border-color: transparent;
  background: transparent;
}

.segmentedControl button.active {
  color: var(--text);
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.analyticsToolbar select,
.analyticsToolbar .dateRangeButton,
.analyticsToolbar button,
.analyticsToolbar .exportMenu summary {
  min-height: var(--control-md);
}

.analyticsToolbar .analyticsToolbarActions {
  flex: 0 0 auto;
}

.analyticsToolbarActions {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  justify-content: flex-end;
  flex-wrap: nowrap;
  margin-left: auto;
}

.exportMenu {
  position: relative;
}

.exportMenu summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--control-border);
  border-radius: 8px;
  background: var(--button-bg);
  color: var(--text);
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}

.exportMenu summary::-webkit-details-marker {
  display: none;
}

.exportMenuList {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  display: grid;
  gap: 6px;
  min-width: 120px;
  padding: 8px;
  border: 1px solid var(--floating-border);
  border-radius: var(--radius-panel);
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
  z-index: var(--z-menu);
}

.exportMenuList button {
  justify-content: flex-start;
  width: 100%;
}

.analyticsExportForm {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding-top: 8px;
}

.analyticsExportFieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.analyticsExportFieldset legend {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.analyticsExportSegmented {
  min-height: 46px;
}

.analyticsExportPeriodMode {
  width: fit-content;
  min-width: min(100%, 280px);
  margin-bottom: 12px;
}

.analyticsExportDates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.analyticsExportDates label {
  min-width: 0;
  margin: 0;
}

.analyticsExportDates label span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
}

.analyticsExportDates input {
  width: 100%;
}

.analyticsExportFieldset:has(.analyticsExportDates),
.analyticsExportSummary {
  grid-column: 1 / -1;
}

.analyticsExportFieldset small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
}

.analyticsExportSummary {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 10px 18px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid var(--subtle-border);
  color: var(--muted);
  font-size: 13px;
}

.analyticsExportSummary span:first-child {
  color: var(--text);
  font-weight: 700;
}

.analyticsExportStatus {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-weight: 700;
}

.analyticsExportStatus.ready { color: var(--primary); }

.analyticsExportStatus.failed { color: var(--danger-text); }

.analyticsExportStatus.cancelled,
.analyticsExportStatus.expired { color: var(--muted); }

.analyticsExportError {
  display: block;
  max-width: 260px;
  overflow: hidden;
  color: var(--danger-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsTabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.analyticsTabsBar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  flex-wrap: wrap;
}

.analyticsSubnavBar {
  display: flex;
  flex: 1 0 100%;
  min-width: 0;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid var(--subtle-border);
  border-radius: var(--radius-panel);
  background: var(--inner-panel-bg);
}

.analyticsSubnavLabel {
  flex: 0 0 auto;
  color: var(--muted-strong);
  font-size: 13px;
  font-weight: 750;
}

.analyticsSavedReportActions {
  display: flex;
  gap: 8px;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.analyticsBuilderToggle {
  white-space: nowrap;
}

.analyticsViewToggle[aria-pressed="true"] {
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
}

.analyticsViewToggle[aria-pressed="true"] > svg {
  color: var(--primary);
}

.analyticsBuilderToggleCounts {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.analyticsBuilderToggleCounts > span {
  display: inline-flex;
  min-width: 28px;
  height: 22px;
  align-items: center;
  justify-content: center;
  padding-inline: 5px;
  border: 1px solid var(--inner-panel-border);
  border-radius: var(--radius-pill);
  background: var(--control-active-bg);
  color: var(--muted-strong);
  font-size: var(--font-meta);
  font-weight: 750;
  line-height: 1;
}

.analyticsTabs button {
  border-color: var(--inner-panel-border);
  background: var(--inner-panel-bg);
}

.analyticsTabs button.active {
  background: var(--selected-bg);
  border-color: var(--selected-border);
  color: var(--text);
}

.usagePage {
  display: grid;
  gap: 14px;
}

.operationalSummaryBlock {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.operationalSummaryBlock > .sectionTitle {
  margin-bottom: 0;
}

.operationalSummary {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.usageMetricGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.usageTable th,
.usageTable td {
  white-space: nowrap;
}

.usageMonthRow td {
  font-weight: 700;
}

.usageMonthToggle {
  width: 100%;
  min-height: 28px;
  justify-content: flex-start;
  border: 0;
  background: transparent;
  padding: 0;
  font: inherit;
}

.usageMonthToggle:hover {
  color: var(--primary);
}

.usageMonthToggle svg {
  flex: 0 0 auto;
  transition: transform 140ms ease;
}

.usageMonthToggle[aria-expanded="true"] svg {
  transform: rotate(90deg);
}

.usageDayRow td {
  background: color-mix(in srgb, var(--status-bg) 54%, transparent);
  color: var(--muted);
}

.usageDayRow td:first-child span {
  display: inline-block;
  padding-left: 24px;
}

.usageDailyMessage td {
  color: var(--muted);
  padding-left: 38px;
}

.usageDailyMessage td svg {
  margin-right: 8px;
  vertical-align: -2px;
  animation: asyncButtonSpin 0.8s linear infinite;
}

.usageDailyMessage.errorText td {
  color: var(--danger-text);
}

.pricingPage {
  display: grid;
  gap: 16px;
}

.pricingTierHeader span,
.pricingEnterprise > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  border: 1px solid var(--selected-border);
  border-radius: 999px;
  background: var(--selected-bg);
  color: var(--text);
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.microTag {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin-left: 6px;
  border: 1px solid var(--warn-border);
  border-radius: 999px;
  background: var(--warn-bg);
  color: var(--warn-text);
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  vertical-align: middle;
}

.pricingCalculatorGrid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.75fr);
  gap: 14px;
  align-items: start;
}

.pricingCalculator,
.pricingSummaryPanel {
  display: grid;
  gap: 14px;
}

.pricingPresets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pricingEstimateGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.pricingMetric,
.pricingSummaryMetric,
.pricingCurrentTier {
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px;
  min-width: 0;
}

.pricingMetric span,
.pricingSummaryMetric span,
.pricingCurrentTier span,
.pricingCurrentTier em {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.pricingMetric strong,
.pricingSummaryMetric strong,
.pricingCurrentTier strong {
  display: block;
  margin-top: 6px;
  overflow-wrap: anywhere;
  font-size: 22px;
  line-height: 1.15;
}

.pricingTierGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.pricingTierCard {
  display: grid;
  gap: 14px;
  align-content: start;
  min-width: 0;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 14px;
}

.pricingTierCard.current {
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.pricingTierHeader {
  display: flex;
  min-height: 78px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.pricingTierHeader > div {
  min-width: 0;
  flex: 1 1 130px;
}

.pricingTierHeader span {
  flex: 0 0 auto;
  max-width: 100%;
}

.pricingTierHeader h3 {
  margin: 0 0 5px;
}

.pricingTierHeader p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.pricingTierRate strong {
  display: block;
  font-size: 28px;
  line-height: 1;
}

.pricingTierRate span {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
}

.pricingTierCard dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.pricingTierCard dl div {
  border-top: 1px solid var(--subtle-border);
  padding-top: 8px;
}

.pricingTierCard dt {
  color: var(--muted);
  font-size: 12px;
}

.pricingTierCard dd {
  margin: 2px 0 0;
  font-weight: 800;
}

.pricingTierCard ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted-strong);
}

.pricingFeatureGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.pricingFeature {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 10px;
  font-weight: 800;
}

.pricingFeature svg {
  flex: 0 0 auto;
  color: var(--primary);
}

.pricingFeature span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.pricingEnterprise {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background:
    linear-gradient(135deg, var(--inner-panel-bg), transparent),
    var(--panel);
}

.pricingEnterprise p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
}

.pricingFaq {
  display: grid;
  gap: 8px;
}

.pricingFaq details {
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 10px 12px;
}

.pricingFaq summary {
  cursor: pointer;
  font-weight: 800;
}

.pricingFaq p {
  margin: 8px 0 0;
  color: var(--muted);
}

.analyticsBuilder {
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(420px, 1.45fr) minmax(280px, 1fr);
  align-items: stretch;
  gap: 10px;
  padding: 10px;
}

.analyticsBuilder[hidden] {
  display: none;
}

.analyticsBuilder-reach {
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.75fr);
}

.analyticsBuilder-attribution {
  grid-template-columns: minmax(0, 1fr);
}

.analyticsBuilder-funnel .analyticsBuilderFilters,
.analyticsBuilder-raw .analyticsBuilderFilters {
  grid-column: 1 / -1;
}

.analyticsBuilderColumn {
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 10px;
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 134px;
}

.analyticsBuilderColumn .sectionTitle {
  margin-bottom: 8px;
  align-items: center;
  flex-direction: row;
}

.analyticsBuilderColumn .sectionActions {
  justify-content: flex-end;
}

.analyticsBuilderColumnContent {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.analyticsBuilderHeading {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.analyticsBuilderCount {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  padding-inline: 6px;
  border: 1px solid var(--inner-panel-border);
  border-radius: var(--radius-pill);
  background: var(--control-active-bg);
  color: var(--muted-strong);
  font-size: var(--font-meta);
  font-weight: 750;
  line-height: 1;
}

.analyticsBuilderColumn.spanFull {
  grid-column: 1 / -1;
}

.analyticsBuilder-breakdown .analyticsBuilderFilters,
.analyticsBuilder-reach .analyticsBuilderReachDimensions,
.analyticsBuilder-reach .analyticsBuilderFilters {
  grid-column: auto;
}

.inlineAdd {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin-top: 8px;
  min-width: 0;
}

.inlineAdd > *,
.analyticsFilterBuilder > *,
.analyticsToolbar > * {
  min-width: 0;
}

.analyticsBuilderColumn .inlineAdd select,
.analyticsBuilderColumn .analyticsOptionSelectTrigger,
.analyticsBuilderColumn .analyticsPickerButton {
  min-height: 36px;
  padding-top: 7px;
  padding-bottom: 7px;
}

.analyticsOptionSelect {
  position: relative;
  width: 100%;
  min-width: 0;
}

.analyticsOptionSelectTrigger {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  background: var(--input-bg);
  text-align: left;
}

.analyticsOptionSelectTrigger span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsOptionSelectTrigger svg {
  color: var(--icon-muted);
  transition: transform 140ms ease;
}

.analyticsOptionSelect.open .analyticsOptionSelectTrigger svg {
  transform: rotate(180deg);
}

.analyticsOptionSelectMenu {
  position: fixed;
  z-index: var(--z-tooltip);
  overflow-y: auto;
  border: 1px solid var(--floating-border);
  border-radius: 7px;
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
  padding: 0;
}

.analyticsOptionSelectGroup + .analyticsOptionSelectGroup {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--subtle-border);
}

.analyticsOptionSelectGroupLabel {
  padding: 5px 8px 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.analyticsOptionSelectOption {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 6px 7px 6px 9px;
  border: 1px solid transparent;
  border-radius: 0;
  color: var(--text);
  cursor: pointer;
  outline: none;
}

.analyticsOptionSelectOption:hover,
.analyticsOptionSelectOption:focus-visible {
  border-color: var(--subtle-border);
  background: color-mix(in srgb, var(--selected-bg) 44%, var(--panel));
}

.analyticsOptionSelectOption[aria-selected="true"] {
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.analyticsOptionSelectOption.unavailable {
  color: var(--muted);
  cursor: not-allowed;
}

.analyticsOptionSelectOption.unavailable:hover,
.analyticsOptionSelectOption.unavailable:focus-visible {
  border-color: var(--subtle-border);
  background: color-mix(in srgb, var(--button-bg) 62%, var(--panel));
}

.analyticsOptionSelectOptionLabel {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsOptionSelectOption .helpWrap,
.analyticsMetricPickerRow > .helpWrap {
  justify-self: end;
}

.analyticsOptionSelectOption.unavailable .helpIcon,
.analyticsMetricPickerRow.unavailable > .helpWrap .helpIcon {
  color: var(--muted-strong);
}

.analyticsToolbar > * {
  position: relative;
  z-index: 1;
}

.inlineHint {
  margin: 6px 0 0;
  font-size: 13px;
}

.analyticsChips,
.analyticsFilterChips {
  min-height: 0;
  align-content: flex-start;
}

.analyticsBuilderColumn .analyticsChips,
.analyticsBuilderColumn .analyticsFilterChips {
  margin-top: 8px;
}

.attributionTimingFilterColumn {
  min-height: 0;
}

.attributionTimingFilters {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 10px;
}

.attributionTimingFilters label {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 0;
  color: var(--label);
  font-size: 13px;
}

.attributionTimingFilters select {
  min-width: 0;
}

.attributionReportBuilder {
  min-height: 0;
}

.attributionReportModes {
  grid-template-columns: repeat(4, minmax(108px, 1fr));
}

.attributionReportModes button {
  min-height: 32px;
  white-space: nowrap;
}

.attributionReportModeBar {
  width: min(680px, calc(100% - 132px));
  grid-template-columns: repeat(4, minmax(118px, 1fr));
}

.attributionReportModeBar button {
  min-height: 36px;
  white-space: nowrap;
}

.multiTouchPrimaryFilters,
.multiTouchSecondaryFilters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  min-width: 0;
}

.multiTouchPrimaryFilters label,
.multiTouchSecondaryFilters label,
.multiTouchMilestonePicker {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 0;
  color: var(--label);
  font-size: 13px;
}

.multiTouchPrimaryFilters select,
.multiTouchPrimaryFilters input,
.multiTouchSecondaryFilters select {
  min-width: 0;
}

.multiTouchSecondaryFilters {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--inner-panel-border);
}

.frequencyEffectivenessBuilder {
  min-height: 0;
}

.frequencyEffectivenessFilterSection {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--inner-panel-border);
}

.frequencyEffectivenessFilterSection .sectionTitle {
  margin-bottom: 0;
}

.frequencyEffectivenessFilterSection .analyticsFilterBuilder {
  width: min(100%, 360px);
  grid-template-columns: minmax(0, 1fr);
}

.multiTouchMilestonePicker {
  grid-column: 1 / -1;
}

.multiTouchToggleList {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.multiTouchToggleList button {
  min-height: 32px;
  padding: 5px 10px;
  border-color: var(--subtle-border);
  background: var(--status-bg);
  color: var(--muted-strong);
}

.multiTouchToggleList button.active {
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
}

.removableChip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  background: var(--status-bg);
  color: var(--muted-strong);
  padding: 4px 5px 4px 8px;
  font-size: 12px;
}

.removableChip > span,
.removableChip {
  overflow: hidden;
  text-overflow: ellipsis;
}

.removableChip button {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  border-radius: 999px;
  justify-content: center;
}

.removableChip.chipWarning:not(.chipDropPlaceholder) {
  border-color: var(--warn-border);
  background: var(--warn-bg);
  color: var(--warn-text);
}

.chipWarningIcon {
  flex: 0 0 auto;
  color: var(--warn-text);
}

.removableChip.draggableChip {
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.removableChip.draggableChip:active {
  cursor: grabbing;
}

.removableChip.chipDropPlaceholder {
  border-color: var(--selected-border);
  border-style: dashed;
  background: transparent;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--selected-border) 40%, transparent);
  opacity: 0.9;
  pointer-events: none;
}

.chipDragGhost {
  position: fixed;
  z-index: 2400;
  pointer-events: none;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
  opacity: 0.96;
}

.dragHandleIcon {
  flex: 0 0 auto;
  color: var(--muted);
}

.analyticsFilterBuilder {
  display: grid;
  grid-template-columns: minmax(220px, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
}

@media (max-width: 1368px) {
  .analyticsBuilder,
  .analyticsBuilder-reach {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .analyticsBuilderColumn {
    min-height: 0;
  }
  .analyticsBuilder-breakdown .analyticsBuilderFilters,
  .analyticsBuilder-reach .analyticsBuilderFilters {
    grid-column: 1 / -1;
  }
  .attributionTimingFilters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .attributionReportModes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .attributionTimingMetricGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.removableChip .chipTextButton {
  flex: 1 1 auto;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  justify-content: flex-start;
  border-radius: 0;
}

.analyticsFilterChips .removableChip {
  flex: 0 1 auto;
  width: auto;
  max-width: min(100%, 520px);
  border-radius: 8px;
  padding: 7px 6px 7px 10px;
  align-items: center;
  justify-content: space-between;
}

.analyticsFilterChips .removableChip .chipTextButton {
  display: block;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.25;
}

.removableChip .chipTextButton:hover {
  background: transparent;
  color: var(--text);
}

.removableChip.chipWarning .chipTextButton:hover {
  color: var(--warn-text);
}

.analyticsFilterModal {
  display: grid;
  gap: 12px;
}

.analyticsFilterModeTabs {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  border-radius: 8px;
  background: var(--inner-panel-bg);
  border: 1px solid var(--inner-panel-border);
}

.analyticsFilterModeTabs button {
  border-color: transparent;
}

.analyticsFilterModeTabs button.active {
  color: var(--text);
  border-color: var(--selected-border);
  background: var(--selected-bg);
}

.analyticsFilterValueToolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
  align-items: center;
}

.analyticsFilterValueMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
}

.badText {
  color: var(--danger-text);
}

.analyticsFilterValueList {
  display: grid;
  align-content: start;
  gap: 4px;
  height: 340px;
  min-height: 340px;
  overflow: auto;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 6px;
}

.analyticsFilterValueRow {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
}

.analyticsFilterValueRow input[type="checkbox"],
.analyticsMetricPickerRow input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
}

.analyticsFilterValueRow:hover {
  background: var(--status-bg);
}

.analyticsFilterValueRow span {
  display: grid;
  min-width: 0;
}

.analyticsFilterValueRow strong,
.analyticsFilterValueRow small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsFilterValueRow small,
.analyticsFilterValueRow em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.analyticsPickerButton {
  justify-content: center;
  width: 100%;
}

.analyticsMetricPicker {
  display: grid;
  gap: 10px;
}

.analyticsMetricPickerToolbar {
  display: block;
}

.analyticsMetricPickerToolbar input {
  width: 100%;
}

.analyticsMetricCategorySelect {
  display: none;
}

.analyticsMetricPickerBody {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  height: min(56vh, 520px);
  min-height: 380px;
  overflow: hidden;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
}

.analyticsMetricCategoryNav {
  display: grid;
  align-content: start;
  gap: 3px;
  overflow-y: auto;
  scrollbar-gutter: stable;
  padding: 7px;
  border-right: 1px solid var(--subtle-border);
}

.analyticsMetricCategoryNav button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  justify-content: initial;
  min-height: 38px;
  padding: 7px 9px;
  border-color: transparent;
  background: transparent;
  text-align: left;
}

.analyticsMetricCategoryNav button:hover {
  border-color: var(--subtle-border);
  background: color-mix(in srgb, var(--selected-bg) 44%, var(--inner-panel-bg));
}

.analyticsMetricCategoryNav button.active {
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
  box-shadow: inset 3px 0 0 var(--primary);
}

.analyticsMetricCategoryNav button strong {
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.2;
}

.analyticsMetricCategoryNav button span {
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.analyticsMetricPickerContent {
  min-width: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
  padding: 8px 10px 12px;
}

.analyticsMetricPickerAllTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 34px;
  margin: 0 0 5px;
  padding: 2px 6px 6px;
  border-bottom: 1px solid var(--subtle-border);
}

.analyticsMetricPickerSectionTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.analyticsMetricPickerSectionHeading {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.analyticsMetricPickerSectionTitle span,
.analyticsMetricPickerEvent summary span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}

.analyticsMetricPickerSection + .analyticsMetricPickerSection,
.analyticsMetricPickerSection + .analyticsMetricPickerEvent,
.analyticsMetricPickerEvent + .analyticsMetricPickerSection,
.analyticsMetricPickerEvent + .analyticsMetricPickerEvent {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid var(--subtle-border);
}

.analyticsMetricPickerSectionTitle {
  min-height: 28px;
  padding: 2px 6px;
}

.analyticsMetricPickerSectionHeading > strong {
  color: var(--muted-strong);
  font-size: 12px;
}

.analyticsMetricPickerSectionActions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  color: var(--muted-strong);
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.analyticsMetricPickerSectionActions:hover {
  color: var(--text);
}

.analyticsMetricPickerSectionActions input {
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
  padding: 0;
}

.analyticsMetricPickerRows {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px 8px;
}

.analyticsMetricPickerRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 38px;
  padding: 4px 7px;
  border: 1px solid transparent;
  border-radius: 6px;
}

.analyticsMetricPickerRowControl {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
}

.analyticsMetricPickerRow:hover {
  border-color: var(--subtle-border);
  background: color-mix(in srgb, var(--selected-bg) 42%, var(--inner-panel-bg));
}

.analyticsMetricPickerRow:has(input:checked) {
  border-color: transparent;
  background: color-mix(in srgb, var(--selected-bg) 30%, var(--inner-panel-bg));
}

.analyticsMetricPickerRowControl strong {
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.25;
}

.analyticsMetricPickerRow.unavailable {
  color: var(--muted);
  cursor: not-allowed;
}

.analyticsMetricPickerRow.unavailable:hover {
  border-color: var(--subtle-border);
  background: color-mix(in srgb, var(--button-bg) 62%, var(--inner-panel-bg));
}

.analyticsMetricPickerRow.unavailable:has(input:checked) {
  color: var(--warn-text);
}

.analyticsMetricPickerRow.unavailable .analyticsMetricPickerRowControl {
  cursor: not-allowed;
}

.analyticsMetricPickerEvent summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 36px;
  padding: 5px 7px;
  cursor: pointer;
  border-radius: 5px;
}

.analyticsMetricPickerEvent summary:hover {
  background: color-mix(in srgb, var(--selected-bg) 42%, var(--inner-panel-bg));
}

.analyticsMetricPickerEvent summary::marker {
  color: var(--muted);
}

.analyticsMetricPickerEvent[open] summary {
  margin-bottom: 2px;
  color: var(--primary);
  background: color-mix(in srgb, var(--selected-bg) 58%, var(--inner-panel-bg));
}

.analyticsMetricPickerEventActions {
  display: flex;
  justify-content: flex-end;
  padding: 0 7px 3px;
}

.analyticsMetricPickerEmpty {
  display: grid;
  place-items: center;
  min-height: 240px;
  margin: 0;
  text-align: center;
}

.analyticsFilterConditionGrid {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 10px;
}

.analyticsMetricFilterInput {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.analyticsMetricFilterInput > span {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.analyticsMetricFilterUpperValue {
  grid-column: 2;
}

.analyticsMetricGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
  gap: 14px;
}

.analyticsMetricGrid .metric {
  min-height: 100px;
}

.analyticsMetricGrid .metric strong {
  font-size: 24px;
}

.analyticsMetricGrid .metric strong.metricValueDense {
  font-size: 20px;
}

.analyticsMetricGrid .metric strong.metricValueVeryDense {
  font-size: 17px;
}

.analyticsFunnelReport {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.analyticsFunnelChartPanel {
  min-width: 0;
}

.analyticsFunnelChart {
  display: grid;
  gap: 14px;
}

.analyticsFunnelStep {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.analyticsFunnelStepMeta,
.analyticsFunnelStepFoot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}

.analyticsFunnelStepMeta > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.analyticsFunnelStepMeta > span:last-child {
  flex: 0 0 auto;
  text-align: right;
}

.analyticsFunnelStepMeta strong {
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsFunnelStepMeta small,
.analyticsFunnelStepMeta em,
.analyticsFunnelStepFoot {
  color: var(--muted);
  font-size: var(--font-meta);
  font-style: normal;
}

.analyticsFunnelTrack {
  height: 12px;
  overflow: hidden;
  border: 1px solid var(--subtle-border);
  border-radius: var(--radius-pill);
  background: var(--status-bg);
}

.analyticsFunnelTrack > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand-gradient);
}

.analyticsFunnelStepFoot {
  align-items: center;
}

.attributionTimingMetricGrid {
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
}

.multiTouchMetricGrid {
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
}

.multiTouchModelTotals {
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
}

.multiTouchContributionMetrics,
.multiTouchPathMetrics {
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 320px));
}

.analyticsSummarySecondary .metric {
  min-height: 84px;
  border-color: var(--inner-panel-border);
  background: var(--inner-panel-bg);
}

.analyticsSummaryContext {
  border-color: var(--inner-panel-border);
  background: var(--inner-panel-bg);
}

.multiTouchPathMixGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
  gap: 12px 20px;
}

.multiTouchPathMixGrid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding-left: 10px;
  border-left: 3px solid var(--panel-border);
}

.multiTouchPathMixGrid > div.click {
  border-left-color: var(--chart-click);
}

.multiTouchPathMixGrid > div.view {
  border-left-color: var(--chart-view);
}

.multiTouchPathMixGrid > div.both {
  border-left-color: var(--success-text);
}

.multiTouchPathMixGrid span {
  color: var(--muted);
  font-size: 12px;
}

.multiTouchPathMixGrid strong {
  overflow: hidden;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsNotice {
  border: 1px solid var(--warn-border);
  border-radius: 6px;
  background: var(--warn-bg);
  color: var(--warn-text);
  padding: 10px 12px;
}

.multiTouchTablePanel,
.multiTouchPathLengthPanel,
.multiTouchChartPanel,
.multiTouchHeatmapPanel {
  min-width: 0;
  overflow: visible;
}

.multiTouchChartModes {
  grid-template-columns: repeat(2, minmax(90px, 1fr));
}

.multiTouchChartLegend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 13px;
}

.multiTouchChartLegend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.multiTouchChartLegend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.multiTouchLegendWon {
  background: var(--chart-click);
}

.multiTouchLegendAssisted {
  background: var(--chart-view);
}

.multiTouchStackedChart {
  display: grid;
  gap: 9px;
}

.multiTouchStackedRow {
  display: grid;
  grid-template-columns: minmax(130px, 240px) minmax(160px, 1fr) minmax(90px, auto);
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.multiTouchStackedRow > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiTouchStackedRow > strong {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.multiTouchStackedTrack {
  display: flex;
  height: 13px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--status-bg);
}

.multiTouchStackedTrack i {
  display: block;
  height: 100%;
}

.multiTouchWonSegment {
  background: var(--chart-click);
}

.multiTouchAssistedSegment {
  background: var(--chart-view);
}

.multiTouchHeatmapScroll {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 2px;
}

.multiTouchHeatmap {
  width: 100%;
  min-width: 860px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 3px;
}

.multiTouchHeatmap th,
.multiTouchHeatmap td {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  vertical-align: middle;
}

.multiTouchHeatmap th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.multiTouchHeatmapCorner {
  width: 210px;
  padding: 8px 10px !important;
  border: 1px solid var(--subtle-border) !important;
  border-radius: 4px;
  background: var(--status-bg) !important;
  text-align: left;
}

.multiTouchHeatmapCorner > span {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 7px;
  align-items: baseline;
}

.multiTouchHeatmapCorner > span + span {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--subtle-border);
}

.multiTouchHeatmapCorner small {
  color: var(--muted);
  font-size: 10px;
}

.multiTouchHeatmapCorner strong {
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiTouchHeatmapAxisLabel {
  display: grid;
  min-width: 0;
  min-height: 48px;
  gap: 4px;
  align-content: center;
  padding: 6px 8px;
  border-radius: 4px;
  background: var(--status-bg);
}

.multiTouchHeatmapAxisLabel.column {
  justify-items: center;
  text-align: center;
}

.multiTouchHeatmapAxisLabel.row {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  text-align: left;
}

.multiTouchHeatmapAxisLabel.row.noPrevious {
  grid-template-columns: minmax(0, 1fr);
}

.multiTouchHeatmapAxisLabel strong {
  max-width: 100%;
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiTouchHeatmapAxisLabel .multiTouchType {
  margin: 0;
  font-size: 9px;
  letter-spacing: 0;
}

.multiTouchHeatmapCell {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 4px;
  background: var(--status-bg);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.multiTouchHeatmapCell.hasValue {
  color: var(--text);
  cursor: help;
  font-weight: 700;
}

.multiTouchHeatmapCell.hasValue:focus-visible {
  outline: 2px solid var(--selected-border);
  outline-offset: 1px;
}

.multiTouchHandoffBubble header strong {
  line-height: 1.45;
}

.multiTouchDimensionValue {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.multiTouchContributionTable td small,
.multiTouchHandoffTable td small,
.multiTouchModelsTable td small {
  display: block;
  color: var(--muted);
  font-size: 11px;
}

.multiTouchModelsTable td small.positiveDelta {
  color: var(--success-text);
}

.multiTouchModelsTable td small.negativeDelta {
  color: var(--danger-text);
}

.multiTouchPathCell {
  white-space: normal;
  line-height: 1.45;
}

.multiTouchPathTokens {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.multiTouchPathArrow {
  color: var(--muted);
}

.multiTouchPathToken {
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  gap: 2px 6px;
  max-width: 230px;
  padding: 4px 7px;
  border: 1px solid var(--panel-border);
  border-radius: 4px;
  background: var(--status-bg);
}

.multiTouchPathToken small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.multiTouchPathToken strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiTouchPathToken b {
  color: var(--muted);
}

.multiTouchEpisodeGroupAnchor {
  display: inline-flex;
  min-width: 0;
  max-width: 280px;
  border-radius: 4px;
}

.multiTouchEpisodeGroupAnchor:focus-visible {
  outline: 2px solid var(--selected-border);
  outline-offset: 2px;
}

.multiTouchPathToken.episodeGroup {
  max-width: 280px;
}

.multiTouchEpisodeBadge {
  white-space: nowrap;
  font-size: 11px;
}

.multiTouchEpisodeBubble {
  position: fixed;
  z-index: var(--z-tooltip);
  border: 1px solid var(--floating-border);
  background: var(--floating-surface);
  color: var(--text);
  box-shadow: var(--floating-shadow);
  border-radius: var(--radius-panel);
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.35;
  pointer-events: none;
}

.multiTouchEpisodeBubble header {
  display: grid;
  gap: 2px;
  margin-bottom: 10px;
}

.multiTouchEpisodeBubble header span {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.multiTouchEpisodeBubble header strong {
  overflow-wrap: anywhere;
}

.multiTouchEpisodeBubble dl {
  display: grid;
  gap: 5px;
  margin: 0;
}

.multiTouchEpisodeBubble dl div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.multiTouchEpisodeBubble dt {
  color: var(--muted);
}

.multiTouchEpisodeBubble dd {
  margin: 0;
  text-align: right;
  font-weight: 700;
}

.multiTouchEpisodeBubble p {
  margin: 10px 0 0;
  padding-top: 9px;
  border-top: 1px solid var(--subtle-border);
  color: var(--muted);
}

.multiTouchPathToken.touch.view {
  border-color: color-mix(in srgb, var(--chart-view) 55%, var(--panel-border));
}

.multiTouchPathToken.touch.click,
.multiTouchPathToken.target {
  border-color: color-mix(in srgb, var(--chart-click) 60%, var(--panel-border));
}

.multiTouchPathToken.product,
.multiTouchPathToken.start {
  border-color: var(--warn-border);
}

.multiTouchType {
  width: fit-content;
  margin-top: 3px;
  padding: 1px 5px;
  border-radius: 3px;
  text-transform: uppercase;
}

.multiTouchType.view {
  color: var(--chart-view);
}

.multiTouchType.click {
  color: var(--chart-click);
}

.multiTouchLengthChart {
  display: grid;
  gap: 9px;
}

.multiTouchLengthRow {
  display: grid;
  grid-template-columns: 90px minmax(100px, 1fr) 90px 70px;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}

.multiTouchLengthRow strong,
.multiTouchLengthRow small {
  text-align: right;
}

.multiTouchLengthRow small {
  color: var(--muted);
}

.multiTouchBarTrack {
  display: block;
  height: 8px;
  overflow: hidden;
  border-radius: 4px;
  background: var(--status-bg);
}

.multiTouchBarTrack > span {
  display: block;
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
  background: var(--primary);
}

.multiTouchModelChart {
  display: grid;
  gap: 16px;
}

.multiTouchModelChartGroup {
  display: grid;
  grid-template-columns: minmax(150px, 230px) minmax(360px, 1fr);
  gap: 16px;
  min-width: 0;
}

.multiTouchModelChartGroup > strong {
  overflow: hidden;
  padding-top: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiTouchModelChartGroup > div {
  display: grid;
  gap: 5px;
}

.multiTouchModelSeries {
  display: grid;
  grid-template-columns: 145px minmax(120px, 1fr) 110px;
  align-items: center;
  gap: 9px;
  min-width: 0;
  font-size: 12px;
}

.multiTouchModelSeries > span {
  color: var(--muted);
}

.multiTouchModelSeries > em {
  text-align: right;
  font-style: normal;
  font-variant-numeric: tabular-nums;
}

.multiTouchModelTrack {
  position: relative;
  display: block;
  height: 8px;
  border-radius: 3px;
  background: var(--status-bg);
}

.multiTouchModelTrack b {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 3px;
}

.multiTouchModelChart.delta .multiTouchModelTrack::after {
  position: absolute;
  inset: -2px auto -2px 50%;
  width: 1px;
  background: var(--muted);
  content: "";
}

.multiTouchModelChart.delta .multiTouchModelTrack b.positive {
  left: 50%;
}

.multiTouchModelChart.delta .multiTouchModelTrack b.negative {
  right: 50%;
  left: auto;
}

.multiTouchModelTrack .series0 {
  background: var(--chart-click);
}

.multiTouchModelTrack .series1 {
  background: var(--chart-view);
}

.multiTouchModelTrack .series2 {
  background: var(--warn-text);
}

.multiTouchModelTrack .series3 {
  background: var(--danger-text);
}

.analyticsEmptyReport {
  display: grid;
  min-height: 150px;
  place-items: center;
}

.attributionTimingChartPanel {
  min-width: 0;
  overflow: hidden;
}

.attributionTimingTablePanel {
  min-width: 0;
  overflow: visible;
}

.attributionTimingChartModes {
  grid-template-columns: repeat(2, minmax(110px, 1fr));
  min-height: 36px;
}

.attributionTimingChartModes button {
  min-height: 28px;
}

.attributionTimingChart {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.attributionTimingEventSeriesControls {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.attributionTimingEventToggles {
  flex: 1 1 auto;
  margin: 0;
}

.attributionTimingEventToggles .chartMetricToggle strong {
  color: var(--text);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.attributionTimingEventSeriesActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}

.attributionTimingLegend {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  color: var(--muted-strong);
  font-size: 13px;
}

.attributionTimingLegend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.attributionTimingLegend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.attributionTimingLegend strong {
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

.attributionTimingChartScroll {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.attributionTimingChart svg {
  display: block;
  width: 100%;
  min-width: 780px;
  height: 264px;
}

.attributionTimingChart .analyticsChartGrid {
  stroke: var(--chart-grid);
  stroke-width: 1;
  opacity: 0.72;
}

.attributionTimingChart .analyticsChartAxisLabel {
  fill: var(--muted-strong);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 560;
  letter-spacing: 0;
}

.attributionTimingBar.clickSeries,
.attributionTimingLegend .clickSeries {
  fill: var(--chart-click);
  background: var(--chart-click);
}

.attributionTimingBar.viewSeries,
.attributionTimingLegend .viewSeries {
  fill: var(--chart-view);
  background: var(--chart-view);
}

.attributionTimingBar {
  opacity: 0.9;
}

.attributionTimingLine {
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.attributionTimingLine.clickSeries {
  stroke: var(--chart-click);
}

.attributionTimingLine.viewSeries {
  stroke: var(--chart-view);
}

.attributionTimingPoint.clickSeries {
  fill: var(--chart-click);
}

.attributionTimingPoint.viewSeries {
  fill: var(--chart-view);
}

.attributionTimingPoint {
  stroke: var(--panel);
  stroke-width: 2;
}

.attributionTimingTable td:first-child {
  display: grid;
  gap: 2px;
}

.attributionTimingTable td small {
  display: block;
  color: var(--muted);
  font-size: 11px;
}

.analyticsChartPanel {
  overflow: hidden;
}

.chartMetricToggles {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 2px 0 10px;
}

.chartMetricToggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 999px;
  border-color: var(--subtle-border);
  color: var(--muted-strong);
  background: color-mix(in srgb, var(--panel) 72%, transparent);
}

.chartMetricToggle.active {
  border-color: var(--primary);
  color: var(--text);
  background: color-mix(in srgb, var(--primary) 14%, var(--panel));
}

.chartMetricSwatch {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 12%, transparent);
}

@media (max-width: 900px) {
  .analyticsSubnavBar {
    align-items: stretch;
    flex-direction: column;
    gap: 7px;
  }
  .attributionReportModes {
    width: 100%;
  }
  .attributionReportModeBar {
    width: 100%;
    overflow-x: auto;
  }
  .attributionTimingEventSeriesControls {
    align-items: stretch;
    flex-direction: column;
  }
  .attributionTimingEventSeriesActions {
    justify-content: flex-start;
  }
  .multiTouchLengthRow {
    grid-template-columns: 74px minmax(70px, 1fr) 72px 58px;
    gap: 7px;
  }
  .multiTouchStackedRow,
  .multiTouchModelChartGroup {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .multiTouchModelSeries {
    grid-template-columns: 110px minmax(80px, 1fr) 90px;
  }
  .multiTouchHeatmap {
    min-width: 640px;
  }
}

.analyticsTrend {
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 10px;
}

.analyticsTrendHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted-strong);
}

.analyticsTrendHeader span {
  color: var(--muted);
  font-size: 13px;
}

.analyticsTrend svg {
  display: block;
  width: 100%;
  height: 300px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent);
  background-size: 48px 48px, auto;
}

.analyticsTrend .axis {
  stroke: var(--subtle-border);
  stroke-width: 1.4;
}

.analyticsTrend .gridLine {
  stroke: var(--subtle-border);
  stroke-width: 1;
  opacity: 0.55;
}

.analyticsTrend .xTick {
  stroke: var(--muted);
  opacity: 0.7;
}

.analyticsTrend .axisLabel {
  fill: var(--muted);
  font-size: 12px;
}

.analyticsTrend .yAxisLabel {
  text-anchor: end;
}

.analyticsTrend .xAxisLabel {
  text-anchor: middle;
}

.analyticsTrend .trendLine {
  fill: none;
  stroke: var(--primary);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.analyticsTrend circle {
  fill: var(--primary);
  stroke: var(--panel);
  stroke-width: 2;
}

.analyticsTrend .activePoint {
  stroke-width: 3;
}

.analyticsTrend .hoverBand {
  fill: transparent;
  cursor: crosshair;
  outline: none;
}

.analyticsTrend .hoverLine {
  stroke: var(--primary);
  stroke-width: 1;
  stroke-dasharray: 4 4;
  opacity: 0.75;
}

.analyticsTrend .trendTooltip rect {
  fill: var(--panel);
  stroke: var(--panel-border);
}

.analyticsTrend .trendTooltip text {
  fill: var(--text);
  font-size: 12px;
  font-weight: 650;
}

.analyticsResults {
  overflow: visible;
}

.analyticsTablePanel {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.analyticsTableEmpty {
  display: grid;
  gap: 10px;
  min-height: 120px;
  align-content: center;
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: var(--panel);
  padding: 16px;
}

.analyticsTable th,
.analyticsTable td {
  vertical-align: middle;
}

.recordsCount {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.analyticsTableFooter {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--subtle-border);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: var(--status-bg);
  color: var(--muted);
  padding: 0 12px;
  font-size: 12px;
  font-weight: 720;
}

.analyticsRecordCount {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}

.geoDataAttribution {
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
}

.geoDataAttribution:hover {
  color: var(--text);
  text-decoration: underline;
}

.analyticsPagination {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.analyticsPagination label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--muted);
}

.analyticsPaginationLimit {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.analyticsPaginationLimit .analyticsOptionSelect { width: 86px; }

.analyticsPaginationLimit .analyticsOptionSelectTrigger {
  width: 86px;
  min-height: var(--control-sm);
  padding: 4px 7px 4px 9px;
  font-size: 12px;
}

.analyticsPagination select {
  min-height: var(--control-sm);
  width: 86px;
  padding: 4px 28px 4px 9px;
  font-size: 12px;
}

.analyticsPagination > button {
  width: var(--control-sm);
  height: var(--control-sm);
  min-height: var(--control-sm);
  padding: 0;
  justify-content: center;
}

.analyticsPagination .paginationSpinner {
  animation: asyncButtonSpin 0.8s linear infinite;
}

.analyticsPageNumber {
  min-width: 58px;
  text-align: center;
  color: var(--muted-strong);
  font-variant-numeric: tabular-nums;
}

.analyticsPrototype {
  display: grid;
  gap: 14px;
}

.prototypeHero {
  display: grid;
  gap: 10px;
}

.prototypeBadge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid var(--warn-border);
  border-radius: 999px;
  background: var(--warn-bg);
  color: var(--warn-text);
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 800;
}

.prototypeScope {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.prototypeScope span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  background: var(--status-bg);
  color: var(--muted-strong);
  padding: 4px 10px;
  font-size: 13px;
  font-weight: 700;
}

.analyticsPrototypeGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.analyticsPrototypeGrid .prototypeWide {
  grid-column: 1 / -1;
}

.prototypeBars {
  display: grid;
  gap: 12px;
}

.frequencyEffectivenessReport {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.frequencyEffectivenessSummary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.frequencyEffectivenessSummary > div {
  display: grid;
  gap: 7px;
  min-width: 0;
  min-height: 92px;
  align-content: center;
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: var(--panel);
  padding: 14px 16px;
}

.frequencyEffectivenessSummary span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.frequencyEffectivenessSummary strong {
  overflow: hidden;
  color: var(--text);
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.frequencyEffectivenessChartPanel,
.frequencyEffectivenessMatrixPanel {
  min-width: 0;
}

.frequencyEffectivenessChartActions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.frequencyEffectivenessSequenceModes {
  grid-template-columns: repeat(3, minmax(52px, 1fr));
  min-height: 34px;
}

.frequencyEffectivenessSequenceModes button {
  min-height: 24px;
  padding: 0 8px;
  font-size: 12px;
}

.frequencyEffectivenessMetricSelect {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.frequencyEffectivenessMetricSelect select {
  width: 190px;
  min-height: 34px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 13px;
}

.frequencyEffectivenessCoverage,
.frequencyEffectivenessMetricHelp {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.frequencyEffectivenessBars {
  display: grid;
  grid-template-columns: repeat(10, minmax(54px, 1fr));
  gap: 8px;
  min-height: 230px;
  margin: 16px 0 12px;
  overflow-x: auto;
}

.frequencyEffectivenessBarColumn {
  display: grid;
  grid-template-rows: 34px 160px 24px;
  gap: 6px;
  min-width: 54px;
  text-align: center;
}

.frequencyEffectivenessBarValue {
  align-self: end;
  overflow: hidden;
  color: var(--muted-strong);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.frequencyEffectivenessBarTrack {
  display: flex;
  align-items: flex-end;
  min-height: 160px;
  border-bottom: 1px solid var(--subtle-border);
  background: var(--status-bg);
}

.frequencyEffectivenessBarTrack > span {
  display: block;
  width: 100%;
  background: var(--primary);
  transition: height 180ms ease;
}

.frequencyEffectivenessBarColumn > strong {
  color: var(--muted-strong);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.frequencyEffectivenessSequencePlot {
  min-width: 0;
  margin: 12px 0 8px;
}

.frequencyEffectivenessZoomScale {
  margin: 0 0 2px;
  color: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.frequencyEffectivenessSequencePlotScroll {
  min-width: 0;
  overflow-x: auto;
}

.frequencyEffectivenessSequencePlot svg {
  display: block;
  width: 100%;
  min-width: 720px;
  height: 238px;
  overflow: visible;
}

.frequencyEffectivenessPlotGrid {
  stroke: var(--subtle-border);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.frequencyEffectivenessPlotLine {
  fill: none;
  stroke: var(--primary);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}

.frequencyEffectivenessPlotPoint {
  fill: var(--primary);
  stroke: var(--panel);
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}

.frequencyEffectivenessPlotAxisLabel,
.frequencyEffectivenessPlotValue {
  fill: var(--muted);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.frequencyEffectivenessPlotValue {
  fill: var(--muted-strong);
  font-weight: 700;
}

.frequencyEffectivenessPlotXAxisLabel {
  fill: var(--muted-strong);
  font-size: 12px;
  font-weight: 700;
}

.frequencyEffectivenessMatrixScroll {
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--subtle-border);
  border-radius: 8px 8px 0 0;
}

.frequencyEffectivenessMatrix {
  width: 100%;
  min-width: 860px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 12px;
}

.frequencyEffectivenessMatrix th,
.frequencyEffectivenessMatrix td {
  height: 42px;
  border-right: 1px solid var(--subtle-border);
  border-bottom: 1px solid var(--subtle-border);
  padding: 8px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.frequencyEffectivenessMatrix th:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 220px;
  max-width: 220px;
  overflow: hidden;
  background: var(--panel);
  color: var(--muted-strong);
  text-align: left;
  text-overflow: ellipsis;
}

.frequencyEffectivenessMatrix thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--status-bg);
  color: var(--muted);
  font-weight: 750;
  text-align: right;
}

.frequencyEffectivenessMatrix thead th:first-child {
  z-index: 4;
  background: var(--status-bg);
}

.frequencyEffectivenessMatrix tr:last-child th,
.frequencyEffectivenessMatrix tr:last-child td {
  border-bottom: 0;
}

.frequencyEffectivenessMatrix th:last-child,
.frequencyEffectivenessMatrix td:last-child {
  border-right: 0;
}

.frequencyEffectivenessMatrix td {
  color: var(--text);
  font-weight: 680;
}

.frequencyEffectivenessMatrix .frequencyZeroCell {
  color: var(--muted);
}

.frequencyEffectivenessTotalRow th,
.frequencyEffectivenessTotalRow td {
  background: var(--status-bg);
  font-weight: 800;
}

.frequencyEffectivenessFooter {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--subtle-border);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: var(--status-bg);
  color: var(--muted);
  padding: 8px 12px;
  font-size: 11px;
}

.frequencyEffectivenessFooter span:last-child {
  text-align: right;
}

.knownAudienceBarDetail {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
}

.knownAudienceBarDetail span:last-child {
  text-align: right;
}

.prototypeBarRow {
  display: grid;
  gap: 7px;
}

.prototypeBarMeta {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto auto;
  align-items: baseline;
  gap: 12px;
}

.prototypeBarMeta span {
  color: var(--muted-strong);
  font-weight: 760;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.prototypeBarMeta strong {
  font-size: 16px;
}

.prototypeBarMeta em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.prototypeBar {
  height: 10px;
  overflow: hidden;
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  background: var(--input-bg);
}

.prototypeBar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary), rgba(0, 221, 215, 0.42));
}

.prototypeTable {
  min-width: max(720px, 100%);
}

.analyticsTableWrap {
  overflow-x: auto;
  overflow-y: visible;
  max-width: 100%;
  border: 1px solid var(--subtle-border);
  border-top: 0;
  border-radius: 0;
  background: var(--panel);
}

.analyticsPage .analyticsTableWrap,
.analyticsPage .rawLogTableWrap {
  overflow-x: auto;
}

:where(.analyticsTableWrap, .rawLogTableWrap, .modalPanel) {
  scrollbar-width: thin;
  scrollbar-color: var(--control-border) transparent;
}

:where(.analyticsTableWrap, .rawLogTableWrap, .modalPanel)::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

:where(.analyticsTableWrap, .rawLogTableWrap, .modalPanel)::-webkit-scrollbar-track {
  background: transparent;
}

:where(.analyticsTableWrap, .rawLogTableWrap, .modalPanel)::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: var(--radius-pill);
  background: var(--control-border);
  background-clip: padding-box;
}

:where(.analyticsTableWrap, .rawLogTableWrap, .modalPanel)::-webkit-scrollbar-corner {
  background: transparent;
}

.analyticsTable {
  min-width: max(920px, 100%);
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.analyticsTable th,
.analyticsTable td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.analyticsTable .numericCell {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.analyticsFloatingHeader {
  position: sticky;
  top: calc(var(--analytics-sticky-offset) - var(--workspace-gutter));
  z-index: 70;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid var(--floating-border);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
}

.analyticsFloatingHeader .analyticsTable {
  transition: none;
}

.analyticsFloatingHeader .analyticsTable th {
  border-bottom-color: var(--floating-border);
  background: transparent;
}

.analyticsTable .pinnedColumn {
  z-index: 3;
  background: color-mix(in srgb, var(--panel) 94%, var(--selected-bg));
  box-shadow:
    1px 0 0 var(--subtle-border),
    10px 0 18px rgba(0, 0, 0, 0.08);
}

.analyticsFloatingHeader .analyticsTable .pinnedColumn {
  z-index: 5;
  background: var(--floating-surface);
}

.analyticsFloatingHeader .analyticsTable th:first-child {
  border-top-left-radius: 7px;
}

.analyticsFloatingHeader .analyticsTable th:last-child {
  border-top-right-radius: 7px;
}

.analyticsFloatingHeader .analyticsTable th.numericCell .analyticsSortButton,
.analyticsFloatingHeader .analyticsTable th.numericCell .analyticsHeaderLabel {
  justify-content: flex-end;
  text-align: right;
}

.analyticsHeaderCell {
  position: relative;
  min-height: 28px;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 8px;
  align-items: center;
  gap: 4px;
}

.analyticsPinButton {
  width: 20px;
  height: 24px;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  justify-content: center;
  opacity: 0.48;
}

.analyticsPinButton:hover,
.analyticsPinButton.active {
  color: var(--primary);
  opacity: 1;
}

.analyticsPinButton.active svg {
  fill: currentColor;
}

.analyticsResizeHandle {
  position: absolute;
  top: -9px;
  right: -8px;
  width: 12px;
  height: calc(100% + 18px);
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: col-resize;
  z-index: 6;
}

.analyticsResizeHandle::after {
  content: "";
  position: absolute;
  top: 8px;
  right: 5px;
  bottom: 8px;
  width: 1px;
  background: color-mix(in srgb, var(--subtle-border) 75%, transparent);
}

.analyticsResizeHandle:hover::after,
.analyticsColumnResizing .analyticsResizeHandle::after {
  width: 2px;
  background: var(--primary);
}

.analyticsColumnResizing {
  cursor: col-resize;
  user-select: none;
}

.analyticsTable tbody tr:hover td {
  background: color-mix(in srgb, var(--selected-bg) 32%, transparent);
}

.analyticsTable tbody tr:hover td.pinnedColumn {
  background: color-mix(in srgb, var(--selected-bg) 44%, var(--panel));
}

.analyticsSortButton {
  width: 100%;
  min-height: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  font-weight: 760;
}

.analyticsSortButton:hover {
  color: var(--primary);
}

.analyticsSortButton span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.analyticsSortButton svg {
  flex: 0 0 auto;
  transition: transform 120ms ease;
}

.analyticsSortButton .sortAsc {
  transform: rotate(180deg);
}

.analyticsHeaderLabel {
  width: 100%;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  font-weight: 760;
  overflow: hidden;
  text-overflow: ellipsis;
}

.analyticsTable .totalRow td {
  background: var(--status-bg);
  font-weight: 750;
}

.dateRangePicker {
  position: relative;
  min-width: 0;
}

.dateRangeButton {
  width: 100%;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
}

.dateRangeButton span {
  color: var(--muted);
}

.dateRangeButton strong {
  min-width: 0;
  margin-left: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dateRangePopover {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: min(830px, calc(100vw - 320px));
  min-width: 680px;
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  background: var(--floating-surface);
  border: 1px solid var(--floating-border);
  border-radius: var(--radius-panel);
  box-shadow: var(--floating-shadow);
  z-index: var(--z-menu);
  overflow: hidden;
}

.datePresetList {
  border-right: 1px solid var(--subtle-border);
  padding: 12px;
  display: grid;
  gap: 4px;
  align-content: start;
  background: var(--status-bg);
}

.datePresetList button {
  border-color: transparent;
  justify-content: flex-start;
  background: transparent;
}

.datePresetList button.active,
.datePresetList button:hover {
  background: var(--selected-bg);
  border-color: var(--selected-border);
}

.rawWindowPopover {
  width: 230px;
  min-width: 230px;
  grid-template-columns: 1fr;
}

.rawWindowPopoverCustom {
  width: min(620px, calc(100vw - 320px));
  min-width: 520px;
  grid-template-columns: 170px minmax(0, 1fr);
}

.rawWindowPopover:not(.rawWindowPopoverCustom) .datePresetList {
  border-right: 0;
}

.rawWindowCustom {
  min-width: 0;
  padding: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-content: start;
}

.rawWindowCustom label {
  min-width: 0;
}

.rawWindowCustom input {
  width: 100%;
}

.rawWindowCustom .fieldError,
.rawWindowCustom .calendarFooter {
  grid-column: 1 / -1;
}

.calendarArea {
  padding: 14px;
}

.calendarHeader {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.calendarHeader button {
  width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  justify-content: center;
}

.calendarMonths {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.calendarMonth h3 {
  margin: 0 0 12px;
  text-align: center;
  font-size: 16px;
}

.calendarWeekdays,
.calendarDays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}

.calendarWeekdays span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  padding-bottom: 4px;
}

.calendarDays span {
  min-height: 36px;
}

.calendarDay {
  min-height: 36px;
  padding: 0;
  justify-content: center;
  border-color: transparent;
  background: transparent;
}

.calendarDay:hover,
.calendarDay.inRange {
  background: var(--selected-bg);
  border-color: var(--selected-border);
}

.calendarDay.edge {
  background: var(--primary);
  color: var(--primary-text);
  border-color: var(--primary);
}

.calendarDay.today:not(.edge) {
  border-color: var(--muted-strong);
}

.calendarDay:disabled,
.calendarDay:disabled:hover {
  border-color: transparent;
  background: transparent;
}

.dateRangePopoverSingleMonth {
  width: min(540px, calc(100vw - 320px));
  min-width: 500px;
  grid-template-columns: 150px minmax(0, 1fr);
}

.dateRangePopoverSingleMonth .calendarMonths {
  grid-template-columns: minmax(0, 1fr);
}

.dateRangeError {
  margin: 10px 0 0;
}

.calendarFooter {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

.filterGrid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
  align-items: end;
}

.filterGrid label { margin-bottom: 0; }

.compactFilters { grid-template-columns: minmax(220px, 1fr) 160px; max-width: 620px; }

.compactAuditFilters { grid-template-columns: minmax(160px, 220px) minmax(220px, 1fr) minmax(220px, 1fr) 140px; }

.capacityGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 12px;
  align-items: end;
}

.capacityGrid label { margin-bottom: 0; }

.checkboxLabel {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 39px;
}

.checkboxLabel input {
  width: auto;
  margin: 0;
}

.plannerResult { margin-top: 14px; display: grid; gap: 12px; }

.plannerMetrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  border-top: 1px solid var(--subtle-border);
  border-bottom: 1px solid var(--subtle-border);
  padding: 12px 0;
}

.plannerMetric span { display: block; color: var(--muted); font-size: 12px; }

.plannerMetric strong { display: block; margin-top: 4px; font-size: 20px; }

.trackerInsights {
  border-top: 1px solid var(--panel-border);
  margin-top: 18px;
  padding-top: 16px;
  display: grid;
  gap: 14px;
}

.insightMetrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--subtle-border);
  border-bottom: 1px solid var(--subtle-border);
  padding: 12px 0;
}

.trackerInsightsAnalysis,
.trackerInsightsDetail {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--subtle-border);
  padding-top: 14px;
  min-width: 0;
}

.insightGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.insightHeader {
  display: grid;
  grid-template-columns: 1fr minmax(180px, 240px);
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}

.insightHeader h3 { margin-bottom: 0; }

.readinessPanel.pass { border-color: var(--success-border); }

.readinessPanel.warn { border-color: var(--warn-border); }

.readinessPanel.fail { border-color: var(--danger-border); }

.launchGatePanel.pass { border-color: var(--success-border); }

.launchGatePanel.warn { border-color: var(--warn-border); }

.launchGatePanel.fail { border-color: var(--danger-border); }

.launchGateControls {
  grid-template-columns: minmax(180px, 240px) 140px auto;
  max-width: 560px;
  margin-bottom: 12px;
}

.launchGateControls label { margin-bottom: 0; }

.launchGateMetrics { margin: 6px 0 12px; }

.gateIssueBlock {
  margin-top: 12px;
  border-top: 1px solid var(--subtle-border);
  padding-top: 10px;
}

.gateIssueBlock h3 {
  font-size: 14px;
  margin-bottom: 8px;
}

.gateIssueBlock.fail h3 { color: var(--danger-text); }

.gateIssueBlock.warn h3 { color: var(--warn-text); }

.rollupPanel.pass { border-color: var(--success-border); }

.rollupPanel.warn { border-color: var(--warn-border); }

.rollupPanel.fail { border-color: var(--danger-border); }

.verificationBlock {
  border-top: 1px solid var(--panel-border);
  margin-top: 16px;
  padding-top: 14px;
}

.verificationBlock.pass { border-top-color: var(--success-border); }

.verificationBlock.warn { border-top-color: var(--warn-border); }

.verificationBlock.fail { border-top-color: var(--danger-border); }

.readinessCounts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0;
}

label { display: grid; gap: 6px; margin-bottom: 12px; color: var(--label); font-size: 14px; }

.labelText {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.checkboxLine { display: flex; align-items: center; gap: 8px; }

.checkboxLine input { width: auto; }

input, select, textarea {
  width: 100%;
  border: 1px solid var(--control-border);
  border-radius: var(--radius-control);
  padding: 9px 10px;
  background: var(--input-bg);
  color: var(--text);
}

input, select { min-height: var(--control-md); }

input:not([type="checkbox"]):not(:disabled):hover,
select:not(:disabled):hover,
textarea:not(:disabled):hover {
  border-color: var(--control-border-strong);
}

input:disabled,
select:disabled,
textarea:disabled {
  opacity: 1;
  border-color: var(--control-border-disabled);
  background-color: var(--control-disabled-bg);
  color: var(--muted);
  cursor: not-allowed;
}

.secretInput {
  -webkit-text-security: disc;
}

select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 42px;
  line-height: 1.35;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23657487' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  background-size: 16px 16px;
}

select::-ms-expand { display: none; }

select { color-scheme: light; }

:root[data-theme="dark"] select { color-scheme: dark; }

select option,
select optgroup {
  background: var(--floating-surface);
  color: var(--text);
}

select option:checked {
  background: var(--selected-bg);
  color: var(--text);
}

select:not(:disabled):focus,
:where(.analyticsOptionSelectTrigger, .dateRangeButton, .profileMenuTrigger):not(:disabled):focus,
.analyticsOptionSelectTrigger[aria-expanded="true"],
.dateRangeButton[aria-expanded="true"],
.profileMenuTrigger[aria-expanded="true"] {
  border-color: var(--control-active-border);
  background-color: var(--control-active-bg);
}

@supports (appearance: base-select) {
  select,
  ::picker(select) {
    appearance: base-select;
  }
  select::picker-icon {
    display: none;
  }
  select:not(:disabled):open {
    border-color: var(--control-active-border);
    background-color: var(--control-active-bg);
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23657487' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m18 15-6-6-6 6'/%3E%3C/svg%3E");
  }
  ::picker(select) {
    max-height: min(360px, 55vh);
    overflow-y: auto;
    border: 1px solid var(--floating-border);
    border-radius: var(--radius-panel);
    background: var(--floating-surface);
    color: var(--text);
    box-shadow: var(--floating-shadow);
    padding: 0;
  }
  select option {
    min-height: 36px;
    align-items: center;
    padding: 7px 9px;
    border-radius: 0;
  }
  select option:hover,
  select option:focus-visible {
    background: color-mix(in srgb, var(--selected-bg) 54%, var(--floating-surface));
  }
  select option:checked {
    background: var(--selected-bg);
  }
}

textarea { resize: vertical; }

button {
  border: 1px solid var(--control-border);
  background: var(--button-bg);
  color: var(--text);
  border-radius: var(--radius-control);
  padding: 9px 11px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  min-height: var(--control-md);
  position: relative;
  transition:
    transform var(--motion-fast) var(--ease-standard),
    border-color var(--motion-base) var(--ease-standard),
    background-color var(--motion-base) var(--ease-standard),
    color var(--motion-base) var(--ease-standard),
    box-shadow var(--motion-base) var(--ease-standard);
}

button > svg,
button > .asyncButtonContent > svg,
summary[role="button"] > svg {
  transition: transform var(--motion-base) var(--ease-emphasized);
}

summary[role="button"] {
  transition:
    transform var(--motion-fast) var(--ease-standard),
    border-color var(--motion-base) var(--ease-standard),
    background-color var(--motion-base) var(--ease-standard),
    box-shadow var(--motion-base) var(--ease-standard);
}

button:where(:not(:disabled):not(.helpIcon)):active,
summary[role="button"]:active {
  transform: translateY(var(--press-offset));
  box-shadow: none;
  transition-duration: 70ms;
}

select:not(:disabled):active {
  transform: translateY(var(--press-offset));
  transition-duration: 70ms;
}

button:where(:not(:disabled)):active :where(.lucide-refresh-cw, .lucide-refresh-ccw) {
  transform: rotate(34deg);
}

:where(nav, .segmentedTabs, .segmentedControl, .analyticsTabs, .analyticsFilterModeTabs) button:not(:disabled):not(.helpIcon):active,
.removableChip button {
  transform: none;
  box-shadow: none;
}

:where(.segmentedTabs, .segmentedControl, .analyticsTabs, .analyticsFilterModeTabs) button,
.removableChip {
  transition:
    border-color var(--motion-base) var(--ease-standard),
    background-color var(--motion-base) var(--ease-standard),
    color var(--motion-base) var(--ease-standard),
    box-shadow var(--motion-base) var(--ease-standard);
}

:where(input, select, textarea, .analyticsOptionSelectTrigger, .dateRangeButton) {
  transition:
    transform var(--motion-fast) var(--ease-standard),
    border-color var(--motion-base) var(--ease-standard),
    background-color var(--motion-base) var(--ease-standard),
    box-shadow var(--motion-base) var(--ease-standard);
}

@media (hover: hover) and (pointer: fine) {
  button.primary:not(:disabled):hover,
  .uiButton--primary:not(:disabled):hover {
    border-color: var(--primary);
    background-color: color-mix(in srgb, var(--primary) 92%, var(--button-bg));
  }
  button:where(:not(:disabled):not(.primary):not(.helpIcon):not(.uiButton--primary):not(.uiButton--danger)):hover {
    border-color: var(--action-hover-border);
    background-color: var(--action-hover-bg);
  }
  .iconButton.uiButton--danger:not(:disabled):hover {
    border-color: var(--danger-border);
    background-color: var(--danger-bg);
    color: var(--danger-text);
  }
  :where(nav, .segmentedTabs, .segmentedControl, .analyticsTabs, .analyticsFilterModeTabs) button:not(:disabled):not(.helpIcon):not([role="tab"]):hover,
  .removableChip button:hover {
    transform: none;
    box-shadow: none;
  }
  :where(.segmentedTabs, .segmentedControl, .analyticsTabs, .analyticsFilterModeTabs) button:hover,
  .removableChip:hover {
    border-color: var(--selected-border);
    background-color: color-mix(in srgb, var(--selected-bg) 52%, var(--button-bg));
  }
  :where(input, select, textarea, .analyticsOptionSelectTrigger, .dateRangeButton):not(:disabled):hover {
    border-color: var(--control-border-strong);
    background-color: color-mix(in srgb, var(--selected-bg) 14%, var(--input-bg));
  }
}

@media (pointer: coarse) {
  :where(nav, .segmentedTabs, .segmentedControl, .analyticsTabs, .analyticsFilterModeTabs) button:not(:disabled):not(.helpIcon):active,
  .removableChip button:active {
    transform: none;
  }
}

button[role="switch"] > span {
  transition:
    transform var(--motion-base) var(--ease-emphasized),
    background-color var(--motion-base) var(--ease-standard);
}

.uiButton--sm { min-height: var(--control-sm); padding: 6px 9px; }

.uiButton--md { min-height: var(--control-md); }

.uiButton--lg { min-height: var(--control-lg); padding: 12px 18px; }

.uiButton--primary,
.uiButton.primary { background: var(--primary); color: var(--primary-text); border-color: var(--primary); }

.uiButton--secondary { background: var(--button-bg); color: var(--text); border-color: var(--control-border); }

.uiButton--ghost { background: transparent; color: var(--text); border-color: transparent; }

.uiButton--danger { background: var(--danger-bg); color: var(--danger-text); border-color: var(--danger-border); }

.iconButton.uiButton--danger {
  background: var(--button-bg);
  color: var(--danger-text);
  border-color: var(--control-border);
}

.asyncButtonContent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: inherit;
  white-space: inherit;
}

.asyncButtonContent.hidden { opacity: 0; }

.asyncButtonIndicator {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.asyncButtonIndicator svg { animation: asyncButtonSpin 0.8s linear infinite; }

@keyframes asyncButtonSpin { to { transform: rotate(360deg); } }

.helpIcon {
  width: 20px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  flex: 0 0 20px;
  gap: 0;
}

.analyticsToolbar button.helpIcon {
  min-height: 20px;
}

.primary { background: var(--primary); color: var(--primary-text); border-color: var(--primary); }

button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

button[aria-busy="true"]:disabled {
  opacity: 1;
  cursor: wait;
}

.authPanel .primary { min-height: var(--control-lg); }

.fullWidth { width: 100%; justify-content: center; }

.iconButton { width: 40px; height: 40px; justify-content: center; }

.error { background: var(--danger-bg); color: var(--danger-text); border: 1px solid var(--danger-border); padding: 12px; border-radius: 8px; margin-bottom: 14px; }

.warningList {
  margin-top: 10px;
  border: 1px solid var(--warn-border);
  background: var(--warn-bg);
  border-radius: 6px;
  padding: 10px;
  color: var(--warn-text);
}

.warningList p { margin: 0 0 6px; }

.warningList p:last-child { margin-bottom: 0; }

.buttonRow { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }

.backButton { margin-bottom: 12px; }

.debugStatus {
  border: 1px solid var(--panel-border);
  background: var(--status-bg);
  border-radius: 6px;
  padding: 10px;
  margin-bottom: 12px;
  color: var(--muted-strong);
}

.debugStatus.ok {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}

.debugStatus.warn {
  border-color: var(--warn-border);
  background: var(--warn-bg);
  color: var(--warn-text);
}

.toolsTabs {
  margin-bottom: 0;
}

.toolsTabs button {
  gap: 7px;
}

.valueReviewControls .sectionTitle {
  margin-bottom: 12px;
}

.valueReviewFilters {
  display: grid;
  grid-template-columns: repeat(7, minmax(140px, 1fr)) auto;
  gap: 10px;
  align-items: end;
}

.valueReviewFilters label {
  min-width: 0;
  margin: 0;
}

.valueReviewPeriodField {
  display: grid;
  grid-column: span 2;
  gap: 6px;
  min-width: 0;
}

.valueReviewPeriodField .dateRangeButton {
  min-height: 40px;
  height: 40px;
}

.valueReviewFilters input,
.valueReviewFilters select {
  width: 100%;
}

.valueReviewApply {
  min-width: 92px;
  height: 40px;
  justify-content: center;
}

.valueReviewCurrencyNote {
  margin: 12px 0 0;
}

.valueReviewSummary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.valueReviewSummary .metric strong {
  font-size: 24px;
  overflow-wrap: anywhere;
}

.valueReviewTableWrap {
  max-height: min(58vh, 680px);
  scrollbar-gutter: stable;
}

.valueReviewTable {
  min-width: 1180px;
}

.valueReviewTable td:nth-child(4),
.valueReviewTable .numericCell {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.valueReviewTable td strong,
.valueCorrectionHistory td strong {
  display: block;
}

.valueReviewTable td small,
.valueCorrectionHistory td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.valueReviewStatus {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 3px 7px;
  border: 1px solid var(--panel-border);
  border-radius: 5px;
  background: var(--status-bg);
  color: var(--muted-strong);
  font-size: 12px;
  white-space: nowrap;
}

.valueReviewStatus.running,
.valueReviewStatus.queued {
  border-color: var(--warn-border);
  background: var(--warn-bg);
  color: var(--warn-text);
}

.valueReviewStatus.running svg {
  animation: asyncButtonSpin 0.8s linear infinite;
}

.valueReviewStatus.complete {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}

.valueReviewStatus.failed {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger-text);
}

.valueReviewContextGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.valueReviewContextGrid > div {
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--subtle-border);
  border-radius: 6px;
  background: var(--input-bg);
}

.valueReviewContextGrid span,
.valueReviewContextGrid small {
  display: block;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.valueReviewContextGrid strong {
  display: block;
  margin: 4px 0;
  overflow-wrap: anywhere;
}

.valueReviewEvidence {
  margin-top: 14px;
  border-top: 1px solid var(--subtle-border);
  border-bottom: 1px solid var(--subtle-border);
  padding: 12px 0;
}

.valueReviewEvidence summary {
  cursor: pointer;
  color: var(--muted-strong);
  font-weight: 700;
}

.valueReviewEvidenceGrid {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.valueReviewEvidenceGrid pre {
  max-height: 180px;
  margin: 6px 0 0;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.valueReviewEvidenceGrid pre code {
  display: block;
  padding: 10px;
}

.valueReviewCorrectionForm {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.valueReviewCorrectionForm label {
  margin: 0;
}

.valueCorrectionModes {
  width: fit-content;
}

.notice {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  background: var(--status-bg);
  color: var(--muted-strong);
}

@media (max-width: 1368px) {
  .valueReviewFilters { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
  .valueReviewSummary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.validation { border-radius: 6px; padding: 10px; margin: 10px 0; }

.validation.ok { background: var(--success-bg); border: 1px solid var(--success-border); }

.validation.warn { background: var(--warn-bg); border: 1px solid var(--warn-border); }

.validation.bad { background: var(--danger-bg); border: 1px solid var(--danger-border); }

.riskChips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 6px 0; }

.riskChips span { color: var(--muted); font-size: 12px; }

.macroParamHeader,
.macroParamRow {
  display: grid;
  grid-template-columns: minmax(160px, 0.7fr) minmax(220px, 1.3fr) 40px;
  gap: 8px;
  align-items: center;
}

.macroParamHeader {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.macroParamRow button {
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  justify-content: center;
}

.paramRulesEditor {
  display: grid;
  gap: 8px;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px;
  overflow-x: visible;
  max-width: 100%;
}

.paramRulesEditor > .sectionHeader {
  margin: -12px -12px 2px;
  padding: 12px;
  border-bottom: 1px solid var(--inner-panel-border);
  background: color-mix(in srgb, var(--panel) 42%, var(--inner-panel-bg));
}

.paramRuleHeader,
.paramRuleRow {
  display: grid;
  grid-template-columns:
    44px
    minmax(132px, 1.05fr)
    minmax(160px, 1fr)
    minmax(70px, 0.42fr)
    minmax(58px, 0.35fr)
    minmax(70px, 0.42fr)
    minmax(76px, 0.45fr)
    minmax(78px, 0.48fr)
    minmax(128px, 0.82fr)
    44px;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.campaignValueHeader,
.campaignValueRow {
  display: grid;
  grid-template-columns: minmax(160px, 0.8fr) 220px minmax(260px, 1.4fr);
  gap: 8px;
  align-items: center;
  min-width: 700px;
}

.paramRuleHeader {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  align-items: end;
  padding: 2px 4px 4px;
  border-bottom: 1px solid var(--subtle-border);
}

.paramRuleHeader > span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}

.paramRuleHeader > span:first-child,
.paramRuleHeader > span:nth-child(4),
.paramRuleHeader > span:nth-child(5),
.paramRuleHeader > span:nth-child(6),
.paramRuleHeader > span:nth-child(7),
.paramRuleHeader > span:nth-child(8),
.paramRuleHeader > span:last-child {
  justify-content: center;
  text-align: center;
}

.paramRuleHeader .helpIcon {
  width: 22px;
  height: 22px;
  min-height: 22px;
}

.paramRuleHeader .helpWrap {
  flex: 0 0 auto;
}

.campaignValueHeader {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  padding: 2px 4px 4px;
  border-bottom: 1px solid var(--subtle-border);
}

.paramRuleRow,
.campaignValueRow {
  padding: 6px 4px;
}

.paramRuleRow + .paramRuleRow,
.campaignValueRow + .campaignValueRow {
  border-top: 1px solid var(--subtle-border);
}

.paramRuleRow.locked {
  opacity: 0.82;
}

.paramRuleRow input,
.paramRuleRow select {
  width: 100%;
  min-width: 0;
}

.paramKeyCell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.readonlyValue {
  color: var(--muted-strong);
  background: var(--status-bg);
  cursor: default;
}

.emptyAliasCell {
  min-height: 40px;
}

.paramRuleRow button {
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  justify-content: center;
}

.dragHandle {
  cursor: grab;
  color: var(--muted);
}

.dragHandle:active {
  cursor: grabbing;
}

.dragHandle:disabled {
  cursor: not-allowed;
}

.paramRuleRow.dragging,
.sourceMacroRow.dragging,
.compactEntityTable tr.dragging td {
  opacity: 0.55;
  background: var(--selected-bg);
}

.tableCheckbox {
  display: grid;
  place-items: center;
  margin: 0;
}

.analyticsCheckboxCell {
  gap: 4px;
}

.analyticsStatusCell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.mutedDash {
  color: var(--muted);
  font-size: 13px;
}

.tableCheckbox input,
.tableSelectCheckbox {
  width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
  margin: 0;
  accent-color: var(--primary);
}

.analyticsParamBadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 82px;
  min-height: 20px;
  padding: 1px 6px;
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  color: var(--muted-strong);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.analyticsParamBadge.ready {
  color: var(--success-text);
  border-color: var(--success-border);
  background: var(--success-bg);
}

.analyticsParamBadge.heavy {
  color: var(--warn-text);
  border-color: var(--warn-border);
  background: var(--warn-bg);
}

.analyticsParamBadge.raw_only {
  color: var(--danger-text);
  border-color: var(--danger-border);
  background: var(--danger-bg);
}

.sourceMacroHeader,
.sourceMacroRow {
  grid-template-columns: 40px minmax(120px, 0.8fr) minmax(150px, 1fr) 140px minmax(160px, 1.2fr) 40px;
}

.trackerTypeToggles {
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 10px 12px;
}

.inlineField {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.inlineField button {
  justify-content: center;
  padding: 0 14px;
}

.macroGroupField {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.macroGroupField button {
  white-space: nowrap;
}

.chips { display: flex; gap: 6px; flex-wrap: wrap; }

.hintDetails {
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 10px 12px;
}

.hintDetails summary {
  cursor: pointer;
  font-weight: 700;
}

.hintDetails p:last-child {
  margin-bottom: 0;
}

code {
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: 4px;
  padding: 2px 5px;
  overflow-wrap: anywhere;
}

.list { display: grid; gap: 8px; margin-bottom: 16px; }

.rowButton { width: 100%; justify-content: space-between; border: 1px solid var(--panel-border); color: var(--text); }

.rowButton.selected { background: var(--selected-bg); border-color: var(--selected-border); }

.detail { border-top: 1px solid var(--panel-border); padding-top: 16px; }

.compactTableWrap {
  overflow: auto;
}

.compactEntityTable th,
.compactEntityTable td {
  white-space: nowrap;
  max-width: 420px;
}

.compactEntityTable td:first-child,
.compactEntityTable td:nth-child(4) {
  white-space: normal;
}

.compactEntityTable .selectedRow td {
  background: var(--selected-bg);
}

.inlineCopyCode {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
}

.inlineCopyCode code {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inlineCopyCode button {
  width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  justify-content: center;
}

.trackerIdentityGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0 16px;
}

.macroPageActions {
  align-items: center;
}

.macroSetupMenu {
  position: relative;
}

.macroSetupMenuTrigger {
  min-height: var(--control-md);
  color: var(--muted-strong);
  border-color: var(--subtle-border);
  background: transparent;
}

.macroSetupMenuPopover {
  position: absolute;
  z-index: var(--z-menu);
  top: calc(100% + 6px);
  right: 0;
  width: min(290px, calc(100vw - 32px));
  padding: 6px;
  border: 1px solid var(--floating-border);
  border-radius: var(--radius-panel);
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
}

.macroSetupMenuPopover button {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  width: 100%;
  height: auto;
  min-height: 52px;
  align-items: start;
  gap: 8px;
  padding: 8px 10px;
  border-color: transparent;
  background: transparent;
  text-align: left;
}

.macroSetupMenuPopover button svg {
  margin-top: 2px;
}

.macroSetupMenuPopover button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.macroSetupMenuPopover button strong {
  font-size: 13px;
}

.macroSetupMenuPopover button small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
  white-space: normal;
}

.macroConsentPresetNotice {
  display: grid;
  gap: 3px;
  margin-top: 0;
}

.macroConsentPresetNotice span {
  color: var(--muted-strong);
  font-size: 13px;
  line-height: 1.4;
}

.macroConsentExampleStatus {
  display: inline-flex;
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  padding: 3px 8px;
  color: var(--muted-strong);
  background: var(--status-bg);
  font-size: 11px;
  font-weight: 700;
}

.macroConsentExampleStatus.pending {
  border-color: var(--info-border);
  color: var(--info-text);
  background: var(--info-bg);
}

.macroConsentExampleStatus.exists {
  border-color: var(--success-border);
  color: var(--success-text);
  background: var(--success-bg);
}

.macroTable th:first-child,
.macroTable td:first-child {
  width: 62px;
  min-width: 62px;
  max-width: 62px;
  text-align: center;
  vertical-align: middle;
}

.macroTable .dragHandle {
  width: 38px;
  height: 38px;
  min-height: 38px;
  margin: 0 auto;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.rowActions {
  width: 1%;
  white-space: nowrap;
  text-align: right;
}

.rowActions button {
  width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  justify-content: center;
  margin-left: 6px;
}

.emptyState { margin: 12px 0 0; }

.readOnlyLabel {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  color: var(--muted);
  font-size: 13px;
}

.formStack { display: grid; gap: 12px; }

.formStack label { margin-bottom: 0; }

.formStack > .sectionTitle {
  margin-bottom: 0;
}

.formStack > .sectionTitle:not(:first-child) {
  margin-top: 4px;
  padding-top: 16px;
  border-top: 1px solid var(--subtle-border);
}

.formStack > .paramRulesEditor {
  margin-top: 4px;
}

.formFieldHelp {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.segmentedTabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--input-bg);
}

.segmentedTabs button {
  justify-content: center;
  min-width: 112px;
  border-color: transparent;
  background: transparent;
}

.segmentedTabs button.active,
.segmentedTabs button[aria-selected="true"] {
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--selected-border) 42%, transparent);
}

.formGrid {
  display: grid;
  gap: 12px;
  align-items: start;
}

.formGrid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.settingsPage {
  width: 100%;
  max-width: 1080px;
}

.settingsShell {
  display: grid;
  grid-template-columns: 220px minmax(0, 760px);
  gap: 20px;
  align-items: start;
}

.settingsSectionNav {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: var(--panel);
}

.settingsSectionNav button {
  width: 100%;
  min-height: 42px;
  justify-content: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border-color: transparent;
  background: transparent;
  white-space: nowrap;
}

.settingsSectionNav button:hover,
.settingsSectionNav button.active {
  border-color: var(--selected-border);
  background: var(--selected-bg);
  color: var(--text);
}

.settingsContent,
.settingsPanel {
  min-width: 0;
}

.settingsPanel {
  padding: 24px;
}

.settingsIdentity {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--subtle-border);
}

.settingsAvatar {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid var(--selected-border);
  border-radius: 50%;
  background: var(--selected-bg);
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
}

.settingsIdentityText {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settingsIdentityText strong,
.settingsIdentityText span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settingsIdentityText span,
.settingsSecurityRow span {
  color: var(--muted);
  font-size: 12px;
}

.settingsRole,
.settingsScopeLabel {
  color: var(--muted-strong);
  font-size: 12px;
  font-weight: 700;
}

.settingsForm {
  display: grid;
  gap: 16px;
  max-width: 620px;
}

.settingsForm label,
.settingsFieldGrid label {
  margin-bottom: 0;
}

.settingsField {
  display: grid;
  gap: 7px;
}

.settingsThemeControl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
}

.settingsThemeControl button {
  min-width: 0;
}

.settingsActions {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--subtle-border);
}

.settingsFieldGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  max-width: 620px;
}

.settingsAttributionGroups {
  display: grid;
  gap: 22px;
  max-width: 720px;
}

.settingsAttributionGroup {
  display: grid;
  gap: 14px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--subtle-border);
}

.settingsAttributionGroup:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.settingsAttributionGroup h3,
.settingsAttributionGroup p {
  margin: 0;
}

.settingsAttributionGroup h3 {
  font-size: 15px;
}

.settingsAttributionGroup > div:first-child p,
.settingsInlineNote {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.settingsInlineNote {
  margin: 0;
}

.settingsSecurityRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
}

.settingsSecurityRow > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settingsSecurityRow strong {
  overflow-wrap: anywhere;
}

.settingsPasswordForm {
  padding: 20px 0;
  border-top: 1px solid var(--subtle-border);
}

.settingsPasswordForm .buttonRow {
  margin-top: 16px;
}

.settingsAdvanced {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--subtle-border);
}

.settingsAdvanced summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  color: var(--muted-strong);
  font-size: 13px;
  font-weight: 700;
  list-style: none;
}

.settingsAdvanced summary::-webkit-details-marker {
  display: none;
}

.settingsAdvanced summary svg {
  transition: transform 160ms ease;
}

.settingsAdvanced[open] summary svg {
  transform: rotate(180deg);
}

.settingsAdvancedBody {
  display: grid;
  gap: 20px;
  padding-top: 18px;
}

.settingsFactsList {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 16px;
  margin: 0;
}

.settingsFactsList > div {
  display: grid;
  gap: 4px;
}

.settingsFactsList dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.settingsFactsList dd {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.settingsConsentParams {
  display: grid;
  gap: 8px;
}

.settingsConsentParams .chips,
.settingsFootnote {
  margin: 0;
}

.settingsFootnote {
  max-width: 620px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.helpCenterIntro {
  display: grid;
  gap: 18px;
}

.helpCenterCards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
}

.helpCenterCard {
  min-height: 156px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 10px;
  padding: 24px;
  text-align: center;
  border-radius: 8px;
  background: var(--inner-panel-bg);
  border: 1px solid var(--inner-panel-border);
}

.helpCenterCard:hover:not(:disabled),
.helpCenterCard.active {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 10%, var(--inner-panel-bg));
}

.helpCenterCard.disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.helpCenterCardIcon {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--primary);
  border: 1px solid var(--inner-panel-border);
  background: var(--input-bg);
}

.helpCenterCard strong {
  color: var(--text);
  font-size: 18px;
}

.helpCenterCard span:last-child {
  color: var(--muted);
  max-width: 360px;
  line-height: 1.45;
}

.helpGuidesPanel {
  display: grid;
  gap: 18px;
}

.helpGuideLayout {
  display: grid;
  grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.helpGuideNav {
  display: grid;
  gap: 20px;
  padding-right: 22px;
  border-right: 1px solid var(--subtle-border);
}

.helpGuideNavGroup {
  display: grid;
  gap: 6px;
}

.helpGuideNavGroup h3 {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.helpGuideNavGroup button {
  width: 100%;
  min-height: 44px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  color: var(--label);
  text-align: left;
  line-height: 1.35;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
}

.helpGuideNavGroup button span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.helpGuideNavGroup button svg {
  color: var(--muted);
}

.helpGuideNavGroup button:hover,
.helpGuideNavGroup button.active {
  color: var(--text);
  border-color: var(--inner-panel-border);
  background: color-mix(in srgb, var(--primary) 8%, var(--inner-panel-bg));
}

.helpGuideNavGroup button.active svg {
  color: var(--primary);
}

.helpGuideArticle {
  width: min(860px, 100%);
  min-width: 0;
}

.helpGuideHeader {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--subtle-border);
}

.helpGuideHeader > span {
  color: var(--primary);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.helpGuideHeader h2 {
  margin: 8px 0 10px;
  font-size: clamp(24px, 2vw, 32px);
  line-height: 1.16;
  letter-spacing: 0;
}

.helpGuideHeader p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.55;
}

.helpGuideBody {
  display: grid;
  gap: 24px;
  padding-top: 22px;
}

.helpGuideBody > section {
  min-width: 0;
}

.helpGuideBody h3 {
  margin: 0 0 10px;
  font-size: 18px;
}

.helpGuideBody p,
.helpGuideBody li {
  color: var(--label);
  line-height: 1.65;
}

.helpGuideBody p {
  margin: 0 0 10px;
}

.helpGuideBody ul,
.helpGuideBody ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 24px;
}

.helpGuideExample {
  display: grid;
  gap: 8px;
  margin-top: 14px;
  padding: 14px 16px;
  border-left: 3px solid var(--primary);
  background: color-mix(in srgb, var(--primary) 6%, var(--inner-panel-bg));
}

.helpGuideExample strong {
  color: var(--text);
  font-size: 13px;
}

.helpGuideExample code {
  width: fit-content;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
  color: var(--text);
}

.helpGuideExample p {
  margin: 0;
}

.helpSupportPanel {
  display: grid;
  gap: 18px;
}

.helpLegalPanel {
  display: grid;
  gap: 16px;
}

.helpLegalGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.helpLegalCard {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-height: 116px;
  padding: 18px;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  color: var(--text);
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease;
}

.helpLegalCard svg {
  flex: 0 0 auto;
  color: var(--primary);
  margin-top: 2px;
}

.helpLegalCard strong,
.helpLegalCard em {
  display: block;
}

.helpLegalCard strong {
  font-size: 16px;
}

.helpLegalCard em {
  margin-top: 6px;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
  line-height: 1.45;
}

.helpLegalCard:hover {
  border-color: color-mix(in srgb, var(--primary) 55%, var(--inner-panel-border));
  background: color-mix(in srgb, var(--primary) 8%, var(--inner-panel-bg));
}

.helpSupportHeader {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  justify-content: space-between;
}

.helpSupportHeader p {
  max-width: 760px;
  margin: 8px 0 0;
}

.supportAccountPill {
  min-width: min(260px, 100%);
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px 14px;
}

.supportAccountPill span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.supportAccountPill strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.helpSupportLayout {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(0, 1.45fr);
  gap: 18px;
  align-items: start;
}

.supportDirectGrid,
.supportRequestForm {
  display: grid;
  gap: 12px;
}

.supportDirectCard,
.supportRequestForm {
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
}

.supportDirectCard {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 16px;
  color: var(--text);
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease;
}

.supportDirectCard::after {
  content: attr(data-action);
  position: absolute;
  right: 14px;
  top: 14px;
  color: var(--primary);
  font-size: 12px;
  font-weight: 850;
  opacity: 0;
  transition: opacity 160ms ease;
}

.supportDirectCard:hover,
.supportDirectCard:focus-visible {
  border-color: color-mix(in srgb, var(--primary) 58%, var(--inner-panel-border));
  background: color-mix(in srgb, var(--primary) 8%, var(--inner-panel-bg));
}

.supportDirectCard:hover::after,
.supportDirectCard:focus-visible::after {
  opacity: 1;
}

.supportDirectCard span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
}

.supportDirectCard strong {
  padding-right: 74px;
  overflow-wrap: anywhere;
}

.supportRequestForm {
  padding: 18px;
}

.supportRequestForm label {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
  color: var(--label);
  font-weight: 760;
}

.supportRequestForm input,
.supportRequestForm select,
.supportRequestForm textarea {
  min-width: 0;
}

.supportRequestForm textarea {
  resize: vertical;
  min-height: 160px;
}

.supportFieldGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.requiredMark {
  margin-left: 3px;
  color: var(--primary);
}

.supportFormFooter {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.supportFormFooter p {
  flex: 1 1 260px;
  margin: 0;
}

.successText {
  color: var(--success-text);
  font-weight: 760;
}

.faqPanel {
  display: grid;
  gap: 16px;
}

.faqSearchRow {
  max-width: 720px;
}

.faqSearchRow label {
  margin-bottom: 0;
}

.faqGroupGrid {
  display: grid;
  gap: 18px;
}

.faqGroup {
  border: 1px solid var(--inner-panel-border);
  background: var(--inner-panel-bg);
  border-radius: 8px;
  padding: 18px;
}

.faqGroupHeader {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--subtle-border);
}

.faqGroupHeader svg {
  color: var(--primary);
  margin-top: 3px;
  flex: 0 0 auto;
}

.faqGroupHeader h3 {
  margin: 0 0 4px;
  font-size: 18px;
}

.faqGroupHeader p {
  margin: 0;
  color: var(--muted);
}

.faqItems {
  display: grid;
  gap: 8px;
  padding-top: 12px;
}

.faqItem {
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel) 60%, var(--inner-panel-bg));
}

.faqItem summary {
  cursor: pointer;
  padding: 12px 14px;
  font-weight: 700;
  color: var(--text);
}

.faqItem p {
  margin: 0;
  padding: 0 14px 14px;
  color: var(--label);
  line-height: 1.55;
}

.toggleRow {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.modalBackdrop {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0, 0, 0, 0.48);
  animation: modalBackdropIn var(--motion-base) var(--ease-standard);
}

.modalPanel {
  width: min(720px, 100%);
  max-height: min(86vh, 920px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
  background: var(--panel);
  border: 1px solid var(--panel-border);
  border-radius: var(--radius-modal);
  box-shadow: 0 12px 32px rgba(6, 18, 37, 0.22);
  padding: var(--space-4);
  animation: modalPanelIn var(--motion-slow) var(--ease-emphasized);
}

@keyframes modalBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modalPanelIn {
  from { opacity: 0; transform: translateY(8px) scale(0.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.modalPanel.medium { width: min(900px, calc(100vw - 48px)); }

.modalPanel.wide { width: min(1180px, calc(100vw - 48px)); }

.modalHeader {
  position: sticky;
  top: calc(-1 * var(--space-4));
  z-index: 4;
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--subtle-border);
  background: var(--panel);
}

.modalHeader .sectionTitle { margin-bottom: 0; }

.modalHeading {
  display: grid;
  flex: 1 1 auto;
  gap: 3px;
  min-width: 0;
}

.modalSubject {
  min-width: 0;
  color: var(--muted-strong);
  font-size: var(--font-body);
  font-weight: 620;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.modalHeader .iconButton {
  width: var(--control-md);
  height: var(--control-md);
  min-height: var(--control-md);
  flex: 0 0 var(--control-md);
  padding: 0;
}

.modalActions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
  border-top: 1px solid var(--subtle-border);
  padding-top: 14px;
  margin-top: 14px;
}

.analyticsSavedReportFields {
  display: grid;
  gap: 12px;
}

.analyticsSavedReportFields label,
.analyticsSavedReportEdit label {
  display: grid;
  gap: 6px;
  color: var(--muted-strong);
  font-weight: 700;
}

.analyticsSavedReportsEmpty {
  margin: 8px 0 4px;
}

.analyticsReportsSection {
  display: grid;
  gap: 4px;
  margin-top: 14px;
}

.analyticsReportsSection + .analyticsReportsSection {
  margin-top: 22px;
}

.analyticsReportsSectionHeader {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--subtle-border));
  border-left: 3px solid var(--primary);
  border-radius: 4px;
  background: color-mix(in srgb, var(--primary) 7%, var(--inner-panel-bg));
}

.analyticsReportsSectionTitle {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  color: var(--primary);
}

.analyticsReportsSectionTitle strong {
  color: var(--text);
  font-size: 15px;
}

.analyticsReportsSectionHeader span {
  color: var(--muted);
  font-size: 12px;
}

.analyticsSavedReportsList {
  display: grid;
  margin: 4px 0 0 8px;
}

.analyticsSavedReportRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  border-bottom: 1px solid var(--subtle-border);
}

.analyticsSavedReportLoad {
  display: grid;
  min-width: 0;
  min-height: 62px;
  align-content: center;
  justify-items: start;
  gap: 3px;
  border: 0;
  background: transparent;
  padding: 8px 10px;
  text-align: left;
}

.analyticsSavedReportLoad:hover:not(:disabled),
.analyticsSavedReportLoad:focus-visible {
  background: var(--inner-panel-bg);
}

.analyticsSavedReportLoad strong,
.analyticsSavedReportLoad span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyticsSavedReportLoad strong {
  font-size: 14px;
}

.analyticsSavedReportLoad span {
  color: var(--muted);
  font-size: 13px;
}

.analyticsSavedReportLoad .analyticsSavedReportDescription {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  color: var(--muted-strong);
}

.analyticsSavedReportLoad .analyticsSavedReportMeta {
  font-size: 12px;
}

.analyticsSystemReportRow {
  grid-template-columns: minmax(0, 1fr);
}

.analyticsSavedReportLoad .analyticsSystemReportDescription {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.analyticsSavedReportRowActions {
  display: flex;
  gap: 6px;
  padding-right: 4px;
}

.analyticsSavedReportEdit {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(180px, 0.8fr) minmax(240px, 1.2fr) auto;
  align-items: end;
  gap: 10px;
  padding: 10px;
}

.analyticsSavedReportEditActions {
  display: flex;
  gap: 6px;
}

.toastHost {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: var(--z-toast);
  display: grid;
  gap: 8px;
  width: min(320px, calc(100vw - 36px));
}

.toast {
  border: 1px solid var(--panel-border);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  box-shadow: var(--floating-shadow);
  padding: 10px 12px;
  font-size: 13px;
}

.toast.ok {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}

.toast.bad {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger-text);
}

.buttonRow.flat { margin-bottom: 0; }

.userRow {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) 120px auto auto auto;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  padding: 10px;
}

.userPasswordStatus {
  color: var(--warn-text);
  font-size: 12px;
  font-weight: 600;
}

.apiSecret {
  margin-top: 14px;
  border: 1px solid var(--warn-border);
  background: var(--warn-bg);
  border-radius: 6px;
  padding: 10px;
  display: grid;
  gap: 8px;
}

.inviteBox {
  border-top: 1px solid var(--panel-border);
  margin-top: 16px;
  padding-top: 14px;
}

.apiKeyRow {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(130px, 0.8fr) 110px 120px minmax(150px, 0.9fr);
  gap: 8px;
  align-items: end;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  padding: 10px;
}

.apiKeyRow label { margin-bottom: 0; }

.apiKeySummary {
  display: grid;
  gap: 4px;
  align-self: center;
  min-width: 0;
}

.apiKeySummary strong,
.apiKeySummary small {
  overflow-wrap: anywhere;
}

.apiKeyNotes { grid-column: span 2; }

.urls { display: grid; gap: 14px; }

.packageMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--muted-strong);
  font-size: 13px;
}

.packageGroup {
  border: 1px solid var(--accordion-border);
  border-radius: 8px;
  display: block;
  overflow: hidden;
  background: var(--accordion-bg);
}

.packageGroupSummary {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  cursor: pointer;
  list-style: none;
  background: var(--accordion-summary-bg);
  transition: background-color 0.16s ease, border-color 0.16s ease;
}

.packageGroupSummary::-webkit-details-marker { display: none; }

.packageGroupSummary:hover {
  background: var(--accordion-open-bg);
}

.packageGroup[open] {
  border-color: var(--selected-border);
  box-shadow: inset 3px 0 0 var(--accordion-accent);
}

.packageGroup[open] .packageGroupSummary {
  background: var(--accordion-open-bg);
  border-bottom: 1px solid var(--accordion-border);
}

.packageChevron {
  margin-top: 2px;
  color: var(--muted);
  transition: transform 0.16s ease;
}

.packageGroup[open] .packageChevron {
  transform: rotate(90deg);
}

.packageGroupSummary h4 {
  margin: 0;
  font-size: 16px;
}

.packageTitleRow,
.packageSubsectionTitle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

.packageGroupSummary p,
.packageHint {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.packageGroupBody {
  display: grid;
  gap: 10px;
  padding: 12px;
  background: color-mix(in srgb, var(--accordion-bg), var(--panel) 24%);
}

.packageActionsRow {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.packageSubsection {
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
  padding: 12px;
  display: grid;
  gap: 10px;
  background: var(--inner-panel-bg);
}

.packageSubsectionHeader {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.packageSubsectionHeader h5 {
  margin: 0;
  font-size: 14px;
}

.packageSubsectionHeader p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.packageSubsection summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--muted-strong);
}

.packageTabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--input-bg);
}

.packageTabs button {
  flex: 1 1 180px;
  justify-content: center;
  border-color: transparent;
  background: transparent;
}

.packageTabs button.active {
  background: var(--selected-bg);
  border-color: var(--selected-border);
  color: var(--text);
}

.accountEventExamples span {
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  color: var(--muted-strong);
  padding: 6px 10px;
}

.accountEventExamples span.configured {
  background: var(--selected-bg);
  border-color: var(--selected-border);
  color: var(--text);
}

.eventCodeControls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  align-items: end;
}

.faqItem ol {
  margin: 8px 0 14px;
  padding-left: 22px;
}

.faqItem li + li {
  margin-top: 6px;
}

.eventGroupTabs {
  margin: 12px 0;
}

.eventGroupTabs button {
  min-width: 0;
}

.eventGroupCreateRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
  background: var(--inner-panel-bg);
}

.eventGroupCreateRow label {
  margin: 0;
}

.eventGroupCreateButton {
  min-height: 42px;
  white-space: nowrap;
}

.eventGroupManagerHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 0 8px;
}

.eventGroupManagerTabs button {
  min-width: 0;
  gap: 7px;
}

.eventGroupManagerTabs button span {
  min-width: 22px;
  border-radius: 999px;
  background: var(--button-bg);
  padding: 2px 6px;
  color: var(--muted-strong);
  font-size: 11px;
  line-height: 1.2;
}

.eventGroupQuota {
  color: var(--muted-strong);
  font-size: 12px;
  white-space: nowrap;
}

.eventGroupTableWrap {
  overflow: visible;
  border: 1px solid var(--subtle-border);
  border-radius: 6px;
}

.eventGroupTable {
  margin: 0;
}

.eventGroupTable th:last-child,
.eventGroupTable td:last-child {
  width: 46px;
}

.eventGroupIdentity {
  display: flex;
  align-items: center;
  min-height: 32px;
}

.eventGroupRenameRow {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 32px 32px;
  gap: 6px;
  align-items: center;
}

.eventGroupRenameRow input {
  min-height: 34px;
}

.eventGroupRenameRow button {
  width: 32px;
  min-height: 32px;
  padding: 0;
  justify-content: center;
}

.eventGroupActionMenu {
  position: relative;
  display: inline-block;
}

.eventGroupActionMenu summary {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--control-border);
  border-radius: 6px;
  background: var(--button-bg);
  color: var(--text);
  cursor: pointer;
  list-style: none;
}

.eventGroupActionMenu summary::-webkit-details-marker {
  display: none;
}

.eventGroupActionMenuList {
  position: absolute;
  z-index: var(--z-menu);
  top: calc(100% + 5px);
  right: 0;
  display: grid;
  gap: 4px;
  min-width: 132px;
  padding: 6px;
  border: 1px solid var(--floating-border);
  border-radius: 6px;
  background: var(--floating-surface);
  box-shadow: var(--floating-shadow);
}

.eventGroupActionMenuList button {
  width: 100%;
  height: auto;
  min-height: 34px;
  margin: 0;
  padding: 7px 9px;
  justify-content: flex-start;
}

.eventGroupChoices {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
}

.eventGroupChoices legend {
  padding: 0 6px;
  color: var(--muted-strong);
  font-weight: 700;
}

.eventCodeMeta {
  min-height: 40px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.eventCodeMeta span {
  border: 1px solid var(--subtle-border);
  border-radius: 999px;
  padding: 5px 9px;
  color: var(--muted-strong);
  font-size: 12px;
}

.copyLine {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  gap: 8px;
  align-items: end;
}

.copyLineValue {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.copyLabel {
  color: var(--muted);
  font-size: 12px;
  text-transform: capitalize;
}

.copyLine code {
  min-height: 40px;
  display: flex;
  align-items: center;
  overflow: auto;
  white-space: nowrap;
}

.urlLine {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  gap: 8px;
  align-items: end;
}

.urlLine code {
  min-height: 40px;
  display: flex;
  align-items: center;
  overflow: auto;
  white-space: nowrap;
}

.urlLine button {
  width: 40px;
  height: 40px;
  min-height: 40px;
  justify-content: center;
  padding: 0;
}

.copyIconButton {
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  justify-content: center;
  flex: 0 0 40px;
}

.sectionActions button,
.packageSubsectionHeader button {
  white-space: nowrap;
}

.compactDetails,
.diagnosticDetails {
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
  padding: 10px 12px;
  background: var(--inner-panel-bg);
}

.compactDetails summary,
.diagnosticDetails summary {
  cursor: pointer;
  color: var(--muted-strong);
  font-weight: 700;
  margin-bottom: 8px;
}

.formStack > details {
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
  padding: 10px 12px;
  background: var(--inner-panel-bg);
}

.formStack > details summary {
  cursor: pointer;
  color: var(--muted-strong);
  font-weight: 700;
}

.diagnosticDetails.warn summary { color: var(--warn-text); }

.diagnosticDetails.fail summary { color: var(--danger-text); }

.snippetBlock {
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  padding: 10px;
  display: grid;
  gap: 8px;
}

.snippetBlock h4 { margin: 0; font-size: 14px; }

.snippetBlock .launchHeader { align-items: center; }

.snippetBlock button { width: 40px; height: 40px; justify-content: center; padding: 0; }

.snippetBlock pre {
  margin: 0;
  max-height: 220px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.snippetBlock code {
  display: block;
  padding: 8px;
}

.apiDocsPage {
  max-width: 1280px;
}

.apiTokenIntro {
  margin: -2px 0 14px;
}

.apiTokenEmpty {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px dashed var(--panel-border);
  border-radius: 6px;
  color: var(--muted);
}

.apiTokenTableWrap {
  overflow-x: auto;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
}

.apiTokenTable {
  width: 100%;
  min-width: 960px;
  margin: 0;
  border: 0;
}

.apiTokenTable th,
.apiTokenTable td {
  padding: 10px 12px;
  vertical-align: middle;
}

.apiTokenTable tbody tr:last-child td {
  border-bottom: 0;
}

.apiTokenTable td:first-child {
  min-width: 170px;
}

.apiTokenTable td:first-child strong,
.apiTokenTable td:first-child small {
  display: block;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.apiTokenTable td:first-child small {
  margin-top: 3px;
  color: var(--muted);
}

.apiTokenTable .rowActions {
  width: 50px;
}

.apiTokenStatus {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border: 1px solid var(--panel-border);
  border-radius: 999px;
  background: var(--status-bg);
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 760;
  white-space: nowrap;
}

.apiTokenStatus.active {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}

.apiTokenStatus.paused,
.apiTokenStatus.expired {
  border-color: var(--warn-border);
  background: var(--warn-bg);
  color: var(--warn-text);
}

.apiTokenStatus.revoked {
  color: var(--muted);
}

.platformAccountBanner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -6px 0 16px;
  border: 1px solid var(--selected-border);
  border-radius: 8px;
  background: var(--selected-bg);
  padding: 10px 12px;
}

.platformAccountBanner > div {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.platformAccountBanner span,
.platformAccountDetailGrid span,
.platformAccountNotes span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.platformAccountBanner strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platformAccountBanner button {
  flex: 0 0 auto;
}

.platformOverviewMetrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.platformOverviewMetrics .metric strong {
  font-size: 26px;
}

.platformAccountActivityTable,
.platformAccountsTable {
  min-width: 820px;
}

.platformAccountActivityTable td:first-child strong,
.platformAccountActivityTable td:first-child small,
.platformAccountsTable td:first-child strong,
.platformAccountsTable td:first-child small {
  display: block;
}

.platformAccountActivityTable td:first-child small,
.platformAccountsTable td:first-child small {
  margin-top: 3px;
  color: var(--muted);
}

.platformAttentionPanel.warn {
  border-color: var(--warn-border);
}

.platformAttentionPanel.pass {
  border-color: var(--success-border);
}

.platformAccountDetailGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  overflow: hidden;
}

.platformAccountDetailGrid > div {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 72px;
  border-right: 1px solid var(--subtle-border);
  border-bottom: 1px solid var(--subtle-border);
  padding: 12px;
}

.platformAccountDetailGrid > div:nth-child(4n) {
  border-right: 0;
}

.platformAccountDetailGrid > div:nth-last-child(-n + 4) {
  border-bottom: 0;
}

.platformAccountDetailGrid strong {
  overflow-wrap: anywhere;
}

.platformAccountNotes {
  margin-top: 12px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px;
}

.platformAccountNotes p {
  margin: 5px 0 0;
  white-space: pre-wrap;
}

.platformDemoSection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  border-top: 1px solid var(--subtle-border);
  padding: 14px 2px 2px;
}

.platformBillingSection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  border: 1px solid var(--subtle-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px;
}

.platformBillingSection > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.platformBillingSection span,
.platformBillingSection small {
  color: var(--muted);
}

.platformBillingSection span {
  font-size: 12px;
  font-weight: 700;
}

.platformBillingSection.fixed,
.platformBillingSection.volume {
  border-color: var(--selected-border);
}

.platformBillingSection button {
  flex: 0 0 auto;
}

.platformBillingNotice {
  border-left: 3px solid var(--selected-border);
  background: var(--inner-panel-bg);
  color: var(--muted-strong);
  padding: 11px 13px;
  line-height: 1.45;
}

.platformDemoSection > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.platformDemoSection span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.platformDemoSection small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.platformDemoSection.ready strong {
  color: var(--success-text);
}

.platformDemoSection.failed strong,
.platformDemoSection.failed small {
  color: var(--danger-text);
}

.platformDemoSection button {
  flex: 0 0 auto;
}

.platformDemoPreview {
  border-left: 3px solid var(--selected-border);
  background: var(--inner-panel-bg);
  padding: 12px 14px;
}

.platformDemoPreview p {
  margin: 6px 0;
  color: var(--muted);
}

.platformDemoPreview small {
  display: block;
  color: var(--warn-text);
}

.platformUserToolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.platformUserToolbar label {
  width: min(320px, 42vw);
  margin: 0;
}

.operationsPage {
  gap: 12px;
}

.operationsTabs {
  margin-bottom: 2px;
}

.operationsSummary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.apiTokenReadOnlyField {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  background: var(--inner-panel-bg);
  color: var(--muted-strong);
  padding: 9px 11px;
}

.apiSecret code {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  white-space: nowrap;
  padding: 10px;
}

.apiSecret p {
  margin: 0;
}

.apiReferenceGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.apiReferenceIntroGrid {
  align-items: stretch;
}

.apiReferenceHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.apiReferenceHeader h3 {
  margin: 0 0 4px;
}

.apiReferenceHeader p {
  margin: 0;
  max-width: 860px;
}

.apiReferenceCard {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--inner-panel-border);
  border-radius: 8px;
  background: var(--inner-panel-bg);
  padding: 12px;
}

.apiReferenceGrid h3 {
  margin-bottom: 0;
  font-size: 15px;
}

.apiReferenceCard .snippetBlock {
  border: 0;
  padding: 0;
  background: transparent;
}

.apiReferenceCard p {
  margin: 0;
}

.docsTableWrap {
  min-width: 0;
  overflow-x: auto;
}

.docsTable th,
.docsTable td {
  max-width: 460px;
}

.apiEndpointList {
  display: grid;
  gap: 8px;
}

.apiEndpoint {
  display: grid;
  grid-template-columns: 76px minmax(260px, 0.75fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--inner-panel-border);
  border-radius: 6px;
  background: var(--inner-panel-bg);
  padding: 10px 12px;
}

.apiEndpoint code {
  justify-self: start;
  min-width: 56px;
  text-align: center;
}

.apiEndpoint span {
  color: var(--muted);
}

.snippetGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.deadLetterList { display: grid; gap: 8px; }

.deadLetterRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  padding: 10px;
}

.deadLetterRow strong { overflow-wrap: anywhere; }

table { width: 100%; border-collapse: collapse; font-size: var(--font-data); font-variant-numeric: tabular-nums; }

th, td { height: var(--control-md); border-bottom: 1px solid var(--subtle-border); padding: 9px 8px; text-align: left; vertical-align: middle; max-width: 300px; overflow-wrap: anywhere; }

th { color: var(--muted-strong); font-weight: 680; }

tbody tr { transition: background-color var(--motion-fast) ease; }

tbody tr:hover { background: color-mix(in srgb, var(--selected-bg) 45%, transparent); }

tbody td:first-child { transition: box-shadow var(--motion-fast) var(--ease-standard); }

@media (hover: hover) and (pointer: fine) {
  tbody tr:hover td:first-child { box-shadow: inset 2px 0 0 var(--primary); }
}

tbody tr[aria-selected="true"],
tbody tr.selected { background: var(--selected-bg); }

.numericCell { text-align: right; font-variant-numeric: tabular-nums; }

.recentTable th:first-child,
.recentTable td:first-child,
.auditTable th:first-child,
.auditTable td:first-child {
  width: 38px;
  max-width: 38px;
}

.expandButton {
  width: 28px;
  height: 28px;
  padding: 0;
  justify-content: center;
}

.monoCell {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
}

.rawLogTableWrap {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: auto;
  max-width: 100%;
  border: 1px solid var(--subtle-border);
  border-radius: 8px 8px 0 0;
  background: var(--panel);
}

.rawLogTable {
  width: 100%;
  min-width: 2200px;
  table-layout: fixed;
}

.rawLogTable th,
.rawLogTable td {
  max-width: none;
}

.rawLogTable th {
  white-space: nowrap;
  overflow-wrap: normal;
}

.rawLogTable .rawLogNoWrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
}

.rawLogTable .rawLogWrap {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.rawLogTable .rawLogParams {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.35;
}

.rawLogColExpand { width: 44px; }

.rawLogColTime { width: 150px; }

.rawLogColId { width: 220px; }

.rawLogColShort { width: 120px; }

.rawLogColTiny { width: 90px; }

.rawLogColIp { width: 130px; }

.rawLogColCampaign { width: 120px; }

.rawLogColCampaignName { width: 280px; }

.rawLogColParams { width: 360px; }

.rawLogColUrl { width: 300px; }

.rawLogColUa { width: 340px; }

.detailsRow td {
  background: var(--details-bg);
  padding: 14px;
}

.detailsGrid {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
  gap: 14px;
}

.detailsGrid h3 {
  margin-bottom: 8px;
}

.detailsGrid pre {
  margin: 0;
  max-height: 420px;
  overflow: auto;
  border: 1px solid var(--panel-border);
  border-radius: 6px;
  background: var(--panel);
  padding: 10px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 12px;
}

@media (max-width: 900px) {
  .dashboardMetricGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dashboardOutcomeGrid,
  .dashboardCompositionGrid {
    grid-template-columns: minmax(0, 1fr);
  }
  .dashboardPrimaryTrend,
  .dashboardAudiencePanel {
    grid-column: auto;
  }
  .appShell, .appShell.sidebarCollapsed {
    grid-template-columns: 1fr;
    height: auto;
    overflow: visible;
    max-width: 100vw;
  }
  .workspace {
    height: auto;
    overflow-x: hidden;
    overflow-y: visible;
    padding: 18px;
  }
  .settingsPage {
    max-width: none;
  }
  .settingsShell {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  .settingsSectionNav {
    position: static;
    display: flex;
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .settingsSectionNav button {
    flex: 0 0 auto;
    width: auto;
    min-height: 40px;
    padding: 9px 12px;
  }
  .settingsSectionNav button span {
    display: inline;
  }
  .platformOverviewMetrics,
  .platformAccountDetailGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .platformAccountDetailGrid > div:nth-child(4n) {
    border-right: 1px solid var(--subtle-border);
  }
  .platformAccountDetailGrid > div:nth-child(2n) {
    border-right: 0;
  }
  .platformAccountDetailGrid > div:nth-last-child(-n + 4) {
    border-bottom: 1px solid var(--subtle-border);
  }
  .platformAccountDetailGrid > div:nth-last-child(-n + 2) {
    border-bottom: 0;
  }
  .platformUserToolbar {
    align-items: stretch;
    flex-direction: column;
  }
  .platformUserToolbar label {
    width: 100%;
  }
  .eventGroupCreateRow {
    grid-template-columns: 1fr;
  }
  .eventGroupCreateButton {
    width: 100%;
  }
  .eventGroupManagerHeader {
    align-items: stretch;
    flex-direction: column;
  }
  .eventGroupQuota {
    white-space: normal;
  }
  .logoOptionsPage { padding: 20px; }
  .logoOptionsHeader { align-items: start; flex-direction: column; }
  .logoOptionsGrid { grid-template-columns: 1fr; }
  .sidebar, .sidebarCollapsed .sidebar {
    position: static;
    width: 100%;
    height: auto;
    max-height: none;
    overflow: hidden;
    padding: 18px 16px 14px;
    border-right: 0;
    border-bottom: 1px solid var(--sidebar-border);
  }
  .sidebarCollapsed .sidebar .logoBrand { display: flex; justify-content: flex-start; width: fit-content; overflow: visible; }
  .sidebarCollapsed .sidebar .logoBrand .brandIconLogo { display: none; }
  .sidebarCollapsed .sidebar .logoBrand { margin-inline: 0; }
  .sidebarCollapsed .sidebar .logoBrand .brandLogo { opacity: 1; transform: none; }
  .sidebarCollapsed .sidebar .logoBrand .brandLogoLight { display: block; }
  :root[data-theme="dark"] .sidebarCollapsed .sidebar .logoBrand .brandLogoLight { display: none; }
  :root[data-theme="dark"] .sidebarCollapsed .sidebar .logoBrand .brandLogoDark { display: block; }
  .sidebarCollapseButton { display: none; }
  .sidebar nav {
    min-height: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }
  .navItems {
    display: flex;
    width: max-content;
    gap: 8px;
  }
  nav button {
    flex: 0 0 44px;
    width: 44px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 10px;
  }
  .sidebar nav button span { display: none; }
  .appShell,
  .appShell.sidebarCollapsed {
    height: 100dvh;
    min-height: 100dvh;
    grid-template-columns: minmax(0, 1fr);
  }
  .sidebar,
  .sidebarCollapsed .sidebar { display: none; }
  .mobileMenuButton {
    display: inline-flex;
    width: var(--control-touch);
    height: var(--control-touch);
    min-height: var(--control-touch);
    flex: 0 0 var(--control-touch);
  }
  .mobileNavDrawer[open] {
    position: fixed;
    inset: 0 auto 0 0;
    display: flex;
    width: min(360px, calc(100vw - 24px));
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    flex-direction: column;
    gap: var(--space-4);
    overflow: hidden;
    border: 0;
    border-right: 1px solid var(--sidebar-border);
    border-radius: 0 var(--radius-modal) var(--radius-modal) 0;
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
    padding: max(var(--space-4), env(safe-area-inset-top)) var(--space-4) max(var(--space-4), env(safe-area-inset-bottom));
    box-shadow: 12px 0 30px rgba(6, 18, 37, 0.24);
    animation: mobileDrawerIn var(--motion-slow) var(--ease-emphasized);
  }
  @keyframes mobileDrawerIn {
    from { opacity: 0; transform: translateX(-12px); }
    to { opacity: 1; transform: translateX(0); }
  }
  .mobileNavDrawerHeader {
    display: flex;
    min-height: var(--control-touch);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
  }
  .mobileNavDrawerHeader .brand { margin: 0; }
  .mobileNavDrawerHeader .brandLogo { width: 164px; }
  .mobileNavDrawer nav {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .mobileNavDrawer .navItems {
    display: grid;
    width: 100%;
    gap: var(--space-1);
  }
  .mobileNavDrawer nav button {
    width: 100%;
    min-height: var(--control-touch);
    justify-content: flex-start;
    padding: 0 var(--space-3);
  }
  .mobileNavDrawer nav button span { display: block; }
  .workspace { padding-top: 0; }
  .topbar {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    margin: 0 calc(-1 * var(--space-6)) var(--space-5);
    padding: max(var(--space-3), env(safe-area-inset-top)) var(--space-6) var(--space-3);
    border-bottom: 1px solid var(--subtle-border);
    background: var(--page);
  }
  .topbarTitle { width: 100%; }
  .topbarTitle .titleLine { min-width: 0; }
  .topbarContextActions > .iconButton,
  .profileMenu,
  .profileMenuTrigger {
    height: var(--control-touch);
    min-height: var(--control-touch);
  }
  .topbarContextActions > .iconButton { width: var(--control-touch); }
  button:not(.helpIcon),
  summary[role="button"] { min-height: var(--control-touch); }
  .removableChip {
    min-height: 36px;
    padding-block: 3px;
  }
  .removableChip .chipTextButton {
    width: auto;
    height: auto;
    min-height: 0;
  }
  .removableChip button:not(.chipTextButton) {
    width: 28px;
    height: 28px;
    min-height: 28px;
  }
  .modalHeader .iconButton {
    width: var(--control-touch);
    height: var(--control-touch);
    min-height: var(--control-touch);
    flex-basis: var(--control-touch);
  }
  .rowActions button,
  .analyticsPagination button,
  .calendarHeader button,
  .calendarDay {
    width: var(--control-touch);
    height: var(--control-touch);
    min-height: var(--control-touch);
  }
  .analyticsPaginationLimit .analyticsOptionSelectTrigger {
    height: var(--control-touch);
    min-height: var(--control-touch);
  }
  .calendarDays span { min-height: var(--control-touch); }
  .analyticsTableWrap,
  .rawLogTableWrap {
    overscroll-behavior-inline: contain;
    box-shadow: inset -12px 0 12px -14px var(--muted-strong);
  }
  .span2,
  .span4 {
    grid-column: 1 / -1;
  }
  .topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    column-gap: 10px;
    row-gap: 12px;
  }
  .topbarTitle {
    grid-column: 1;
    grid-row: 1;
  }
  .topbarActions {
    display: contents;
  }
  .topbarContextActions {
    grid-column: 2;
    grid-row: 1;
  }
  .topbarActions > .profileMenu {
    grid-column: 3;
    grid-row: 1;
  }
  .topbarHasFilter .topbarTitle {
    grid-column: 1 / 3;
  }
  .topbarHasFilter .topbarContextActions {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: minmax(0, 1fr) var(--control-touch);
    width: 100%;
  }
  .topbarHasFilter .trackerStatusSelect {
    width: 100%;
  }
  .workspaceSelect {
    flex: 1 1 100%;
    width: 100%;
  }
  .grid, .split, .filterGrid, .compactFilters, .compactAuditFilters, .launchGateControls, .capacityGrid, .plannerMetrics, .insightMetrics, .insightGrid, .insightHeader, .readinessCounts, .checklist, .macroParamHeader, .macroParamRow, .campaignValueHeader, .campaignValueRow, .deadLetterRow, .detailsGrid, .destinationRow, .formGrid.two, .packageSubsectionHeader, .eventCodeControls, .analyticsToolbar, .analyticsBuilder, .analyticsFilterBuilder, .analyticsMetricGrid, .attributionTimingFilters, .analyticsPrototypeGrid, .usageMetricGrid, .operationsSummary, .pricingCalculatorGrid, .pricingEstimateGrid, .pricingTierGrid, .pricingFeatureGrid, .calendarMonths, .apiReferenceGrid, .apiEndpoint, .snippetGrid, .trackerIdentityGrid { grid-template-columns: 1fr; }
  .valueReviewFilters,
  .valueReviewSummary,
  .valueReviewContextGrid { grid-template-columns: 1fr; }
  .valueReviewPeriodField { grid-column: auto; }
  .valueReviewApply { width: 100%; }
  .helpSupportHeader {
    flex-direction: column;
  }
  .supportAccountPill {
    width: 100%;
  }
  .helpSupportLayout {
    grid-template-columns: 1fr;
  }
  .helpGuideLayout {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  .helpGuideNav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-right: 0;
    padding-bottom: 18px;
    border-right: 0;
    border-bottom: 1px solid var(--subtle-border);
  }
  .helpGuideArticle {
    width: 100%;
  }
  .supportDirectGrid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
  .analyticsToolbar {
    position: static;
    top: auto;
    z-index: auto;
    align-items: stretch;
    flex-wrap: wrap;
    box-shadow: var(--floating-shadow);
  }
  .analyticsFloatingHeader {
    top: var(--mobile-sticky-top, 0px);
  }
  .analyticsToolbar label,
  .analyticsToolbar label:first-child,
  .analyticsToolbarField,
  .analyticsToolbar .analyticsToolbarActions {
    flex: 1 1 100%;
  }
  .analyticsToolbarField.compactField {
    flex: 1 1 100%;
    min-width: 0;
  }
  .analyticsToolbarActions {
    justify-content: flex-start;
  }
  .analyticsExportForm,
  .analyticsExportDates {
    grid-template-columns: 1fr;
  }
  .analyticsExportFieldset,
  .analyticsExportSummary {
    grid-column: 1;
  }
  .frequencyEffectivenessSummary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .frequencyEffectivenessChartPanel .sectionTitle {
    align-items: stretch;
    flex-direction: column;
  }
  .frequencyEffectivenessChartPanel .sectionActions,
  .frequencyEffectivenessChartActions,
  .frequencyEffectivenessMetricSelect,
  .frequencyEffectivenessMetricSelect select {
    width: 100%;
  }
  .frequencyEffectivenessChartActions {
    align-items: stretch;
    flex-direction: column;
  }
  .frequencyEffectivenessFooter {
    align-items: flex-start;
    flex-direction: column;
  }
  .frequencyEffectivenessFooter span:last-child {
    text-align: left;
  }
  .analyticsTableFooter {
    min-height: 70px;
    align-items: stretch;
    flex-direction: column;
    justify-content: center;
    padding: 10px 12px;
  }
  .analyticsPagination {
    justify-content: space-between;
    width: 100%;
  }
  .analyticsPagination label {
    flex: 1 1 auto;
  }
  .pricingEnterprise { align-items: flex-start; flex-direction: column; }
  .analyticsBuilderColumn.spanFull { grid-column: auto; }
  .dateRangePopover {
    position: static;
    width: 100%;
    min-width: 0;
    grid-template-columns: 1fr;
    margin-top: 8px;
  }
  .datePresetList { border-right: 0; border-bottom: 1px solid var(--subtle-border); }
  .rawWindowCustom { grid-template-columns: 1fr; }
  .rawWindowCustom .fieldError,
  .rawWindowCustom .calendarFooter { grid-column: auto; }
  .paramRuleHeader, .paramRuleRow, .campaignValueHeader, .campaignValueRow { min-width: 0; }
  .userRow, .apiKeyRow { grid-template-columns: 1fr; }
  .apiKeyNotes { grid-column: auto; }
  .span2, .span4 { grid-column: 1 / -1; }
  .modalBackdrop { align-items: stretch; padding: 12px; }
  .modalPanel { max-height: none; }
  .modalPanel.medium { width: 100%; }
  .analyticsFilterValueToolbar,
  .analyticsFilterConditionGrid {
    grid-template-columns: 1fr;
  }
  .analyticsMetricFilterUpperValue {
    grid-column: auto;
  }
  .analyticsFilterValueList {
    height: 48vh;
    min-height: 260px;
  }
  .analyticsMetricCategorySelect {
    display: grid;
    gap: 4px;
  }
  .analyticsMetricPickerBody {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
  }
  .analyticsMetricCategoryNav {
    display: none;
  }
  .analyticsMetricPickerContent {
    height: 48vh;
    min-height: 300px;
  }
  .dashboardAudienceSnapshotGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 0;
  }
  .dashboardAudienceSnapshot,
  .dashboardAudienceSnapshot:first-child,
  .dashboardAudienceSnapshot:last-child {
    padding: 0 16px;
    border-left: 0;
  }
  .dashboardAudienceSnapshot:nth-child(odd) {
    padding-left: 0;
  }
  .dashboardAudienceSnapshot:nth-child(even) {
    padding-right: 0;
    border-left: 1px solid var(--subtle-border);
  }
  .dashboardAudienceSnapshot:nth-child(n + 3) {
    padding-top: 16px;
    border-top: 1px solid var(--subtle-border);
  }
  .sectionTitle { align-items: stretch; flex-direction: column; }
  .sectionActions { justify-content: flex-start; }
  .platformDemoSection,
  .platformBillingSection {
    align-items: stretch;
    flex-direction: column;
  }
  .platformDemoSection button,
  .platformBillingSection button {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 560px) {
  .dashboardPage {
    gap: 20px;
  }
  .dashboardMetricGrid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  .dashboardHeadlineMetric {
    min-height: 104px;
  }
  .workspace {
    padding: 0 var(--space-4) var(--space-4);
  }
  .analyticsSummaryGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .analyticsSummaryGrid .metric {
    min-height: 88px;
    padding: 12px;
  }
  .analyticsSummaryGrid .metric strong {
    margin-top: 6px;
    font-size: 20px;
  }
  .analyticsSummaryGrid .metric strong.metricValueDense {
    font-size: 17px;
  }
  .analyticsSummaryGrid .metric strong.metricValueVeryDense {
    font-size: 15px;
  }
  .topbar {
    margin-inline: calc(-1 * var(--space-4));
    padding-inline: var(--space-4);
  }
  .profileMenuTriggerText {
    display: none;
  }
  .topbar:not(.topbarHasFilter) .topbarTitle {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .topbar:not(.topbarHasFilter) .topbarContextActions {
    grid-column: 2;
    grid-row: 2;
  }
  .topbar:not(.topbarHasFilter) .topbarActions > .profileMenu {
    grid-column: 3;
    grid-row: 2;
  }
  .profileMenuTrigger {
    width: auto;
    max-width: none;
    padding-right: 7px;
  }
  .macroSetupMenuPopover {
    right: auto;
    left: 0;
  }
  .topbarActions > select,
  .analyticsToolbarActions,
  .analyticsToolbarActions > button,
  .analyticsToolbarActions > .exportMenu,
  .analyticsToolbarActions > .exportMenu summary,
  .modalActions > button,
  .formStack > button.primary {
    width: 100%;
    justify-content: center;
  }
  .modalBackdrop {
    padding: 0;
  }
  .modalPanel,
  .modalPanel.medium,
  .modalPanel.wide {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
    padding: var(--space-4);
  }
  .modalHeader {
    position: sticky;
    top: calc(-1 * var(--space-4));
    z-index: 2;
    margin: calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) var(--space-3);
    padding: max(var(--space-3), env(safe-area-inset-top)) var(--space-4) var(--space-3);
    border-bottom: 1px solid var(--subtle-border);
    background: var(--panel);
  }
  .modalActions {
    position: sticky;
    bottom: calc(-1 * var(--space-4));
    z-index: 2;
    margin: var(--space-4) calc(-1 * var(--space-4)) calc(-1 * var(--space-4));
    padding: var(--space-3) var(--space-4) max(var(--space-3), env(safe-area-inset-bottom));
    background: var(--panel);
  }
  .frequencyEffectivenessSummary {
    grid-template-columns: minmax(0, 1fr);
  }
  .analyticsTabsBar {
    align-items: stretch;
  }
  .analyticsSavedReportActions {
    width: 100%;
    margin-left: 0;
  }
  .analyticsSavedReportActions button {
    flex: 1 1 0;
    justify-content: center;
  }
  .analyticsSavedReportRow {
    gap: 6px;
  }
  .analyticsSavedReportEdit {
    grid-template-columns: minmax(0, 1fr);
  }
  .analyticsSavedReportEditActions button {
    flex: 1 1 0;
    justify-content: center;
  }
  .settingsPanel {
    min-height: 0;
    padding: 18px;
  }
  .settingsIdentity {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .settingsAvatar {
    width: 42px;
    height: 42px;
  }
  .settingsRole {
    grid-column: 2;
  }
  .settingsFieldGrid {
    grid-template-columns: minmax(0, 1fr);
  }
  .settingsSecurityRow {
    align-items: stretch;
    flex-direction: column;
  }
  .settingsSecurityRow button,
  .settingsActions button {
    width: 100%;
    justify-content: center;
  }
  .settingsActions {
    justify-content: stretch;
  }
  .platformAccountBanner {
    align-items: stretch;
    flex-direction: column;
  }
  .platformAccountBanner > div {
    align-items: start;
    flex-direction: column;
    gap: 3px;
  }
  .platformAccountBanner button {
    width: 100%;
    justify-content: center;
  }
  .platformOverviewMetrics,
  .platformAccountDetailGrid {
    grid-template-columns: 1fr;
  }
  .platformAccountDetailGrid > div,
  .platformAccountDetailGrid > div:nth-child(2n),
  .platformAccountDetailGrid > div:nth-child(4n),
  .platformAccountDetailGrid > div:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid var(--subtle-border);
  }
  .platformAccountDetailGrid > div:last-child {
    border-bottom: 0;
  }
  .apiTokenTableWrap {
    overflow: visible;
    border: 0;
  }
  .apiTokenTable {
    min-width: 0;
  }
  .apiTokenTable thead {
    display: none;
  }
  .apiTokenTable tbody {
    display: grid;
    gap: 10px;
  }
  .apiTokenTable tr {
    display: block;
    border: 1px solid var(--panel-border);
    border-radius: 6px;
    padding: 6px;
  }
  .apiTokenTable td,
  .apiTokenTable tbody tr:last-child td {
    display: block;
    width: auto;
    border: 0;
    padding: 7px;
  }
  .apiTokenTable td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
  }
  .apiTokenTable .rowActions {
    width: auto;
    text-align: left;
  }
  .apiTokenTable .rowActions button {
    margin: 0;
  }
  .analyticsMetricPickerToolbar,
  .analyticsMetricPickerRows {
    grid-template-columns: 1fr;
  }
  .analyticsMetricPickerSectionTitle {
    align-items: stretch;
    flex-direction: column;
  }
  .analyticsMetricPickerSectionActions {
    justify-content: flex-end;
  }
  .analyticsMetricPickerContent {
    min-height: 260px;
  }
  .dashboardTrendBars {
    grid-template-columns: repeat(24, minmax(8px, 1fr));
    gap: 4px;
  }
  .dashboardTrendBar em {
    font-size: 9px;
  }
  .dashboardFunnelMeta {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .dashboardFunnelMeta em {
    grid-column: 1 / -1;
  }
  .dashboardDonutMetricSwitch {
    width: 100%;
    min-width: 0;
  }
  .dashboardAudienceMetricSwitch {
    width: 100%;
    min-width: 0;
  }
  .dashboardAudienceMetricSwitch button {
    padding: 0 5px;
  }
  .dashboardAudienceSnapshotGrid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
  .dashboardAudienceSnapshot,
  .dashboardAudienceSnapshot:first-child,
  .dashboardAudienceSnapshot:last-child,
  .dashboardAudienceSnapshot:nth-child(odd),
  .dashboardAudienceSnapshot:nth-child(even),
  .dashboardAudienceSnapshot:nth-child(n + 3) {
    padding: 0;
    border-top: 0;
    border-left: 0;
  }
  .dashboardAudienceSnapshot + .dashboardAudienceSnapshot {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--subtle-border);
  }
  .dashboardTrafficSection .sectionActions {
    width: 100%;
  }
  .dashboardDonutLayout {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .dashboardDonutLegend {
    width: 100%;
  }
  .dashboardReachStats {
    grid-template-columns: 1fr;
  }
  .dashboardReachChart svg {
    height: 240px;
  }
  .supportFieldGrid {
    grid-template-columns: 1fr;
  }
  .helpGuideNav {
    grid-template-columns: minmax(0, 1fr);
  }
  .helpGuideHeader h2 {
    font-size: 24px;
  }
  .supportDirectCard strong {
    padding-right: 0;
  }
  .supportDirectCard::after {
    position: static;
    opacity: 1;
    transform: none;
  }
  .supportFormFooter .primary {
    width: 100%;
    justify-content: center;
  }
}
.presentationCaseReviewPage { --pc-bg:#061225;--pc-panel:#0b1b31;--pc-border:rgba(90,166,255,.28);--pc-line:rgba(39,143,255,.3);--pc-text:#f3f7fc;--pc-soft:#d5deea;--pc-muted:#a7b5c6;--pc-blue:#5aa6ff;--pc-cyan:#27d5d1;--pc-green:#55c98a;--pc-amber:#e9c46a;min-height:100vh;padding:32px;color:var(--pc-text);background:radial-gradient(circle at 16% 0%,rgba(39,143,255,.15),transparent 30%),linear-gradient(180deg,#061225,#0b1b31 48%,#06101f)}

.presentationCaseToolbar,.presentationCaseContext,.presentationCaseStage{width:min(1600px,100%);margin-inline:auto}

.presentationCaseToolbar{display:grid;grid-template-columns:1fr;gap:18px;padding:18px 20px;border:1px solid var(--pc-border);border-radius:12px;background:rgba(5,17,34,.92)}

.presentationCaseToolbarBrand{display:flex;align-items:center;gap:22px}
.presentationCaseToolbarBrand img{width:154px;height:auto}
.presentationCaseToolbarBrand p,.presentationCaseToolbarBrand h1{margin:0}
.presentationCaseToolbarBrand p{color:var(--pc-cyan);font-size:12px;font-weight:850;text-transform:uppercase}
.presentationCaseToolbarBrand h1{margin-top:3px;font-size:23px}

.presentationCaseSwitcher{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.presentationCaseSwitcher button{min-width:0;min-height:62px;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--pc-border);border-radius:8px;color:var(--pc-soft);background:rgba(255,255,255,.035);text-align:left}
.presentationCaseSwitcher button>span:first-child{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--pc-border);border-radius:6px;color:var(--pc-blue)}
.presentationCaseSwitcher button>span:last-child{min-width:0;display:grid;gap:3px}
.presentationCaseSwitcher strong,.presentationCaseSwitcher small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationCaseSwitcher strong{font-size:14px}
.presentationCaseSwitcher small{color:var(--pc-muted);font-size:12px}
.presentationCaseSwitcher button.is-active{border-color:rgba(39,213,209,.65);background:linear-gradient(135deg,rgba(39,143,255,.16),rgba(39,213,209,.08));box-shadow:inset 3px 0 var(--pc-cyan);color:var(--pc-text)}
.presentationCaseSwitcher button.is-active>span:first-child{color:var(--pc-cyan);border-color:rgba(39,213,209,.48)}

.presentationCaseContext{margin-top:18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(480px,.85fr);gap:14px 28px;padding:18px 22px;border:1px solid var(--pc-border);border-radius:12px;background:rgba(5,17,34,.72)}
.presentationCaseContext p,.presentationCaseContext h2,.presentationCaseContext div>span{margin:0}
.presentationCaseContext p{color:var(--pc-cyan);font-size:12px;font-weight:850}
.presentationCaseContext h2{margin-top:5px;font-size:30px;line-height:1.08}
.presentationCaseContext div>span{display:block;margin-top:6px;color:var(--pc-soft);font-size:15px}
.presentationCaseContextChips{display:flex;flex-wrap:wrap;justify-content:flex-end;align-content:center;gap:8px}
.presentationCaseContextChips>span{padding:6px 10px;border:1px solid var(--pc-border);border-radius:999px;color:var(--pc-soft);background:rgba(255,255,255,.04);font-size:12px;font-weight:750}
.presentationCaseContext small{grid-column:1/-1;display:flex;align-items:center;gap:8px;padding-top:10px;border-top:1px solid var(--pc-line);color:var(--pc-muted);font-size:12px}
.presentationCaseContext small svg{color:var(--pc-blue)}

.presentationCaseStage{margin-top:18px}
.presentationCaseStageMeta{display:grid;grid-template-columns:auto 1fr auto auto;gap:16px;align-items:center;margin-bottom:12px;color:var(--pc-muted);font-size:13px}
.presentationCaseStageMeta strong{color:var(--pc-text);font-variant-numeric:tabular-nums}
.presentationCaseStageMeta>span:nth-child(2){text-align:center}
.presentationCaseStageMeta>span:nth-child(3){color:var(--pc-amber);font-weight:760}
.presentationCaseStageMeta>span:nth-child(3).is-ready{color:var(--pc-green)}
.presentationCaptureButton{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid rgba(39,213,209,.58);border-radius:6px;color:var(--pc-text);background:linear-gradient(135deg,rgba(39,143,255,.2),rgba(39,213,209,.12));font:inherit;font-weight:800;cursor:pointer}
.presentationCaptureButton:hover:not(:disabled){border-color:var(--pc-cyan);background:linear-gradient(135deg,rgba(39,143,255,.28),rgba(39,213,209,.18))}
.presentationCaptureButton:disabled{cursor:wait;opacity:.7}
.presentationCaptureButton.is-done{color:var(--pc-green)}
.presentationCaptureButton.is-error{border-color:rgba(233,196,106,.7);color:var(--pc-amber)}
.presentationCaptureButton svg{width:17px;height:17px}
.presentationCaseViewport{width:100%;overflow:auto;padding-bottom:36px;scrollbar-color:rgba(90,166,255,.45) transparent}

.presentationCaseCanvas{position:relative;isolation:isolate;contain:layout paint;width:1600px;height:1200px;flex:0 0 auto;overflow:hidden;padding:56px;color:var(--pc-text);background:radial-gradient(circle at 88% 8%,rgba(0,221,215,.11),transparent 28%),radial-gradient(circle at 5% 92%,rgba(39,143,255,.14),transparent 30%),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(180deg,#061225,#0b1b31 48%,#06101f);background-size:auto,auto,48px 48px,auto;font-family:var(--font-sans);font-variant-numeric:tabular-nums}
.presentationCaseCanvas::before{content:"";position:absolute;z-index:-1;inset:0;border:2px solid rgba(90,166,255,.2);pointer-events:none}
.presentationCaseCanvas *,.presentationCaseCanvas *::before,.presentationCaseCanvas *::after{animation:none!important;transition:none!important;box-sizing:border-box}

.presentationEvidencePanel,.presentationFunnelInsights>div,.presentationFunnelInsights>aside{border:2px solid var(--pc-border);border-radius:24px;background:rgba(11,27,49,.94)}

.presentationBudgetVisual{height:100%}
.presentationCampaignPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationPanelHeading{min-width:0;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:16px;align-items:center}
.presentationPanelHeading>svg{width:44px;height:44px;color:var(--pc-cyan)}
.presentationPanelHeading>strong{font-size:40px;line-height:1.05}
.presentationPanelHeading>span{display:flex;align-items:center;gap:12px;color:var(--pc-muted);font-size:34px;font-weight:800}
.presentationPanelHeading i{width:18px;height:18px;display:inline-block;border-radius:4px}
.presentationPanelHeading i.is-strong{background:var(--pc-cyan)}
.presentationPanelHeading i.is-watch{margin-left:10px;background:var(--pc-amber)}
.presentationCampaignTags{min-width:0;display:flex;align-items:center;gap:12px;overflow:hidden;border-block:2px solid var(--pc-line)}
.presentationCampaignTags>span{height:56px;display:inline-flex;align-items:center;gap:12px;flex:0 0 auto;padding:0 16px;border:2px solid rgba(90,166,255,.25);border-radius:999px;color:var(--pc-soft);background:rgba(90,166,255,.08);font-size:34px;font-weight:820}
.presentationCampaignTags>span.is-event{border-color:rgba(39,213,209,.45);color:#a6f2ef;background:rgba(39,213,209,.1)}
.presentationCampaignTags>span.is-configured{border-color:rgba(90,166,255,.54);color:#bcdcff;background:rgba(39,143,255,.13)}
.presentationCampaignTags>span.is-request{border-color:rgba(39,213,209,.58);color:#a6f2ef;background:linear-gradient(135deg,rgba(39,143,255,.15),rgba(39,213,209,.1))}
.presentationCampaignTags i{width:18px;height:18px;display:block;border-radius:4px}
.presentationCampaignTags .is-post-click i{background:var(--pc-blue)}
.presentationCampaignTags .is-post-view i{background:var(--pc-cyan)}

.presentationCampaignHeader,.presentationCampaignRow{display:grid;grid-template-columns:390px minmax(480px,1fr) 180px 190px;gap:22px;align-items:center}
.presentationCampaignHeader{padding:0 22px;color:var(--pc-muted);font-size:36px;font-weight:760;line-height:1.1}
.presentationCampaignHeader span:nth-child(n+3){text-align:right}
.presentationCampaignRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:18px}
.presentationCampaignRow{padding:22px;border:2px solid transparent;border-radius:16px;background:rgba(6,18,37,.5)}
.presentationCampaignRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationCampaignRow.is-comparison{border-color:rgba(233,196,106,.6);background:rgba(233,196,106,.055);box-shadow:inset 6px 0 rgba(233,196,106,.85)}
.presentationCampaignRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px;line-height:1.08}
.presentationCampaignRow>span{color:var(--pc-soft);font-size:38px;font-weight:760;text-align:right}
.presentationValueBar{position:relative;height:78px;overflow:hidden;border:2px solid rgba(90,166,255,.2);border-radius:12px;background:rgba(5,17,34,.82)}
.presentationValueBarFill{position:absolute;inset:0 auto 0 0;width:var(--presentation-bar-width);display:flex;overflow:hidden;border-radius:10px}
.presentationValueBarFill i{height:100%;display:block}
.presentationValueBarFill i.is-post-click{width:var(--presentation-post-click-share);background:linear-gradient(90deg,rgba(90,166,255,.88),rgba(39,143,255,.82))}
.presentationValueBarFill i.is-post-view{width:calc(100% - var(--presentation-post-click-share));background:linear-gradient(90deg,rgba(39,213,209,.7),rgba(39,213,209,.94))}
.presentationCampaignRow.is-comparison .presentationValueBarFill{filter:saturate(.72)}
.presentationValueBar b{position:absolute;z-index:1;top:50%;right:18px;transform:translateY(-50%);color:#fff;font-size:40px;text-shadow:0 2px 8px rgba(0,0,0,.75)}

.presentationFunnelVisual{height:100%;display:grid;grid-template-rows:minmax(0,790px) minmax(0,1fr);gap:32px}
.presentationFunnelPanel{min-height:0;display:grid;grid-template-rows:74px 56px 106px minmax(0,1fr);padding:32px}
.presentationFunnelGroups,.presentationFunnelHeader,.presentationFunnelRow{display:grid;grid-template-columns:170px 200px 230px 230px 265px 215px;gap:14px;align-items:center}
.presentationFunnelGroups{color:var(--pc-muted);font-size:34px}
.presentationFunnelGroups strong{height:48px;display:grid;place-items:center;border-bottom:2px solid var(--pc-line);font-size:34px}
.presentationFunnelGroups strong:nth-child(3){grid-column:3/5}
.presentationFunnelGroups strong:nth-child(4){grid-column:5/7}
.presentationFunnelHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationFunnelHeader span:first-child{text-align:left}
.presentationFunnelRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationFunnelRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationFunnelRow>strong{font-size:38px}
.presentationFunnelRow>span:nth-child(2){color:var(--pc-soft);font-size:36px;font-weight:760;text-align:center}
.presentationHeatCell{min-width:0;min-height:92px;display:flex;align-items:center;justify-content:center;gap:12px;border:2px solid transparent;border-radius:14px;font-size:38px}
.presentationHeatCell svg{width:34px;height:34px;flex:0 0 auto}
.presentationHeatCell.is-strong{border-color:rgba(39,213,209,.34);background:rgba(39,213,209,.16);color:#a6f2ef}
.presentationHeatCell.is-steady{border-color:rgba(90,166,255,.25);background:rgba(90,166,255,.11);color:var(--pc-soft)}
.presentationHeatCell.is-watch{border-color:rgba(233,196,106,.34);background:rgba(233,196,106,.12);color:#f2d88e}
.presentationHeatCell.is-flagged{border-color:rgba(233,196,106,.88);box-shadow:inset 0 0 0 2px rgba(233,196,106,.26)}

.presentationFunnelInsights{display:grid;grid-template-columns:1fr 1fr .9fr;gap:24px}
.presentationFunnelInsights>div,.presentationFunnelInsights>aside{min-width:0;padding:28px 34px}
.presentationFunnelInsights>div{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;align-items:center;column-gap:20px;border-color:rgba(233,196,106,.58);background:linear-gradient(135deg,rgba(233,196,106,.1),rgba(11,27,49,.96))}
.presentationFunnelInsights>div span{display:flex;align-items:center;gap:12px;color:var(--pc-amber);font-size:36px;font-weight:850}
.presentationFunnelInsights>div span svg{width:38px;height:38px}
.presentationFunnelInsights>div>strong{grid-row:1/3;grid-column:2;font-size:72px}
.presentationFunnelInsights p{margin:12px 0 0;color:var(--pc-soft);font-size:38px;line-height:1.08}
.presentationFunnelInsights>aside{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:24px;color:var(--pc-cyan);background:linear-gradient(135deg,rgba(39,143,255,.14),rgba(0,221,215,.08)),var(--pc-panel)}
.presentationFunnelInsights>aside svg{width:50px;height:50px}
.presentationFunnelInsights>aside strong{color:var(--pc-text);font-size:38px;line-height:1.15}

.presentationConfiguredVisual,.presentationRequestVisual{height:100%}
.presentationConfiguredPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationConfiguredHeader,.presentationConfiguredRow{display:grid;grid-template-columns:350px 200px 180px 276px minmax(282px,1fr);gap:18px;align-items:center}
.presentationConfiguredHeader{padding:0 20px;color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08}
.presentationConfiguredHeader span:nth-child(n+2){text-align:right}
.presentationConfiguredRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:18px}
.presentationConfiguredRow{padding:20px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.5)}
.presentationConfiguredRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationConfiguredRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px;line-height:1.08}
.presentationConfiguredRow>span{color:var(--pc-soft);font-size:38px;font-weight:760;text-align:right}
.presentationConfiguredValue{position:relative;height:78px;overflow:hidden;border:2px solid rgba(90,166,255,.2);border-radius:12px;background:rgba(5,17,34,.82)}
.presentationConfiguredValue>span{position:absolute;inset:0 auto 0 0;width:var(--presentation-configured-width);display:flex;overflow:hidden;border-radius:10px}
.presentationConfiguredValue>span i{height:100%;display:block}
.presentationConfiguredValue>span i.is-post-click{width:var(--presentation-post-click-share);background:linear-gradient(90deg,rgba(90,166,255,.88),rgba(39,143,255,.82))}
.presentationConfiguredValue>span i.is-post-view{width:calc(100% - var(--presentation-post-click-share));background:linear-gradient(90deg,rgba(39,213,209,.7),rgba(39,213,209,.94))}
.presentationConfiguredValue b{position:absolute;z-index:1;top:50%;right:16px;transform:translateY(-50%);color:#fff;font-size:38px;text-shadow:0 2px 8px rgba(0,0,0,.78)}

.presentationRequestPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 56px 104px minmax(0,1fr);padding:32px}
.presentationRequestPanel .presentationCampaignTags{gap:10px}
.presentationRequestPanel .presentationCampaignTags>span{padding-inline:14px}
.presentationRequestGroups,.presentationRequestHeader,.presentationRequestRow{display:grid;grid-template-columns:300px 210px 180px 300px minmax(250px,1fr);gap:16px;align-items:center}
.presentationRequestGroups{color:var(--pc-muted);font-size:34px}
.presentationRequestGroups strong{height:48px;display:grid;place-items:center;border-bottom:2px solid var(--pc-line);font-size:34px}
.presentationRequestGroups strong:nth-child(2){grid-column:2}
.presentationRequestGroups strong:nth-child(3){grid-column:3/6}
.presentationRequestHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationRequestHeader span:first-child{text-align:left}
.presentationRequestRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationRequestRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationRequestRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationRequestRow>strong{min-width:0;display:flex;align-items:center;gap:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationRequestRow>strong svg{width:36px;height:36px;flex:0 0 auto;color:var(--pc-cyan)}
.presentationRequestRow>span:nth-child(2),.presentationRequestRow>span:nth-child(3){color:var(--pc-soft);font-size:36px;font-weight:760;text-align:center}

.presentationDomainVisual,.presentationGeoVisual{height:100%}
.presentationDomainPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationDomainHeader,.presentationDomainRow{display:grid;grid-template-columns:330px 200px 210px minmax(370px,1fr) 170px;gap:18px;align-items:center}
.presentationDomainHeader{padding:0 20px;color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08}
.presentationDomainHeader span:nth-child(n+2){text-align:right}
.presentationDomainRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:18px}
.presentationDomainRow{padding:20px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.5)}
.presentationDomainRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationDomainRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px;line-height:1.08}
.presentationDomainMetric{min-width:0;display:grid;justify-items:end;gap:8px;color:var(--pc-soft)}
.presentationDomainMetric>b{font-size:38px}
.presentationDomainMetric>small{display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap;color:var(--pc-muted);font-size:34px;font-weight:720}
.presentationDomainMetric>small i{width:14px;height:14px;display:inline-block;border-radius:4px}
.presentationDomainMetric>small i.is-post-click{background:var(--pc-blue)}
.presentationDomainMetric>small i.is-post-view{margin-left:4px;background:var(--pc-cyan)}
.presentationDomainAverage{color:var(--pc-text);font-size:40px;font-weight:820;text-align:right}

.presentationGeoPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 56px 104px minmax(0,1fr);padding:32px}
.presentationGeoPanel .presentationCampaignTags{gap:10px}
.presentationGeoPanel .presentationCampaignTags>span{padding-inline:14px}
.presentationGeoGroups,.presentationGeoHeader,.presentationGeoRow{display:grid;grid-template-columns:190px 200px 230px 180px 265px minmax(215px,1fr);gap:14px;align-items:center}
.presentationGeoGroups{color:var(--pc-muted);font-size:34px}
.presentationGeoGroups strong{height:48px;display:grid;place-items:center;border-bottom:2px solid var(--pc-line);font-size:34px}
.presentationGeoGroups strong:nth-child(2){grid-column:2/4}
.presentationGeoGroups strong:nth-child(3){grid-column:4/7}
.presentationGeoHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationGeoHeader span:first-child{text-align:left}
.presentationGeoRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationGeoRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationGeoRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationGeoRow>strong{min-width:0;display:flex;align-items:center;gap:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationGeoRow>strong svg{width:34px;height:34px;flex:0 0 auto;color:var(--pc-cyan)}
.presentationGeoRow>span:nth-child(2),.presentationGeoRow>span:nth-child(4){color:var(--pc-soft);font-size:36px;font-weight:760;text-align:center}

.presentationTechnologyVisual,.presentationPlaybackVisual,.presentationFrequencyVisual,.presentationAttributionTypeVisual,.presentationAudienceVisual,.presentationHistoryVisual,.presentationContributionVisual,.presentationPathsVisual,.presentationModelVisual,.presentationStageVisual{height:100%}

.presentationTechnologyPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 56px 104px minmax(0,1fr);padding:32px}
.presentationTechnologyGroups,.presentationTechnologyHeader,.presentationTechnologyRow{display:grid;grid-template-columns:260px 180px 190px 260px minmax(420px,1fr);gap:16px;align-items:center}
.presentationTechnologyGroups{color:var(--pc-muted);font-size:34px}
.presentationTechnologyGroups strong{height:48px;display:grid;place-items:center;border-bottom:2px solid var(--pc-line);font-size:34px}
.presentationTechnologyGroups strong:nth-child(1){grid-column:1/3}
.presentationTechnologyGroups strong:nth-child(2){grid-column:3/6}
.presentationTechnologyHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationTechnologyHeader span:first-child{text-align:left}
.presentationTechnologyRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationTechnologyRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationTechnologyRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationTechnologyRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px}
.presentationTechnologyRow>span{color:var(--pc-soft);font-size:38px;font-weight:760;text-align:center}
.presentationTechnologyRow>span.is-volume-leader{border:2px solid rgba(90,166,255,.48);border-radius:12px;background:rgba(90,166,255,.12);color:#cfe6ff;padding:16px}

.presentationPlaybackPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationPlaybackHeader,.presentationPlaybackRow{display:grid;grid-template-columns:350px 200px 220px 200px 200px minmax(140px,1fr);gap:14px;align-items:center}
.presentationPlaybackHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationPlaybackHeader span:first-child{text-align:left}
.presentationPlaybackRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationPlaybackRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationPlaybackRow>strong{min-width:0;display:grid;gap:12px;overflow:hidden}
.presentationPlaybackRow>strong b,.presentationPlaybackRow>strong small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationPlaybackRow>strong b{font-size:40px;line-height:1.04}
.presentationPlaybackRow>strong small{color:var(--pc-muted);font-size:34px;font-weight:720}
.presentationPlaybackRow .presentationHeatCell{min-height:104px}

.presentationFrequencyPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px minmax(0,1fr);padding:34px}
.presentationFrequencyCards{position:relative;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-top:26px}
.presentationFrequencyCards article{position:relative;z-index:1;min-width:0;display:grid;grid-template-rows:88px 140px 72px 220px minmax(100px,1fr);align-items:center;padding:34px;border:2px solid color-mix(in srgb,var(--pc-cyan) var(--presentation-frequency-intensity),var(--pc-border));border-radius:22px;background:linear-gradient(180deg,rgba(39,213,209,var(--presentation-frequency-alpha)),rgba(6,18,37,.94));box-shadow:inset 0 5px rgba(39,213,209,var(--presentation-frequency-alpha))}
.presentationFrequencyCards p{margin:0;color:var(--pc-soft);font-size:34px;font-weight:850;line-height:1.08;text-align:center}
.presentationFrequencyCards article>strong{font-size:84px;line-height:1;text-align:center}
.presentationFrequencyCards article>span{color:var(--pc-cyan);font-size:34px;font-weight:820;text-align:center}
.presentationFrequencyCards article>div{display:grid;justify-items:center;gap:10px;padding:24px 12px;border-block:2px solid var(--pc-line)}
.presentationFrequencyCards article>div b{font-size:52px}
.presentationFrequencyCards article>div small{color:var(--pc-muted);font-size:34px;font-weight:760;text-align:center}
.presentationFrequencyCards footer{display:grid;place-content:center;justify-items:center;gap:8px}
.presentationFrequencyCards footer b{font-size:46px}
.presentationFrequencyCards footer span{color:var(--pc-muted);font-size:34px;font-weight:760}

.presentationAttributionTypePanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 214px minmax(0,1fr);padding:34px}
.presentationAttributionTotal{display:grid;grid-template-columns:310px minmax(0,1fr);gap:24px;align-items:center;padding:26px 0}
.presentationAttributionTotal>div:first-child{display:grid;gap:8px}
.presentationAttributionTotal>div:first-child span{color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationAttributionTotal>div:first-child strong{font-size:58px}
.presentationAttributionTotalBar{height:122px;display:flex;overflow:hidden;border:2px solid var(--pc-border);border-radius:18px;background:rgba(5,17,34,.82)}
.presentationAttributionTotalBar>span{display:flex;align-items:center;justify-content:center;gap:18px;font-size:38px}
.presentationAttributionTotalBar>span.is-click{background:linear-gradient(90deg,rgba(90,166,255,.68),rgba(39,143,255,.82))}
.presentationAttributionTotalBar>span.is-view{background:linear-gradient(90deg,rgba(39,213,209,.58),rgba(39,213,209,.82))}
.presentationAttributionTotalBar small{font-size:34px;font-weight:760}
.presentationAttributionCards{min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.presentationAttributionCards article{min-width:0;display:grid;grid-template-rows:140px minmax(0,1fr);padding:34px;border:2px solid var(--pc-border);border-radius:22px;background:rgba(6,18,37,.58)}
.presentationAttributionCards article.is-click{border-color:rgba(90,166,255,.58)}
.presentationAttributionCards article.is-view{border-color:rgba(39,213,209,.58)}
.presentationAttributionCards header{display:flex;align-items:center;gap:24px;border-bottom:2px solid var(--pc-line)}
.presentationAttributionIcon{width:74px;height:74px;display:grid;place-items:center;border:2px solid currentColor;border-radius:18px;color:var(--pc-blue)}
.presentationAttributionCards article.is-view .presentationAttributionIcon{color:var(--pc-cyan)}
.presentationAttributionIcon svg{width:44px;height:44px}
.presentationAttributionCards header>div{display:grid;gap:8px}
.presentationAttributionCards header strong{font-size:44px}
.presentationAttributionCards header small{color:var(--pc-muted);font-size:34px;font-weight:800}
.presentationAttributionCards article>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:center}
.presentationAttributionCards article>div span{min-width:0;display:grid;grid-template-rows:96px auto;align-content:center;gap:12px}
.presentationAttributionCards article>div small{display:flex;align-items:flex-end;color:var(--pc-muted);font-size:34px;font-weight:740}
.presentationAttributionCards article>div b{font-size:42px;white-space:nowrap}

.presentationAudiencePanel{height:100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationAudienceHeader,.presentationAudienceRow{display:grid;grid-template-columns:350px 160px minmax(630px,1fr) 150px;gap:18px;align-items:center}
.presentationAudienceHeader{min-width:0;padding:0 20px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationAudienceHeader span:first-child{text-align:left}
.presentationAudienceRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationAudienceRow{padding:16px 20px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationAudienceRow.is-selected{border-color:rgba(39,213,209,.62);background:linear-gradient(90deg,rgba(39,213,209,.11),rgba(39,143,255,.04))}
.presentationAudienceRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationAudienceRow>span,.presentationAudienceRow>b{font-size:38px;text-align:center}
.presentationAudienceComposition{min-width:0;display:grid;gap:10px}
.presentationAudienceComposition>div{height:86px;display:flex;overflow:hidden;border:2px solid var(--pc-border);border-radius:12px}
.presentationAudienceComposition>div span{min-width:0;display:grid;place-content:center;justify-items:center;gap:3px;overflow:hidden;white-space:nowrap}
.presentationAudienceComposition .is-no-prior{background:linear-gradient(90deg,rgba(90,166,255,.48),rgba(39,143,255,.66))}
.presentationAudienceComposition .is-known{background:linear-gradient(90deg,rgba(39,213,209,.5),rgba(39,213,209,.72))}
.presentationAudienceComposition span b{font-size:36px}
.presentationAudienceComposition p{margin:0;display:grid;grid-template-columns:1fr;align-items:center;gap:2px;padding:6px 14px;border:2px solid rgba(39,213,209,.32);border-radius:10px;color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.05;white-space:nowrap}
.presentationAudienceComposition p b{color:var(--pc-cyan)}

.presentationHistoryPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationHistoryHeader,.presentationHistoryRow{display:grid;grid-template-columns:300px repeat(5,minmax(0,1fr));gap:14px;align-items:center}
.presentationHistoryHeader{padding:0 16px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:780;line-height:1.08;text-align:center}
.presentationHistoryHeader span:first-child{text-align:left}
.presentationHistoryRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationHistoryRow{padding:16px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationHistoryRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px}
.presentationHistoryRow>span{min-height:128px;display:grid;place-items:center;border:2px solid rgba(90,166,255,.28);border-radius:14px;background:rgba(39,213,209,var(--presentation-history-alpha));color:#d5deea;font-size:40px}
.presentationHistoryRow>span.is-selected{border-color:rgba(39,213,209,.78);color:#a6f2ef;box-shadow:inset 0 0 0 3px rgba(39,213,209,.2)}

.presentationContributionPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationContributionHeader,.presentationContributionRow{display:grid;grid-template-columns:280px minmax(410px,1fr) 160px 210px 240px;gap:16px;align-items:center}
.presentationContributionHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationContributionHeader span:first-child{text-align:left}
.presentationContributionRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationContributionRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationContributionRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationContributionRow>strong{min-width:0;display:grid;gap:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px}
.presentationContributionRow>strong small{width:max-content;padding:8px 10px;border:2px solid rgba(39,213,209,.4);border-radius:8px;color:var(--pc-cyan);font-size:34px}
.presentationContributionRow>span{font-size:38px;font-weight:780;text-align:center}
.presentationRoleBar{height:104px;position:relative;overflow:hidden;border:2px solid var(--pc-border);border-radius:14px;background:rgba(5,17,34,.82)}
.presentationRoleBar>span{position:absolute;inset:0 auto 0 0;width:var(--presentation-involvement);display:flex;overflow:hidden}
.presentationRoleBar i{display:grid;place-items:center;font-style:normal}
.presentationRoleBar i.is-win{width:var(--presentation-win-share);background:linear-gradient(90deg,rgba(90,166,255,.68),rgba(39,143,255,.82))}
.presentationRoleBar i.is-assist{width:calc(100% - var(--presentation-win-share));background:linear-gradient(90deg,rgba(39,213,209,.54),rgba(39,213,209,.78))}
.presentationRoleBar b{font-size:34px}

.presentationPathsPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px minmax(0,1fr);padding:34px}
.presentationPathRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:14px;padding-top:18px}
.presentationPathRows article{min-width:0;display:grid;grid-template-rows:minmax(108px,1fr) 88px;gap:12px;padding:20px 24px;border:2px solid rgba(90,166,255,.24);border-radius:18px;background:rgba(6,18,37,.54)}
.presentationPathRail{min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;overflow:hidden}
.presentationPathRail>span{min-width:0;flex:0 1 auto;display:grid;gap:4px;padding:10px 8px;border:2px solid var(--pc-border);border-radius:12px;background:rgba(90,166,255,.09);white-space:nowrap}
.presentationPathRail>span.is-product{border-color:rgba(39,213,209,.38);background:rgba(39,213,209,.09)}
.presentationPathRail>span.is-target{border-color:rgba(39,213,209,.7);background:rgba(39,213,209,.17)}
.presentationPathRail>span.is-click{border-color:rgba(90,166,255,.62)}
.presentationPathRail small{color:var(--pc-muted);font-size:34px;font-weight:800}
.presentationPathRail strong{overflow:hidden;text-overflow:ellipsis;font-size:34px}
.presentationPathRail>i{flex:0 0 auto;color:var(--pc-cyan);font-size:34px;font-style:normal}
.presentationPathMetrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding-top:12px;border-top:2px solid var(--pc-line)}
.presentationPathMetrics span{display:grid;place-content:center;justify-items:center;gap:2px;white-space:nowrap}
.presentationPathMetrics b{font-size:38px}
.presentationPathMetrics small{color:var(--pc-muted);font-size:34px;font-weight:760}

.presentationModelPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 104px minmax(0,1fr);padding:34px}
.presentationModelHeader,.presentationModelRow{display:grid;grid-template-columns:250px repeat(4,minmax(0,1fr));gap:14px;align-items:center}
.presentationModelHeader{padding:0 16px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationModelHeader span:first-child{text-align:left}
.presentationModelRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationModelRow{padding:16px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationModelRow.is-selected{border-color:rgba(39,213,209,.5);background:linear-gradient(90deg,rgba(39,213,209,.1),rgba(39,143,255,.04))}
.presentationModelRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px}
.presentationModelRow>span{min-width:0;display:grid;grid-template-rows:48px 20px 48px;align-content:center;gap:10px;padding:12px;border:2px solid rgba(90,166,255,.18);border-radius:12px;background:rgba(5,17,34,.64);text-align:center}
.presentationModelRow>span>b{font-size:40px}
.presentationModelRow>span>i{height:16px;overflow:hidden;border-radius:999px;background:rgba(90,166,255,.14)}
.presentationModelRow>span>i em{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--pc-blue),var(--pc-cyan))}
.presentationModelRow>span>small{min-height:42px;color:transparent;font-size:34px;font-weight:820;white-space:nowrap}
.presentationModelRow>span.is-flagged{border-color:rgba(39,213,209,.8);background:rgba(39,213,209,.12);box-shadow:inset 0 0 0 2px rgba(39,213,209,.2)}
.presentationModelRow>span.is-flagged>small{color:var(--pc-cyan)}

.presentationStagePanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 160px 104px minmax(0,1fr);padding:32px}
.presentationStageRail{display:grid;grid-template-columns:270px minmax(0,1fr) 270px;gap:24px;align-items:center;padding:20px 0}
.presentationStageRail>div:first-child,.presentationStageRail>div:last-child{height:118px;display:grid;place-content:center;gap:8px;padding:18px;border:2px solid rgba(39,213,209,.5);border-radius:16px;background:rgba(39,213,209,.1);text-align:center}
.presentationStageRail span{color:var(--pc-cyan);font-size:34px;font-weight:820}
.presentationStageRail strong{font-size:38px;white-space:nowrap}
.presentationStageRail>div:nth-child(2){display:grid;grid-template-rows:auto 14px auto;gap:10px;text-align:center}
.presentationStageRail>div:nth-child(2)>i{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--pc-blue),var(--pc-cyan));position:relative}
.presentationStageRail>div:nth-child(2)>i::after{content:"→";position:absolute;right:0;top:-26px;color:var(--pc-cyan);font-size:42px;font-style:normal}
.presentationStageRail small{color:var(--pc-muted);font-size:34px;font-weight:720;white-space:nowrap}
.presentationStageRail small b{color:var(--pc-text)}
.presentationStageHeader,.presentationStageRow{display:grid;grid-template-columns:260px repeat(4,minmax(0,1fr));gap:16px;align-items:center}
.presentationStageHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationStageHeader span:first-child{text-align:left}
.presentationStageRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationStageRow{padding:14px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationStageRow.is-selected{border-color:rgba(39,213,209,.52);background:linear-gradient(90deg,rgba(39,213,209,.1),rgba(39,143,255,.04))}
.presentationStageRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:40px}
.presentationStageRow>span{min-height:86px;display:grid;place-items:center;border:2px solid rgba(90,166,255,.18);border-radius:12px;background:rgba(5,17,34,.52);font-size:38px;font-weight:780}
.presentationStageRow>span.is-flagged{border-color:rgba(39,213,209,.78);background:rgba(39,213,209,.15);color:#a6f2ef;box-shadow:inset 0 0 0 2px rgba(39,213,209,.2)}

.presentationWeeklyVisual,.presentationEventTimeVisual,.presentationLastTouchVisual,.presentationTimingVisual,.presentationCustomEventVisual,.presentationEventGroupsVisual,.presentationMetricFiltersVisual,.presentationRawVisual,.presentationAccessVisual,.presentationSavedVisual{height:100%}

.presentationWeeklyPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 56px 104px minmax(0,1fr);padding:32px}
.presentationWeeklyGroups,.presentationWeeklyHeader,.presentationWeeklyRow{display:grid;grid-template-columns:312px 200px 180px 143px 170px minmax(300px,1fr);gap:14px;align-items:center}
.presentationWeeklyGroups{color:var(--pc-muted);font-size:34px}
.presentationWeeklyGroups strong{height:48px;display:grid;place-items:center;border-bottom:2px solid var(--pc-line);font-size:34px}
.presentationWeeklyGroups strong:nth-child(2){grid-column:2/5}
.presentationWeeklyGroups strong:nth-child(3){grid-column:5/7}
.presentationWeeklyHeader{padding:0 18px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationWeeklyHeader span:first-child{text-align:left}
.presentationWeeklyRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationWeeklyRow{padding:16px 18px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationWeeklyRow.is-selected{border-color:rgba(39,213,209,.72);background:linear-gradient(90deg,rgba(39,213,209,.14),rgba(39,143,255,.05));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationWeeklyRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationWeeklyRow>span{color:var(--pc-soft);font-size:38px;font-weight:760;text-align:center}
.presentationWeeklyValue{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center}
.presentationWeeklyValue>i{height:54px;overflow:hidden;border:2px solid var(--pc-border);border-radius:10px;background:rgba(5,17,34,.7)}
.presentationWeeklyValue>i em{height:100%;display:block;border-radius:8px;background:linear-gradient(90deg,var(--pc-blue),var(--pc-cyan))}
.presentationWeeklyValue>b{font-size:38px;white-space:nowrap}

.presentationEventTimePanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px minmax(0,1fr);padding:32px}
.presentationEventTimeContent{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:24px;padding-top:18px}
.presentationEventHeatmap,.presentationEventTopPeriods{min-width:0;min-height:0;border:2px solid var(--pc-border);border-radius:18px;background:rgba(6,18,37,.56)}
.presentationEventHeatmap{display:grid;grid-template-rows:64px 60px minmax(0,1fr);padding:20px}
.presentationEventHeatmap>header,.presentationEventTopPeriods>header{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;border-bottom:2px solid var(--pc-line)}
.presentationEventHeatmap>header strong,.presentationEventTopPeriods>header strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationEventHeatmap>header span,.presentationEventTopPeriods>header span{color:var(--pc-muted);font-size:34px;font-weight:780;white-space:nowrap}
.presentationEventHeatmapAxis,.presentationEventHeatmapRow{display:grid;grid-template-columns:96px repeat(6,minmax(0,1fr));gap:8px;align-items:center}
.presentationEventHeatmapAxis{color:var(--pc-muted);font-size:34px;font-weight:780;text-align:center}
.presentationEventHeatmapAxis span:first-child{text-align:left}
.presentationEventHeatmapRows{min-height:0;display:grid;grid-template-rows:repeat(7,minmax(0,1fr));gap:8px;padding-top:8px}
.presentationEventHeatmapRow>strong{font-size:36px;white-space:nowrap}
.presentationEventHeatmapRow>span{height:100%;min-height:0;display:grid;place-items:center;border:2px solid rgba(90,166,255,.24);border-radius:10px;background:rgba(39,143,255,var(--presentation-event-time-alpha));color:#f3f7fc}
.presentationEventHeatmapRow>span b{font-size:36px}
.presentationEventHeatmapRow>span.is-top{border-color:rgba(39,213,209,.75);background:linear-gradient(135deg,rgba(39,143,255,.48),rgba(39,213,209,.5))}
.presentationEventHeatmapRow>span.is-peak{border-color:var(--pc-cyan);color:#fff;box-shadow:inset 0 0 0 3px rgba(39,213,209,.28),0 0 20px rgba(39,213,209,.12)}
.presentationEventTopPeriods{display:grid;grid-template-rows:64px minmax(0,1fr) 218px;gap:12px;padding:20px}
.presentationEventTopCards{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px}
.presentationEventTopCards>article{min-width:0;display:grid;grid-template-rows:45px minmax(0,1fr);padding:10px 14px;border:2px solid rgba(90,166,255,.25);border-radius:14px;background:rgba(11,27,49,.78)}
.presentationEventTopCards>article.is-peak{border-color:rgba(39,213,209,.78);background:linear-gradient(135deg,rgba(39,213,209,.13),rgba(39,143,255,.08));box-shadow:inset 5px 0 var(--pc-cyan)}
.presentationEventTopCards article>header{min-width:0;display:flex;align-items:start;justify-content:space-between;gap:12px;border-bottom:2px solid rgba(90,166,255,.18)}
.presentationEventTopCards article>header strong{font-size:36px;white-space:nowrap}
.presentationEventTopCards article>header span{color:var(--pc-cyan);font-size:34px;font-weight:820}
.presentationEventTopCards article>div{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:center}
.presentationEventTopCards article>div>span{min-width:0;display:grid;gap:2px}
.presentationEventTopCards article>div>span:last-child{text-align:right}
.presentationEventTopCards article>div b{font-size:40px;white-space:nowrap}
.presentationEventTopCards article>div small{color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1}
.presentationEventTimeNote{display:grid;align-content:center;gap:6px;padding:14px 18px;border:2px solid rgba(233,196,106,.6);border-radius:14px;background:linear-gradient(135deg,rgba(233,196,106,.1),rgba(6,18,37,.7))}
.presentationEventTimeNote small{color:var(--pc-amber);font-size:34px;font-weight:850;line-height:1}
.presentationEventTimeNote strong{font-size:36px;line-height:1.12}
.presentationEventTimeNote span{color:var(--pc-soft);font-size:34px;font-weight:760;line-height:1.08}

.presentationLastTouchPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 72px minmax(0,1fr) 146px;padding:32px}
.presentationLastTouchHeader,.presentationLastTouchRows>article{display:grid;grid-template-columns:340px minmax(0,1fr) 350px;gap:18px;align-items:center}
.presentationLastTouchHeader{padding:0 16px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;text-align:center}
.presentationLastTouchHeader span:first-child{text-align:left}
.presentationLastTouchRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-block:16px}
.presentationLastTouchRows>article{min-height:0;padding:12px 16px;border:2px solid rgba(90,166,255,.16);border-radius:16px;background:rgba(6,18,37,.5)}
.presentationLastTouchRows>article>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationLastTouchWeek{height:100%;min-height:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.presentationLastTouchWeek>span{min-width:0;min-height:0;display:grid;grid-template-rows:42px minmax(0,1fr) 36px;justify-items:center;align-items:end;color:var(--pc-soft)}
.presentationLastTouchWeek b,.presentationLastTouchWeek small{font-size:34px;line-height:1;white-space:nowrap}
.presentationLastTouchWeek b{align-self:center}
.presentationLastTouchWeek small{color:var(--pc-muted);font-weight:760}
.presentationLastTouchWeek i{width:50px;height:max(8px,var(--presentation-last-touch-rate));max-height:100%;display:block;align-self:end;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--pc-cyan),var(--pc-blue));box-shadow:0 4px 14px rgba(39,143,255,.16)}
.presentationLastTouchWeek>span.is-best b,.presentationLastTouchWeek>span.is-best small{color:var(--pc-amber)}
.presentationLastTouchWeek>span.is-best i{background:linear-gradient(180deg,#f3d98e,#c69237);box-shadow:0 4px 18px rgba(233,196,106,.28)}
.presentationLastTouchRows aside{height:100%;min-height:0;display:grid;align-content:center;gap:2px;padding:8px 12px;border:2px solid rgba(233,196,106,.46);border-radius:13px;background:rgba(233,196,106,.07)}
.presentationLastTouchRows aside small,.presentationLastTouchRows aside span,.presentationLastTouchRows aside b{font-size:34px;line-height:1;white-space:nowrap}
.presentationLastTouchRows aside small{color:var(--pc-amber);font-weight:820}
.presentationLastTouchRows aside strong{font-size:38px;line-height:1;white-space:nowrap}
.presentationLastTouchRows aside span{color:var(--pc-soft);font-weight:760}
.presentationLastTouchRows aside b{color:var(--pc-muted)}
.presentationLastTouchStory{display:grid;grid-template-columns:1fr 54px 1fr 54px 1.45fr;grid-template-rows:minmax(0,1fr) 42px;gap:8px 12px;align-items:center;padding:10px 20px;border:2px solid rgba(233,196,106,.48);border-radius:16px;background:linear-gradient(90deg,rgba(233,196,106,.09),rgba(39,143,255,.07))}
.presentationLastTouchStory>div{min-width:0;display:grid;gap:7px}
.presentationLastTouchStory strong,.presentationLastTouchStory small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationLastTouchStory strong{font-size:36px}
.presentationLastTouchStory small{color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationLastTouchStory>i{color:var(--pc-amber);font-size:48px;font-style:normal;text-align:center}
.presentationLastTouchStory .is-result strong{color:var(--pc-cyan)}
.presentationLastTouchStory>.presentationLastTouchCaveat{grid-column:1/-1;justify-self:end;color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.1;white-space:nowrap}

.presentationTimingPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 76px 104px minmax(0,1fr);padding:32px}
.presentationTimingLegend{display:flex;align-items:center;gap:24px;color:var(--pc-soft);font-size:34px;font-weight:780}
.presentationTimingLegend>span{display:flex;align-items:center;gap:10px;white-space:nowrap}
.presentationTimingLegend i{width:22px;height:22px;display:block;border-radius:5px}
.presentationTimingLegend .is-hour i,.presentationTimingBar .is-hour{background:rgba(39,213,209,.82)}
.presentationTimingLegend .is-day i,.presentationTimingBar .is-day{background:rgba(90,166,255,.8)}
.presentationTimingLegend .is-later i,.presentationTimingBar .is-later{background:rgba(167,181,198,.54)}
.presentationTimingLegend small{margin-left:auto;color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationTimingHeader,.presentationTimingRow{display:grid;grid-template-columns:340px minmax(420px,1fr) 140px 150px 210px;gap:14px;align-items:center}
.presentationTimingHeader{padding:0 16px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:center}
.presentationTimingHeader span:first-child{text-align:left}
.presentationTimingRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationTimingRow{padding:16px;border:2px solid rgba(90,166,255,.13);border-radius:16px;background:rgba(6,18,37,.48)}
.presentationTimingRow.is-selected{border-color:rgba(39,213,209,.62);background:linear-gradient(90deg,rgba(39,213,209,.11),rgba(39,143,255,.04));box-shadow:inset 6px 0 var(--pc-cyan)}
.presentationTimingRow>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:38px}
.presentationTimingRow>span{font-size:38px;font-weight:780;text-align:center;white-space:nowrap}
.presentationTimingBar{height:104px;display:flex;overflow:hidden;border:2px solid var(--pc-border);border-radius:14px;background:rgba(5,17,34,.72)}
.presentationTimingBar>span{min-width:0;display:grid;place-items:center;color:#fff}
.presentationTimingBar b{font-size:34px;text-shadow:0 2px 7px rgba(0,0,0,.65)}

.presentationCustomEventPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 72px 470px minmax(0,1fr);padding:34px}
.presentationCustomEventPanel .presentationCampaignTags,.presentationEventGroupsPanel .presentationCampaignTags,.presentationMetricFiltersPanel .presentationCampaignTags{gap:10px}
.presentationCustomEventPanel .presentationCampaignTags>span,.presentationEventGroupsPanel .presentationCampaignTags>span,.presentationMetricFiltersPanel .presentationCampaignTags>span{padding-inline:13px}
.presentationEventDefinitionHeading{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:2px solid var(--pc-line)}
.presentationEventDefinitionHeading strong{font-size:38px}
.presentationEventDefinitionHeading span{color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationEventDefinitionFlow{min-height:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;padding-block:20px}
.presentationEventDefinitionFlow>article{min-width:0;position:relative;display:grid;grid-template-rows:50px 70px 56px minmax(0,1fr) 58px;align-items:center;padding:20px;border:2px solid rgba(90,166,255,.28);border-radius:18px;background:linear-gradient(180deg,rgba(39,143,255,.09),rgba(6,18,37,.62))}
.presentationEventDefinitionFlow>article:not(:last-child)::after{content:"→";position:absolute;z-index:2;right:-27px;top:50%;translate:0 -50%;color:var(--pc-blue);font-size:44px;font-weight:800}
.presentationEventDefinitionFlow>article.is-value{border-color:rgba(39,213,209,.72);background:linear-gradient(180deg,rgba(39,213,209,.14),rgba(6,18,37,.62));box-shadow:inset 0 6px var(--pc-cyan)}
.presentationEventDefinitionFlow small,.presentationEventDefinitionFlow span,.presentationEventDefinitionFlow b,.presentationEventDefinitionFlow code{font-family:inherit;font-size:34px;line-height:1.05}
.presentationEventDefinitionFlow small{color:var(--pc-muted);font-weight:760}
.presentationEventDefinitionFlow strong{font-size:34px;line-height:1.04;white-space:nowrap}
.presentationEventDefinitionFlow code{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--pc-soft);font-weight:650}
.presentationEventDefinitionFlow span{align-self:center;color:#bdd4f2;font-weight:760}
.presentationEventDefinitionFlow b{align-self:end;color:var(--pc-muted)}
.presentationEventDefinitionFlow .is-value b{color:var(--pc-cyan)}
.presentationEventDefinitionImpacts{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:16px}
.presentationEventDefinitionImpacts article{min-width:0;display:grid;align-content:center;gap:12px;padding:20px 26px;border:2px solid rgba(233,196,106,.48);border-radius:16px;background:rgba(233,196,106,.07)}
.presentationEventDefinitionImpacts article.is-value{border-color:rgba(39,213,209,.5);background:rgba(39,213,209,.08)}
.presentationEventDefinitionImpacts span,.presentationEventDefinitionImpacts small{font-size:34px;font-weight:760}
.presentationEventDefinitionImpacts span{color:var(--pc-amber)}
.presentationEventDefinitionImpacts .is-value span{color:var(--pc-cyan)}
.presentationEventDefinitionImpacts strong{font-size:38px}
.presentationEventDefinitionImpacts small{color:var(--pc-muted)}

.presentationEventGroupsPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 132px 62px 52px 78px minmax(0,1fr) 130px;padding:34px}
.presentationEventReuseStrip{display:grid;grid-template-columns:180px minmax(0,1fr) 390px;gap:18px;align-items:center;margin-block:14px;padding:16px 20px;border:2px solid rgba(39,213,209,.42);border-radius:16px;background:linear-gradient(90deg,rgba(39,143,255,.1),rgba(39,213,209,.08))}
.presentationEventReuseStrip small,.presentationEventReuseStrip strong{font-size:34px;font-weight:800;white-space:nowrap}
.presentationEventReuseStrip small{color:var(--pc-muted)}
.presentationEventReuseStrip strong{color:var(--pc-cyan);text-align:right}
.presentationEventReuseStrip>div{display:flex;justify-content:center;gap:10px}
.presentationEventReuseStrip>div span{padding:8px 12px;border:2px solid var(--pc-border);border-radius:999px;background:rgba(6,18,37,.55);font-size:34px;font-weight:780;white-space:nowrap}
.presentationCrossProductTitle{display:flex;align-items:center;justify-content:space-between;gap:24px}
.presentationCrossProductTitle strong{font-size:38px}
.presentationCrossProductTitle span{color:var(--pc-muted);font-size:34px;font-weight:780}
.presentationCrossProductAxis{display:grid;grid-template-columns:330px minmax(0,1fr);align-items:center;text-align:center}
.presentationCrossProductAxis strong{color:var(--pc-muted);font-size:34px}
.presentationCrossProductHeader,.presentationCrossProductRows>div{display:grid;grid-template-columns:330px repeat(3,minmax(0,1fr));gap:12px;align-items:center}
.presentationCrossProductHeader{padding:0 14px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.05;text-align:center}
.presentationCrossProductHeader span:first-child{text-align:left}
.presentationCrossProductRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px;padding-block:12px}
.presentationCrossProductRows>div{min-height:0;padding:12px 14px;border:2px solid rgba(90,166,255,.14);border-radius:14px;background:rgba(6,18,37,.48)}
.presentationCrossProductRows>div>strong{font-size:36px;white-space:nowrap}
.presentationCrossProductRows>div>span{height:100%;min-height:0;display:grid;place-content:center;gap:4px;border:2px solid rgba(90,166,255,.22);border-radius:12px;background:rgba(39,143,255,.07);text-align:center}
.presentationCrossProductRows>div>span.is-diagonal{background:rgba(39,143,255,.19)}
.presentationCrossProductRows>div>span.is-selected{border-color:var(--pc-cyan);background:rgba(39,213,209,.17);box-shadow:inset 0 0 0 3px rgba(39,213,209,.18)}
.presentationCrossProductRows b{font-size:40px}
.presentationCrossProductRows small{color:var(--pc-cyan);font-size:34px;font-weight:800}
.presentationCrossProductCallout{display:grid;grid-template-columns:430px minmax(0,1fr);grid-template-rows:auto auto;gap:8px 20px;align-content:center;padding:8px 22px;border:2px solid rgba(39,213,209,.52);border-radius:16px;background:linear-gradient(90deg,rgba(39,213,209,.12),rgba(39,143,255,.06))}
.presentationCrossProductCallout strong,.presentationCrossProductCallout b,.presentationCrossProductCallout span{font-size:34px;line-height:1.05}
.presentationCrossProductCallout strong{color:var(--pc-cyan)}
.presentationCrossProductCallout b{justify-self:end;white-space:nowrap}
.presentationCrossProductCallout span{grid-column:1/-1;color:var(--pc-soft);font-weight:720;white-space:nowrap}

.presentationMetricFiltersPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px minmax(0,1fr) 130px;padding:34px}
.presentationPlacementFilterContent{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 120px 500px;gap:18px;padding-block:18px}
.presentationPlacementBefore,.presentationPlacementResult{min-width:0;min-height:0;border:2px solid var(--pc-border);border-radius:18px;background:rgba(6,18,37,.52)}
.presentationPlacementBefore{display:grid;grid-template-rows:82px minmax(0,1fr);padding:20px}
.presentationPlacementBefore>header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:2px solid var(--pc-line)}
.presentationPlacementBefore>header strong,.presentationPlacementBefore>header span{font-size:34px;white-space:nowrap}
.presentationPlacementBefore>header span{color:var(--pc-cyan);font-weight:800}
.presentationPlacementBefore>div{min-height:0;display:grid;grid-template-rows:repeat(4,minmax(0,1fr));gap:10px;padding-top:14px}
.presentationPlacementBefore>div>div{display:grid;grid-template-columns:204px minmax(0,1fr) 104px 200px;gap:12px;align-items:center;padding:12px 14px;border:2px solid rgba(90,166,255,.14);border-radius:13px;background:rgba(11,27,49,.62)}
.presentationPlacementBefore>div>div.is-hidden{border-color:rgba(233,196,106,.34);background:rgba(233,196,106,.05)}
.presentationPlacementBefore>div strong,.presentationPlacementBefore>div b,.presentationPlacementBefore>div small{font-size:34px;white-space:nowrap}
.presentationPlacementBefore>div>div>span{height:58px;overflow:hidden;border:2px solid rgba(90,166,255,.2);border-radius:10px;background:rgba(5,17,34,.75)}
.presentationPlacementBefore>div>div>span i{width:var(--presentation-placement-width);height:100%;display:block;border-radius:8px;background:linear-gradient(90deg,var(--pc-blue),var(--pc-cyan))}
.presentationPlacementBefore>div>div.is-hidden>span i{background:linear-gradient(90deg,rgba(90,166,255,.4),rgba(167,181,198,.34))}
.presentationPlacementBefore>div small{color:var(--pc-cyan);font-weight:800;text-align:right}
.presentationPlacementBefore>div .is-hidden small{color:var(--pc-amber)}
.presentationPlacementFilterGate{display:grid;place-content:center;justify-items:center;gap:16px;color:var(--pc-cyan);text-align:center}
.presentationPlacementFilterGate svg{width:56px;height:56px}
.presentationPlacementFilterGate strong{font-size:34px;line-height:1.08}
.presentationPlacementFilterGate span{font-size:58px}
.presentationPlacementResult{display:grid;grid-template-rows:82px minmax(0,1fr) 112px;padding:20px}
.presentationPlacementResult>header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:2px solid var(--pc-line)}
.presentationPlacementResult>header strong,.presentationPlacementResult>header span{font-size:34px}
.presentationPlacementResult>header span{color:var(--pc-cyan);font-weight:800}
.presentationPlacementResult>div{min-height:0;display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:14px;padding-block:18px}
.presentationPlacementResult>div>div{min-width:0;display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:14px;align-items:center;padding:20px;border:2px solid rgba(39,213,209,.48);border-radius:16px;background:rgba(39,213,209,.08)}
.presentationPlacementResult svg{width:44px;height:44px;color:var(--pc-cyan)}
.presentationPlacementResult>div span{min-width:0;display:grid;gap:5px}
.presentationPlacementResult>div strong,.presentationPlacementResult>div small,.presentationPlacementResult>div b{font-size:34px;white-space:nowrap}
.presentationPlacementResult>div small{color:var(--pc-muted);font-weight:760}
.presentationPlacementResult>div b{font-size:40px}
.presentationPlacementResult footer{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:2px solid var(--pc-line)}
.presentationPlacementResult footer small,.presentationPlacementResult footer strong{font-size:34px}
.presentationPlacementResult footer small{color:var(--pc-muted);font-weight:760}
.presentationPlacementResult footer strong{color:var(--pc-cyan)}
.presentationPlacementTruth{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 24px;border:2px solid rgba(233,196,106,.5);border-radius:16px;background:linear-gradient(90deg,rgba(233,196,106,.09),rgba(39,213,209,.07))}
.presentationPlacementTruth strong,.presentationPlacementTruth span{font-size:36px}
.presentationPlacementTruth strong{color:var(--pc-amber)}
.presentationPlacementTruth span{color:var(--pc-cyan);font-weight:800}

.presentationRawPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 180px 90px minmax(0,1fr);padding:32px}
.presentationRawMatch{display:grid;grid-template-columns:1fr 70px 1fr;gap:18px;align-items:center;padding:20px 0}
.presentationRawMatch>div{height:140px;display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;place-content:center;justify-items:center;gap:5px;padding:14px 22px;border:2px solid var(--pc-border);border-radius:16px;background:rgba(6,18,37,.58);text-align:center}
.presentationRawMatch>div:last-child{border-color:rgba(39,213,209,.6);background:rgba(39,213,209,.08)}
.presentationRawMatch small{color:var(--pc-muted);font-size:34px;font-weight:780}
.presentationRawMatch strong{font-size:42px;white-space:nowrap}
.presentationRawMatch span{color:var(--pc-cyan);font-size:34px;font-weight:780;white-space:nowrap}
.presentationRawMatch>i{color:var(--pc-cyan);font-size:54px;font-style:normal;text-align:center}
.presentationRawHeader,.presentationRawRow{display:grid;grid-template-columns:155px 220px 280px 320px 230px 95px;gap:14px;align-items:center}
.presentationRawHeader{padding:0 12px;border-bottom:2px solid var(--pc-line);color:var(--pc-muted);font-size:34px;font-weight:760;line-height:1.08;text-align:left}
.presentationRawHeader span:last-child{text-align:right}
.presentationRawRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px;padding-top:14px}
.presentationRawRow{padding:12px;border:2px solid rgba(90,166,255,.13);border-radius:14px;background:rgba(6,18,37,.48)}
.presentationRawRow>strong{font-size:36px;white-space:nowrap}
.presentationRawRow>strong:last-child{text-align:right}
.presentationRawRow>span{min-width:0;display:grid;gap:8px;overflow:hidden}
.presentationRawRow>span>b,.presentationRawRow>span>small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationRawRow>span>b{font-size:36px}
.presentationRawRow>span>small{color:var(--pc-muted);font-size:34px;font-weight:700}
.presentationRawRow>span:nth-child(3){font-size:34px;font-weight:760;white-space:nowrap}
.presentationRawRow>span:nth-child(4)>b,.presentationRawRow>span:nth-child(5)>b{font-size:34px}

.presentationAccessPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px minmax(0,1fr);padding:34px}
.presentationAccessCards{min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-top:24px}
.presentationAccessCards article{min-width:0;display:grid;grid-template-rows:132px 70px minmax(0,1fr) 76px;padding:28px;border:2px solid var(--pc-border);border-radius:20px;background:rgba(6,18,37,.58)}
.presentationAccessCards article.is-admin{border-color:rgba(39,213,209,.64);background:linear-gradient(180deg,rgba(39,213,209,.1),rgba(6,18,37,.66))}
.presentationAccessCards header{min-width:0;display:flex;align-items:center;gap:18px;border-bottom:2px solid var(--pc-line)}
.presentationAccessCards header>span{width:64px;height:64px;display:grid;place-items:center;flex:0 0 auto;border:2px solid var(--pc-border);border-radius:16px;color:var(--pc-blue)}
.presentationAccessCards article.is-admin header>span{border-color:rgba(39,213,209,.6);color:var(--pc-cyan)}
.presentationAccessCards header svg{width:38px;height:38px}
.presentationAccessCards header>div{min-width:0;display:grid;gap:7px}
.presentationAccessCards header strong,.presentationAccessCards header small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationAccessCards header strong{font-size:38px}
.presentationAccessCards header small{color:var(--pc-muted);font-size:34px;font-weight:700}
.presentationAccessBadges{display:flex;align-items:center;gap:12px}
.presentationAccessBadges b,.presentationAccessBadges span{padding:8px 12px;border:2px solid var(--pc-border);border-radius:999px;font-size:34px}
.presentationAccessBadges b{color:#bcdcff;background:rgba(90,166,255,.12)}
.presentationAccessCards article.is-admin .presentationAccessBadges b{border-color:rgba(39,213,209,.52);color:#a6f2ef;background:rgba(39,213,209,.1)}
.presentationAccessBadges span{color:var(--pc-green)}
.presentationAccessCards dl{margin:0;display:grid;align-content:center;gap:22px}
.presentationAccessCards dl>div{display:grid;grid-template-columns:1fr auto;gap:14px;padding-bottom:16px;border-bottom:2px solid rgba(90,166,255,.18)}
.presentationAccessCards dt,.presentationAccessCards dd{margin:0;font-size:34px;font-weight:760;white-space:nowrap}
.presentationAccessCards dt{color:var(--pc-muted)}
.presentationAccessCards dd{color:var(--pc-text)}
.presentationAccessCards footer{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationAccessCards footer span{white-space:nowrap}

.presentationSavedPanel{height:100%;min-width:0;display:grid;grid-template-rows:80px 88px 150px minmax(0,1fr);padding:34px}
.presentationSavedPeriod{display:grid;grid-template-columns:64px 330px minmax(0,1fr);gap:20px;align-items:center;margin-block:16px;padding:18px 24px;border:2px solid rgba(39,213,209,.48);border-radius:16px;background:linear-gradient(90deg,rgba(39,143,255,.12),rgba(39,213,209,.08))}
.presentationSavedPeriod>svg{width:50px;height:50px;color:var(--pc-cyan)}
.presentationSavedPeriod>span{display:grid;gap:6px}
.presentationSavedPeriod small{color:var(--pc-muted);font-size:34px;font-weight:760}
.presentationSavedPeriod strong{font-size:40px}
.presentationSavedPeriod>b{justify-self:end;color:var(--pc-cyan);font-size:36px}
.presentationSavedRows{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px;padding-top:16px}
.presentationSavedRows article{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 120px;grid-template-rows:auto 54px;gap:12px 18px;padding:18px 22px;border:2px solid rgba(90,166,255,.2);border-radius:16px;background:rgba(6,18,37,.5)}
.presentationSavedRows header{min-width:0;grid-column:1;grid-row:1;display:block}
.presentationSavedRows header>div{min-width:0;display:grid;gap:6px}
.presentationSavedRows header strong,.presentationSavedRows header span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presentationSavedRows header strong{font-size:38px}
.presentationSavedRows header span{color:var(--pc-muted);font-size:34px;font-weight:720}
.presentationSavedRows button{grid-column:2;grid-row:1/3;align-self:center;height:64px;padding:0 14px;border:2px solid rgba(39,213,209,.55);border-radius:10px;color:var(--pc-cyan);background:rgba(39,213,209,.09);font:inherit;font-size:34px;font-weight:820}
.presentationSavedRows article>div{min-width:0;grid-column:1;grid-row:2;display:flex;align-items:center;gap:8px;overflow:hidden}
.presentationSavedRows article>div>span{height:48px;display:inline-flex;align-items:center;flex:0 0 auto;padding:0 10px;border:2px solid rgba(90,166,255,.25);border-radius:999px;color:var(--pc-muted);background:rgba(90,166,255,.07);font-size:34px;font-weight:760;white-space:nowrap}

@media(max-width:1000px){.presentationCaseReviewPage{padding:18px}
.presentationCaseSwitcher{grid-template-columns:repeat(2,minmax(0,1fr))}
.presentationCaseContext{grid-template-columns:1fr}
.presentationCaseContextChips{justify-content:flex-start}
.presentationCaseStageMeta{grid-template-columns:1fr auto}
.presentationCaseStageMeta>span:nth-child(2){grid-column:1;grid-row:2;text-align:left}
.presentationCaseStageMeta>span:nth-child(3){grid-column:2;grid-row:1}
.presentationCaptureButton{grid-column:2;grid-row:2}
}

@media(max-width:620px){.presentationCaseToolbarBrand img{display:none}
.presentationCaseSwitcher{grid-template-columns:1fr}
.presentationCaseStageMeta{grid-template-columns:1fr}
.presentationCaseStageMeta>span:nth-child(2),.presentationCaseStageMeta>span:nth-child(3),.presentationCaptureButton{grid-column:1;grid-row:auto;justify-self:start}
}

@media print{.presentationCaseReviewPage{min-height:0;padding:0;background:transparent}
.presentationCaseToolbar,.presentationCaseContext,.presentationCaseStageMeta{display:none}
.presentationCaseStage{margin:0}
.presentationCaseViewport{overflow:visible;padding:0}
}
