@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/fonts/bricolage-grotesque.woff2") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

/* Local subsets keep the UI consistent without sending every script to every user. */
@font-face {
  font-family: "GramLead Noto Sans";
  src: url("/fonts/noto-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 75% 100%;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "GramLead Noto Sans";
  src: url("/fonts/noto-sans-latin-ext.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 75% 100%;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "GramLead Noto Sans";
  src: url("/fonts/noto-sans-khmer.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 100%;
  font-display: swap;
  unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC;
}

:root {
  color-scheme: only light;
  --tg-theme-bg-color: #ffffff !important;
  --tg-theme-secondary-bg-color: #f3f5f7 !important;
  --tg-theme-section-bg-color: #ffffff !important;
  --tg-theme-text-color: #17181a !important;
  --tg-theme-hint-color: #6d7278 !important;
  --tg-theme-link-color: #168acd !important;
  --tg-theme-button-color: #2aabee !important;
  --tg-theme-button-text-color: #ffffff !important;
  --tg-theme-section-separator-color: #e2e5e9 !important;
  --blue: #2aabee;
  --blue-strong: #168acd;
  --green: #28a745;
  --red: #df3c46;
  --fallback-page-bg: #f3f5f7;
  --fallback-section-bg: #ffffff;
  --fallback-text: #17181a;
  --fallback-hint: #6d7278;
  --fallback-separator: #e2e5e9;
  --badge-radius: 0.3rem;
  --app-background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg));
  color: var(--tg-theme-text-color, var(--fallback-text));
  background: var(--app-background);
  --font-interface: "GramLead Noto Sans", "Noto Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Bricolage Grotesque", var(--font-interface);
  font-family: var(--font-interface);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
html { font-size: clamp(14px, calc(11px + 0.7svh), 16px); }
html, body { width: 100%; min-width: 320px; min-height: 100%; margin: 0; }
body { min-height: 100svh; overflow: hidden; background: var(--app-background); }
button, input { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
:where(button, a, input, select, textarea):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 62%, white);
  outline-offset: 2px;
}
.app-shell { display: flex; height: 100svh; min-height: 0; overflow: hidden; flex-direction: column; background: var(--app-background); }

.app-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: calc(clamp(3.4rem, 8.5svh, 4rem) + env(safe-area-inset-top));
  padding: calc(clamp(0.45rem, 1.4svh, 0.65rem) + env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) clamp(0.45rem, 1.4svh, 0.65rem) max(1rem, env(safe-area-inset-left));
  align-items: center;
  border-bottom: 0;
  background: var(--app-background);
  box-shadow: none;
}

.brand {
  display: inline-flex;
  min-width: 0;
  padding: 0;
  align-items: center;
  gap: 0.5rem;
  border: 0;
  color: inherit;
  background: transparent;
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 720;
  letter-spacing: -0.06em;
  line-height: 1;
  cursor: pointer;
}
.brand img { display: block; width: 2.25rem; height: 2.25rem; flex: 0 0 2.25rem; object-fit: contain; }
.header-controls { display: flex; margin-left: auto; align-items: center; gap: 0.1rem; }
.header-language,
.header-settings {
  display: inline-flex;
  width: 2.75rem;
  min-width: 2.75rem;
  height: 2.75rem;
  margin-left: 0;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  color: var(--tg-theme-hint-color, var(--fallback-hint));
  background: transparent;
  cursor: pointer;
}
.header-language img { display: block; width: 1.75rem; height: 1.3125rem; border-radius: 0.18rem; object-fit: cover; box-shadow: none; }
.header-settings[hidden] { display: none; }
.header-settings.active { color: var(--tg-theme-link-color, var(--blue-strong)); background: color-mix(in srgb, var(--blue) 9%, white); }
.header-settings-icon { display: block; width: 1.45rem; height: 1.45rem; background: currentColor; -webkit-mask: url("/assets/ui-settings.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-settings.webp?v=20260809-153") center / contain no-repeat; }

.app-main { width: 100%; min-height: 0; max-width: 42rem; margin: 0 auto; padding: clamp(0.7rem, 2.2svh, 1.25rem) max(1rem, env(safe-area-inset-right)) clamp(0.45rem, 1.5svh, 1rem) max(1rem, env(safe-area-inset-left)); flex: 1; overflow-y: auto; overscroll-behavior: contain; }
.app-footer {
  display: flex;
  padding: clamp(0.25rem, 0.8svh, 0.5rem) 1rem calc(clamp(0.4rem, 1.2svh, 0.75rem) + env(safe-area-inset-bottom));
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(0.15rem, 0.5svh, 0.3rem);
  color: var(--tg-theme-hint-color, var(--fallback-hint));
  font-size: 0.78rem;
}
.footer-art-frame {
  position: relative;
  width: min(90vw, 30rem);
  aspect-ratio: 3.115 / 1;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
.footer-art {
  position: absolute;
  top: -45.5%;
  left: 50%;
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.82;
  transform: translateX(-50%);
  pointer-events: none;
  user-select: none;
}
.footer-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
}
.app-footer button { padding: 0; border: 0; color: var(--tg-theme-link-color, var(--blue-strong)); background: none; cursor: pointer; }
.brand, .footer-links button, .text-button, .settings-row-action,
.lead-card-actions button, .crm-decision-button, .crm-close-button {
  min-height: 2.75rem;
}
.footer-links button { min-width: 2.75rem; padding: 0.7rem 0.2rem; }

.app-footer.workspace-navigation {
  min-height: calc(4.4rem + env(safe-area-inset-bottom));
  padding: 0 0 calc(0.35rem + env(safe-area-inset-bottom));
  border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  background: var(--tg-theme-section-bg-color, var(--fallback-section-bg));
  gap: 0;
}
.subscription-warning {
  display: grid;
  width: min(100%, 42rem);
  padding: 0.55rem max(0.7rem, env(safe-area-inset-right)) 0.55rem max(0.7rem, env(safe-area-inset-left));
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.48rem;
  color: #fff;
  background: #c93643;
  font-size: 0.68rem;
  font-weight: 750;
  line-height: 1.25;
}
.subscription-warning-icon { width: 1.2rem; height: 1.2rem; background: currentColor; -webkit-mask: url("/assets/ui-warning.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-warning.webp?v=20260809-153") center / contain no-repeat; }
.subscription-warning button { display: inline-flex; min-height: 2rem; padding: 0.35rem 0.62rem; align-items: center; gap: 0.3rem; border: 0; border-radius: 0.45rem; color: #9f202d; background: #fff; font-size: 0.67rem; font-weight: 850; cursor: pointer; }
.subscription-cta-icon { display: inline-block; width: 1rem; height: 1rem; flex: 0 0 1rem; background: currentColor; -webkit-mask: url("/assets/ui-stars-v1.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-stars-v1.webp?v=20260809-153") center / contain no-repeat; }
.workspace-nav-list {
  display: grid;
  width: min(100%, 42rem);
  padding: 0.35rem max(0.45rem, env(safe-area-inset-right)) 0 max(0.45rem, env(safe-area-inset-left));
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.1rem;
}
.app-footer .workspace-nav-button {
  display: flex;
  min-width: 0;
  min-height: 3.45rem;
  padding: 0.3rem 0.1rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.18rem;
  border-radius: 0.7rem;
  color: color-mix(in srgb, var(--tg-theme-text-color, var(--fallback-text)) 72%, white);
  opacity: 0.82;
}
.app-footer .workspace-nav-button.active { color: var(--tg-theme-link-color, var(--blue-strong)); opacity: 1; }
.workspace-nav-icon {
  display: block;
  width: 1.35rem;
  height: 1.35rem;
  flex: 0 0 1.35rem;
  background: currentColor;
  -webkit-mask: var(--workspace-icon) center / contain no-repeat;
  mask: var(--workspace-icon) center / contain no-repeat;
}
.workspace-nav-icon--actions, .crm-page-icon--actions { --workspace-icon: url("/assets/nav-actions-v2.webp?v=20260809-153"); }
.workspace-nav-icon--leads, .crm-page-icon--leads { --workspace-icon: url("/assets/nav-leads.webp?v=20260809-153"); }
.workspace-nav-icon--pipeline, .crm-page-icon--pipeline { --workspace-icon: url("/assets/nav-pipeline-v2.webp?v=20260809-153"); }
.workspace-nav-icon--decisions, .crm-page-icon--decisions { --workspace-icon: url("/assets/nav-decisions.webp?v=20260809-153"); }
.workspace-nav-icon--reports, .crm-page-icon--reports { --workspace-icon: url("/assets/nav-reports-v2.webp?v=20260809-153"); }
.crm-page-icon--settings { --workspace-icon: url("/assets/ui-settings.webp?v=20260809-153"); }
.workspace-nav-label {
  overflow: hidden;
  max-width: 100%;
  font-size: 0.59rem;
  font-weight: 700;
  line-height: 1.12;
  text-align: center;
  white-space: normal;
}

.app-footer.mode-transition-footer {
  min-height: calc(2.35rem + env(safe-area-inset-bottom));
  padding: 0.35rem 1rem calc(0.35rem + env(safe-area-inset-bottom));
  border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  background: var(--tg-theme-section-bg-color, var(--fallback-section-bg));
}

.clean-slate-empty { min-height: 1px; }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); letter-spacing: -0.035em; }
h1 { margin-bottom: 0.55rem; font-size: clamp(1.75rem, 7vw, 2.35rem); line-height: 1.03; }
h2 { margin-bottom: 0.35rem; font-size: 1.35rem; }
h3 { margin-bottom: 0.2rem; font-size: 1.03rem; }
.lead { max-width: 31rem; margin-bottom: 1.35rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); line-height: 1.55; }
.eyebrow { margin-bottom: 0.45rem; color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 0.73rem; font-weight: 750; letter-spacing: 0.09em; text-transform: uppercase; }
.muted, .helper { color: var(--tg-theme-hint-color, var(--fallback-hint)); }
.helper { margin: 0.6rem 0 0; font-size: 0.8rem; line-height: 1.45; }

.panel, .loading-card, .notice {
  border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  border-radius: 1.15rem;
  background: var(--tg-theme-section-bg-color, var(--tg-theme-bg-color, var(--fallback-section-bg)));
  box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.035);
}
.panel { padding: 1rem; }
.panel + .panel { margin-top: 0.8rem; }
.loading-card { display: flex; min-height: 10rem; align-items: center; justify-content: center; flex-direction: column; gap: 0.8rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); }
.loading-card p { margin: 0; }
.spinner { width: 1.55rem; height: 1.55rem; border: 0.18rem solid color-mix(in srgb, var(--blue) 24%, transparent); border-top-color: var(--blue); border-radius: 50%; animation: spin 0.75s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.choice-grid { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.choice-card { min-height: 8.5rem; padding: 1rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1rem; color: inherit; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); text-align: left; cursor: pointer; }
.choice-card:active { transform: scale(0.985); }
.choice-icon { display: grid; width: 2.5rem; height: 2.5rem; margin-bottom: 1rem; place-items: center; border-radius: 0.8rem; background: color-mix(in srgb, var(--blue) 14%, transparent); color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 1.25rem; font-weight: 800; }
.choice-card strong { display: block; margin-bottom: 0.25rem; }
.choice-card span:last-child { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.78rem; line-height: 1.4; }
.choice-card--illustrated { position: relative; display: flex; min-height: 6.3rem; padding: 0.8rem 47% 0.8rem 1rem; align-items: center; overflow: hidden; isolation: isolate; }
.choice-copy { position: relative; z-index: 1; display: block; }
.choice-copy > span { display: block; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.78rem; line-height: 1.4; }
.choice-art { position: absolute; z-index: 0; right: 0.2rem; bottom: -0.35rem; width: 46%; height: 106%; object-fit: contain; object-position: right bottom; opacity: 0.9; pointer-events: none; user-select: none; }
.choice-art--join { right: 0.35rem; width: 48%; height: 102%; }

.intro-carousel {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  overflow: hidden;
  text-align: center;
  touch-action: pan-y;
}
.app-main.intro-active { overflow: hidden; }
.intro-scale-content { width: min(100%, 26rem); margin: 0 auto; transform: scale(var(--intro-fit-scale, 1)); transform-origin: top center; }
.intro-carousel:focus-visible { outline: 3px solid color-mix(in srgb, var(--blue) 62%, white); outline-offset: 0.2rem; }
.intro-slides { display: grid; }
.intro-page {
  grid-area: 1 / 1;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transform: translateX(0.65rem);
  transition: opacity 180ms ease, transform 180ms ease;
  pointer-events: none;
}
.intro-page.active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  pointer-events: auto;
}
.intro-page--setup, .intro-page--security { display: flex; flex-direction: column; }
.intro-page--setup .intro-benefit, .intro-page--security .intro-benefit { margin-top: auto; }
.intro-page h1 { max-width: 24rem; margin: 0 auto 0.55rem; }
.intro-eyebrow { margin-bottom: 0.55rem; }
.intro-lead {
  max-width: 25rem;
  margin: 0 auto 1.1rem;
  color: var(--tg-theme-hint-color, var(--fallback-hint));
  font-size: 0.88rem;
  line-height: 1.45;
}
.intro-journey {
  position: relative;
  display: grid;
  margin: 0;
  padding: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  list-style: none;
}
.intro-journey::before {
  position: absolute;
  top: 1.65rem;
  right: 10%;
  left: 10%;
  height: 0.16rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--blue) 62%, white);
  content: "";
}
.intro-stage {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 0;
  justify-items: center;
  gap: 0.35rem;
  color: var(--tg-theme-text-color, var(--fallback-text));
  font-size: 0.66rem;
  font-weight: 750;
}
.intro-stage-icon {
  display: grid;
  width: 3.35rem;
  height: 3.35rem;
  place-items: center;
  border: 0.14rem solid color-mix(in srgb, var(--blue) 72%, white);
  border-radius: 50%;
  background: white;
  box-shadow: 0 0.35rem 0.9rem rgb(0 0 0 / 0.05);
}
.intro-stage-icon svg, .intro-feature svg, .intro-mini-icon svg {
  width: 1.8rem;
  height: 1.8rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.intro-icon-accent { stroke: var(--blue-strong); stroke-width: 2.4; }
.intro-automation {
  display: grid;
  margin: 0.8rem auto 0;
  justify-items: center;
}
.intro-feature-grid {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
}
.intro-owner-art {
  display: block;
  width: clamp(9.7rem, 40vw, 12rem);
  height: auto;
  margin: 0.3rem auto -0.65rem;
  pointer-events: none;
  user-select: none;
}
.intro-feature {
  display: grid;
  min-width: 0;
  min-height: 4.9rem;
  padding: 0.6rem 0.25rem;
  place-items: center;
  align-content: center;
  gap: 0.25rem;
  border: 1px solid color-mix(in srgb, var(--blue) 28%, white);
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--blue) 10%, white);
  color: var(--blue-strong);
  box-shadow: 0 0.6rem 1.2rem rgb(0 0 0 / 0.06);
  font-size: 0.64rem;
  font-weight: 800;
  line-height: 1.2;
}
.intro-feature--notification { transform: rotate(-2deg); }
.intro-feature--report { transform: rotate(2deg); }
.intro-benefit { margin: 0.2rem 0 0.7rem; font-size: 0.85rem; font-weight: 800; }
.intro-cta { width: min(100%, 24rem); margin: 0 auto; }
.intro-pagination { display: flex; margin-top: 0.65rem; align-items: center; justify-content: center; gap: 0.05rem; }
.intro-pagination button { display: grid; width: 2rem; height: 1.25rem; padding: 0; place-items: center; border: 0; background: transparent; cursor: pointer; }
.intro-pagination button span { width: 0.34rem; height: 0.34rem; border-radius: 50%; background: color-mix(in srgb, var(--blue) 20%, white); transition: width 160ms ease, background 160ms ease; }
.intro-pagination button.active span { width: 1.1rem; border-radius: 999px; background: var(--blue); }
.intro-pagination button:focus-visible { outline: none; }
.intro-pagination button:focus-visible span { box-shadow: 0 0 0 0.16rem white, 0 0 0 0.3rem color-mix(in srgb, var(--blue) 62%, white); }

.intro-minute-visual {
  position: relative;
  display: grid;
  width: 8rem;
  height: 8rem;
  margin: 0.2rem auto 0.65rem;
  place-items: center;
  color: var(--blue-strong);
}
.intro-minute-visual img { position: absolute; width: 120%; max-width: none; height: 120%; object-fit: contain; }
.intro-time-badge { width: fit-content; margin: -0.45rem auto 0.55rem; padding: 0.35rem 0.7rem; border: 1px solid color-mix(in srgb, var(--blue) 38%, white); border-radius: 999px; color: var(--blue-strong); background: color-mix(in srgb, var(--blue) 10%, white); font-size: 0.7rem; font-weight: 850; line-height: 1; }
.intro-setup-steps {
  position: relative;
  display: grid;
  margin: 0 0 0.65rem;
  padding: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  list-style: none;
}
.intro-setup-steps::before { position: absolute; top: 1.35rem; right: 14%; left: 14%; height: 0.12rem; background: color-mix(in srgb, var(--blue) 42%, white); content: ""; }
.intro-setup-steps li { position: relative; display: grid; min-width: 0; justify-items: center; gap: 0.3rem; font-size: 0.65rem; font-weight: 800; line-height: 1.15; }
.intro-mini-icon { position: relative; z-index: 1; display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: 1px solid color-mix(in srgb, var(--blue) 38%, white); border-radius: 50%; background: white; color: var(--blue-strong); }
.intro-mini-icon svg { width: 1.5rem; height: 1.5rem; }
.intro-ready-icon .intro-icon-accent { stroke: var(--green); }
.intro-setup-pills { display: flex; margin-bottom: 0.65rem; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.4rem; }
.intro-setup-pills span { padding: 0.38rem 0.6rem; border: 1px solid color-mix(in srgb, var(--blue) 25%, white); border-radius: 999px; color: var(--blue-strong); background: color-mix(in srgb, var(--blue) 8%, white); font-size: 0.62rem; font-weight: 800; }
.intro-audience { max-width: 25rem; margin-inline: auto; line-height: 1.35; }

.intro-shield { display: grid; width: 8.3rem; height: 8.6rem; margin: 0.2rem auto 0.55rem; place-items: center; color: var(--blue-strong); }
.intro-shield img { width: 135%; max-width: none; height: 135%; object-fit: contain; }
.intro-security-grid { display: grid; margin: 0 auto 0.7rem; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.55rem; }
.intro-security-grid > div { display: grid; min-width: 0; min-height: 5.3rem; padding: 0.55rem 0.2rem; place-items: center; align-content: center; gap: 0.35rem; border: 1px solid color-mix(in srgb, var(--blue) 24%, white); border-radius: 0.9rem; background: white; box-shadow: 0 0.6rem 1.2rem rgb(0 0 0 / 0.05); color: var(--blue-strong); font-size: 0.64rem; line-height: 1.15; }
.intro-security-grid .intro-mini-icon { width: 2.25rem; height: 2.25rem; border: 0; background: color-mix(in srgb, var(--blue) 10%, white); }
.intro-security-grid .intro-mini-icon svg { width: 1.35rem; height: 1.35rem; }

@media (prefers-reduced-motion: reduce) {
  .intro-page, .intro-pagination button span { transition: none; }
}

.field { display: grid; margin-bottom: 1rem; gap: 0.42rem; }
.field > span { font-size: 0.8rem; font-weight: 700; }
.field input { width: 100%; min-height: 3rem; padding: 0.75rem 0.85rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.8rem; outline: none; color: inherit; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.field input:focus { border-color: var(--tg-theme-button-color, var(--blue)); box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--blue) 14%, transparent); }
.legal-note { margin: 0.7rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.4; text-align: center; }
.legal-note button { padding: 0; border: 0; color: var(--tg-theme-link-color, var(--blue-strong)); background: transparent; cursor: pointer; }

.button-row { display: flex; margin-top: 1rem; gap: 0.65rem; }
.button { display: inline-flex; min-height: 2.9rem; padding: 0.72rem 1rem; align-items: center; justify-content: center; border: 0; border-radius: 0.82rem; background: var(--tg-theme-button-color, var(--blue)); color: var(--tg-theme-button-text-color, white); font-weight: 750; text-decoration: none; cursor: pointer; }
.button.secondary { border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); color: var(--tg-theme-text-color, var(--fallback-text)); }
.button.block { width: 100%; }
.button:disabled { cursor: not-allowed; opacity: 0.48; }
.button-row .button { flex: 1; }
.button-with-icon { gap: 0.42rem; }
.ui-icon, .connection-status-icon { display: inline-block; width: 1.15rem; height: 1.15rem; flex: 0 0 1.15rem; background: currentColor; -webkit-mask: var(--icon-mask) center / contain no-repeat; mask: var(--icon-mask) center / contain no-repeat; }
.ui-icon--shuttle { --icon-mask: url("/assets/ui-shuttle.webp?v=20260809-153"); }
.ui-icon--setup { --icon-mask: url("/assets/ui-setup.webp?v=20260809-153"); }
.ui-icon--recheck { --icon-mask: url("/assets/ui-recheck.webp?v=20260809-153"); }
.recheck-status { margin: 0.7rem 0 0; color: var(--green); font-size: 0.76rem; font-weight: 650; text-align: center; }
.text-button { padding: 0; border: 0; color: var(--tg-theme-link-color, var(--blue-strong)); background: none; font-weight: 700; cursor: pointer; }

.workspace-head { display: flex; margin-bottom: 1rem; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.workspace-head > div { min-width: 0; }
.workspace-head h1 { margin-bottom: 0.2rem; }
.workspace-create-button { min-height: 2.35rem; padding: 0.5rem 0.75rem; align-self: center; white-space: nowrap; }
.setup-instructions small { color: var(--fallback-hint); font-size: 0.66rem; line-height: 1.4; }
.setup-instructions code { padding: 0.06rem 0.22rem; border-radius: 0.3rem; color: #126da9; background: #eaf7ff; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.62rem; }
.confirmation-ready { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.75rem 0.82rem; border: 1px solid #a9dfc0; border-radius: 0.9rem; background: #eefaf3; }
.confirmation-ready > span { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; flex: 0 0 auto; border-radius: 999px; color: white; background: #20a75a; font-weight: 900; }
.confirmation-ready strong { display: block; font-size: 0.78rem; }
.confirmation-ready p { margin: 0.15rem 0 0; color: var(--fallback-hint); font-size: 0.67rem; line-height: 1.4; }
.confirmation-ready.warning { border-color: #ead5aa; background: #fff8e9; }
.confirmation-ready.warning > span { background: #c98920; }
.transition-lock-note { margin: 0; text-align: center; }
.cancel-transition { justify-self: center; margin: 0.1rem 0 0.4rem; color: var(--fallback-hint); font-size: 0.7rem; }
.impact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; margin: 0.75rem 0; }
.impact-row { display: grid; align-content: center; min-height: 4.4rem; padding: 0.55rem 0.4rem; border: 1px solid var(--fallback-separator); border-radius: 0.75rem; background: #f8f9fa; text-align: center; }
.impact-row strong { font-size: 1.05rem; }
.impact-row span { color: var(--fallback-hint); font-size: 0.58rem; line-height: 1.3; }
.badge { display: inline-flex; padding: 0.3rem 0.52rem; align-items: center; border: 1px solid color-mix(in srgb, var(--blue) 28%, white); border-radius: var(--badge-radius); background: color-mix(in srgb, var(--blue) 10%, white); color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 0.7rem; font-weight: 800; text-transform: uppercase; }
.stepper { display: flex; margin-bottom: 1rem; align-items: center; gap: 0.45rem; }
.step-dot { height: 0.34rem; flex: 1; border-radius: 999px; background: var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.step-dot.active { background: var(--tg-theme-button-color, var(--blue)); }

.checklist { margin: 0.85rem 0 0; padding: 0; list-style: none; }
.check { display: flex; min-height: 2.7rem; padding: 0.55rem 0; align-items: center; gap: 0.7rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.check:first-child { border-top: 0; }
.check-mark { display: grid; width: 1.45rem; height: 1.45rem; flex: 0 0 1.45rem; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--red) 11%, transparent); color: var(--red); font-size: 0.78rem; font-weight: 900; }
.check.done .check-mark { background: color-mix(in srgb, var(--green) 13%, transparent); color: var(--green); }
.check span:last-child { font-size: 0.86rem; font-weight: 620; }
.locked-panel { opacity: 0.58; }
.success { padding: 1.15rem; border: 1px solid color-mix(in srgb, var(--green) 35%, transparent); border-radius: 1rem; background: color-mix(in srgb, var(--green) 8%, var(--tg-theme-section-bg-color, white)); }
.success-icon { display: grid; width: 2.7rem; height: 2.7rem; margin-bottom: 0.8rem; place-items: center; border-radius: 50%; background: var(--green); color: white; font-size: 1.25rem; font-weight: 900; }
.workspace-ready-notice { animation: ready-in 180ms ease-out; }
.today-head { margin-bottom: 0.8rem; }
.today-date { margin: -0.1rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; }
.today-summary {
  display: grid;
  margin-bottom: 1rem;
  padding: 0.2rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  border-radius: 1rem;
  background: var(--tg-theme-section-bg-color, var(--fallback-section-bg));
  box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.03);
}
.today-summary-item {
  display: flex;
  min-width: 0;
  min-height: 3.7rem;
  padding: 0.45rem 0.15rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.12rem;
  border-left: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  text-align: center;
}
.today-summary-item:first-child { border-left: 0; }
.today-summary-item strong { font-family: var(--font-display); font-size: 1.35rem; line-height: 1; }
.today-summary-item span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.64rem; line-height: 1.15; }
.today-summary-item.danger strong { color: var(--red); }
.today-actions {
  overflow: hidden;
  border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  border-radius: 1.1rem;
  background: var(--tg-theme-section-bg-color, var(--fallback-section-bg));
  box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.03);
}
.today-section-head { display: flex; padding: 0.85rem 1rem; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.today-section-head h2 { margin: 0; font-size: 1.05rem; }
.today-section-head span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.72rem; font-weight: 700; }
.today-empty-state { padding: clamp(1.25rem, 4svh, 2rem) 1.2rem; text-align: center; }
.today-empty-icon { display: grid; width: 2.6rem; height: 2.6rem; margin: 0 auto 0.7rem; place-items: center; border-radius: 50%; color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); font-size: 1.15rem; font-weight: 900; }
.today-empty-state h3 { margin-bottom: 0.3rem; }
.today-empty-state p { max-width: 24rem; margin: 0 auto; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; line-height: 1.5; }
.today-learning-note { display: flex; margin-top: 0.75rem; padding: 0.75rem 0.85rem; align-items: flex-start; gap: 0.65rem; border-radius: 0.9rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); background: color-mix(in srgb, var(--blue) 7%, transparent); }
.today-learning-note > span { color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 1rem; }
.today-learning-note p { margin: 0; font-size: 0.76rem; line-height: 1.45; }
.today-learning-note strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.action-card-list { padding: 0.35rem 0.85rem 0.85rem; }
.action-card { padding: 0.85rem 0; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.action-card:first-child { border-top: 0; }
.action-card.overdue { border-left: 0.18rem solid var(--red); padding-left: 0.7rem; }
.action-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.65rem; }
.action-card-head h3 { margin: 0.12rem 0 0; font-size: 0.9rem; line-height: 1.25; }
.action-customer { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.67rem; font-weight: 700; }
.action-due { flex: 0 0 auto; max-width: 42%; padding: 0.2rem 0.38rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: var(--badge-radius); color: var(--tg-theme-hint-color, var(--fallback-hint)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font-size: 0.59rem; font-weight: 750; line-height: 1.2; text-align: right; }
.action-due.overdue { border-color: color-mix(in srgb, var(--red) 30%, white); color: var(--red); background: color-mix(in srgb, var(--red) 8%, white); }
.action-rationale { margin: 0.55rem 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.72rem; line-height: 1.45; }
.action-rationale strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.action-draft { margin-top: 0.6rem; padding: 0.62rem 0.7rem; border-radius: 0.72rem; background: color-mix(in srgb, var(--blue) 7%, var(--tg-theme-secondary-bg-color, var(--fallback-page-bg))); }
.action-draft span { color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 0.6rem; font-weight: 750; text-transform: uppercase; letter-spacing: 0.04em; }
.action-draft p { margin: 0.3rem 0 0; font-size: 0.72rem; line-height: 1.42; white-space: pre-wrap; }
.action-controls { display: flex; margin-top: 0.65rem; gap: 0.42rem; flex-wrap: wrap; }
.action-control { min-height: 2.75rem; padding: 0.55rem 0.65rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.62rem; color: var(--tg-theme-text-color, var(--fallback-text)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font-size: 0.68rem; font-weight: 750; cursor: pointer; }
.action-control.primary { color: white; border-color: var(--green); background: var(--green); }
.action-control.send { margin-left: auto; color: white; border-color: var(--tg-theme-button-color, var(--blue)); background: var(--tg-theme-button-color, var(--blue)); }
.action-last-message { margin-top: 0.62rem; padding: 0.62rem 0.72rem; border-left: 3px solid #9aa5ad; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.action-last-message span, .action-draft > span { display: block; margin-bottom: 0.3rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.055em; text-transform: uppercase; }
.action-last-message p { margin: 0; font-size: 0.76rem; line-height: 1.4; }
.quick-reply { display: block; min-height: 2.75rem; margin: 0.55rem 0 0 auto; padding: 0.55rem 0.7rem; border: 0; border-radius: var(--badge-radius); color: white; background: var(--tg-theme-button-color, var(--blue)); font-size: 0.68rem; font-weight: 800; cursor: pointer; }

.draft-review-label select { width: 100%; margin-top: 0.35rem; padding: 0.7rem; border: 1px solid var(--fallback-separator); border-radius: 0.55rem; background: white; font: inherit; }
.draft-review-label input { box-sizing: border-box; width: 100%; margin-top: 0.35rem; padding: 0.7rem; border: 1px solid var(--fallback-separator); border-radius: 0.55rem; background: white; font: inherit; }
.action-resolved { display: inline-block; color: var(--green); font-size: 0.68rem; font-weight: 750; }
.leads-head { margin-bottom: 0.8rem; }
.leads-count { margin: -0.1rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; }
.leads-search {
  display: flex;
  min-height: 2.9rem;
  padding: 0 0.85rem;
  align-items: center;
  gap: 0.65rem;
  border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator));
  border-radius: 0.9rem;
  background: var(--tg-theme-section-bg-color, var(--fallback-section-bg));
}
.leads-search svg { width: 1.2rem; height: 1.2rem; flex: 0 0 1.2rem; fill: none; stroke: var(--tg-theme-hint-color, var(--fallback-hint)); stroke-width: 1.8; stroke-linecap: round; }
.leads-search input { width: 100%; min-width: 0; padding: 0.65rem 0; border: 0; outline: none; color: var(--tg-theme-text-color, var(--fallback-text)); background: transparent; }
.leads-search input::placeholder { color: var(--tg-theme-hint-color, var(--fallback-hint)); opacity: 0.8; }
.leads-summary { display: grid; margin: 0.7rem 0 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
.leads-summary > div { display: flex; min-height: 3.4rem; padding: 0.55rem 0.8rem; align-items: center; gap: 0.6rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.9rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.leads-summary strong { font-family: var(--font-display); font-size: 1.25rem; }
.leads-summary span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.2; }
.leads-list { overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1.1rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.03); }
.leads-section-head { display: flex; padding: 0.85rem 1rem; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.leads-section-head h2 { margin: 0; font-size: 1.05rem; }
.leads-filter-control { display: flex; align-items: center; gap: 0.45rem; }
.leads-filter-control > span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.61rem; font-weight: 650; }
.leads-filter-control select { max-width: 8.2rem; min-height: 2rem; padding: 0.3rem 1.45rem 0.3rem 0.55rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.45rem; color: var(--tg-theme-text-color, var(--fallback-text)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font: inherit; font-size: 0.65rem; font-weight: 700; }
.leads-empty-state { padding: clamp(1.2rem, 3.5svh, 1.8rem) 1.2rem; text-align: center; }
.leads-empty-icon { display: grid; width: 2.8rem; height: 2.8rem; margin: 0 auto 0.7rem; place-items: center; border-radius: 50%; color: var(--tg-theme-link-color, var(--blue-strong)); background: color-mix(in srgb, var(--blue) 11%, transparent); }
.leads-empty-icon svg { width: 1.45rem; height: 1.45rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.leads-empty-state h3 { margin-bottom: 0.3rem; }
.leads-empty-state p { max-width: 24rem; margin: 0 auto; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; line-height: 1.5; }
.leads-capture-note { display: flex; margin-top: 0.75rem; padding: 0.75rem 0.85rem; align-items: flex-start; gap: 0.65rem; border-radius: 0.9rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); background: color-mix(in srgb, var(--blue) 7%, transparent); }
.leads-capture-note > span { color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 1rem; }
.leads-capture-note p { margin: 0; font-size: 0.76rem; line-height: 1.45; }
.leads-capture-note strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.leads-section-head > span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.68rem; font-weight: 700; }
.lead-card-list { padding: 0 0.9rem; }
.lead-card { padding: 0.85rem 0; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.lead-card:first-child { border-top: 0; }
.lead-card[hidden] { display: none; }
.leads-no-match { margin: 0; padding: 1.2rem 0.35rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.75rem; text-align: center; }
.leads-no-match[hidden] { display: none; }
.lead-card-head { display: flex; justify-content: space-between; gap: 0.7rem; }
.lead-card-head h3 { margin: 0; font-size: 0.9rem; }
.lead-card-head div > span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.64rem; }
.lead-stage { align-self: flex-start; padding: 0.2rem 0.42rem; border: 1px solid color-mix(in srgb, var(--blue) 26%, white); border-radius: var(--badge-radius); color: var(--tg-theme-link-color, var(--blue-strong)); background: color-mix(in srgb, var(--blue) 8%, white); font-size: 0.61rem; font-weight: 800; text-transform: capitalize; }
.lead-reason { margin: 0.55rem 0 0; font-size: 0.73rem; line-height: 1.45; }
.lead-summary { margin: 0.35rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.42; }
.lead-card-foot { display: flex; margin-top: 0.65rem; justify-content: space-between; gap: 0.6rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.62rem; }
.lead-next.attention { color: var(--red); font-weight: 750; }
.lead-card-actions { display: flex; margin-top: 0.6rem; gap: 0.8rem; }
.lead-card-actions button { padding: 0.65rem 0; border: 0; color: var(--tg-theme-link-color, var(--blue-strong)); background: transparent; font-size: 0.64rem; font-weight: 750; cursor: pointer; }
.lead-card-actions .lead-not-button { color: var(--tg-theme-hint-color, var(--fallback-hint)); }
.lead-detail-block { margin-top: 0.75rem; padding: 0.7rem; border-radius: 0.75rem; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.lead-detail-block span, .lead-detail-grid span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.61rem; font-weight: 750; text-transform: uppercase; letter-spacing: 0.04em; }
.lead-detail-block p { margin: 0.28rem 0 0; font-size: 0.74rem; line-height: 1.45; }
.lead-detail-grid { display: grid; margin-top: 0.7rem; grid-template-columns: 1fr 1fr; gap: 0.55rem; }
.lead-detail-grid > div { display: flex; padding: 0.55rem 0.65rem; flex-direction: column; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.7rem; }
.lead-detail-grid strong { margin-top: 0.2rem; font-size: 0.72rem; text-transform: capitalize; }
.lead-stage-control { display: block; margin-top: 0.75rem; font-size: 0.68rem; font-weight: 750; }
.lead-stage-control select { display: block; width: 100%; min-height: 2.6rem; margin-top: 0.3rem; padding: 0.5rem 0.7rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.72rem; color: var(--tg-theme-text-color, var(--fallback-text)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font: inherit; }
.pipeline-head { margin-bottom: 0.8rem; }
.pipeline-count { margin: -0.1rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; }
.pipeline-summary { display: grid; margin-bottom: 0.8rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
.pipeline-summary > div { display: flex; min-height: 3.7rem; padding: 0.6rem 0.85rem; align-items: center; gap: 0.7rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.9rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.pipeline-summary strong { font-family: var(--font-display); font-size: 1.3rem; }
.pipeline-summary span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.2; }
.pipeline-stages { overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1.1rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.03); }
.pipeline-section-head { display: flex; padding: 0.85rem 1rem; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.pipeline-section-head h2 { margin: 0; font-size: 1.05rem; }
.pipeline-section-head > span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.72rem; font-weight: 700; }
.pipeline-stage-list { padding: 0 0.85rem; }
.pipeline-stage { display: flex; min-height: 3.55rem; padding: 0.55rem 0; align-items: center; gap: 0.7rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.pipeline-stage:first-child { border-top: 0; }
.pipeline-stage-marker { width: 0.42rem; height: 2rem; flex: 0 0 0.42rem; border-radius: 999px; background: #a8d8f3; }
.pipeline-stage-marker.stage-2 { background: #74c2ee; }
.pipeline-stage-marker.stage-3 { background: #3faee7; }
.pipeline-stage-marker.stage-4 { background: #168acd; }
.pipeline-stage-marker.stage-5 { background: #28a745; }
.pipeline-stage-marker.stage-6 { background: #a5a9ae; }
.pipeline-stage-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.pipeline-stage-copy strong { font-size: 0.82rem; }
.pipeline-stage-copy small { overflow: hidden; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.66rem; text-overflow: ellipsis; white-space: nowrap; }
.pipeline-stage-count { display: grid; min-width: 1.8rem; height: 1.8rem; padding: 0 0.4rem; place-items: center; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: var(--badge-radius); color: var(--tg-theme-hint-color, var(--fallback-hint)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font-size: 0.72rem; font-weight: 800; }
.pipeline-automation-note { display: flex; margin-top: 0.75rem; padding: 0.75rem 0.85rem; align-items: flex-start; gap: 0.65rem; border-radius: 0.9rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); background: color-mix(in srgb, var(--blue) 7%, transparent); }
.pipeline-automation-note > span { color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 1rem; }
.pipeline-automation-note p { margin: 0; font-size: 0.76rem; line-height: 1.45; }
.pipeline-automation-note strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.pipeline-stage-group { border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.pipeline-stage-group:first-child { border-top: 0; }
.pipeline-stage-group .pipeline-stage { border-top: 0; }
.opportunity-list { padding: 0 0 0.65rem 1.12rem; }
.opportunity-card { margin: 0.35rem 0; padding: 0.65rem 0.72rem; border-radius: 0.72rem; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.opportunity-card > div { display: flex; justify-content: space-between; gap: 0.55rem; font-size: 0.72rem; }
.opportunity-card > div span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-weight: 700; }
.opportunity-card p { margin: 0.28rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.65rem; line-height: 1.4; }
.opportunity-card small { display: inline-block; margin-top: 0.35rem; color: var(--red); font-size: 0.6rem; font-weight: 750; }
.settings-head { margin-bottom: 0.8rem; }
.settings-subtitle { margin: -0.1rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; }
.settings-card { margin-bottom: 0.75rem; padding: 0.9rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1.05rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); box-shadow: 0 0.4rem 1.4rem rgb(0 0 0 / 0.03); }
.settings-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; }
.settings-card-head h2, .settings-plan h2 { margin: 0; font-size: 1.05rem; }
.settings-kicker { margin: 0 0 0.12rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.settings-status { padding: 0.24rem 0.44rem; border: 1px solid color-mix(in srgb, var(--red) 28%, white); border-radius: var(--badge-radius); color: var(--red); background: color-mix(in srgb, var(--red) 8%, white); font-size: 0.65rem; font-weight: 800; white-space: nowrap; }
.settings-status.connected { border-color: color-mix(in srgb, var(--green) 28%, white); color: var(--green); background: color-mix(in srgb, var(--green) 8%, white); }
.settings-card .checklist { margin-top: 0.6rem; }
.settings-card .check { min-height: 2.2rem; padding: 0.38rem 0; font-size: 0.76rem; }
.settings-card .check-mark { width: 1.2rem; height: 1.2rem; flex-basis: 1.2rem; font-size: 0.66rem; }
.settings-card .connection-status-icon { color: var(--red); }
.settings-card .check.done .connection-status-icon { color: var(--green); }
.settings-description { margin: 0.65rem 0 0.8rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.76rem; line-height: 1.5; }
.settings-connection-actions { margin-top: 0.7rem; }
.settings-connection-actions .button { min-height: 2.45rem; padding: 0.5rem 0.7rem; font-size: 0.76rem; }
.settings-rows { margin-top: 0.55rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.settings-row { display: flex; min-height: 2.65rem; align-items: center; justify-content: space-between; gap: 0.75rem; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); font-size: 0.78rem; }
.settings-row:last-child { border-bottom: 0; }
.settings-row-value { overflow: hidden; max-width: 58%; font-weight: 700; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.settings-row-value.muted { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; font-weight: 600; }
.settings-row-action { display: inline-flex; padding: 0.4rem 0; align-items: center; gap: 0.35rem; border: 0; color: var(--tg-theme-link-color, var(--blue-strong)); background: transparent; font-size: 0.74rem; font-weight: 750; cursor: pointer; }
.settings-row-action span { font-size: 1rem; line-height: 1; }
.settings-plan { display: block; }
.settings-plan p:last-child { max-width: 24rem; margin: 0.35rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.4; }
.settings-plan > span { display: inline-flex; margin-top: 0.55rem; padding: 0.3rem 0.48rem; border: 1px solid color-mix(in srgb, var(--blue) 26%, white); border-radius: var(--badge-radius); color: var(--tg-theme-link-color, var(--blue-strong)); background: color-mix(in srgb, var(--blue) 8%, white); font-size: 0.68rem; font-weight: 800; }
.settings-plan .button { margin-top: 0.75rem; }
@keyframes ready-in { from { opacity: 0; transform: translateY(0.35rem); } }
.notice { padding: 0.85rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.8rem; line-height: 1.45; }
.error { margin-bottom: 0.85rem; padding: 0.75rem; border-radius: 0.75rem; background: color-mix(in srgb, var(--red) 10%, transparent); color: var(--red); font-size: 0.8rem; }
.code-box { display: flex; margin-top: 0.7rem; padding: 0.7rem; align-items: center; gap: 0.65rem; border: 1px dashed var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.75rem; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.code-box code { min-width: 0; flex: 1; overflow: hidden; font-size: 0.67rem; text-overflow: ellipsis; white-space: nowrap; }
.dialog-backdrop { position: fixed; z-index: 50; inset: 0; display: grid; padding: 1rem; place-items: end center; background: rgb(0 0 0 / 0.42); }
.dialog { width: min(100%, 32rem); padding: 1.1rem; border-radius: 1.1rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); box-shadow: 0 1rem 3rem rgb(0 0 0 / 0.25); }
.language-dialog h2 { margin: 0 0 0.85rem; }
.language-list { display: grid; margin-bottom: 0.8rem; gap: 0.4rem; }
.language-list button { display: flex; width: 100%; min-height: 3.4rem; padding: 0.55rem 0.7rem; align-items: center; gap: 0.75rem; border: 1px solid var(--fallback-separator); border-radius: 0.75rem; color: var(--fallback-text); background: var(--fallback-section-bg); text-align: left; }
.language-list button[aria-pressed="true"] { border-color: var(--blue-strong); background: color-mix(in srgb, var(--blue) 7%, white); }
.language-list img { width: 1.75rem; height: 1.3125rem; flex: 0 0 auto; border-radius: 0.14rem; object-fit: cover; box-shadow: none; }
.language-list span { display: grid; min-width: 0; flex: 1; gap: 0.05rem; }
.language-list strong { font-size: 0.92rem; }
.language-list small { color: var(--fallback-hint); font-size: 0.72rem; }
.language-list b { color: var(--blue-strong); font-size: 1.1rem; }
.public-setup-language { position: fixed; z-index: 60; top: max(0.6rem, env(safe-area-inset-top)); right: max(0.75rem, env(safe-area-inset-right)); }
.setup-guide-backdrop { padding: 0; place-items: stretch center; background: var(--app-background); }
.setup-guide { width: min(100%, 42rem); height: 100svh; overflow-y: auto; overscroll-behavior: contain; background: var(--app-background); }
.setup-guide-header { position: sticky; z-index: 2; top: 0; display: flex; padding: calc(0.8rem + env(safe-area-inset-top)) 1rem 0.75rem; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); background: color-mix(in srgb, var(--app-background) 94%, transparent); backdrop-filter: blur(12px); }
.setup-guide-header .eyebrow { margin-bottom: 0.2rem; }
.setup-guide-header h2 { margin: 0; font-size: 1.35rem; }
.setup-guide-header > button { display: grid; width: 2.75rem; height: 2.75rem; padding: 0; flex: 0 0 2.75rem; place-items: center; border: 0; border-radius: 50%; color: var(--tg-theme-hint-color, var(--fallback-hint)); background: transparent; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.setup-guide-content { display: grid; padding: 0.9rem max(0.8rem, env(safe-area-inset-right)) calc(1rem + env(safe-area-inset-bottom)) max(0.8rem, env(safe-area-inset-left)); gap: 0.85rem; }
.setup-guide-banner { display: grid; padding: 0.85rem; gap: 0.25rem; border: 3px solid #e7ad11; border-radius: 1rem; color: #553700; background: #fff3b2; box-shadow: 0 0.55rem 1.2rem rgb(125 85 0 / 0.12); text-align: center; }
.setup-guide-banner strong { font-family: var(--font-display); font-size: 1.08rem; }
.setup-guide-banner span { font-size: 0.72rem; font-weight: 700; line-height: 1.35; }
.setup-guide-step { padding: 0.8rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); box-shadow: 0 0.4rem 1.1rem rgb(0 0 0 / 0.04); }
.setup-guide-step > header { display: flex; margin-bottom: 0.7rem; align-items: flex-start; gap: 0.65rem; }
.setup-guide-number { display: grid; width: 2.25rem; height: 2.25rem; flex: 0 0 2.25rem; place-items: center; border-radius: 50%; color: white; background: var(--blue-strong); font-family: var(--font-display); font-size: 1.05rem; font-weight: 850; }
.setup-guide-step h3 { margin: 0 0 0.12rem; font-size: 1rem; }
.setup-guide-step header p { margin: 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.35; }
.setup-guide-alert { display: grid; margin: 0 0 0.7rem; padding: 0.65rem; gap: 0.15rem; border: 2px solid #e7ad11; border-radius: 0.75rem; color: #553700; background: #fff7cf; text-align: center; }
.setup-guide-alert strong { font-size: 0.82rem; text-transform: uppercase; }
.setup-guide-alert span { font-size: 0.66rem; font-weight: 700; line-height: 1.3; }
.setup-guide-shot { position: relative; width: min(100%, 25rem); margin: 0 auto; overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.8rem; background: #fff; }
.setup-guide-shot img { display: block; width: 100%; height: auto; }
.setup-guide-highlight { position: absolute; border: 3px solid #0969da; border-radius: 0.65rem; pointer-events: none; }
.setup-guide-highlight--connect { top: 77.4%; left: 0.5%; width: 99%; height: 13.5%; }
.setup-guide-highlight--chatbots { top: 66%; left: 4%; width: 92%; height: 14%; border-width: 4px; border-color: #e7ad11; }
.setup-guide-highlight--bot { top: 43.5%; left: 2.5%; width: 95%; height: 14%; }
.setup-guide-highlight--add { top: 46.4%; left: 84.5%; width: 13.5%; height: 8.5%; border-color: #e7ad11; border-radius: 999px; }
.setup-guide-highlight--permissions { top: 43%; left: 4%; width: 92%; height: 16%; }
.setup-guide-finish { display: grid; padding: 0.72rem; justify-items: center; gap: 0.3rem; border-radius: 0.85rem; color: #155f2b; background: #eaf8ee; text-align: center; }
.setup-guide-done-icon { display: block; width: 2.45rem; height: 2.45rem; object-fit: contain; }
.setup-guide-finish > div { display: grid; gap: 0.05rem; }
.setup-guide-finish strong { font-family: var(--font-display); font-size: 1rem; }
.setup-guide-finish span { font-size: 0.7rem; font-weight: 700; }
.setup-guide-inline { margin-top: 1rem; }
.setup-guide-inline-header { padding: 0.2rem 0.15rem 0.7rem; }
.setup-guide-inline-header h2 { margin: 0; font-size: 1.35rem; }
.setup-guide-inline .setup-guide-content { padding: 0; }
.required-connection-panel { width: calc(100% - 1rem); max-width: 22rem; padding: 0.75rem; margin-inline: auto; }
.required-connection-panel h2 { margin-bottom: 0.2rem; font-size: 1.15rem; }
.required-connection-panel .eyebrow { margin-bottom: 0.25rem; }
.required-connection-panel .helper { margin-top: 0.25rem; line-height: 1.3; }
.required-connection-panel .checklist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0.55rem; gap: 0.35rem; }
.required-connection-panel .check { display: grid; min-height: 3.1rem; padding: 0.32rem 0.15rem; align-content: center; justify-items: center; gap: 0.2rem; border: 0; border-radius: 0.65rem; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); text-align: center; }
.required-connection-panel .check-mark { width: 1.2rem; height: 1.2rem; flex-basis: 1.2rem; font-size: 0.66rem; }
.required-connection-panel .connection-status-icon { width: 1.35rem; height: 1.35rem; color: var(--red); }
.required-connection-panel .check.done .connection-status-icon { color: var(--green); }
.connection-status-icon--bot { --icon-mask: url("/assets/status-bot.webp?v=20260809-153"); }
.connection-status-icon--read { --icon-mask: url("/assets/status-read.webp?v=20260809-153"); }
.connection-status-icon--reply { --icon-mask: url("/assets/status-reply.webp?v=20260809-153"); }
.required-connection-panel .check span:last-child { font-size: 0.66rem; line-height: 1.15; }
.required-connection-panel .button-row { margin-top: 0.55rem; gap: 0.45rem; }
.required-connection-panel .button { min-height: 2.35rem; padding: 0.45rem 0.6rem; font-size: 0.78rem; }
.attribution-list { display: grid; margin: 0.85rem 0; padding-left: 1.1rem; gap: 0.5rem; font-size: 0.76rem; line-height: 1.35; }
.attribution-list a, .attribution-dialog .helper a { color: var(--tg-theme-link-color, var(--blue-strong)); }
.draft-review-label { display: block; margin-top: 0.8rem; font-size: 0.68rem; font-weight: 750; }
.draft-review-body { display: block; width: 100%; min-height: 7rem; max-height: 32svh; overflow: auto; resize: vertical; margin-top: 0.35rem; padding: 0.85rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.8rem; outline: none; color: var(--tg-theme-text-color, var(--fallback-text)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); font: inherit; font-size: 0.8rem; line-height: 1.5; }
.draft-review-body:focus { border-color: var(--tg-theme-button-color, var(--blue)); box-shadow: 0 0 0 0.14rem color-mix(in srgb, var(--blue) 12%, transparent); }

@media (max-width: 380px) {
  .brand { font-size: 1.08rem; }
  .brand img { width: 2rem; height: 2rem; flex-basis: 2rem; }
  .choice-card--illustrated { min-height: 6.3rem; }
  .choice-icon { margin-bottom: 0.65rem; }
}

@media (max-height: 700px) {
  .lead { margin-bottom: 0.9rem; line-height: 1.4; }
  .choice-grid { gap: 0.6rem; }
  .choice-card--illustrated { min-height: 5.65rem; padding-block: 0.6rem; }
  .panel { padding: 0.85rem; }
  .field { margin-bottom: 0.75rem; }
  .field input { min-height: 2.75rem; }
  .mode-options { margin-bottom: 0.75rem; }
  .mode-card { min-height: 5.1rem; }
  .button { min-height: 2.7rem; }
  .legal-note { margin-top: 0.5rem; }
}

@media (max-height: 600px) {
  .footer-art-frame { display: none; }
  .app-footer { font-size: 0.72rem; }
  h1 { font-size: clamp(1.55rem, 6.5vw, 1.9rem); }
  .lead { margin-bottom: 0.7rem; }
  .choice-card--illustrated { min-height: 5.2rem; }
}

@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; }
}
.danger-dialog .danger-note {
  color: #a33a2b;
  font-size: 0.82rem;
  line-height: 1.45;
}

.button.danger {
  background: #c94332;
  color: #fff;
}

.button.danger:disabled {
  background: #e7b9b2;
}

/* D-073 self-maintaining CRM */
.crm-page { padding-bottom: 1rem; }
.crm-page-title { display: flex; align-items: center; gap: 0.48rem; }
.crm-page-icon { display: inline-block; width: 1.65rem; height: 1.65rem; flex: 0 0 1.65rem; background: var(--tg-theme-link-color, var(--blue-strong)); -webkit-mask: var(--workspace-icon) center / contain no-repeat; mask: var(--workspace-icon) center / contain no-repeat; }
.crm-subtitle { margin: 0.2rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.76rem; line-height: 1.4; }
.crm-empty { margin-top: 1rem; padding: 2.2rem 1.25rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); text-align: center; }
.crm-empty h2 { margin: 0 0 0.35rem; color: var(--tg-theme-text-color, var(--fallback-text)); font-size: 1rem; }
.crm-empty p { max-width: 24rem; margin: auto; font-size: 0.78rem; line-height: 1.5; }
.crm-action-list, .crm-lead-list { margin-top: 0.85rem; overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 1rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.ai-decision-list { display: grid; margin-top: 0.85rem; gap: 0.7rem; }
.ai-decision-card { padding: 0.9rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.9rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.ai-decision-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.6rem; }
.ai-decision-card h2 { margin: 0.12rem 0 0; font-size: 0.9rem; }
.crm-badge.decision-applied { border-color: #9dd5ac; color: #187737; background: #effaf2; }
.crm-badge.decision-withheld { border-color: #d2d4d7; color: #65696e; background: #f4f5f6; }
.ai-decision-value { margin-top: 0.7rem; font-family: var(--font-display); font-size: 1rem; font-weight: 750; text-transform: capitalize; }
.ai-decision-reason { margin: 0.42rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.74rem; line-height: 1.45; }
.ai-decision-reason strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.ai-decision-meta { display: flex; margin-top: 0.58rem; justify-content: space-between; gap: 0.6rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.62rem; }
.bad-decision-button { margin-left: auto; font-size: 0.64rem; }
.ai-decision-review { margin-top: 0.7rem; padding: 0.6rem 0.68rem; border-left: 3px solid #d99424; background: #fff8e9; font-size: 0.68rem; }
.ai-decision-review p { margin: 0.25rem 0 0; color: #72501a; line-height: 1.4; }
.daily-report-list { display: grid; margin-top: 0.85rem; gap: 0.75rem; }
.daily-report-card { padding: 0.9rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.9rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.daily-report-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.6rem; }
.daily-report-card h2 { margin: 0.12rem 0 0; font-size: 0.95rem; }
.crm-badge.report-complete { border-color: #9dd5ac; color: #187737; background: #effaf2; }
.daily-report-summary { margin: 0.7rem 0 0; font-size: 0.78rem; font-weight: 650; line-height: 1.5; }
.report-metrics { display: grid; margin-top: 0.75rem; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.42rem; }
.report-metric { position: relative; padding: 0.55rem 0.35rem; border-radius: 0.55rem; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); text-align: center; }
.report-metric-icon { position: absolute; top: 0.35rem; left: 0.35rem; width: 1.2rem; height: 1.2rem; color: #505050; background: currentColor; -webkit-mask: var(--report-metric-icon) center / contain no-repeat; mask: var(--report-metric-icon) center / contain no-repeat; }
.report-metric-icon--active-chats { --report-metric-icon: url("/assets/ui-view-chat.webp?v=20260809-153"); }
.report-metric-icon--new-leads { --report-metric-icon: url("/assets/pipeline-new.webp?v=20260809-153"); }
.report-metric-icon--replies { --report-metric-icon: url("/assets/ui-reply-message.webp?v=20260809-153"); }
.report-metric-icon--needs-reply { --report-metric-icon: url("/assets/ui-warning.webp?v=20260809-153"); color: #c93643; }
.report-metric-icon--follow-ups { --report-metric-icon: url("/assets/summary-follow-up.webp?v=20260809-153"); color: #b17a00; }
.report-metric-icon--won { --report-metric-icon: url("/assets/summary-won-leads.webp?v=20260809-153"); color: #2f8f4e; }
.report-metric strong, .report-metric span { display: block; }
.report-metric strong { font-size: 1rem; }
.report-metric span { margin-top: 0.12rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.56rem; line-height: 1.2; }
.report-insights { margin-top: 0.72rem; padding-left: 0.68rem; border-left: 3px solid #65a9d0; }
.report-insights.wins { border-color: #4aa463; }
.report-insights.risks { border-color: #d99424; }
.report-insights h3 { margin: 0; font-size: 0.7rem; }
.report-insights ul { margin: 0.35rem 0 0; padding-left: 1rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.45; }
.report-timezone { margin: 0.75rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.58rem; }
.crm-action-card, .crm-lead-card { padding: 0.9rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.crm-action-card:first-child, .crm-lead-card:first-child { border-top: 0; }
.crm-action-card.awaiting { border-left: 3px solid #e05757; }
.crm-action-card.follow-up { border-left: 3px solid #d99424; }
.crm-action-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.6rem; }
.crm-action-card h2, .crm-lead-card h2 { margin: 0.12rem 0 0; font-size: 0.9rem; line-height: 1.3; }
.crm-customer { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.68rem; font-weight: 750; }
.crm-badge { display: inline-flex; flex: 0 0 auto; padding: 0.2rem 0.42rem; align-items: center; border: 1px solid #bfd7e6; border-radius: var(--badge-radius); color: #1878aa; background: #edf8fd; font-size: 0.6rem; font-weight: 800; line-height: 1.2; text-transform: capitalize; }
.crm-badge.awaiting, .crm-badge.awaiting_reply { border-color: #efbaba; color: #b93535; background: #fff1f1; }
.crm-badge.follow-up, .crm-badge.follow_up { border-color: #eccb94; color: #8d5a08; background: #fff8e9; }
.crm-badge.pending { border-color: #bcd6e7; color: #1e6f9d; background: #eef7fc; }
.crm-badge.no_action { color: var(--tg-theme-hint-color, var(--fallback-hint)); background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.crm-badge.outcome-won { border-color: #9dd5ac; color: #187737; background: #effaf2; }
.crm-badge.outcome-lost { border-color: #d2d4d7; color: #65696e; background: #f4f5f6; }
.crm-badge.unverified { border-color: #f0c36d; color: #8a4b08; background: #fff7e6; }
.crm-last-message { display: flex; min-height: 4.1rem; margin-top: 0.7rem; padding: 0.55rem 0.62rem 0.55rem 0.72rem; align-items: center; justify-content: space-between; gap: 0.65rem; border-left: 3px solid #9aa5ad; background: var(--tg-theme-secondary-bg-color, var(--fallback-page-bg)); }
.crm-last-message-copy { min-width: 0; flex: 1; }
.crm-last-message .crm-reply-button { flex: 0 0 auto; }
.crm-last-message span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.61rem; font-weight: 800; text-transform: uppercase; }
.crm-last-message p, .crm-reason { margin: 0.35rem 0 0; font-size: 0.74rem; line-height: 1.45; }
.crm-reason { color: var(--tg-theme-hint-color, var(--fallback-hint)); }
.crm-reason strong { color: var(--tg-theme-text-color, var(--fallback-text)); }
.crm-card-meta, .crm-card-actions { display: flex; margin-top: 0.65rem; align-items: center; gap: 0.42rem; flex-wrap: wrap; }
.crm-decision-actions { display: inline-flex; align-items: center; gap: 0.18rem; }
.crm-decision-button, .crm-close-button { padding: 0.65rem 0; font-size: 0.64rem; font-weight: 750; line-height: 1.25; }
.crm-decision-button { color: var(--blue); }
.crm-close-button { color: #b83535; }
.crm-evidence { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.62rem; }
.button.compact { min-height: 2.75rem; padding: 0.55rem 0.7rem; font-size: 0.7rem; border-radius: 0.65rem; }
.danger-text { color: #b83535 !important; }
.crm-filter-row { display: grid; margin: 0.8rem 0; grid-template-columns: minmax(0, 1fr) auto; gap: 0.5rem; }
.crm-filter-row input, .crm-filter-row select, .dialog-field input, .dialog-field select, .dialog-field textarea { min-width: 0; min-height: 2.6rem; padding: 0.55rem 0.7rem; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.65rem; color: var(--tg-theme-text-color, var(--fallback-text)); background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); font: inherit; }
.dialog-field textarea { min-height: 6rem; resize: vertical; line-height: 1.4; }
.crm-lead-open, .crm-opportunity { display: flex; width: 100%; padding: 0; align-items: center; justify-content: space-between; gap: 0.7rem; border: 0; color: inherit; background: transparent; text-align: left; text-decoration: none; cursor: pointer; }
.crm-lead-open p { display: -webkit-box; margin: 0.3rem 0 0; overflow: hidden; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.crm-opportunity > span:last-child { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 1.5rem; }
.crm-lead-result { flex: 0 0 auto; padding: 0.24rem 0.42rem; border: 1px solid #bcd6e7; border-radius: var(--badge-radius); color: #1e6f9d; background: #eef7fc; font-size: 0.6rem; font-weight: 800; }
.crm-lead-result.outcome-won { border-color: #9dd5ac; color: #187737; background: #effaf2; }
.crm-lead-result.outcome-lost { border-color: #d2d4d7; color: #65696e; background: #f4f5f6; }
.crm-no-match { padding: 1rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); text-align: center; }
.crm-pipeline { display: grid; margin-top: 0.85rem; gap: 0.7rem; }
.crm-pipeline-stage { overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.9rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.crm-pipeline-stage > header { display: flex; padding: 0.75rem 0.85rem; align-items: center; justify-content: space-between; gap: 0.7rem; background: color-mix(in srgb, var(--blue) 6%, transparent); }
.crm-pipeline-stage h2 { margin: 0; font-size: 0.86rem; }
.crm-pipeline-stage header p, .crm-stage-empty { margin: 0.18rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.66rem; }
.crm-opportunity { padding: 0.72rem 0.85rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.crm-opportunity span:first-child { display: grid; gap: 0.2rem; }
.crm-opportunity small { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.66rem; }
.crm-stage-empty { padding: 0.7rem 0.85rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.dialog-field { display: grid; margin-top: 0.8rem; gap: 0.3rem; font-size: 0.7rem; font-weight: 750; }

/* D-086 compact operational dashboards */
.dashboard-summary { display: grid; margin-top: 0.75rem; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.42rem; }
.dashboard-summary-card { display: grid; min-height: 3.35rem; padding: 0.48rem 0.35rem; place-content: center; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.72rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); font: inherit; text-align: center; }
button.dashboard-summary-card { cursor: pointer; }
button.dashboard-summary-card[aria-pressed="true"] { z-index: 2; box-shadow: 0 0 0 0.16rem #2aabee, 0 0.2rem 0.6rem rgb(15 15 15 / 0.06); }
button.dashboard-summary-card:focus-visible, .pipeline-flow-stage:focus-visible { z-index: 3; outline: 0.16rem solid #2aabee; outline-offset: -0.16rem; }
.dashboard-summary-card strong { font-family: var(--font-display); font-size: 1rem; }
.dashboard-summary-card span { margin-top: 0.08rem; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.58rem; line-height: 1.2; }
.dashboard-summary-card.urgent { border-color: #efbaba; background: #fff7f7; }
.dashboard-summary-card.warning { border-color: #eccb94; background: #fffaf0; }
.dashboard-summary-card.success { border-color: #9dd5ac; background: #f4fbf6; }
.dashboard-toolbar { display: grid; margin-top: 0.65rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.48rem; }
.dashboard-toolbar .dashboard-search { grid-column: 1 / -1; }
.dashboard-date-control { position: relative; grid-column: 1 / -1; }
.dashboard-date-field { display: flex; width: 100%; min-height: 2.8rem; padding: 0.42rem 0.75rem; align-items: center; gap: 0.62rem; border: 1px solid #c8c8c4; border-radius: 0.72rem; color: #191919; background: #fff; box-shadow: 0 0.18rem 0.55rem rgb(15 15 15 / 0.055); font: inherit; text-align: left; cursor: pointer; }
.dashboard-date-field:hover { border-color: #9b9b96; }
.dashboard-date-field:focus-visible { outline: 0; border-color: #2aabee; box-shadow: 0 0 0 0.16rem rgb(42 171 238 / 0.14); }
.dashboard-date-field.active { border-color: #74c2ee; background: #f3fbff; }
.dashboard-date-field > i { width: 1.18rem; height: 1.18rem; flex: 0 0 1.18rem; background: #168acd; -webkit-mask: url("/assets/ui-plan-annual-v1.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-plan-annual-v1.webp?v=20260809-153") center / contain no-repeat; }
.dashboard-date-field > span { display: grid; min-width: 0; flex: 1; gap: 0.08rem; }
.dashboard-date-field small { color: #6b6b6b; font-size: 0.52rem; font-weight: 800; letter-spacing: 0.05em; line-height: 1; text-transform: uppercase; }
.dashboard-date-field strong { overflow: hidden; font-size: 0.74rem; font-weight: 750; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-date-field > b { width: 0.48rem; height: 0.48rem; flex: 0 0 0.48rem; border-right: 2px solid #505050; border-bottom: 2px solid #505050; transform: translateY(-0.12rem) rotate(45deg); transition: transform 160ms ease; }
.dashboard-date-field[aria-expanded="true"] > b { transform: translateY(0.12rem) rotate(225deg); }
.dashboard-date-layer { position: fixed; z-index: 70; inset: 0; display: grid; padding: 0.65rem; align-items: end; background: rgb(25 25 25 / 0.38); backdrop-filter: blur(2px); }
.dashboard-date-layer[hidden] { display: none; }
.dashboard-date-picker { width: min(100%, 25rem); max-height: calc(100dvh - 1.3rem); margin: 0 auto; padding: 0.9rem; overflow-y: auto; border: 1px solid #c8e5f5; border-radius: 1rem; color: #191919; background: #fff; box-shadow: 0 1.1rem 3rem rgb(15 15 15 / 0.24); }
.dashboard-date-picker > header { display: flex; align-items: center; justify-content: space-between; gap: 0.7rem; }
.dashboard-date-picker > header > div { display: grid; gap: 0.1rem; }
.dashboard-date-picker > header span { color: #168acd; font-size: 0.54rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.dashboard-date-picker > header strong { font-family: var(--font-display); font-size: 1rem; text-transform: capitalize; }
.dashboard-date-picker nav { display: flex; gap: 0.32rem; }
.dashboard-date-picker nav button { display: grid; width: 2.25rem; height: 2.25rem; padding: 0; place-items: center; border: 1px solid #c8c8c4; border-radius: 0.68rem; color: #168acd; background: #f7f7f5; font: inherit; font-size: 1.35rem; font-weight: 800; cursor: pointer; }
.dashboard-date-picker nav button:focus-visible, .dashboard-date-days button:focus-visible { position: relative; z-index: 3; outline: 0.14rem solid #2aabee; outline-offset: -0.14rem; }
.dashboard-date-picker > p { margin: 0.58rem 0 0.72rem; color: #6b6b6b; font-size: 0.66rem; line-height: 1.35; }
.dashboard-date-weekdays, .dashboard-date-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.dashboard-date-weekdays { margin-bottom: 0.15rem; color: #6b6b6b; font-size: 0.58rem; font-weight: 800; text-align: center; }
.dashboard-date-weekdays span { padding: 0.25rem 0; }
.dashboard-date-days button { position: relative; display: grid; min-width: 0; height: 2.35rem; padding: 0; place-items: center; border: 0; color: #2f3437; background: transparent; font: inherit; font-size: 0.7rem; font-weight: 700; cursor: pointer; }
.dashboard-date-days button.in-range { background: #dff3fd; }
.dashboard-date-days button.outside { color: #a5a5a0; }
.dashboard-date-days button > span { position: relative; z-index: 1; display: grid; width: 1.9rem; height: 1.9rem; place-items: center; border-radius: 50%; }
.dashboard-date-days button.range-start > span, .dashboard-date-days button.range-end > span { color: #fff; background: #168acd; box-shadow: 0 0.18rem 0.42rem rgb(22 138 205 / 0.28); }
.dashboard-date-days button.range-start { border-radius: 999px 0 0 999px; }
.dashboard-date-days button.range-end { border-radius: 0 999px 999px 0; }
.dashboard-date-days button.range-start.range-end { border-radius: 999px; background: transparent; }
.dashboard-date-days button.today:not(.range-start, .range-end) > span::after { position: absolute; bottom: 0.16rem; width: 0.22rem; height: 0.22rem; content: ""; border-radius: 50%; background: #168acd; }
.dashboard-date-picker > footer { display: flex; margin-top: 0.72rem; justify-content: flex-end; gap: 0.42rem; border-top: 1px solid #e5e5e2; padding-top: 0.72rem; }
@media (min-width: 640px) { .dashboard-date-layer { align-items: center; } }
.dashboard-search, .dashboard-select { position: relative; display: block; min-width: 0; }
.dashboard-control-label { position: absolute; z-index: 1; top: 0.3rem; left: 0.75rem; color: #6b6b6b; font-size: 0.52rem; font-weight: 800; letter-spacing: 0.05em; line-height: 1; text-transform: uppercase; pointer-events: none; }
.dashboard-search::before { position: absolute; z-index: 1; top: 50%; left: 0.78rem; width: 0.72rem; height: 0.72rem; content: ""; border: 1.7px solid #6b6b6b; border-radius: 50%; transform: translateY(-60%); pointer-events: none; }
.dashboard-search::after { position: absolute; z-index: 1; top: 57%; left: 1.43rem; width: 0.34rem; height: 1.7px; content: ""; background: #6b6b6b; transform: rotate(45deg); transform-origin: left center; pointer-events: none; }
.dashboard-select::after { position: absolute; top: 58%; right: 0.82rem; width: 0.43rem; height: 0.43rem; content: ""; border-right: 2px solid #505050; border-bottom: 2px solid #505050; transform: translateY(-68%) rotate(45deg); pointer-events: none; }
.dashboard-toolbar input, .dashboard-toolbar select { width: 100%; min-width: 0; min-height: 2.55rem; border: 1px solid #c8c8c4; border-radius: 0.72rem; outline: none; color: #191919; background: #fff; box-shadow: 0 0.18rem 0.55rem rgb(15 15 15 / 0.055); font: inherit; font-size: 0.74rem; font-weight: 600; }
.dashboard-toolbar input { padding: 0.52rem 0.75rem 0.52rem 2.15rem; }
.dashboard-toolbar input::placeholder { color: #787873; opacity: 1; }
.dashboard-toolbar select { min-height: 2.8rem; max-width: none; padding: 1.08rem 2.15rem 0.28rem 0.75rem; appearance: none; cursor: pointer; }
.dashboard-toolbar input:hover, .dashboard-toolbar select:hover { border-color: #9b9b96; }
.dashboard-toolbar input:focus, .dashboard-toolbar select:focus { border-color: #2aabee; box-shadow: 0 0 0 0.16rem rgb(42 171 238 / 0.14); }
.dashboard-row[hidden] { display: none !important; }
.dashboard-table { margin-top: 0.65rem; overflow: hidden; border: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); border-radius: 0.85rem; background: var(--tg-theme-section-bg-color, var(--fallback-section-bg)); }
.dashboard-table-row { min-height: 3.5rem; }
.dashboard-pagination { display: grid; margin-top: 0.65rem; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.45rem; }
.dashboard-pagination span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.65rem; text-align: center; }
.dashboard-pagination .button.compact { min-height: 2.3rem; padding: 0.4rem 0.58rem; }
.dashboard-no-match { margin: 0.8rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.75rem; text-align: center; }
.dashboard-decision-line { display: flex; margin-top: 0.48rem; align-items: baseline; justify-content: space-between; gap: 0.5rem; }
.dashboard-decision-line strong { overflow: hidden; font-size: 0.82rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-decision-line span { flex: 0 0 auto; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.6rem; }
.dashboard-row .ai-decision-reason { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.report-details { margin-top: 0.6rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.report-details summary { padding: 0.55rem 0 0; color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 0.68rem; font-weight: 750; cursor: pointer; }
.settings-page-v2 .dashboard-summary { margin-bottom: 0.65rem; }
.settings-page-v2 .settings-plan { border-color: #9dcfe9; }
.settings-toggle-list { display: grid; margin-top: 0.7rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.settings-toggle-row { display: flex; padding: 0.68rem 0; align-items: center; justify-content: space-between; gap: 0.65rem; border-bottom: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.settings-toggle-row > div { display: grid; min-width: 0; gap: 0.15rem; }
.settings-toggle-row strong { font-size: 0.78rem; }
.settings-toggle-row span { color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.64rem; line-height: 1.35; }
.settings-switch { position: relative; width: 2.8rem; min-width: 2.8rem; height: 1.55rem; padding: 0; flex: 0 0 2.8rem; border: 1px solid #b8b8b3; border-radius: 999px; background: #d9d9d6; cursor: pointer; transition: background 160ms ease, border-color 160ms ease; }
.settings-switch > span { position: absolute; top: 0.16rem; left: 0.17rem; width: 1.12rem; height: 1.12rem; border-radius: 50%; background: #fff; box-shadow: 0 0.12rem 0.3rem rgb(15 15 15 / 0.2); transition: transform 160ms ease; }
.settings-switch.on { border-color: #168acd; background: #2aabee; }
.settings-switch.on > span { transform: translateX(1.24rem); }
.settings-switch:disabled { cursor: wait; opacity: 0.65; }
.settings-paywall { overflow: hidden; border-color: #8bc9e9; box-shadow: 0 0.55rem 1.5rem rgb(42 171 238 / 0.1); }
.billing-cycle-toggle { display: grid; margin-top: 0.8rem; padding: 0.22rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.22rem; border-radius: 0.72rem; background: #f1f1ef; }
.billing-cycle-toggle button { display: flex; min-height: 2.55rem; padding: 0.45rem 0.35rem; align-items: center; justify-content: center; gap: 0.4rem; border: 0; border-radius: 0.55rem; color: #505050; background: transparent; font-size: 0.76rem; font-weight: 800; cursor: pointer; }
.billing-cycle-toggle button[aria-selected="true"] { color: #fff; background: #2aabee; box-shadow: 0 0.15rem 0.4rem rgb(15 15 15 / 0.13); }
.billing-plan-icon { display: inline-block; width: 1.15rem; height: 1.15rem; flex: 0 0 1.15rem; background: currentColor; }
.billing-plan-icon--monthly { -webkit-mask: url("/assets/ui-plan-monthly-v1.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-plan-monthly-v1.webp?v=20260809-153") center / contain no-repeat; }
.billing-plan-icon--annual { -webkit-mask: url("/assets/ui-plan-annual-v1.webp?v=20260809-153") center / contain no-repeat; mask: url("/assets/ui-plan-annual-v1.webp?v=20260809-153") center / contain no-repeat; }
.billing-plan-copy { display: block; line-height: 1.05; }
.billing-plan-copy small { display: block; margin-top: 0.14rem; color: inherit; font-size: 0.57rem; font-weight: 750; }
.paywall-option { position: relative; margin-top: 0.65rem; padding: 0.85rem; border: 1px solid #d9d9d6; border-radius: 0.82rem; background: #f7f7f5; }
.paywall-option[hidden] { display: none; }
.paywall-price { display: flex; margin: 0; align-items: center; gap: 0.65rem; color: #191919; }
.paywall-price strong { font-family: var(--font-display); font-size: 2rem; letter-spacing: -0.04em; line-height: 1; }
.paywall-price > span { color: #505050; font-size: 0.72rem; font-weight: 750; line-height: 1.2; }
.paywall-price small { color: #6b6b6b; font-size: 0.62rem; font-weight: 600; }
.paywall-saving { position: absolute; top: 0.72rem; right: 0.72rem; padding: 0.22rem 0.4rem; border-radius: var(--badge-radius); color: #246f3d; background: #dff2e5; font-size: 0.62rem; font-weight: 850; text-transform: uppercase; }
.paywall-equivalent { margin: 0.32rem 0 0; color: #246f3d; font-size: 0.7rem; font-weight: 800; }
.paywall-benefits { display: grid; margin: 0.7rem 0 0; padding: 0; gap: 0.38rem; list-style: none; }
.paywall-benefits li { position: relative; padding-left: 1.2rem; color: #2f3437; font-size: 0.7rem; line-height: 1.35; }
.paywall-benefits li::before { position: absolute; left: 0; color: #2f8f4e; content: "✓"; font-weight: 900; }
.active-plan { border-color: #9dd5ac; background: #f4fbf6; }
.settings-delay-control { display: flex; margin-top: 0.7rem; align-items: center; justify-content: space-between; gap: 0.7rem; color: #191919; font-size: 0.74rem; font-weight: 750; }
.settings-delay-control select { min-height: 2.4rem; padding: 0.42rem 2rem 0.42rem 0.65rem; border: 1px solid #c9c9c5; border-radius: 0.58rem; color: #191919; background: #f7f7f5; font-size: 0.72rem; font-weight: 700; }
.settings-delay-control select:disabled { opacity: 0.5; }
.settings-note { margin: 0.55rem 0 0; color: var(--tg-theme-hint-color, var(--fallback-hint)); font-size: 0.7rem; }
.settings-collapsible { padding: 0; }
.settings-collapsible > summary { display: flex; padding: 0.82rem 0.9rem; align-items: center; justify-content: space-between; list-style: none; cursor: pointer; }
.settings-collapsible > summary::-webkit-details-marker { display: none; }
.settings-collapsible > summary > span:first-child { display: grid; gap: 0.15rem; font-size: 0.82rem; font-weight: 760; }
.settings-collapsible > summary small { color: var(--tg-theme-link-color, var(--blue-strong)); font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; }
.settings-collapsible[open] > summary > span:last-child { transform: rotate(45deg); }
.settings-collapsible .settings-rows { padding: 0 0.9rem 0.7rem; border-top: 1px solid var(--tg-theme-section-separator-color, var(--fallback-separator)); }
.settings-timezone-note { padding: 0 0.9rem 0.75rem; }

/* D-087 through D-089 glance-first operational views with light Notion-like surfaces */
.crm-page:not(.settings-page) .eyebrow { color: var(--tg-theme-link-color, var(--blue-strong)); }
.crm-page-icon { background: #191919; }
.app-footer .workspace-nav-button.active { color: var(--tg-theme-link-color, var(--blue-strong)); }
.crm-page:not(.settings-page) .dashboard-summary-card { border: 1px solid #d9d9d6; color: #191919; background: #fff; box-shadow: 0 0.2rem 0.6rem rgb(15 15 15 / 0.06); }
.crm-page:not(.settings-page) .dashboard-summary-card span { color: #000; font-size: calc(0.58rem + 1px); }
.crm-page:not(.settings-page) .dashboard-summary-card.urgent { border-color: #c93643; color: #a82431; background: #fff1f2; }
.crm-page:not(.settings-page) .dashboard-summary-card.warning { border-color: #e7ad11; color: #715500; background: #fff8df; }
.crm-page:not(.settings-page) .dashboard-summary-card.warning span { color: #000; }
.crm-page:not(.settings-page) .dashboard-summary-card.success { border-color: #2f8f4e; color: #246f3d; background: #edf8f0; }
.dashboard-summary-card { position: relative; }
.dashboard-summary-icon { position: absolute; top: 0.36rem; left: 0.36rem; width: 1.15rem; height: 1.15rem; background: #191919; -webkit-mask: var(--summary-icon) center / contain no-repeat; mask: var(--summary-icon) center / contain no-repeat; }
.dashboard-summary-icon--need-reply { --summary-icon: url("/assets/ui-warning.webp?v=20260809-153"); }
.dashboard-summary-icon--follow-up { --summary-icon: url("/assets/summary-follow-up.webp?v=20260809-153"); }
.dashboard-summary-icon--unverified { --summary-icon: url("/assets/summary-unverified.webp?v=20260809-153"); }
.dashboard-summary-icon--open-leads { --summary-icon: url("/assets/summary-open-leads.webp?v=20260809-153"); }
.dashboard-summary-icon--won-leads { --summary-icon: url("/assets/summary-won-leads.webp?v=20260809-153"); }
.dashboard-summary-icon--lost-leads { --summary-icon: url("/assets/summary-lost-leads.webp?v=20260809-153"); }
.dashboard-summary-icon--applied { --summary-icon: url("/assets/summary-applied.webp?v=20260809-153"); }
.dashboard-summary-icon--held { --summary-icon: url("/assets/summary-held.webp?v=20260809-153"); }
.dashboard-summary-icon--review { --summary-icon: url("/assets/summary-review.webp?v=20260809-153"); }
.crm-action-list, .crm-lead-list { display: grid; overflow: visible; border: 0; gap: 0.65rem; background: transparent; }
.crm-action-card, .crm-lead-card { padding: 0.85rem; border: 1px solid #d9d9d6; border-radius: 0.9rem; color: #191919; background: #fff; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.crm-action-card { padding-bottom: 0.4rem; }
.crm-action-card:first-child, .crm-lead-card:first-child { border-top: 0; }
.crm-action-card.awaiting, .crm-lead-card.lead-status-awaiting_reply { border-left: 0.3rem solid #c93643; }
.crm-action-card.follow-up, .crm-lead-card.lead-status-follow_up, .crm-lead-card.lead-status-pending, .crm-lead-card.lead-status-unverified { border-left: 0.3rem solid #e7ad11; }
.crm-lead-card.lead-status-won { border-left: 0.3rem solid #2f8f4e; }
.crm-lead-card.lead-status-lost, .crm-lead-card.lead-status-no_action { border-left: 0.3rem solid #8f8f8f; }
.crm-action-card h2, .crm-lead-card h2 { color: #191919; }
.crm-action-card .crm-customer, .crm-lead-card .crm-customer { color: #6b6b6b; }
.crm-lead-open p { color: #505050; }
.crm-status-label { flex: 0 0 auto; color: #2f3437; font-size: 0.64rem; font-weight: 850; letter-spacing: 0.02em; text-transform: uppercase; }
.crm-status-label.crm-needs-reply-badge, .crm-status-label.crm-lead-status-badge, .crm-status-label.crm-pipeline-status-badge, .crm-status-label.crm-decision-status-badge { display: inline-flex; padding: 0.18rem 0.38rem; align-items: center; gap: 0.22rem; border: 1px solid #8f8f8f; border-radius: var(--badge-radius); font-size: 0.58rem; letter-spacing: 0.03em; }
.crm-status-label.crm-needs-reply-badge { border-color: #c93643; color: #a82431; background: #fff1f2; }
.crm-lead-status-badge.status-pending, .crm-lead-status-badge.status-follow_up, .crm-lead-status-badge.status-unverified { border-color: #e7ad11; color: #715500; background: #fff8df; }
.crm-lead-status-badge.status-won { border-color: #72b889; color: #246f3d; background: #edf8f0; }
.crm-lead-status-badge.status-lost, .crm-lead-status-badge.status-no_action, .crm-lead-status-badge.status-active { color: #505050; background: #f1f1ef; }
.crm-status-badge-icon { width: 0.68rem; height: 0.68rem; flex: 0 0 0.68rem; background: currentColor; -webkit-mask: var(--status-badge-icon) center / contain no-repeat; mask: var(--status-badge-icon) center / contain no-repeat; }
.status-icon-needs-reply { --status-badge-icon: url("/assets/ui-warning.webp?v=20260809-153"); }
.status-icon-stage-new { --status-badge-icon: url("/assets/pipeline-new.webp?v=20260809-153"); }
.status-icon-stage-qualified { --status-badge-icon: url("/assets/pipeline-qualified.webp?v=20260809-153"); }
.status-icon-stage-offer { --status-badge-icon: url("/assets/pipeline-offer.webp?v=20260809-153"); }
.status-icon-stage-decision { --status-badge-icon: url("/assets/pipeline-decision.webp?v=20260809-153"); }
.status-icon-decision-applied { --status-badge-icon: url("/assets/summary-applied.webp?v=20260809-153"); }
.status-icon-decision-withheld { --status-badge-icon: url("/assets/summary-held.webp?v=20260809-153"); }
.status-icon-decision-review { --status-badge-icon: url("/assets/summary-review.webp?v=20260809-153"); }
.crm-last-message { border-left-color: #8f8f8f; background: #f1f1ef; }
.crm-last-message span { color: #6b6b6b; }
.crm-last-message p { color: #191919; }
.button.dark-secondary { border: 1px solid #8f8f8f; color: #2f3437; background: #f1f1ef; }
.button.dark-danger { border: 1px solid #e38890; color: #fff; background: #c93643; }
.crm-card-actions .button, .crm-last-message .crm-reply-button, .ai-decision-card .bad-decision-button, .pipeline-lead .view-chat-cue { min-height: 1.8rem; padding: 0.264rem 0.4rem; border-radius: 0.54rem; font-size: 0.72rem; font-weight: 750; line-height: 1.15; white-space: nowrap; }
.crm-reply-button { border: 1px solid #2aabee; color: #fff; background: #2aabee; }
.button.crm-icon-only-danger { width: 30px; min-width: 30px; height: 30px; min-height: 30px; padding: 0; border: 0; color: #c93643; background: transparent; }
.crm-icon-only-danger .crm-button-icon { width: 1.512rem; height: 1.512rem; flex-basis: 1.512rem; }
.crm-neutral-button { border: 1px solid #8f8f8f; color: #2f3437; background: #f1f1ef; }
.crm-reply-button, .crm-decision-button, .crm-close-button, .ai-decision-card .bad-decision-button { gap: 0.24rem; }
.crm-button-icon { width: 0.84rem; height: 0.84rem; flex: 0 0 0.84rem; background: currentColor; -webkit-mask: var(--crm-button-icon) center / contain no-repeat; mask: var(--crm-button-icon) center / contain no-repeat; }
.crm-button-icon--reply { --crm-button-icon: url("/assets/ui-reply-message.webp?v=20260809-153"); }
.crm-button-icon--bad-decision { --crm-button-icon: url("/assets/ui-bad-decision.webp?v=20260809-153"); }
.crm-button-icon--close-lead { --crm-button-icon: url("/assets/ui-close-lead.webp?v=20260809-153"); }
.crm-lead-card .crm-card-actions { justify-content: space-between; flex-wrap: nowrap; }
.crm-action-card .crm-card-actions { margin-top: 0.2rem; }
.crm-card-actions > .crm-reply-button, .crm-card-actions > .crm-view-chat-button { margin-left: auto; }
.crm-timestamp { color: #6b6b6b; font-size: 0.56rem; font-weight: 650; line-height: 1.3; white-space: nowrap; }
.crm-action-time { margin-left: auto; text-align: right; }
.crm-lead-time { flex: 0 1 auto; }
.crm-lead-open { display: block; }
.crm-lead-copy { width: 100%; min-width: 0; }
.crm-lead-title-row { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 0.65rem; }
.crm-lead-title-row h2 { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-lead-copy p, .pipeline-lead-open > p { padding: 0.52rem 0.62rem; border-left: 3px solid #8f8f8f; border-radius: 0.12rem 0.5rem 0.5rem 0.12rem; color: #3f3f3c; background: #f1f1ef; }
.crm-lead-copy p { display: block; overflow: visible; -webkit-line-clamp: unset; }
.view-chat-cue { display: inline-flex; margin-top: 0.48rem; align-items: center; gap: 0.3rem; color: #505050; font-size: 0.61rem; font-weight: 750; }
.view-chat-cue i { width: 1.032rem; height: 1.032rem; flex: 0 0 1.032rem; background: currentColor; mask: url("/assets/ui-view-chat.webp?v=20260809-153") center / contain no-repeat; -webkit-mask: url("/assets/ui-view-chat.webp?v=20260809-153") center / contain no-repeat; }
.crm-view-chat-button { gap: 0.35rem; border: 1px solid #8f8f8f; color: #2f3437; background: #f1f1ef; }
.crm-view-chat-button i { width: 1.02rem; height: 1.02rem; flex: 0 0 1.02rem; background: currentColor; mask: url("/assets/ui-view-chat.webp?v=20260809-153") center / contain no-repeat; -webkit-mask: url("/assets/ui-view-chat.webp?v=20260809-153") center / contain no-repeat; }

.pipeline-flow { display: grid; margin-top: 0.75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #d9d9d6; border-radius: 0.9rem; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.pipeline-flow-stage { --stage-accent: #6b6b6b; position: relative; display: grid; min-width: 0; min-height: 5.75rem; padding: 0.62rem 0.38rem; align-content: start; justify-items: center; border: 0; color: #2f3437; background: #f1f1ef; font: inherit; text-align: center; cursor: pointer; }
.pipeline-flow-stage[aria-pressed="true"] { z-index: 2; box-shadow: inset 0 0 0 0.16rem #2aabee; }
.pipeline-flow-stage::after { position: absolute; z-index: 1; top: 50%; right: -0.31rem; width: 0.62rem; height: 0.62rem; content: ""; background: inherit; transform: translateY(-50%) rotate(45deg); }
.pipeline-flow-stage:last-child::after { display: none; }
.pipeline-flow-stage.stage-qualified { --stage-accent: #e7ad11; color: #715500; background: #fff1bd; }
.pipeline-flow-stage.stage-offer { --stage-accent: #d97706; color: #854a0e; background: #fde5c7; }
.pipeline-flow-stage.stage-decision { --stage-accent: #2f8f4e; color: #246f3d; background: #dff2e5; }
.pipeline-flow-stage > span { display: block; width: 1.15rem; height: 1.15rem; border: 0; border-radius: 0; color: #191919; background: transparent; }
.pipeline-stage-icon { display: block; width: 1.15rem; height: 1.15rem; background: #191919; -webkit-mask: var(--pipeline-stage-icon) center / contain no-repeat; mask: var(--pipeline-stage-icon) center / contain no-repeat; }
.pipeline-stage-icon--new { --pipeline-stage-icon: url("/assets/pipeline-new.webp?v=20260809-153"); }
.pipeline-stage-icon--qualified { --pipeline-stage-icon: url("/assets/pipeline-qualified.webp?v=20260809-153"); }
.pipeline-stage-icon--offer { --pipeline-stage-icon: url("/assets/pipeline-offer.webp?v=20260809-153"); }
.pipeline-stage-icon--decision { --pipeline-stage-icon: url("/assets/pipeline-decision.webp?v=20260809-153"); }
.pipeline-flow-stage strong { margin-top: 0.32rem; overflow: hidden; font-size: 0.74rem; line-height: 1.15; text-overflow: ellipsis; }
.pipeline-flow-stage small { display: -webkit-box; min-height: 1.5rem; margin-top: 0.16rem; overflow: hidden; color: currentColor; font-size: 0.62rem; font-weight: 600; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pipeline-flow-stage b { margin-top: auto; font-size: 1.08rem; line-height: 1; }
.pipeline-lead-list { display: grid; margin-top: 0.65rem; gap: 0.55rem; }
.pipeline-lead { padding: 0.75rem 0.82rem; border: 1px solid #d9d9d6; border-radius: 0.82rem; color: #191919; background: #fff; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.pipeline-lead-open { display: block; width: 100%; padding: 0; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.pipeline-lead .view-chat-cue { display: flex; width: max-content; margin: 0 0 0 auto; border: 1px solid #8f8f8f; color: #2f3437; background: #f1f1ef; }
.pipeline-lead-head { display: flex; align-items: center; justify-content: space-between; gap: 0.7rem; }
.pipeline-lead-head .crm-pipeline-status-badge { color: #505050; background: #f1f1ef; }
.pipeline-lead-head .crm-pipeline-status-badge.stage-qualified { border-color: #e7ad11; color: #715500; background: #fff8df; }
.pipeline-lead-head .crm-pipeline-status-badge.stage-offer { border-color: #d97706; color: #854a0e; background: #fff3e4; }
.pipeline-lead-head .crm-pipeline-status-badge.stage-decision { border-color: #2f8f4e; color: #246f3d; background: #edf8f0; }
.pipeline-lead-head h2 { margin: 0; color: #191919; font-size: 0.88rem; }
.pipeline-stage-state { display: flex; flex: 0 0 auto; align-items: center; gap: 0.42rem; }
.pipeline-stage-state > strong { color: #191919; font-size: 1.1rem; }
.pipeline-stage-state > strong small { color: #6b6b6b; font-size: 0.58rem; }
.pipeline-lead-open > p { margin: 0.42rem 0 0; color: #505050; font-size: 0.68rem; line-height: 1.4; }
.pipeline-card-meta { display: flex; min-height: 1.8rem; margin-top: 0.48rem; align-items: center; justify-content: space-between; gap: 0.5rem; }
.pipeline-progress { display: grid; margin-top: 0.55rem; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.2rem; }
.pipeline-progress i { height: 0.22rem; border-radius: 999px; background: #d9d9d6; }
.pipeline-progress i.complete { background: #2f8f4e; }

.ai-decision-list { gap: 0.7rem; }
.ai-customer-group { overflow: hidden; border: 1px solid #d9d9d6; border-radius: 0.9rem; background: #fff; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.ai-customer-head { display: flex; padding: 0.72rem 0.82rem; align-items: center; justify-content: space-between; gap: 0.65rem; border-bottom: 1px solid #d9d9d6; background: #f7f7f5; }
.ai-customer-head > div { display: grid; min-width: 0; gap: 0.1rem; }
.ai-customer-head strong { overflow: hidden; color: #191919; font-size: 0.86rem; text-overflow: ellipsis; white-space: nowrap; }
.ai-customer-head span { overflow: hidden; color: #6b6b6b; font-size: 0.61rem; text-overflow: ellipsis; white-space: nowrap; }
.ai-customer-head b { flex: 0 0 auto; color: #505050; font-size: 0.61rem; }
.ai-customer-decisions { display: grid; gap: 0; }
.ai-decision-history { border-top: 1px solid #d9d9d6; }
.ai-decision-history > summary { display: flex; min-height: 2.35rem; padding: 0.55rem 0.82rem; align-items: center; justify-content: space-between; color: #505050; background: #f7f7f5; font-size: 0.68rem; font-weight: 750; list-style: none; cursor: pointer; }
.ai-decision-history > summary::-webkit-details-marker { display: none; }
.ai-decision-history > summary::before { margin-right: 0.35rem; content: "›"; font-size: 1rem; line-height: 1; transition: transform 120ms ease; }
.ai-decision-history[open] > summary::before { transform: rotate(90deg); }
.ai-decision-history > summary span { min-width: 1.25rem; padding: 0.12rem 0.32rem; border-radius: 0.35rem; color: #505050; background: #e9e9e6; text-align: center; }
.ai-decision-history > div { display: grid; }
.ai-history-decision[hidden] { display: none; }
.ai-history-pagination { display: grid; padding: 0.55rem 0.72rem; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.55rem; border-top: 1px solid #d9d9d6; background: #f7f7f5; }
.ai-history-pagination button { min-height: 1.9rem; padding: 0.3rem 0.55rem; border: 1px solid #b8b8b3; border-radius: 0.5rem; color: #2f3437; background: #fff; font: inherit; font-size: 0.65rem; font-weight: 750; cursor: pointer; }
.ai-history-pagination button:disabled { cursor: default; opacity: 0.4; }
.ai-history-pagination span { color: #6b6b6b; font-size: 0.62rem; font-weight: 700; text-align: center; }
.ai-decision-card { padding: 0; overflow: hidden; border: 1px solid #d9d9d6; color: #191919; background: #fff; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.ai-customer-group .ai-decision-card { border-width: 0 0 1px; border-radius: 0; box-shadow: none; }
.ai-customer-group .ai-decision-card:last-child { border-bottom: 0; }
.ai-decision-card > summary { display: flex; min-height: 4rem; padding: 0.72rem 0.82rem; align-items: center; justify-content: space-between; gap: 0.5rem 0.7rem; flex-wrap: wrap; list-style: none; cursor: pointer; }
.ai-decision-card > summary::-webkit-details-marker { display: none; }
.ai-decision-card > summary > div { display: grid; min-width: 0; gap: 0.12rem; }
.ai-decision-card > summary .crm-customer { color: #6b6b6b; }
.ai-decision-card > summary strong { overflow: hidden; color: #191919; font-size: 0.84rem; text-overflow: ellipsis; white-space: nowrap; }
.ai-decision-card > summary small { color: #6b6b6b; font-size: 0.6rem; }
.decision-result { flex: 0 0 auto; }
.crm-decision-status-badge.status-applied { border-color: #2f8f4e; color: #246f3d; background: #edf8f0; }
.crm-decision-status-badge.status-withheld { border-color: #8f8f8f; color: #505050; background: #f1f1ef; }
.crm-decision-status-badge.status-review { border-color: #e7ad11; color: #715500; background: #fff8df; }
.decision-expand-label { flex: 1 0 100%; color: #505050; font-size: 0.61rem; font-weight: 750; }
.decision-expand-label::before { margin-right: 0.25rem; content: "›"; }
.ai-decision-card[open] .decision-expand-label::before { content: "⌄"; }
.ai-decision-time { flex: 1 0 100%; text-align: right; }
.decision-detail { padding: 0.75rem 0.82rem; border-top: 1px solid #d9d9d6; background: #f7f7f5; }
.decision-detail h3 { margin: 0 0 0.5rem; color: #191919; font-size: 0.72rem; }
.decision-detail-meta { display: flex; justify-content: space-between; gap: 0.7rem; color: #6b6b6b; font-size: 0.6rem; }
.decision-detail > p { margin: 0.5rem 0 0.7rem; color: #2f3437; font-size: 0.7rem; line-height: 1.45; }
.ai-decision-review { border-left-color: #e7ad11; background: #fff8df; }
.ai-decision-review p { color: #715500; }

.reports-page .dashboard-toolbar { margin-top: 0.8rem; }
.daily-report-card { padding: 0; overflow: hidden; border: 1px solid #d9d9d6; color: #191919; background: #fff; box-shadow: 0 0.25rem 0.75rem rgb(15 15 15 / 0.07); }
.daily-report-card > header { display: block; padding: 0.8rem 0.9rem 0; }
.daily-report-card > header > span { color: #6b6b6b; font-size: 0.58rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.daily-report-card h2 { margin-top: 0.18rem; color: #191919; }
.daily-report-summary { padding: 0 0.9rem; color: #2f3437; }
.report-metrics { padding: 0 0.9rem; }
.report-metric { color: #191919; background: #f1f1ef; }
.report-metric span { color: #000; font-size: calc(0.56rem + 1px); }
.report-details { margin: 0.7rem 0.9rem 0; border-top-color: #d9d9d6; }
.report-details summary { color: #191919; }
.report-insights ul { color: #505050; }
.report-timezone { margin: 0.75rem 0 0; padding: 0.6rem 0.9rem; color: #6b6b6b; background: #f1f1ef; }
.report-timezone time { white-space: normal; }

@media (min-width: 34rem) {
  .dashboard-toolbar { grid-template-columns: minmax(0, 1fr) auto auto; }
  .dashboard-toolbar .dashboard-search { grid-column: auto; }
}

.conversation-shell .app-header, .conversation-footer { display: none; }
.app-main.conversation-active { max-width: 42rem; padding: 0; overflow: hidden; background: #f1f1ef; }
.conversation-page { display: grid; height: 100%; min-height: 0; grid-template-rows: auto minmax(0, 1fr) auto; background: #f1f1ef; }
.conversation-header { z-index: 2; display: flex; min-height: calc(3.75rem + env(safe-area-inset-top)); padding: calc(0.55rem + env(safe-area-inset-top)) 0.8rem 0.55rem; align-items: center; gap: 0.65rem; border-bottom: 1px solid #d8dde1; background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 0.06); }
.conversation-header h1 { margin: 0; font-size: 1.05rem; letter-spacing: -0.02em; }
.conversation-header p { margin: 0.12rem 0 0; color: var(--fallback-hint); font-size: 0.75rem; }
.conversation-back { width: 2.15rem; height: 2.15rem; padding: 0; border: 0; color: var(--blue-strong); background: transparent; font-size: 2rem; line-height: 1; cursor: pointer; }
.conversation-messages { min-height: 0; padding: 0.8rem max(0.65rem, env(safe-area-inset-right)) 0.65rem max(0.65rem, env(safe-area-inset-left)); overflow-y: auto; overscroll-behavior: contain; background-color: #f1f1ef; background-image: linear-gradient(rgb(255 255 255 / 0.38), rgb(255 255 255 / 0.38)), url("/assets/gramlead-chat-wallpaper-v1.webp?v=20260809-153"); background-position: center; background-repeat: no-repeat; background-size: cover; }
.chat-message { width: fit-content; max-width: min(84%, 30rem); margin: 0.24rem 0; padding: 0.48rem 0.62rem 0.28rem; border-radius: 0.75rem; background: #fff; box-shadow: 0 1px 1px rgb(0 0 0 / 0.08); overflow-wrap: anywhere; }
.chat-message.outbound { margin-left: auto; background: #e7ffcf; border-bottom-right-radius: 0.2rem; }
.chat-message.inbound { margin-right: auto; border-bottom-left-radius: 0.2rem; }
.chat-message p { margin: 0; font-size: 0.88rem; line-height: 1.42; }
.chat-message footer { display: flex; margin-top: 0.16rem; justify-content: flex-end; gap: 0.28rem; color: #819087; font-size: 0.61rem; }
.chat-day { display: flex; margin: 0.7rem 0; justify-content: center; }
.chat-day span, .chat-older-status, .chat-history-start { width: fit-content; margin: 0.35rem auto 0.75rem; padding: 0.22rem 0.5rem; border-radius: var(--badge-radius); color: #fff; background: rgb(84 114 92 / 0.62); font-size: 0.66rem; font-weight: 700; }
.chat-image-link { display: block; padding: 0.45rem 0.6rem; border: 1px solid #bed9e7; border-radius: var(--badge-radius); color: var(--blue-strong); background: #edf8fd; font-size: 0.75rem; font-weight: 700; cursor: pointer; }
.chat-image { display: block; width: min(100%, 22rem); max-height: 28rem; border-radius: 0.45rem; object-fit: contain; }
.chat-deleted { color: var(--fallback-hint); font-size: 0.78rem; }
.chat-pending { color: var(--blue-strong); }
.chat-loading, .chat-empty { margin: 2rem auto; padding: 0.4rem 0.6rem; width: fit-content; border-radius: var(--badge-radius); color: #fff; background: rgb(84 114 92 / 0.62); font-size: 0.72rem; }
.conversation-composer { padding: 0.45rem max(0.55rem, env(safe-area-inset-right)) calc(0.45rem + env(safe-area-inset-bottom)) max(0.55rem, env(safe-area-inset-left)); border-top: 1px solid #d8dde1; background: #fff; }
.conversation-composer .generate-suggested-response { display: flex; width: 100%; min-height: 2.65rem; margin: 0 0 0.45rem; align-items: center; justify-content: center; gap: 0.5rem; border: 1px solid #9fd3ef; border-radius: 0.72rem; color: #087ebd; background: #edf8fd; font-size: 0.86rem; font-weight: 800; }
.generate-suggested-response img { width: 1.35rem; height: 1.35rem; object-fit: contain; }
.suggested-response-panel { margin: 0 0 0.45rem; padding: 0.72rem; border: 1px solid #d8dde1; border-radius: 0.72rem; background: #f8f9fa; box-shadow: 0 1px 3px rgb(0 0 0 / 0.06); }
.suggested-response-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; font-size: 0.76rem; }
.suggested-response-heading > div { display: flex; min-width: 0; align-items: center; gap: 0.42rem; }
.suggested-response-heading span { padding: 0.12rem 0.35rem; border-radius: 999px; color: #5d6770; background: #e7eaed; font-size: 0.62rem; text-transform: uppercase; }
.conversation-composer .toggle-suggested-response { min-width: 0; min-height: 1.8rem; padding: 0.28rem 0.52rem; border: 1px solid #c9d0d6; border-radius: 0.48rem; color: #53606a; background: #fff; font-size: 0.68rem; font-weight: 750; }
.suggested-response-text, .suggested-response-translation p { margin: 0.5rem 0; color: #202529; font-size: 0.86rem; line-height: 1.42; overflow-wrap: anywhere; }
.conversation-composer .copy-suggested-response, .open-suggested-response-chat { display: grid; width: 100%; min-height: 2.25rem; border-radius: 0.58rem; place-items: center; font-size: 0.78rem; }
.open-suggested-response-chat { margin-top: 0.4rem; color: #fff; background: var(--blue-strong); font-weight: 750; text-decoration: none; }
.suggested-response-translation { margin-top: 0.68rem; padding-top: 0.62rem; border-top: 1px solid #d8dde1; }
.suggested-response-translation strong { color: #66717a; font-size: 0.7rem; }
.conversation-composer > div { display: flex; align-items: end; gap: 0.45rem; }
.conversation-composer textarea { width: 100%; min-height: 2.55rem; max-height: 7rem; padding: 0.65rem 0.8rem; resize: vertical; border: 1px solid #dfe3e7; border-radius: 0.7rem; outline: none; font: inherit; font-size: 0.88rem; }
.conversation-composer textarea:focus { border-color: var(--blue); }
.conversation-composer button { min-width: 3.6rem; min-height: 2.55rem; padding: 0.55rem; border: 0; border-radius: 0.7rem; color: white; background: var(--blue); font-weight: 750; cursor: pointer; }
.conversation-composer button:disabled { opacity: 0.48; }
.composer-warning { margin: 0 0 0.38rem; color: var(--red); font-size: 0.68rem; line-height: 1.35; }
.composer-feedback { margin: 0 0 0.38rem; color: var(--blue-strong); font-size: 0.68rem; line-height: 1.35; }
.composer-feedback.error { color: var(--red); }