:root {
  color-scheme: light;
  --canvas: #f4f7f4;
  --paper: #ffffff;
  --paper-soft: #eef3ef;
  --ink: #193638;
  --ink-soft: #35514e;
  --muted: #526660;
  --muted-fine: #5b6d67;
  --line: #dce5e0;
  --line-strong: #cad8d2;
  --petrol: #173b3e;
  --petrol-2: #234d4e;
  --teal: #147a70;
  --teal-hover: #0d625b;
  --teal-soft: #e7f3ee;
  --signal: #d4eb70;
  --amber: #784a0b;
  --amber-soft: #fff3d8;
  --red: #913a35;
  --red-soft: #fcecea;
  --blue: #315d78;
  --blue-soft: #eaf2f8;
  --color-primary: #147a70;
  --color-primary-hover: #0d625b;
  --color-primary-active: #0a514d;
  --color-primary-text: #ffffff;
  --color-accent: #d4eb70;
  --color-accent-hover: #c6df5b;
  --color-accent-active: #b8d344;
  --color-accent-text: #173b3e;
  --color-canvas: #f4f7f4;
  --color-surface: #ffffff;
  --color-surface-muted: #eef3ef;
  --color-text: #193638;
  --color-text-muted: #526660;
  --color-text-fine: #5b6d67;
  --color-border: #dce5e0;
  --color-border-strong: #cad8d2;
  --color-positive: #23664f;
  --color-positive-bg: #e7f3ee;
  --color-positive-border: #b9d9c9;
  --color-warning: #784a0b;
  --color-warning-bg: #fff3d8;
  --color-warning-border: #e9ce90;
  --color-negative: #913a35;
  --color-negative-bg: #fcecea;
  --color-negative-border: #e9c4bf;
  --color-info: #315d78;
  --color-info-bg: #eaf2f8;
  --color-info-border: #c8dbe8;
  --font-heading: "Manrope", "DM Sans", system-ui, sans-serif;
  --font-body: "DM Sans", "Segoe UI", system-ui, sans-serif;
  --font-display: clamp(39px, 7vw, 76px);
  --font-h1: clamp(20px, 1.1vw + 17px, 28px);
  --font-h2: clamp(20px, 1vw + 16px, 24px);
  --font-h3: clamp(18px, .6vw + 16px, 20px);
  --font-h4: clamp(16px, .4vw + 15px, 18px);
  --font-body-lg: clamp(16px, .36vw + 15px, 18px);
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --radius-sm: 5px;
  --radius-default: 7px;
  --radius-card: 9px;
  --radius-modal: 13px;
  --radius-full: 9999px;
  --shadow-floating: 0 8px 24px rgba(23, 59, 62, .12);
  --transition-duration: 160ms;
  --transition-easing: cubic-bezier(.2, .7, .3, 1);
  --shadow: 0 18px 50px rgba(27, 53, 51, .12);
  font-family: "DM Sans", "Segoe UI", sans-serif;
  background: var(--canvas);
  color: var(--ink);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--canvas); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #147a70;
  outline-offset: 2px;
}
.sidebar :focus-visible { outline-color: #d4eb70; }
a { color: inherit; text-decoration: none; }
svg { display: block; }

.app-shell { min-height: 100vh; }
.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 10; width: 258px; padding: 25px 16px 14px;
  display: flex; flex-direction: column; color: #e4efea; background: var(--petrol);
}
.brand { display: flex; align-items: center; gap: 11px; padding: 0 7px; min-height: 44px; }
.brand-mark { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; color: var(--petrol); background: var(--signal); }
.brand-mark img { width: 27px; height: 27px; }
.brand-copy, .workspace-copy, .profile-copy { display: flex; flex-direction: column; min-width: 0; }
.brand-copy strong { font: 800 22px/1 "Manrope", sans-serif; letter-spacing: -.9px; color: #f7faf8; }
.brand-copy small { margin-top: 4px; color: #a6bfba; font-size: 12px; letter-spacing: .1px; }
.workspace-switch {
  width: 100%; display: flex; align-items: center; gap: 10px; margin-top: 32px; padding: 10px;
  text-align: left; border: 1px solid rgba(218, 235, 226, .13); border-radius: 10px; color: inherit; background: rgba(255,255,255,.055); cursor: pointer;
}
.workspace-switch:hover { background: rgba(255,255,255,.09); }
.workspace-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; color: #16393b; background: #dbe9e1; font: 700 12px "Manrope", sans-serif; }
.workspace-copy { flex: 1; gap: 2px; }
.workspace-copy strong, .profile-copy strong { font-size: 12px; font-weight: 600; color: #f5faf6; }
.workspace-copy small, .profile-copy small { font-size: 12px; color: #a4bab5; }
.chevron { width: 15px; height: 15px; color: #a6bfba; }
.nav-group-label { margin: 32px 10px 9px; color: #93aaa4; font-size: 12px; font-weight: 600; }
.main-nav { display: flex; flex-direction: column; gap: 4px; }
.nav-link { position: relative; display: flex; align-items: center; gap: 12px; min-height: 41px; padding: 0 11px; border-radius: 8px; color: #c0d0ca; font-size: 12px; font-weight: 500; transition: background .16s ease, color .16s ease; }
.nav-link:hover { color: #fff; background: rgba(255,255,255,.07); }
.nav-link.active { color: #fff; background: rgba(255,255,255,.115); box-shadow: inset 3px 0 var(--signal); }
.nav-link svg { width: 17px; height: 17px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
.nav-link span:nth-child(2) { flex: 1; }
.nav-count { min-width: 20px; padding: 3px 6px; border-radius: 99px; text-align: center; color: #c6d9d2; background: rgba(255,255,255,.1); font-size: 12px; font-weight: 700; }
.nav-count-accent { color: #eaf3c4; background: rgba(212,235,112,.16); }
.sidebar-spacer { flex: 1; min-height: 30px; }
.whatsapp-status { display: flex; align-items: center; gap: 9px; margin: 0 2px 12px; padding: 10px 8px; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(255,255,255,.1); }
.connection-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #e3ad5b; box-shadow: 0 0 0 3px rgba(227,173,91,.14); }
.whatsapp-status div { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.whatsapp-status strong { font-size: 12px; font-weight: 600; color: #e4ede8; }
.whatsapp-status small { overflow: hidden; color: #9fb4ad; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.profile-button { display: flex; align-items: center; gap: 9px; padding: 8px 7px; text-align: left; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.profile-button:hover { background: rgba(255,255,255,.07); }
.profile-avatar, .topbar-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 31px; height: 31px; border-radius: 50%; color: #234b4a; background: #dce9df; font: 700 12px "Manrope", sans-serif; }
.profile-copy { flex: 1; gap: 3px; }
.profile-menu { width: 18px; height: 18px; color: #9fb4ad; fill: currentColor; stroke: none; }

.main-area { min-height: 100vh; margin-left: 258px; }
.topbar { height: 65px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(22px, 4vw, 56px); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.72); }
.breadcrumbs { display: flex; align-items: center; gap: 11px; color: var(--muted-fine); font-size: 12px; }
.breadcrumbs strong { color: #365153; font-weight: 600; }
.crumb-divider { color: #c2cfca; }
.topbar-actions { display: flex; align-items: center; gap: 18px; }
.global-search { width: min(300px, 31vw); height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 9px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.global-search svg { width: 15px; height: 15px; fill: none; stroke: #8da09b; stroke-width: 1.6; stroke-linecap: round; }
.global-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 12px; }
.global-search input::placeholder { color: var(--muted-fine); }
.global-search kbd { flex: 0 0 auto; padding: 2px 4px; border: 1px solid #e3e9e6; border-radius: 3px; color: var(--muted-fine); font-family: inherit; font-size: 12px; }
.icon-button { position: relative; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid transparent; border-radius: 7px; color: #627674; background: transparent; cursor: pointer; }
.icon-button:hover { border-color: var(--line); background: #fff; }
.icon-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.notification-button i { position: absolute; top: 6px; right: 6px; width: 6px; height: 6px; border: 1px solid #fff; border-radius: 50%; background: #d29138; }
.topbar-avatar { width: 29px; height: 29px; color: #315a56; background: #d9e8dc; }
.page-content { max-width: 1480px; margin: 0 auto; padding: 32px clamp(22px, 4vw, 56px) 60px; }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 25px; }
.page-heading h1 { margin: 0; color: var(--ink); font: 700 clamp(22px, 2vw, 27px)/1.25 "Manrope", "DM Sans", sans-serif; letter-spacing: -.8px; }
.page-heading p { margin: 7px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.heading-actions { display: flex; align-items: center; gap: 9px; }
.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 13px; border: 1px solid transparent; border-radius: 7px; cursor: pointer; font-size: 12px; font-weight: 600; transition: background-color var(--transition-duration) var(--transition-easing), border-color var(--transition-duration) var(--transition-easing), color var(--transition-duration) var(--transition-easing); }
.button:active { transform: translateY(1px); }
.button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.button-primary { color: var(--petrol); background: var(--signal); }
.button-primary:hover { background: #c6df5b; }
.button-primary:active { background: #b8d344; }
.button-primary:disabled, .button-primary[aria-disabled="true"] { color: #526660; background: #e8eecc; cursor: not-allowed; }
.button-dark { color: #fff; background: var(--petrol); }
.button-dark:hover { background: #285355; }
.button-secondary { border-color: var(--line-strong); color: #486164; background: #fff; }
.button-secondary:hover { border-color: #aebfba; background: #f9fbf9; }
.button-danger { color: var(--red); border-color: #ead3cf; background: #fff; }
.button-danger:hover { background: var(--red-soft); }
.button-small { min-height: 31px; padding: 0 10px; font-size: 12px; }
.button-block { width: 100%; }
.text-button { display: inline-flex; align-items: center; gap: 5px; padding: 0; border: 0; color: var(--teal); background: transparent; cursor: pointer; font-size: 12px; font-weight: 600; }
.text-button:hover { color: var(--teal-hover); text-decoration: underline; }
.text-button svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.overview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 23px; }
.metric-card { min-height: 111px; padding: 16px 17px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.metric-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted-fine); font-size: 12px; font-weight: 500; }
.metric-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; color: var(--teal); background: #e8f3ee; }
.metric-icon.amber { color: var(--amber); background: #fbf2e4; }
.metric-icon.blue { color: var(--blue); background: #eaf1f5; }
.metric-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.metric-value { margin-top: 12px; color: #1d3d3f; font: 700 24px/1 "Manrope", sans-serif; letter-spacing: -.6px; }
.metric-caption { margin-top: 6px; color: var(--muted-fine); font-size: 12px; }
.metric-caption .up { color: var(--teal); font-weight: 700; }

.dashboard-main-grid { display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(280px, .72fr); gap: 16px; align-items: start; }
.panel { border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.panel + .panel { margin-top: 15px; }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 57px; padding: 0 16px; border-bottom: 1px solid #eaf0ec; }
.panel-title { margin: 0; color: #29484a; font: 700 12px "Manrope", sans-serif; letter-spacing: -.15px; }
.panel-subtitle { display: block; margin-top: 4px; color: var(--muted-fine); font-size: 12px; font-weight: 400; }
.panel-body { padding: 0 16px; }
.panel-footer { display: flex; justify-content: center; padding: 12px 16px; border-top: 1px solid #edf1ee; }
.section-label { margin: 0 0 12px; color: var(--muted-fine); font-size: 12px; font-weight: 600; }

.followup-list { display: flex; flex-direction: column; }
.followup-row { display: grid; grid-template-columns: 35px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 68px; border-bottom: 1px solid #edf1ee; }
.followup-row:last-child { border-bottom: 0; }
.initials { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: #38625e; background: #e5eee8; font: 700 12px "Manrope", sans-serif; }
.initials.i2 { color: #80653c; background: #f4eddf; }
.initials.i3 { color: var(--blue); background: #e7eff3; }
.followup-info { min-width: 0; }
.followup-info strong { display: block; overflow: hidden; color: #385456; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.followup-info span { display: block; overflow: hidden; margin-top: 4px; color: var(--muted-fine); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.followup-due { padding: 4px 6px; border-radius: 5px; color: var(--amber); background: var(--amber-soft); font-size: 12px; font-weight: 700; white-space: nowrap; }
.followup-due.late { color: var(--red); background: var(--red-soft); }
.followup-due.future { color: var(--muted-fine); background: #f0f4f1; }
.followup-row .followup-action { display: none; }
.followup-row:hover .followup-due { display: none; }
.followup-row:hover .followup-action { display: inline-flex; }
.empty-inline { padding: 23px 8px; text-align: center; color: var(--muted-fine); font-size: 12px; }
.empty-inline strong { display: block; margin-bottom: 4px; color: #52706d; font-size: 12px; }

.pipeline { padding: 16px; }
.pipeline-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; }
.reports-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; }
.report-metrics .metric-value { overflow-wrap: anywhere; }
.report-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.report-panel { min-width: 0; }
.report-panel .panel-header { min-height: 62px; }
.report-panel-body { display: grid; gap: 13px; padding: 16px; }
.report-bar-row { display: grid; grid-template-columns: minmax(80px, .9fr) minmax(48px, 1.1fr) 30px; align-items: center; gap: 9px; min-width: 0; }
.report-bar-row > span { overflow: hidden; color: #526660; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.report-bar-row > strong { color: #29484a; font: 700 12px "Manrope", sans-serif; text-align: right; }
.report-bar-track { height: 8px; overflow: hidden; border-radius: 99px; background: #edf2ed; }
.report-bar-track i { display: block; height: 100%; min-width: 3px; border-radius: inherit; background: linear-gradient(90deg, #4b8f81, #b5ce67); }
.report-panel-note, .report-definition { color: var(--muted-fine); font-size: 11px; line-height: 1.55; }
.report-panel-note { margin: 0; padding: 0 16px 15px; }
.report-definition { margin: 14px 0 0; }
.report-payment-rows > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--line); }
.report-payment-rows > div:last-child { border-bottom: 0; }
.report-payment-rows span { color: #526660; font-size: 12px; }
.report-payment-rows strong { color: #29484a; font: 700 15px "Manrope", sans-serif; }
.report-payment-rows small { grid-column: 1 / -1; color: var(--muted-fine); font-size: 11px; }
.pipeline-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pipeline-stage { min-height: 80px; padding: 11px 10px 9px; border-left: 2px solid #d7e2dd; background: #f8faf8; }
.pipeline-stage:nth-child(2) { border-color: #d5df89; }
.pipeline-stage:nth-child(3) { border-color: #66a79a; }
.pipeline-stage span { color: var(--muted-fine); font-size: 12px; }
.pipeline-stage strong { display: block; margin-top: 11px; color: #29484a; font: 700 19px/1 "Manrope", sans-serif; }
.pipeline-stage small { display: block; margin-top: 4px; color: var(--muted-fine); font-size: 12px; }
.mini-progress { height: 3px; overflow: hidden; margin-top: 12px; border-radius: 9px; background: #e9efeb; }
.mini-progress i { display: block; height: 100%; border-radius: inherit; background: var(--teal); }

.demo-proof-panel { overflow: hidden; }
.demo-proof-panel .panel-header { align-items: flex-start; padding-top: 13px; padding-bottom: 11px; }
.demo-proof-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 99px; color: #23664f; background: #e7f3ee; font-size: 12px; font-weight: 600; white-space: nowrap; }
.demo-proof-badge i { width: 7px; height: 7px; border-radius: 50%; background: #23664f; }
.demo-proof-body { padding: 13px 16px 15px; }
.demo-proof-intro, .demo-proof-note p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.demo-proof-steps { display: grid; gap: 3px; margin: 12px 0; padding: 0; list-style: none; }
.demo-proof-steps li { min-width: 0; }
.demo-proof-steps button { display: grid; grid-template-columns: 27px minmax(0, 1fr) auto; align-items: center; gap: 9px; width: 100%; min-height: 47px; padding: 5px 2px; border: 0; border-bottom: 1px solid #edf1ee; color: var(--ink); background: transparent; text-align: left; cursor: pointer; }
.demo-proof-steps button:hover .demo-proof-open { text-decoration: underline; }
.demo-proof-number { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px; color: var(--petrol); background: #eaf2ed; font: 700 12px/1 "Manrope", sans-serif; }
.demo-proof-steps strong, .demo-proof-steps small { display: block; }
.demo-proof-steps strong { color: #29484a; font-size: 12px; font-weight: 700; }
.demo-proof-steps small { margin-top: 2px; color: var(--muted-fine); font-size: 12px; line-height: 1.35; }
.demo-proof-open { color: var(--teal); font-size: 12px; font-weight: 700; }
.demo-proof-note { padding: 10px 11px; border: 1px solid #dce8df; border-radius: 7px; background: #f6f9f6; }
.demo-proof-note strong { display: block; margin-bottom: 4px; color: #29484a; font-size: 12px; }
.demo-proof-readonly { margin: 10px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.45; }

.table-panel { overflow: hidden; }
.table-tools { display: flex; align-items: center; gap: 8px; }
.filter-select { min-height: 31px; padding: 0 25px 0 9px; border: 1px solid var(--line); border-radius: 6px; color: #607472; background: #fff; font-size: 12px; }
.table-wrap { width: 100%; overflow: auto; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; }
.data-table th { height: 37px; padding: 0 15px; color: var(--muted-fine); background: #f8faf8; font-size: 12px; font-weight: 600; }
.data-table td { height: 54px; padding: 0 15px; border-top: 1px solid #eef2ef; color: #506665; font-size: 12px; }
.data-table tbody tr { cursor: pointer; transition: background .12s ease; }
.data-table tbody tr:hover { background: #f8fbf8; }
.customer-cell { display: flex; align-items: center; gap: 9px; }
.customer-cell .initials { width: 29px; height: 29px; border-radius: 8px; font-size: 12px; }
.customer-cell strong { display: block; color: #355456; font-size: 12px; font-weight: 600; }
.customer-cell small { display: block; margin-top: 3px; color: var(--muted-fine); font-size: 12px; }
.table-number { color: var(--muted-fine); font-size: 12px; }
.amount { color: #355354; font-size: 12px; font-weight: 700; }
.table-empty { padding: 38px 16px; text-align: center; color: var(--muted-fine); font-size: 12px; }

.toolbar-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.filter-tabs { display: flex; align-items: center; gap: 4px; padding: 3px; border: 1px solid var(--line); border-radius: 7px; background: #f9fbf9; }
.filter-tab { min-height: 28px; padding: 0 10px; border: 0; border-radius: 5px; color: var(--muted-fine); background: transparent; cursor: pointer; font-size: 12px; font-weight: 500; white-space: nowrap; }
.filter-tab:hover { color: #42605d; }
.filter-tab.active { color: #24494a; background: white; box-shadow: 0 1px 3px rgba(34,62,58,.11); font-weight: 700; }
.inline-search { display: flex; align-items: center; gap: 7px; width: 205px; min-height: 32px; padding: 0 9px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.inline-search svg { width: 14px; height: 14px; fill: none; stroke: #8fa09b; stroke-width: 1.6; stroke-linecap: round; }
.inline-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: #435d5b; background: transparent; font-size: 12px; }
.inline-search input::placeholder { color: var(--muted-fine); }
.table-caption { padding: 12px 14px; border-top: 1px solid #edf1ee; color: var(--muted-fine); font-size: 12px; }
.table-caption strong { color: #5f7773; }

.payment-overview { margin-bottom: 15px; }
.payment-setup-note { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; padding: 14px 16px; border: 1px solid #d9e7dc; border-radius: 9px; background: #f6faf5; }
.payment-setup-note strong { color: #355957; font: 700 12px "Manrope", sans-serif; }
.payment-setup-note p { max-width: 860px; margin: 5px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.55; }
.payment-setup-note .payment-sandbox-note { display: block; margin-top: 6px; color: var(--amber); font-size: 12px; font-weight: 700; line-height: 1.45; }
.payment-setup-note .text-button { flex: 0 0 auto; }
.saas-billing-panel { margin: 0 0 15px; padding: 18px; border: 1px solid #d7e4dc; border-radius: 11px; background: linear-gradient(135deg, #f7fbf7, #f3f7f5); }
.saas-billing-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.saas-billing-heading h2 { margin: 2px 0 5px; color: var(--petrol); font: 700 17px "Manrope", sans-serif; }
.saas-billing-heading p:not(.section-eyebrow) { max-width: 720px; margin: 0; color: var(--muted-fine); font-size: 12px; line-height: 1.55; }
.saas-billing-heading .section-eyebrow { margin: 0; color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.saas-plan-price { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 2px; color: var(--petrol); }
.saas-plan-price strong { font: 700 19px "Manrope", sans-serif; }
.saas-plan-price span { color: var(--muted-fine); font-size: 11px; }
.saas-subscription-form { margin-top: 14px; padding-top: 13px; border-top: 1px solid #dfe9e2; }
.saas-form-intro { margin: 0 0 12px; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.saas-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 11px; }
.saas-form-grid .field { gap: 5px; }
.saas-form-grid .field label { color: #516965; font-size: 11px; font-weight: 700; }
.saas-form-grid .field input, .saas-form-grid .field select { width: 100%; min-height: 39px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--petrol); background: #fff; font: inherit; font-size: 12px; }
.saas-form-grid .field small { color: var(--muted-fine); font-size: 10px; line-height: 1.4; }
.saas-terms { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; color: #627672; font-size: 11px; line-height: 1.45; }
.saas-terms input { flex: 0 0 auto; width: 15px; height: 15px; margin: 1px 0 0; accent-color: var(--teal); }
.saas-start-button { margin-top: 12px; min-height: 42px; }
.saas-subscription-status { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 13px; padding: 12px; border: 1px solid #e1e9e3; border-radius: 8px; background: #fff; }
.saas-subscription-status > div:first-child { display: grid; gap: 4px; }
.saas-subscription-status strong { color: var(--petrol); font-size: 12px; }
.saas-subscription-status span { color: var(--muted-fine); font-size: 11px; }
.saas-subscription-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.saas-cancel-action { color: #8f5a4c; }
.saas-billing-message { margin: 12px 0 0; padding: 10px 11px; border-radius: 7px; color: #765b26; background: #fbf5e8; font-size: 11px; line-height: 1.5; }
.saas-billing-footnote { margin: 12px 0 0; color: var(--muted-fine); font-size: 10px; line-height: 1.45; }
.billing-required-page { display: grid; min-height: min(720px, calc(100vh - 110px)); align-content: center; justify-items: center; padding: 16px; }
.billing-required-card { width: min(100%, 760px); padding: 20px; border: 1px solid #dfe8e1; border-radius: 12px; background: var(--paper); box-shadow: 0 8px 28px rgba(31,66,58,.07); }
.billing-required-card > .section-eyebrow { margin: 0 0 5px; color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.billing-required-card > h1 { margin: 0 0 7px; color: var(--petrol); font: 700 22px "Manrope", sans-serif; }
.billing-required-card > p:not(.section-eyebrow) { margin: 0; color: var(--muted-fine); font-size: 13px; line-height: 1.55; }
.billing-required-card .saas-billing-panel { margin-top: 16px; }
.billing-refresh-access { margin: 2px 12px 0 0; }
.payment-toolbar { margin-top: 15px; }
.payment-list { display: grid; gap: 8px; }
.payment-card { display: grid; grid-template-columns: minmax(180px,1fr) minmax(150px,.7fr) auto; align-items: center; gap: 12px; padding: 13px 14px 0; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.payment-card-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.payment-customer { min-width: 0; }
.payment-customer-title { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.payment-customer-title strong { color: #355456; font-size: 12px; font-weight: 700; }
.payment-customer small { display: block; margin-top: 4px; overflow-wrap: anywhere; color: var(--muted-fine); font-size: 12px; line-height: 1.4; }
.customer-type { padding: 2px 5px; border-radius: 4px; color: #54756f; background: #edf4ef; font-size: 12px; font-weight: 700; }
.payment-card-meta { display: grid; gap: 4px; color: var(--muted-fine); font-size: 12px; }
.payment-card-total { display: flex; align-items: flex-end; justify-content: space-between; gap: 13px; }
.payment-card-total > span { display: grid; justify-items: start; gap: 4px; }
.payment-card-total > span > small { color: var(--muted-fine); font-size: 12px; }
.payment-card-total > strong { color: #29484a; font: 700 16px "Manrope", sans-serif; white-space: nowrap; }
.payment-receipt-date { color: var(--muted-fine); font-size: 12px; }
.payment-status { display: inline-flex; align-items: center; gap: 5px; padding: 4px 6px; border-radius: 5px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.payment-status::before { width: 5px; height: 5px; border-radius: 50%; background: currentColor; content: ""; }
.payment-status-paid { color: var(--positive); background: var(--teal-soft); }
.payment-status-confirmed { color: var(--blue); background: var(--blue-soft); }
.payment-status-pending { color: var(--amber); background: var(--amber-soft); }
.payment-status-overdue { color: var(--red); background: var(--red-soft); }
.payment-status-refunded { color: var(--red); background: var(--red-soft); }
.payment-status-draft { color: #657875; background: #eef2ef; }
.payment-card-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; padding: 9px 0; border-top: 1px solid #edf1ee; }
.payment-card-actions .button { min-height: 29px; }
.payment-confirm-check { display: flex; align-items: flex-start; gap: 9px; margin-top: 15px; color: #4d6864; font-size: 12px; line-height: 1.5; }
.payment-confirm-check input { flex: 0 0 auto; width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--teal); }
.workorder-summary a { display: inline-block; margin-top: 7px; color: var(--teal); font-size: 12px; font-weight: 700; text-decoration: underline; }

.status { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 5px; color: #667a76; background: #eff3f0; font-size: 12px; font-weight: 700; }
.status::before { width: 5px; height: 5px; border-radius: 50%; background: currentColor; content: ""; }
.status-new, .status-qualify { color: var(--blue); background: var(--blue-soft); }
.status-visit { color: var(--amber); background: #f8f0e2; }
.status-draft { color: #697875; background: #eef2ef; }
.status-sent, .status-awaiting { color: var(--amber); background: var(--amber-soft); }
.status-conversation { color: var(--blue); background: var(--blue-soft); }
.status-accepted, .status-order, .status-completed { color: var(--positive); background: var(--teal-soft); }
.status-refused, .status-cancelled, .status-expired { color: var(--red); background: var(--red-soft); }
.status-scheduled, .status-executing { color: var(--blue); background: var(--blue-soft); }
.status-chip { display: inline-flex; align-items: center; gap: 5px; color: var(--muted-fine); font-size: 12px; }
.status-chip i { width: 6px; height: 6px; border-radius: 50%; background: #7aac74; }
.status-chip.paused i { background: #d3a353; }

.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.detail-card { padding: 18px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.detail-card h2 { margin: 0; color: #29484a; font: 700 13px "Manrope", sans-serif; }
.detail-card p { color: var(--muted-fine); font-size: 12px; line-height: 1.6; }
.details-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 18px; margin: 17px 0 0; }
.details-list div { min-width: 0; }
.details-list dt { color: var(--muted-fine); font-size: 12px; }
.details-list dd { margin: 5px 0 0; color: #405d5c; font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.timeline { position: relative; display: flex; flex-direction: column; gap: 15px; margin-top: 15px; }
.timeline-event { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 9px; }
.timeline-dot { position: relative; width: 20px; height: 20px; display: grid; place-items: center; border: 1px solid #d6e3dc; border-radius: 50%; color: var(--teal); background: #f4f8f5; }
.timeline-dot svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.timeline-copy strong { display: block; color: #4a6562; font-size: 12px; font-weight: 600; }
.timeline-copy small { display: block; margin-top: 4px; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.side-card { margin-bottom: 13px; padding: 16px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.side-card h3 { margin: 0; color: #4a6562; font-size: 12px; font-weight: 700; }
.side-card p { margin: 8px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.55; }
.side-card .button { margin-top: 13px; }
.side-card-highlight { border-color: #d8e6d8; background: #f6faf4; }
.side-card-highlight .next-date { margin-top: 10px; color: #31585a; font: 700 17px "Manrope", sans-serif; }

.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 225px; padding: 35px; text-align: center; }
.empty-state-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #4c8177; background: #e9f3ed; }
.empty-state-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.empty-state h2 { margin: 14px 0 0; color: #365456; font: 700 15px "Manrope", sans-serif; }
.empty-state p { max-width: 330px; margin: 7px 0 16px; color: var(--muted-fine); font-size: 12px; line-height: 1.6; }

#modal-root:empty { display: none; }
.modal-backdrop { position: fixed; inset: 0; z-index: 30; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(17, 40, 39, .46); backdrop-filter: blur(3px); animation: fade-in .15s ease; }
.modal { width: min(680px, 100%); max-height: min(90vh, 900px); display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(255,255,255,.65); border-radius: 12px; background: #fff; box-shadow: var(--shadow); animation: modal-in .18s ease; }
.modal.modal-wide { width: min(840px, 100%); }
.modal.modal-narrow { width: min(470px, 100%); }
.modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 19px 21px 15px; border-bottom: 1px solid #eaf0ec; }
.modal-heading h2 { margin: 0; color: #244748; font: 700 17px "Manrope", sans-serif; letter-spacing: -.4px; }
.modal-heading p { margin: 5px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.modal-close { flex: 0 0 auto; width: 29px; height: 29px; border: 1px solid transparent; border-radius: 6px; color: var(--muted-fine); background: transparent; cursor: pointer; font-size: 19px; line-height: 1; }
.modal-close:hover { border-color: var(--line); background: #f8faf8; }
.modal-body { overflow: auto; padding: 18px 21px 21px; }
.modal-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 21px; border-top: 1px solid #eaf0ec; background: #fbfcfb; }
.modal-footer .footer-left, .modal-footer .footer-right { display: flex; align-items: center; gap: 8px; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.field-grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field label, .field-label { color: #647976; font-size: 12px; font-weight: 600; }
.field input, .field select, .field textarea { width: 100%; min-height: 36px; padding: 8px 10px; border: 1px solid #d9e3de; border-radius: 6px; color: #385454; background: #fff; font-size: 12px; }
.field textarea { min-height: 72px; resize: vertical; line-height: 1.5; }
.field input::placeholder, .field textarea::placeholder { color: var(--muted-fine); }
.field small { color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.form-section-title { margin: 20px 0 11px; padding-top: 15px; border-top: 1px solid #edf1ee; color: #48625f; font-size: 12px; font-weight: 700; }
.form-section-title:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.line-items { width: 100%; margin-top: 9px; border-collapse: collapse; }
.line-items th { padding: 0 6px 7px; color: var(--muted-fine); text-align: left; font-size: 12px; font-weight: 600; }
.line-items td { padding: 4px 5px; border-top: 1px solid #edf1ee; }
.line-items input { width: 100%; min-height: 32px; padding: 6px 7px; border: 1px solid #e0e7e3; border-radius: 5px; color: #48615f; background: #fff; font-size: 12px; }
.line-items .qty-input { width: 65px; }
.line-items .price-input { width: 108px; }
.line-items .remove-line { width: 26px; height: 26px; border: 0; border-radius: 5px; color: #a1aeaa; background: transparent; cursor: pointer; font-size: 15px; }
.line-items .remove-line:hover { color: var(--red); background: var(--red-soft); }
.quote-pricing-panel { margin: 0 0 14px; padding: 13px; border: 1px solid #e2ebe5; border-radius: 8px; background: #f8fbf9; }
.quote-pricing-panel .field-grid { align-items: end; }
.quote-pricing-explainer { display: flex; min-height: 43px; align-items: center; padding: 9px 11px; border-radius: 6px; color: #41615d; background: #edf5f0; font-size: 12px; line-height: 1.45; }
.quote-pricing-note { margin: 10px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.quote-lines-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.line-items { min-width: 650px; }
.line-items .cost-input { width: 108px; }
.line-items .price-input[readonly] { color: #496460; background: #f3f7f4; }
.quote-builder-total-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; }
.quote-total { display: flex; justify-content: flex-end; align-items: center; gap: 15px; padding: 12px 4px 0; color: var(--muted-fine); font-size: 12px; }
.quote-total strong { color: #24494a; font: 700 16px "Manrope", sans-serif; }
.notice { display: flex; align-items: flex-start; gap: 9px; padding: 11px 12px; border: 1px solid #eadcb9; border-radius: 7px; color: var(--amber); background: #fcf7ea; font-size: 12px; line-height: 1.5; }
.notice svg { width: 15px; height: 15px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.notice strong { color: var(--amber); }
.message-preview { min-height: 170px !important; font-size: 12px !important; }
.proposal-paper { max-width: 630px; margin: 0 auto; padding: 20px 0; }
.proposal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 16px; border-bottom: 2px solid #1d4849; }
.proposal-brand { color: #214749; font: 800 18px "Manrope", sans-serif; }
.proposal-brand small { display: block; margin-top: 4px; color: var(--muted-fine); font: 400 12px "DM Sans", sans-serif; }
.proposal-number { color: #5f7471; text-align: right; font-size: 12px; }
.proposal-number strong { display: block; margin-bottom: 4px; color: #24494a; font: 700 12px "Manrope", sans-serif; }
.proposal-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 17px 0; }
.proposal-parties small { display: block; margin-bottom: 5px; color: var(--muted-fine); font-size: 12px; }
.proposal-parties strong { color: #405c59; font-size: 12px; }
.proposal-parties span { display: block; margin-top: 4px; color: var(--muted-fine); font-size: 12px; }
.proposal-title { margin: 4px 0 8px; color: #29484a; font: 700 14px "Manrope", sans-serif; }
.proposal-description { margin: 0; color: #6f817c; font-size: 12px; line-height: 1.6; white-space: pre-line; }
.proposal-table { width: 100%; margin-top: 15px; border-collapse: collapse; }
.proposal-table th { padding: 8px 7px; color: var(--muted-fine); background: #f4f7f4; text-align: left; font-size: 12px; font-weight: 600; }
.proposal-table td { padding: 9px 7px; border-bottom: 1px solid #e9efeb; color: #526966; font-size: 12px; }
.proposal-table td:last-child, .proposal-table th:last-child { text-align: right; }
.proposal-sum { width: 220px; margin: 12px 0 0 auto; }
.proposal-sum div { display: flex; justify-content: space-between; padding: 4px 0; color: var(--muted-fine); font-size: 12px; }
.proposal-sum strong { color: #375856; }
.proposal-sum .proposal-grand { margin-top: 5px; padding-top: 9px; border-top: 1px solid #cfdcd4; color: #29484a; font-size: 12px; font-weight: 700; }
.proposal-terms { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 22px; padding-top: 14px; border-top: 1px solid #e7eeea; }
.proposal-terms h4 { margin: 0 0 5px; color: #58716d; font-size: 12px; }
.proposal-terms p { margin: 0; color: var(--muted-fine); font-size: 12px; line-height: 1.6; white-space: pre-line; }
.client-decision { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; max-width: 340px; margin: 22px auto 0; }
.client-decision .button { min-height: 39px; }
.decision-note { max-width: 420px; margin: 12px auto 0; color: var(--muted-fine); text-align: center; font-size: 12px; line-height: 1.5; }
.refusal-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 11px; }
.reason-option { display: flex; align-items: center; gap: 7px; padding: 9px; border: 1px solid #e0e8e3; border-radius: 6px; color: #617570; font-size: 12px; cursor: pointer; }
.reason-option input { accent-color: var(--teal); }
.modal-copy { margin: 0 0 12px; color: var(--muted-fine); font-size: 12px; line-height: 1.65; }
.workorder-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 14px; padding: 13px; border: 1px solid #e2ebe5; border-radius: 7px; background: #f8faf8; }
.workorder-summary span { color: var(--muted-fine); font-size: 12px; }
.workorder-summary strong { display: block; margin-top: 4px; color: #44615d; font-size: 12px; }
.service-schedule-panel { margin-bottom: 17px; overflow: hidden; }
.service-resource-count { flex: 0 0 auto; color: #55716a; font-size: 11px; font-weight: 700; }
.service-schedule-list { display: grid; }
.service-schedule-row { display: grid; grid-template-columns: 115px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #edf1ee; }
.service-schedule-row:last-child { border-bottom: 0; }
.service-schedule-time { display: grid; gap: 3px; justify-items: start; padding: 0; border: 0; color: var(--teal); background: transparent; cursor: pointer; text-align: left; }
.service-schedule-time strong { font-size: 12px; }
.service-schedule-time span { color: var(--muted-fine); font-size: 11px; }
.service-schedule-copy { display: grid; min-width: 0; gap: 3px; }
.service-schedule-copy strong, .service-schedule-copy span, .service-schedule-copy small { overflow-wrap: anywhere; }
.service-schedule-copy strong { color: var(--ink); font-size: 12px; }
.service-schedule-copy span, .service-schedule-copy small { color: var(--muted-fine); font-size: 11px; }
.service-schedule-status { color: var(--teal); font-size: 10px; font-weight: 700; }
.service-schedule-empty { padding: 17px; color: var(--muted-fine); font-size: 12px; }
.service-booking-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 12px; border: 1px solid #dce8e0; border-radius: 7px; background: #f8faf8; }
.service-booking-copy { display: grid; min-width: 0; gap: 4px; }
.service-booking-copy span { color: var(--muted-fine); font-size: 11px; }
.service-booking-copy strong { color: #44615d; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.service-resource-list { display: grid; margin-top: 14px; border: 1px solid #e4ebe6; border-radius: 8px; overflow: hidden; }
.service-resource-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-bottom: 1px solid #edf1ee; }
.service-resource-row:last-child { border-bottom: 0; }
.service-resource-row > div:first-child { display: grid; min-width: 0; gap: 3px; }
.service-resource-row strong { color: var(--ink); font-size: 12px; overflow-wrap: anywhere; }
.service-resource-row span, .service-resource-row small { color: var(--muted-fine); font-size: 10px; overflow-wrap: anywhere; }
.service-resource-actions { display: flex; align-items: center; gap: 8px; }
.service-resource-actions { flex-wrap: wrap; }
.service-availability-week { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.service-availability-day { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; min-width: 0; margin: 0; padding: 10px; border: 1px solid #e4ebe6; border-radius: 8px; }
.service-availability-day legend { grid-column: 1 / -1; padding: 0 4px; color: var(--ink); font-size: 11px; font-weight: 750; }
.service-availability-period { display: grid; min-width: 0; gap: 4px; }
.service-availability-period span { color: var(--muted-fine); font-size: 9px; }
.service-availability-period label { color: var(--muted-fine); font-size: 10px; }
.service-availability-period input { box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 6px; }
.service-slot-picker { display: grid; justify-items: start; gap: 8px; margin-top: 12px; }
.service-slot-suggestions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; width: 100%; color: var(--muted-fine); font-size: 11px; }
.service-slot-heading { grid-column: 1 / -1; }
.service-slot-option { display: grid; min-width: 0; gap: 4px; padding: 9px; border: 1px solid #cdded3; border-radius: 7px; background: #f8fbf8; color: var(--ink); text-align: left; cursor: pointer; }
.service-slot-option strong, .service-slot-option small { overflow-wrap: anywhere; }
.service-slot-option strong { font-size: 11px; }
.service-slot-option small { color: var(--muted-fine); font-size: 10px; }
.service-resource-state { font-weight: 700; }
.service-resource-state.active { color: #2b7658; }
.service-resource-state.inactive { color: #8c6c4a; }
.service-schedule-form-grid { margin-top: 15px; }
.service-schedule-resources select { min-height: 112px; }
.service-schedule-resources select option { padding: 5px; }
.form-status { min-height: 19px; margin: 12px 0 0; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.service-schedule-panel .panel-header { min-height: 64px; }

.execution-record { display: grid; gap: 11px; margin-top: 18px; padding: 14px; border: 1px solid #dce8e0; border-radius: 8px; background: #fbfcfb; }
.execution-record-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.execution-record-heading h3 { margin: 0; color: #29484a; font: 700 15px "Manrope", sans-serif; }
.execution-record-heading p { margin: 4px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.execution-checklist { display: grid; gap: 7px; }
.execution-checklist-row { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 8px; }
.execution-check-toggle { display: inline-flex; align-items: center; gap: 5px; color: #526b66; font-size: 11px; cursor: pointer; }
.execution-check-toggle input { width: 16px; height: 16px; margin: 0; accent-color: var(--teal); }
.execution-checklist-row > input, .execution-record .field input, .execution-record .field textarea { width: 100%; min-width: 0; }
.execution-remove { padding: 5px 0; font-size: 11px; white-space: nowrap; }
.execution-notes-field { margin-top: 2px; }
.execution-record-note { margin: -3px 0 0; color: var(--muted-fine); font-size: 11px; line-height: 1.55; }
.field-optional { color: var(--muted-fine); font-size: 11px; font-weight: 400; }

#toast-region { position: fixed; right: 22px; bottom: 20px; z-index: 50; display: flex; flex-direction: column; gap: 8px; }
.toast { display: flex; align-items: center; gap: 9px; min-width: 230px; max-width: min(380px, calc(100vw - 35px)); padding: 11px 14px; border: 1px solid #d5e2d9; border-radius: 8px; color: #315654; background: #fff; box-shadow: 0 7px 28px rgba(26,55,52,.15); font-size: 12px; animation: toast-in .2s ease; }
.toast-icon { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--teal); font-size: 12px; }
.toast.error .toast-icon { background: var(--red); }
.toast.warning .toast-icon { background: #c08a37; }

.connection-banner { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 0 0 18px; padding: 14px 16px; border: 1px solid #e7dab8; border-radius: 8px; background: #fcf8ed; }
.connection-banner-copy { display: flex; align-items: flex-start; gap: 11px; }
.connection-banner-icon { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 7px; color: var(--amber); background: #f5ead2; }
.connection-banner-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.connection-banner strong { display: block; color: var(--amber); font-size: 12px; }
.connection-banner p { margin: 4px 0 0; color: var(--amber); font-size: 12px; line-height: 1.5; }

.mobile-bottom-nav { display: none; }
body.billing-required .sidebar { display: none; }
body.billing-required .main-area { margin-left: 0; }
body.billing-required .page-content { max-width: 860px; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-in { from { opacity: .5; transform: translateY(7px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

@media (max-width: 1150px) {
  .sidebar { width: 222px; }
  .main-area { margin-left: 222px; }
  .page-content { padding-left: 26px; padding-right: 26px; }
  .topbar { padding-left: 26px; padding-right: 26px; }
  .overview-grid { gap: 9px; }
  .metric-card { padding-left: 13px; padding-right: 13px; }
  .dashboard-main-grid { grid-template-columns: minmax(0,1.15fr) minmax(260px,.85fr); gap: 12px; }
}
@media (max-width: 900px) {
  .overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .report-panels { grid-template-columns: minmax(0,1fr); }
  .dashboard-main-grid { grid-template-columns: minmax(0,1fr); }
  .dashboard-main-grid > div:last-child { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .dashboard-main-grid > div:last-child .panel + .panel { margin-top: 0; }
  .detail-grid { grid-template-columns: 1fr; }
  .detail-side { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .detail-side .side-card { margin: 0; }
}
@media (max-width: 680px) {
  body { padding-bottom: 67px; }
  body.billing-required { padding-bottom: 0; }
  .sidebar { position: fixed; inset: auto 0 0 0; width: auto; min-width: 0; height: 61px; flex-direction: row; align-items: center; justify-content: center; padding: 5px 8px; border-top: 1px solid rgba(255,255,255,.1); }
  .brand, .workspace-switch, .nav-group-label, .sidebar-spacer, .whatsapp-status, .profile-button { display: none; }
  .main-nav { width: 100%; min-width: 0; flex-direction: row; justify-content: space-around; gap: 3px; }
  .nav-link { flex: 1; min-width: 0; flex-direction: column; justify-content: center; gap: 3px; min-height: 48px; padding: 3px 2px; border-radius: 7px; font-size: 12px; }
  .nav-link > span:not(.nav-count) { max-width: 100%; text-align: center; white-space: normal; line-height: 1.1; }
  .nav-link.active { box-shadow: inset 0 -2px var(--signal); }
  .nav-link svg { width: 17px; height: 17px; }
  .nav-count { position: absolute; top: 2px; left: calc(50% + 7px); min-width: 17px; padding: 2px 4px; font-size: 12px; }
  .main-area { margin-left: 0; }
  .topbar { height: 54px; padding: 0 16px; }
  .breadcrumbs { font-size: 12px; }
  .topbar-actions { gap: 9px; }
  .global-search { width: 34px; height: 32px; justify-content: center; padding: 0; border: 0; background: transparent; }
  .global-search input, .global-search kbd { display: none; }
  .global-search svg { width: 18px; height: 18px; }
  .notification-button { width: 44px; height: 44px; }
  .public-login-link, .auth-back { min-height: 44px; display: inline-flex; align-items: center; }
  .topbar-avatar { width: 27px; height: 27px; font-size: 12px; }
  .page-content { padding: 23px 15px 32px; }
  .page-heading { align-items: flex-start; margin-bottom: 18px; }
  .page-heading h1 { font-size: 21px; }
  .page-heading p { max-width: 280px; font-size: 12px; }
  .page-heading .heading-actions { flex: 0 0 auto; }
  .page-heading .heading-actions .button { width: 44px; min-width: 44px; padding: 0; overflow: hidden; font-size: 0; }
  .page-heading .heading-actions .button svg { flex: 0 0 auto; }
  .overview-grid { gap: 8px; margin-bottom: 14px; }
  .metric-card { min-height: 96px; padding: 12px; }
  .metric-top { font-size: 12px; }
  .metric-icon { width: 24px; height: 24px; }
  .metric-value { margin-top: 11px; font-size: 21px; }
  .metric-caption { font-size: 12px; }
  .dashboard-main-grid > div:last-child { grid-template-columns: minmax(0,1fr); }
  .panel-header { min-height: 50px; padding: 0 12px; }
  .panel-body { padding: 0 12px; }
  .pipeline { padding: 13px; }
  .followup-row { grid-template-columns: 32px minmax(0,1fr) auto; min-height: 63px; gap: 8px; }
  .followup-row .followup-action { display: inline-flex; }
  .followup-row .followup-due { display: none; }
  .followup-action { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 6px; color: var(--teal); background: #fff; cursor: pointer; }
  .followup-action svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.7; }
  .toolbar-row { align-items: stretch; flex-direction: column; }
  .reports-toolbar { align-items: stretch; flex-direction: column; }
  .reports-toolbar > .button { width: 100%; }
  .filter-tabs { overflow: auto; max-width: 100%; }
  .inline-search { width: 100%; }
  .data-table th, .data-table td { padding-left: 10px; padding-right: 10px; }
  .data-table th { font-size: 12px; }
  .data-table td { font-size: 12px; }
  .connection-banner { align-items: flex-start; flex-direction: column; gap: 10px; }
  .connection-banner > .button { margin-left: 39px; }
  .modal-backdrop { align-items: flex-end; padding: 0; }
  .modal, .modal.modal-wide, .modal.modal-narrow { width: 100%; max-height: 93vh; border-radius: 13px 13px 0 0; }
  .modal-header { padding: 16px 17px 12px; }
  .modal-body { padding: 15px 17px 18px; }
  .modal-footer { padding: 11px 17px calc(11px + env(safe-area-inset-bottom)); }
  .field-grid.three { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .line-items .qty-input { width: 52px; }
  .line-items .price-input, .line-items .cost-input { width: 82px; }
  .quote-pricing-panel { padding: 11px; }
  .quote-pricing-explainer { grid-column: 1 / -1; min-height: 40px; }
  .quote-builder-total-row { align-items: flex-start; flex-direction: column; }
  .quote-builder-total-row .quote-total { width: 100%; justify-content: space-between; padding-top: 8px; }
  .proposal-paper { padding: 7px 0; }
  .proposal-header { gap: 10px; }
  .proposal-terms { gap: 10px; }
  .detail-side { grid-template-columns: 1fr; }
  .payment-setup-note { align-items: flex-start; flex-direction: column; padding: 12px; }
  .saas-billing-panel { padding: 13px; }
  .billing-required-page { min-height: calc(100vh - 100px); padding: 10px 0; }
  .billing-required-card { padding: 14px; }
  .billing-required-card > h1 { font-size: 19px; }
  .saas-billing-heading, .saas-subscription-status { align-items: flex-start; flex-direction: column; }
  .saas-plan-price { align-items: flex-start; }
  .saas-form-grid { grid-template-columns: 1fr; }
  .saas-subscription-actions { width: 100%; justify-content: flex-start; }
  .saas-subscription-actions .button { width: 100%; }
  .saas-start-button { width: 100%; min-height: 46px; }
  .billing-refresh-access { width: 100%; margin: 0 0 12px; }
  .payment-card { grid-template-columns: minmax(0,1fr) auto; gap: 9px; padding: 11px 11px 0; }
  .payment-card-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 5px 12px; font-size: 12px; }
  .payment-card-total { grid-column: 1 / -1; align-items: center; }
  .payment-card-total > strong { font-size: 15px; }
  .payment-card-actions { justify-content: stretch; }
  .payment-card-actions .button { flex: 1 1 auto; min-width: 0; padding-left: 7px; padding-right: 7px; font-size: 12px; }
  .button, .button-small { min-height: 44px; }
  .client-decision .button { min-height: 44px; }
  .filter-tab { min-height: 44px; }
  .icon-button { width: 44px; min-height: 44px; }
  .field input, .field select, .field textarea { min-height: 44px; font-size: 16px; }
  .auth-card .field input { min-height: 44px; font-size: 16px; }
  .auth-submit { font-size: 16px; }
  .auth-description, .public-proposal-paper .proposal-description { font-size: 16px; }
  .auth-error { font-size: 16px; }
  .public-proposal-paper .proposal-table tr { grid-template-columns: 1fr; }
  .public-proposal-paper .proposal-table td:first-child { grid-column: 1; }
}
@media (max-width: 400px) {
  .page-heading { gap: 8px; }
  .page-heading h1 { font-size: 19px; }
  .overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .filter-tab { padding: 0 8px; }
  .field-grid, .field-grid.three { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .proposal-parties, .proposal-terms { grid-template-columns: 1fr; }
  .modal-footer { align-items: stretch; flex-direction: column-reverse; }
  .modal-footer .footer-left, .modal-footer .footer-right { width: 100%; }
  .modal-footer .footer-left .button, .modal-footer .footer-right .button { flex: 1 1 auto; }
  .nav-link { gap: 2px; padding-right: 1px; padding-left: 1px; }
  .nav-link .nav-label { display: none; }
  .nav-link::after { font: 600 10px/1 "DM Sans", sans-serif; text-align: center; white-space: nowrap; }
  .nav-link[data-view="dashboard"]::after { content: "Painel"; }
  .nav-link[data-view="reports"]::after { content: "Relat."; }
  .nav-link[data-view="requests"]::after { content: "Pedidos"; }
  .nav-link[data-view="quotes"]::after { content: "Propostas"; }
  .nav-link[data-view="orders"]::after { content: "Ordens"; }
  .nav-link[data-view="payments"]::after { content: "Pagar"; }
  .nav-link[data-view="whatsapp"]::after { content: "Whats"; }
}

.wa-status-card, .wa-cost-strip { margin-bottom: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.wa-status-card { border-color: #d9e6d8; background: linear-gradient(120deg, #f4f9f3, #fff 72%); }
.wa-status-heading { display: flex; align-items: flex-start; gap: 11px; }
.wa-status-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; color: var(--petrol); background: var(--signal); font: 800 17px "Manrope", sans-serif; }
.wa-status-heading > div { display: flex; flex-direction: column; gap: 4px; }
.wa-status-heading strong { color: var(--ink); font-size: 14px; }
.wa-status-heading span { color: var(--muted); font-size: 12px; line-height: 1.5; }
.wa-status-pills { display: flex; flex-wrap: wrap; gap: 7px; margin: 14px 0 0 45px; }
.wa-status-pills span { padding: 5px 8px; border: 1px solid #eadcb9; border-radius: 99px; color: #775e2e; background: #fcf7ea; font-size: 12px; }
.wa-status-pills span.ready { border-color: #d5e6d8; color: #37654b; background: #f0f7ef; }
.wa-webhook-url { margin: 12px 0 0 45px; color: var(--muted-fine); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.wa-webhook-url code { color: #365456; }
.wa-setup-card { margin-bottom: 14px; }
.wa-setup-card .panel-header { gap: 10px; }
.wa-setup-card .panel-body { padding-bottom: 17px; }
.wa-setup-card .field textarea { min-height: 120px; }
.wa-submit-row { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.wa-submit-row small { color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.wa-manual-setup { border-top: 1px solid var(--line); padding-top: 12px; }
.wa-manual-setup summary { color: var(--muted); font-size: 13px; font-weight: 700; cursor: pointer; }
.wa-manual-setup > p { margin: 9px 0; color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.wa-registration-form { margin: 0 0 15px; padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: #f9fbf9; }
.wa-registration-form > label { display: block; margin-bottom: 7px; color: var(--ink); font-size: 12px; font-weight: 700; }
.wa-registration-form .field-grid { display: flex; align-items: center; gap: 8px; }
.wa-registration-form input { width: 150px; text-align: center; letter-spacing: .22em; }
.wa-registration-form small { display: block; margin-top: 7px; color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.wa-connection-summary { display: flex; flex-wrap: wrap; gap: 8px 17px; margin-bottom: 15px; color: var(--muted); font-size: 12px; }
.wa-connection-summary > span { display: inline-flex; align-items: center; gap: 7px; }
.connection-dot.is-connected { background: #56a26e; box-shadow: 0 0 0 3px rgba(86,162,110,.14); }
.wa-ai-toggle { display: flex; align-items: center; gap: 10px; margin-top: 15px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #f9fbf9; cursor: pointer; }
.wa-ai-toggle input { width: 18px; height: 18px; accent-color: #217f72; }
.wa-ai-toggle span { display: flex; flex-direction: column; gap: 3px; }
.wa-ai-toggle strong { color: var(--ink); font-size: 12px; }
.wa-ai-toggle small { color: var(--muted-fine); font-size: 12px; line-height: 1.4; }
.wa-form-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.wa-cost-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.wa-cost-strip > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.wa-cost-strip span { color: var(--muted-fine); font-size: 12px; }
.wa-cost-strip strong { color: var(--ink); font-size: 13px; overflow-wrap: anywhere; }
.wa-cost-strip > small { grid-column: 1 / -1; color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.wa-inbox-layout { display: grid; grid-template-columns: minmax(230px,.8fr) minmax(0,1.65fr); gap: 13px; min-height: 430px; }
.wa-conversation-list { min-width: 0; overflow: hidden; }
.wa-conversation-items { max-height: 560px; overflow-y: auto; }
.wa-conversation-item { display: flex; width: 100%; min-height: 67px; align-items: center; gap: 9px; padding: 9px 11px; border: 0; border-top: 1px solid var(--line); text-align: left; color: inherit; background: #fff; cursor: pointer; }
.wa-conversation-item:hover, .wa-conversation-item.active { background: #f3f8f4; }
.wa-contact-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #315a56; background: #dce9df; font: 700 12px "Manrope", sans-serif; }
.wa-contact-copy { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.wa-contact-copy strong { overflow: hidden; color: var(--ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.wa-contact-copy small { overflow: hidden; color: var(--muted-fine); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.wa-contact-date { align-self: flex-start; margin-top: 2px; color: var(--muted-fine); font-size: 12px; white-space: nowrap; }
.wa-empty-list { padding: 20px 14px; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.wa-chat { display: flex; min-width: 0; min-height: 430px; flex-direction: column; overflow: hidden; }
.wa-chat-header { display: flex; min-height: 65px; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 13px; border-bottom: 1px solid var(--line); }
.wa-chat-header > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.wa-chat-header > .wa-chat-actions { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.wa-chat-header strong { overflow: hidden; color: var(--ink); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.wa-chat-header small { overflow: hidden; color: var(--muted-fine); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.wa-messages { display: flex; flex: 1; min-height: 230px; max-height: 470px; flex-direction: column; gap: 10px; padding: 15px; overflow: auto; background: #f4f7f4; }
.wa-message { max-width: min(84%, 460px); padding: 9px 11px 7px; border: 1px solid #e2e9e4; border-radius: 10px 10px 10px 3px; background: #fff; }
.wa-message.outbound { align-self: flex-end; border-color: #d8e7d8; border-radius: 10px 10px 3px 10px; background: #eaf4e9; }
.wa-message p { margin: 0; color: #334c49; font-size: 12px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.wa-message small { display: block; margin-top: 4px; text-align: right; color: #81928b; font-size: 12px; }
.wa-chat-footer { padding: 11px; border-top: 1px solid var(--line); }
.wa-chat-footer > p { margin: 0 0 9px; color: var(--muted-fine); font-size: 12px; line-height: 1.45; }
.wa-chat-footer form { display: flex; align-items: flex-end; gap: 8px; }
.wa-chat-footer textarea { width: 100%; min-width: 0; min-height: 44px; max-height: 120px; resize: vertical; padding: 9px 10px; border: 1px solid var(--line-strong); border-radius: 7px; color: var(--ink); background: white; font-size: 12px; }
.wa-chat-empty { justify-content: center; }
.wa-chat-empty .empty-state { min-height: 300px; }
.wa-loading { margin: -8px 0 10px; color: var(--muted-fine); font-size: 12px; }
.wa-load-error { margin-bottom: 12px; }
@media (max-width: 900px) {
  .wa-inbox-layout { grid-template-columns: minmax(0,1fr); }
  .wa-conversation-items { max-height: 240px; }
  .wa-chat, .wa-chat-empty { min-height: 340px; }
}
@media (max-width: 680px) {
  .wa-status-card, .wa-cost-strip { padding: 12px; }
  .wa-status-pills, .wa-webhook-url { margin-left: 0; }
  .wa-cost-strip { grid-template-columns: 1fr 1fr; gap: 11px; }
  .wa-cost-strip > div:first-child { grid-column: 1 / -1; }
  .wa-inbox-layout { gap: 10px; }
  .wa-conversation-items { max-height: 190px; }
  .wa-chat { min-height: 390px; }
  .wa-messages { min-height: 200px; max-height: 330px; padding: 11px; }
  .wa-chat-header { padding: 8px 10px; }
  .wa-chat-header .button { min-height: 40px; padding: 0 8px; }
  .wa-chat-footer { padding: 9px; }
  .wa-chat-footer textarea { min-height: 48px; font-size: 16px; }
  .wa-chat-footer .button { flex: 0 0 auto; min-width: 72px; }
  .wa-form-actions .button { flex: 1; }
}
@media (max-width: 400px) {
  .nav-link[data-view="whatsapp"]::after { content: "Whats"; }
  .wa-status-heading { gap: 8px; }
  .wa-cost-strip { grid-template-columns: 1fr; }
  .wa-cost-strip > div:first-child, .wa-cost-strip > small { grid-column: auto; }
  .wa-chat-header { align-items: flex-start; flex-direction: column; }
  .wa-chat-header > .wa-chat-actions { align-self: flex-end; }
  .wa-chat-header .button { align-self: auto; }
}
@media print {
  body { background: white !important; }
  body * { visibility: hidden !important; }
  .proposal-paper, .proposal-paper * { visibility: visible !important; }
  .proposal-paper { position: absolute; inset: 0; width: 100%; max-width: none; margin: 0; padding: 15mm; }
  .modal-backdrop, .modal, .modal-body { display: contents !important; max-height: none !important; overflow: visible !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
  .modal-header, .modal-footer, .client-decision, .decision-note, .proposal-close { display: none !important; }
  .proposal-header, .proposal-table, .proposal-terms { break-inside: avoid; }
}

/* Landing, access and customer proposal pages */
.landing-body, .auth-body, .public-proposal-body { min-width: 320px; min-height: 100vh; color: var(--ink); background: var(--canvas); }
.landing-body { display: flex; flex-direction: column; }
.skip-link { position: fixed; top: -60px; left: 16px; z-index: 100; min-height: 44px; display: flex; align-items: center; padding: 0 14px; border-radius: 7px; color: #173b3e; background: #d4eb70; box-shadow: 0 2px 8px rgba(23,59,62,.12); transition: top var(--transition-duration) var(--transition-easing); }
.skip-link:focus { top: 12px; }
.public-header { width: min(1120px, calc(100% - 48px)); min-height: 78px; display: flex; align-items: center; justify-content: space-between; margin: 0 auto; border-bottom: 1px solid #dce5df; }
.public-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--petrol); text-decoration: none; }
.public-brand strong { font: 800 21px/1 "Manrope", sans-serif; letter-spacing: -1px; }
.public-brand-mark { width: 34px; height: 34px; display: grid; place-items: center; overflow: hidden; border-radius: 10px; background: var(--signal); }
.public-brand-mark img { width: 31px; height: 31px; }
.public-login-link { padding: 9px 13px; border: 1px solid #d4ded8; border-radius: 7px; color: #355657; text-decoration: none; font-size: 12px; font-weight: 600; }
.public-login-link:hover, .auth-back:hover { background: #e6eee7; }
.landing-main { width: min(1120px, calc(100% - 48px)); flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; margin: 0 auto; padding: 88px 0 130px; }
.landing-main h1 { max-width: 820px; margin: 0; color: var(--petrol); font: 800 clamp(39px, 7vw, 76px)/1.04 "Manrope", "DM Sans", sans-serif; letter-spacing: -.055em; }
.landing-main p { max-width: 590px; margin: 23px 0 29px; color: var(--muted); font-size: clamp(16px, 2vw, 20px); line-height: 1.65; }
.landing-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.landing-cta { min-height: 49px; padding: 0 19px; gap: 13px; border-radius: 8px; text-decoration: none; font-size: 13px; }
.landing-contact { min-height: 49px; padding: 0 17px; border-radius: 8px; text-decoration: none; }
.auth-body { display: grid; place-items: center; padding: 28px 18px; }
.auth-shell { width: min(100%, 432px); }
.auth-brand { margin: 0 0 20px 4px; }
.auth-card { padding: 34px 36px 26px; border: 1px solid #e0e8e2; border-radius: 13px; background: #fff; box-shadow: 0 20px 60px rgba(32, 61, 55, .08); }
.auth-eyebrow { margin-bottom: 12px; color: var(--muted-fine); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.auth-card h1 { margin: 0; color: #173b41; font: 750 25px/1.2 "Manrope", sans-serif; letter-spacing: -.7px; }
.auth-description { margin: 10px 0 23px; color: var(--muted-fine); font-size: 12px; line-height: 1.6; }
.auth-card form { display: grid; gap: 14px; }
.auth-card form[hidden] { display: none; }
.auth-card .field { gap: 6px; }
.auth-card .field label { color: #50645f; font-size: 12px; }
.auth-card .field input { min-height: 42px; padding: 0 11px; font-size: 13px; }
.auth-owner-confirm { display: flex; align-items: flex-start; gap: 9px; color: #50645f; font-size: 12px; line-height: 1.5; cursor: pointer; }
.auth-owner-confirm input { width: 17px; height: 17px; flex: 0 0 auto; margin: 1px 0 0; accent-color: #247b69; }
.signup-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.signup-note { margin: 0; color: var(--muted-fine); font-size: 11px; line-height: 1.55; }
.auth-submit { width: 100%; min-height: 44px; margin-top: 3px; font-size: 12px; }
.auth-submit:disabled { cursor: wait; opacity: .7; }
.auth-error { margin: 0; padding: 10px 11px; border: 1px solid #efcebf; border-radius: 7px; color: var(--red); background: #fff5ef; font-size: 12px; line-height: 1.5; }
.auth-success { margin: 0; padding: 10px 11px; border: 1px solid #cce3d5; border-radius: 7px; color: #25634d; background: #f1f8f3; font-size: 12px; line-height: 1.5; }
.auth-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 14px; }
.auth-actions a { color: #286b62; font-size: 11px; font-weight: 600; }
.auth-contact-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 20px; padding: 12px 0; border-top: 1px solid #e7ede8; color: #286b62; font-size: 13px; font-weight: 700; }
.auth-contact-link:hover { color: #174a46; }
.auth-back { display: inline-flex; margin-top: 17px; padding: 7px 9px; border-radius: 5px; color: var(--muted-fine); text-decoration: none; font-size: 12px; }
.save-status { color: var(--muted-fine); font-size: 12px; white-space: nowrap; }
.save-status[data-state="saved"] { color: var(--positive); }
.save-status[data-state="saving"] { color: var(--amber); }
.save-status[data-state="error"] { color: var(--red); font-weight: 700; }
.logout-button { min-height: 31px; padding: 0 10px; border: 1px solid #dce5df; border-radius: 6px; color: #526762; background: #fff; cursor: pointer; font: 600 12px "DM Sans", sans-serif; }
.logout-button:hover { border-color: #b8c9be; background: #f7faf7; }

/* Fluxo identity application: improve reading rhythm while keeping dense data compact. */
.brand-mark { width: 40px; height: 40px; }
.brand-mark img { width: 29px; height: 29px; }
.brand-copy strong { font-size: 23px; }
.nav-link, .breadcrumbs { font-size: 13px; }
.global-search input { font-size: 13px; }
.page-heading p { font-size: 14px; }
.button { font-size: 14px; }
.button:not(.button-small):not(.landing-cta) { min-height: 44px; }
.metric-top, .metric-caption { font-size: 13px; }
.panel-header { min-height: 60px; padding-right: 18px; padding-left: 18px; }
.panel-title { font-size: 14px; }
.panel-subtitle { font-size: 13px; }
.panel-body { padding-right: 18px; padding-left: 18px; }
.followup-info strong { font-size: 13px; }
.followup-info span { font-size: 13px; }
.pipeline-stage span, .pipeline-stage small { font-size: 13px; }
.filter-select, .filter-tab, .inline-search input { font-size: 13px; }
.data-table th, .data-table td { font-size: 13px; }
.customer-cell strong, .customer-cell small { font-size: 13px; }
.status { font-size: 13px; }
.payment-customer-title strong, .payment-customer small, .payment-card-meta { font-size: 13px; }
.field label, .field-label { font-size: 14px; }
.field input, .field select, .field textarea { min-height: 44px; font-size: 14px; }
.modal-heading h2 { font-size: 19px; }
.modal-body { font-size: 14px; }
.auth-card h1 { font-size: 28px; }
.auth-description { font-size: 15px; }
.public-header { min-height: 82px; }
.public-brand { gap: 10px; }
.public-brand strong { font-size: 23px; }
.public-brand-mark { width: 38px; height: 38px; border-radius: 11px; }
.public-brand-mark img { width: 35px; height: 35px; }
.public-login-link { min-height: 44px; display: inline-flex; align-items: center; padding: 0 15px; font-size: 14px; }
.landing-main { width: min(1120px, calc(100% - 48px)); }
.landing-main h1 .problem-emphasis { color: var(--teal); white-space: nowrap; }
.landing-cta { min-height: 50px; font-size: 15px; }

@media (max-width: 680px) {
  .nav-link { font-size: 12px; }
  .page-content { padding-right: 16px; padding-left: 16px; }
  .page-heading h1 { font-size: 22px; }
  .page-heading p { font-size: 16px; }
  .panel-header { min-height: 56px; padding-right: 14px; padding-left: 14px; }
  .panel-body { padding-right: 14px; padding-left: 14px; }
  .data-table th, .data-table td { font-size: 13px; }
  .payment-card-actions .button { font-size: 13px; }
  .auth-body { padding: 22px 16px; }
  .auth-description { font-size: 16px; }
  .landing-main { justify-content: flex-start; padding-top: clamp(96px, 17vh, 144px); padding-bottom: 72px; }
  .landing-main h1 { font-size: clamp(38px, 10.2vw, 48px); }
  .landing-main p { font-size: 18px; }
}
@media (max-width: 400px) {
  .page-heading h1 { font-size: 21px; }
  .landing-main { width: calc(100% - 40px); padding-top: clamp(84px, 15vh, 124px); }
  .landing-main h1 { font-size: clamp(36px, 11vw, 41px); }
  .landing-main p { font-size: 17px; }
  .nav-link::after { font-size: 11px; }
}
@media (max-width: 360px) {
  .nav-link[data-view="quotes"]::after, .nav-link[data-view="payments"]::after { font-size: 10px; }
}
.public-proposal-body { padding: 28px 15px 50px; }
.public-proposal-shell { width: min(100%, 740px); margin: 0 auto; }
.proposal-loading { padding: 24px; color: var(--muted-fine); text-align: center; font-size: 12px; }
.proposal-state { max-width: 520px; margin: 80px auto; padding: 27px; border: 1px solid #e0e8e2; border-radius: 12px; background: #fff; }
.proposal-state h1 { margin: 24px 0 9px; color: #173b41; font: 750 22px/1.25 "Manrope", sans-serif; }
.proposal-state p { color: var(--muted-fine); font-size: 12px; line-height: 1.6; }
.public-proposal-paper { max-width: 740px; padding: 27px 32px 30px; border: 1px solid #e1e9e3; border-radius: 12px; background: #fff; box-shadow: 0 12px 38px rgba(32, 61, 55, .06); }
.proposal-site-brand { margin-bottom: 23px; }
.proposal-site-brand .public-brand-mark { width: 28px; height: 28px; border-radius: 8px; }
.proposal-site-brand .public-brand-mark img { width: 26px; height: 26px; }
.proposal-site-brand strong { font-size: 17px; }
.public-proposal-paper .proposal-header { padding-bottom: 18px; }
.public-proposal-paper .proposal-brand { font-size: 17px; }
.public-proposal-paper .proposal-number { line-height: 1.6; }
.public-proposal-paper .proposal-parties { margin-top: 4px; }
.proposal-table-scroll { width: 100%; overflow-x: auto; }
.public-proposal-paper .proposal-table { min-width: 520px; }
.public-proposal-paper .proposal-title { font-size: 16px; }
.public-proposal-paper .proposal-terms h2 { margin: 0 0 6px; color: var(--muted-fine); font-size: 12px; }
.public-decision-area { margin-top: 22px; padding: 17px; border: 1px solid #e5ece6; border-radius: 9px; background: #f8faf8; }
.public-decision-area > p { margin: 0; color: #667976; text-align: center; font-size: 12px; }
.public-decision-area .client-decision { margin-top: 13px; }
.public-confirmation { text-align: center; }
.public-confirmation > strong { color: #264b4b; font: 700 14px "Manrope", sans-serif; }
.public-confirmation p { color: var(--muted-fine); font-size: 12px; line-height: 1.55; }
.public-confirmation > div { display: flex; justify-content: center; gap: 9px; }
.public-success { display: grid; justify-items: center; gap: 7px; text-align: center; }
.public-success > span { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 50%; color: #234b45; background: #dcefdc; font-size: 19px; }
.public-success strong { color: #234746; font: 700 15px "Manrope", sans-serif; }
.public-success p { max-width: 410px; margin: 0; color: var(--muted-fine); font-size: 12px; line-height: 1.6; }
.public-expiry-note { margin: 13px 0 0; color: var(--muted-fine); text-align: center; font-size: 12px; }
.public-proposal-paper .proposal-description { line-height: 1.7; }

@media (max-width: 680px) {
  .public-header { width: calc(100% - 32px); min-height: 65px; }
  .landing-main { width: calc(100% - 36px); justify-content: flex-start; padding: clamp(90px, 19vh, 155px) 0 70px; }
  .landing-main h1 { max-width: 560px; font-size: clamp(39px, 11vw, 58px); }
  .landing-main p { margin: 18px 0 23px; font-size: 16px; }
  .landing-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .landing-actions .button { width: 100%; justify-content: center; font-size: 16px; }
  .auth-body { padding: 20px 15px; }
  .auth-card { padding: 27px 22px 21px; }
  .save-status { max-width: 71px; overflow: hidden; text-overflow: ellipsis; }
  .topbar-actions { gap: 7px; }
  .logout-button { min-height: 44px; padding: 0 8px; }
  .public-proposal-body { padding: 12px 9px 76px; }
  .public-proposal-paper { padding: 19px 16px 22px; border-radius: 10px; }
  .public-proposal-paper .proposal-header { gap: 9px; }
  .public-proposal-paper .proposal-brand { font-size: 14px; }
  .public-proposal-paper .proposal-number { max-width: 145px; font-size: 12px; text-align: right; }
  .public-proposal-paper .proposal-parties { grid-template-columns: 1fr; gap: 13px; }
  .public-decision-area { padding: 13px 10px; }
  .public-decision-area .client-decision { max-width: 100%; }
  .public-proposal-paper .proposal-table-scroll { overflow: visible; }
  .public-proposal-paper .proposal-table { display: block; min-width: 0; }
  .public-proposal-paper .proposal-table thead { display: none; }
  .public-proposal-paper .proposal-table tbody { display: grid; gap: 8px; }
  .public-proposal-paper .proposal-table tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 12px; padding: 5px 9px; border: 1px solid #e5ece6; border-radius: 7px; }
  .public-proposal-paper .proposal-table td { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 5px 0; text-align: right; }
  .public-proposal-paper .proposal-table td:first-child { grid-column: 1 / -1; border-bottom: 1px solid #edf1ee; color: #395754; text-align: left; font-weight: 600; }
  .public-proposal-paper .proposal-table td::before { color: var(--muted-fine); font-size: 12px; font-weight: 400; content: attr(data-label); }
}
@media (max-width: 400px) {
  .save-status, .global-search, .notification-button, .topbar-avatar { display: none; }
  .auth-card h1 { font-size: 22px; }
  .public-proposal-paper .proposal-header { flex-direction: column; }
  .public-proposal-paper .proposal-number { max-width: none; text-align: left; }
  .public-confirmation > div { flex-direction: column; }
}

/* Public landing: problem, four-step flow and invitation-only pilot. */
.sales-landing { display: block; overflow-x: hidden; background: #f4f7f4; }
.sales-landing .sales-header { min-height: 80px; }
.sales-main { width: 100%; }
.sales-wrap { width: min(1120px, calc(100% - 48px)); margin-right: auto; margin-left: auto; }
.sales-hero { display: grid; grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr); align-items: center; gap: clamp(28px, 5vw, 64px); padding-top: clamp(48px, 7vw, 82px); padding-bottom: clamp(58px, 8vw, 96px); }
.sales-hero-copy { max-width: 650px; min-width: 0; }
.sales-eyebrow, .sales-kicker { margin: 0 0 16px; color: #147a70; font-size: 15px; font-weight: 700; line-height: 1.45; letter-spacing: .01em; }
.sales-hero h1 { max-width: 15ch; margin: 0; color: #173b3e; font: 800 clamp(42px, 4.5vw, 62px)/1.07 "Manrope", "DM Sans", sans-serif; letter-spacing: -.045em; }
.sales-lede { max-width: 46ch; margin: 22px 0 0; color: #35514e; font-size: clamp(18px, 1.35vw, 20px); line-height: 1.6; }
.sales-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 30px; }
.sales-button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 19px; border-radius: 7px; text-decoration: none; font-size: 17px; font-weight: 700; }
.sales-button:focus-visible, .sales-inline-link:focus-visible, .sales-pilot-direct:focus-visible, .sales-faq-list summary:focus-visible { outline: 3px solid #147a70; outline-offset: 3px; }
.sales-hero-visual { min-width: 0; margin: 0; }
.sales-hero-visual img { display: block; width: 100%; aspect-ratio: 1.12; border: 1px solid #dce5e0; border-radius: 10px; object-fit: cover; object-position: 76% center; }
.sales-hero-visual figcaption { margin: 8px 2px 0; color: #526660; font-size: 13px; line-height: 1.4; }
.sales-manual-note { max-width: 58ch; margin: 19px 0 0; color: #526660; font-size: 14px; line-height: 1.55; }
.sales-preview { min-width: 0; padding: 24px; border: 1px solid #dce5e0; border-radius: 10px; background: #fff; }
.sales-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 17px; color: #526660; font-size: 11px; font-weight: 700; letter-spacing: .07em; }
.sales-fake-label { display: inline-flex; align-items: center; gap: 7px; color: #526660; font-size: 11px; font-weight: 500; letter-spacing: 0; white-space: nowrap; }
.sales-fake-label i { width: 7px; height: 7px; border-radius: 50%; background: #147a70; }
.sales-route { border-top: 1px solid #e5ece7; }
.sales-route-step { min-height: 67px; display: grid; grid-template-columns: 29px minmax(0, 1fr) auto; align-items: center; gap: 12px; border-bottom: 1px solid #e5ece7; }
.sales-route-dot { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid #cad8d2; border-radius: 50%; color: #526660; font-size: 12px; font-weight: 700; }
.sales-route-step > span:nth-child(2) { display: grid; gap: 3px; min-width: 0; }
.sales-route-step strong { color: #193638; font-size: 14px; font-weight: 700; }
.sales-route-step small { color: #526660; font-size: 12px; line-height: 1.4; }
.sales-route-step b { color: #526660; font-size: 11px; font-weight: 600; text-align: right; }
.sales-route-current .sales-route-dot { border-color: #147a70; color: #173b3e; background: #d4eb70; }
.sales-route-current b { color: #23664f; }
.sales-preview-foot { margin: 15px 0 0; color: #526660; font-size: 13px; line-height: 1.5; }
.sales-section { padding-top: clamp(60px, 7.5vw, 88px); padding-bottom: clamp(60px, 7.5vw, 88px); border-top: 1px solid #dce5e0; }
.sales-section h2, .sales-pilot h2 { max-width: 18ch; margin: 0; color: #173b3e; font: 700 clamp(29px, 3.2vw, 42px)/1.14 "Manrope", "DM Sans", sans-serif; letter-spacing: -.035em; }
.sales-kicker { margin-bottom: 13px; text-transform: none; }
.sales-problem, .sales-fit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(32px, 7vw, 96px); align-items: start; }
.sales-section-copy { max-width: 62ch; padding-top: 5px; }
.sales-section-copy p, .sales-section-heading > p, .sales-demo-panel > div:first-child > p:not(.sales-kicker) { margin: 0 0 15px; color: #35514e; font-size: 17px; line-height: 1.7; }
.sales-section-copy p:last-child { margin-bottom: 0; }
.sales-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 30px; }
.sales-section-heading > p { max-width: 36ch; margin-bottom: 3px; }
.sales-flow-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.sales-flow-list li { min-width: 0; min-height: 206px; padding: 20px; border: 1px solid #dce5e0; border-radius: 9px; background: #fff; }
.sales-step-number { display: block; margin-bottom: 26px; color: #147a70; font: 700 13px/1 "DM Sans", sans-serif; letter-spacing: .06em; }
.sales-flow-list h3 { margin: 0 0 9px; color: #193638; font: 700 20px/1.3 "Manrope", sans-serif; }
.sales-flow-list p { margin: 0; color: #35514e; font-size: 16px; line-height: 1.65; }
.sales-flow-disclosure { max-width: 90ch; margin: 19px 0 0; padding-left: 14px; border-left: 3px solid #d4eb70; color: #35514e; font-size: 14px; line-height: 1.6; }
.sales-demo-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .78fr); gap: clamp(28px, 6vw, 72px); align-items: center; padding: clamp(24px, 5vw, 48px); border-radius: 11px; background: #eef3ef; }
.sales-demo-panel h2 { margin-bottom: 14px; }
.sales-demo-panel > div:first-child > p:not(.sales-kicker) { max-width: 58ch; margin-bottom: 0; }
.sales-demo-warning { padding-left: 22px; border-left: 1px solid #cad8d2; }
.sales-demo-warning strong { color: #193638; font-size: 16px; }
.sales-demo-warning p { margin: 7px 0 14px; color: #526660; font-size: 14px; line-height: 1.6; }
.sales-inline-link { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; color: #147a70; font-size: 14px; font-weight: 700; text-decoration: none; }
.sales-inline-link:hover { color: #0d625b; text-decoration: underline; text-underline-offset: 3px; }
.sales-faq-heading { margin-bottom: 23px; }
.sales-faq-list { border-top: 1px solid #dce5e0; }
.sales-faq-list details { border-bottom: 1px solid #dce5e0; }
.sales-faq-list summary { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 3px; color: #193638; cursor: pointer; font-size: 16px; font-weight: 600; line-height: 1.45; list-style: none; }
.sales-faq-list summary::-webkit-details-marker { display: none; }
.sales-faq-list summary::after { content: "+"; flex: 0 0 auto; color: #147a70; font-size: 22px; font-weight: 400; }
.sales-faq-list details[open] summary::after { content: "−"; }
.sales-faq-list details p { max-width: 74ch; margin: -2px 36px 20px 3px; color: #526660; font-size: 15px; line-height: 1.65; }
.sales-pilot { padding: clamp(56px, 8vw, 96px) 0; color: #f4f7f4; background: #173b3e; }
.sales-pilot-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 7vw, 90px); align-items: start; }
.sales-pilot .sales-kicker { color: #d4eb70; }
.sales-pilot h2 { max-width: 16ch; color: #fff; }
.sales-pilot-copy > p:not(.sales-kicker) { max-width: 54ch; margin: 18px 0; color: #e1ebe6; font-size: 17px; line-height: 1.65; }
.sales-pilot-copy ul { display: grid; gap: 10px; margin: 22px 0 27px; padding: 0; list-style: none; }
.sales-pilot-copy li { position: relative; padding-left: 23px; color: #e1ebe6; font-size: 14px; line-height: 1.55; }
.sales-pilot-copy li::before { position: absolute; top: 0; left: 0; color: #d4eb70; content: "✓"; font-weight: 700; }
.sales-pilot-direct { min-height: 48px; display: inline-flex; align-items: center; gap: 8px; color: #d4eb70; font-size: 16px; font-weight: 700; text-decoration: none; }
.sales-pilot-direct:hover { color: #e8f4b1; text-decoration: underline; text-underline-offset: 3px; }
.sales-contact-copy { max-width: 820px; }
.sales-contact-links { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 18px; }
.sales-pilot-direct[hidden], .sales-form[hidden] { display: none; }
.sales-form { min-width: 0; padding: clamp(22px, 4vw, 34px); border-radius: 10px; color: #193638; background: #fff; }
.sales-form-heading { margin-bottom: 23px; }
.sales-form-heading h3 { margin: 0 0 7px; color: #193638; font: 700 21px/1.3 "Manrope", sans-serif; }
.sales-form-heading p { margin: 0; color: #526660; font-size: 14px; line-height: 1.55; }
.sales-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sales-field { min-width: 0; display: grid; align-content: start; gap: 7px; }
.sales-field-wide { grid-column: 1 / -1; }
.sales-field label { color: #193638; font-size: 14px; font-weight: 600; line-height: 1.4; }
.sales-field input, .sales-field select, .sales-field textarea { width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid #cad8d2; border-radius: 7px; color: #193638; background: #fff; font: 400 16px/1.5 "DM Sans", sans-serif; }
.sales-field textarea { min-height: 112px; resize: vertical; }
.sales-field input::placeholder, .sales-field textarea::placeholder { color: #526660; opacity: 1; }
.sales-field input:focus-visible, .sales-field select:focus-visible, .sales-field textarea:focus-visible { outline: 3px solid #147a70; outline-offset: 2px; }
.sales-field small { color: #526660; font-size: 12px; line-height: 1.5; }
.sales-consent { min-height: 44px; display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; }
.sales-consent input { width: 18px; height: 18px; flex: 0 0 18px; margin: 2px 0 0; accent-color: #147a70; }
.sales-consent label { color: #35514e; font-size: 13px; line-height: 1.5; cursor: pointer; }
.sales-form-status { margin: 14px 0 0; color: #913a35; font-size: 14px; line-height: 1.5; }
.sales-form-status:empty { display: none; }
.sales-form-submit { width: 100%; margin-top: 17px; }
.sales-form-privacy { margin: 12px 0 0; color: #526660; font-size: 12px; line-height: 1.5; }
.sales-footer { padding: 22px 0; border-top: 1px solid #dce5e0; background: #f4f7f4; }
.sales-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.sales-footer .public-brand strong { font-size: 19px; }
.sales-footer .public-brand-mark { width: 30px; height: 30px; border-radius: 8px; }
.sales-footer .public-brand-mark img { width: 28px; height: 28px; }
.sales-footer p { margin: 0; color: #526660; font-size: 13px; line-height: 1.5; text-align: right; }
.sales-footer-articles { color: #0d625b; font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.sales-footer-articles:hover { color: #173b3e; }
.demo-read-only-banner { display: flex; align-items: flex-start; gap: 8px 16px; padding: 12px max(24px, calc((100% - 1120px) / 2)); color: #244a3d; background: #e8f0d0; font-size: 13px; line-height: 1.45; }
.demo-read-only-banner strong { flex: 0 0 auto; font-weight: 700; }
.demo-read-only-banner[hidden] { display: none; }
.demo-read-only [data-readonly-hidden="true"] { display: none !important; }
@media (max-width: 900px) {
  .sales-hero { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  .sales-hero-copy { max-width: 720px; }
  .sales-hero-visual { width: min(100%, 680px); }
  .sales-hero-visual img { aspect-ratio: 16 / 10; }
  .sales-preview { width: min(100%, 560px); }
  .sales-flow-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sales-flow-list li { min-height: 180px; }
  .sales-pilot-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 30px; }
}
@media (max-width: 680px) {
  .demo-read-only-banner { flex-direction: column; gap: 3px; padding: 10px 18px; font-size: 12px; }
  .sales-wrap { width: calc(100% - 36px); }
  .sales-landing .sales-header { width: calc(100% - 32px); min-height: 70px; }
  .sales-landing .public-login-link { min-height: 48px; padding: 0 13px; font-size: 15px; }
  .sales-hero { gap: 24px; padding-top: 38px; padding-bottom: 48px; }
  .sales-eyebrow { margin-bottom: 13px; font-size: 15px; }
  .sales-hero h1 { max-width: 18ch; font-size: clamp(36px, 8.6vw, 48px); line-height: 1.1; }
  .sales-lede { margin-top: 17px; font-size: 18px; line-height: 1.6; }
  .sales-actions { align-items: stretch; flex-direction: column; gap: 10px; margin-top: 23px; }
  .sales-button { width: 100%; min-height: 52px; padding: 0 14px; text-align: center; }
  .sales-hero-visual { width: 100%; }
  .sales-hero-visual img { aspect-ratio: 16 / 10; object-position: 75% center; }
  .sales-hero-visual figcaption { font-size: 13px; }
  .sales-manual-note { margin-top: 16px; font-size: 14px; }
  .sales-preview { padding: 18px 15px; }
  .sales-route-step { grid-template-columns: 28px minmax(0, 1fr) auto; gap: 9px; }
  .sales-route-step b { max-width: 76px; font-size: 10px; }
  .sales-section { padding-top: 57px; padding-bottom: 57px; }
  .sales-section h2, .sales-pilot h2 { font-size: clamp(29px, 7.5vw, 36px); }
  .sales-problem, .sales-fit { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .sales-section-heading { align-items: flex-start; flex-direction: column; gap: 13px; margin-bottom: 22px; }
  .sales-section-heading > p { margin: 0; }
  .sales-flow-list { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .sales-flow-list li { min-height: 0; padding: 17px; }
  .sales-step-number { margin-bottom: 15px; }
  .sales-flow-list p { font-size: 16px; }
  .sales-demo-panel { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 23px 19px; }
  .sales-demo-warning { padding: 17px 0 0; border-top: 1px solid #cad8d2; border-left: 0; }
  .sales-faq-list summary { min-height: 62px; font-size: 15px; }
  .sales-faq-list details p { margin-right: 12px; font-size: 15px; }
  .sales-pilot { padding: 58px 0; }
  .sales-pilot-layout { grid-template-columns: minmax(0, 1fr); gap: 29px; }
  .sales-pilot-copy > p:not(.sales-kicker) { font-size: 16px; }
  .sales-form { padding: 22px 17px; }
  .sales-form-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .sales-field-wide { grid-column: auto; }
  .sales-footer-inner { align-items: flex-start; flex-direction: column; gap: 11px; }
  .sales-footer p { text-align: left; }
}
@media (max-width: 360px) {
  .sales-wrap { width: calc(100% - 32px); }
  .sales-hero h1 { font-size: 34px; }
  .sales-route-step small { font-size: 11px; }
  .sales-fake-label { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .sales-landing *, .sales-landing *::before, .sales-landing *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Product-led landing: compact copy, clear autonomy choices, and a photographic hero. */
.product-main { width: 100%; background: #f4f7f4; }
.product-hero { display: grid; grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr); align-items: center; gap: clamp(30px, 5.5vw, 76px); padding-top: clamp(45px, 7vw, 78px); padding-bottom: clamp(54px, 7vw, 78px); }
.product-hero-copy { max-width: 610px; min-width: 0; }
.product-hero h1 { max-width: 12ch; margin: 0; color: #173b3e; font: 800 clamp(42px, 5vw, 68px)/1.06 "Manrope", "DM Sans", sans-serif; letter-spacing: -.05em; }
.product-hero-lede { max-width: 48ch; margin: 20px 0 0; color: #35514e; font-size: clamp(18px, 1.45vw, 20px); line-height: 1.6; }
.product-hero .sales-eyebrow { margin-bottom: 15px; font-size: 15px; }
.product-cta { min-height: 54px; display: inline-flex; align-items: center; justify-content: center; gap: 11px; margin-top: 26px; padding: 0 20px; border-radius: 8px; text-decoration: none; font-size: 16px; font-weight: 700; }
.product-cta:focus-visible, .product-email:focus-visible { outline: 3px solid #147a70; outline-offset: 3px; }
.product-audience { margin: 17px 0 0; color: #526660; font-size: 15px; line-height: 1.5; }
.product-hero-visual { min-width: 0; margin: 0; }
.product-hero-visual img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; border: 1px solid #dce5e0; border-radius: 14px; object-fit: cover; object-position: 62% center; box-shadow: 0 18px 46px rgba(23, 59, 62, .12); }
.product-autonomy { padding: clamp(48px, 6.5vw, 76px) 0; border-top: 1px solid #dce5e0; border-bottom: 1px solid #dce5e0; background: #fff; }
.product-section-heading { margin-bottom: 25px; }
.product-section-heading .sales-kicker { margin-bottom: 10px; }
.product-section-heading h2, .product-contact h2 { max-width: 22ch; margin: 0; color: #173b3e; font: 700 clamp(29px, 3.3vw, 42px)/1.14 "Manrope", "DM Sans", sans-serif; letter-spacing: -.035em; }
.product-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.product-mode-card { min-width: 0; min-height: 184px; padding: 21px; border: 1px solid #dce5e0; border-radius: 10px; background: #f7f9f7; }
.product-mode-icon { width: 34px; height: 34px; display: grid; place-items: center; margin-bottom: 21px; border-radius: 9px; color: #173b3e; background: #d4eb70; font-size: 12px; font-weight: 800; }
.product-mode-card h3 { margin: 0 0 8px; color: #193638; font: 700 18px/1.35 "Manrope", "DM Sans", sans-serif; }
.product-mode-card p { max-width: 36ch; margin: 0; color: #526660; font-size: 16px; line-height: 1.55; }
.product-whatsapp-note { max-width: 76ch; margin: 22px 0 0; padding: 13px 0 13px 16px; border-left: 3px solid #d4eb70; color: #35514e; font-size: 16px; line-height: 1.55; }
.product-whatsapp-note strong { color: #173b3e; }
.product-contact { padding: clamp(42px, 6vw, 66px) 0; color: #f4f7f4; background: #173b3e; }
.product-contact-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 28px; }
.product-contact .sales-kicker { margin-bottom: 9px; color: #d4eb70; }
.product-contact h2 { max-width: 21ch; color: #fff; font-size: clamp(27px, 3vw, 38px); }
.product-contact-links { display: grid; justify-items: start; }
.product-contact .product-cta { margin-top: 0; }
.product-email { min-height: 42px; display: inline-flex; align-items: center; margin-top: 7px; color: #d4eb70; font-size: 15px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .product-hero { grid-template-columns: minmax(0, 1fr); gap: 29px; }
  .product-hero-copy { max-width: 760px; }
  .product-hero h1 { max-width: 14ch; }
  .product-hero-visual { width: min(100%, 760px); }
  .product-hero-visual img { aspect-ratio: 16 / 10; object-position: 62% center; }
  .product-contact-inner { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 17px; }
}
@media (max-width: 640px) {
  .product-hero { gap: 24px; padding-top: 36px; padding-bottom: 42px; }
  .product-hero h1 { max-width: 12ch; font-size: clamp(38px, 10vw, 48px); }
  .product-hero-lede { margin-top: 16px; font-size: 17px; }
  .product-cta { width: 100%; min-height: 54px; margin-top: 21px; font-size: 16px; }
  .product-audience { margin-top: 13px; font-size: 14px; }
  .product-hero-visual { width: 100%; }
  .product-hero-visual img { aspect-ratio: 1.12; border-radius: 11px; object-position: 63% center; }
  .product-autonomy { padding: 43px 0; }
  .product-section-heading { margin-bottom: 18px; }
  .product-section-heading h2 { font-size: 31px; }
  .product-mode-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .product-mode-card { min-height: 0; display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: start; column-gap: 12px; padding: 15px; }
  .product-mode-icon { grid-row: span 2; margin: 0; }
  .product-mode-card h3 { margin: 0 0 4px; font-size: 17px; }
  .product-mode-card p { font-size: 15px; }
  .product-whatsapp-note { margin-top: 17px; font-size: 15px; }
  .product-contact { padding: 42px 0; }
  .product-contact h2 { font-size: 29px; }
  .product-contact-links { width: 100%; }
  .product-contact .product-cta { width: 100%; }
}

.fluxo-login-body { background: radial-gradient(ellipse at 50% 10%, #e8f1e9 0, #f4f7f4 48%, #eef3ef 100%); }
.fluxo-login-shell { width: min(100%, 390px); }
.fluxo-login-brand { justify-content: center; margin: 0 0 20px; }
.fluxo-login-brand .public-brand-mark { width: 42px; height: 42px; }
.fluxo-login-brand .public-brand-mark img { width: 38px; height: 38px; }
.fluxo-login-brand strong { font-size: 30px; letter-spacing: -1.7px; }
.fluxo-login-card { padding: 26px; border-radius: 11px; box-shadow: 0 18px 44px rgba(32, 61, 55, .075); }
.fluxo-login-card form { gap: 16px; }
.fluxo-login-card .field label { font-weight: 600; }
.fluxo-login-card .field input { min-height: 48px; border-color: #d9e3dc; border-radius: 7px; }
.fluxo-login-card .auth-submit { min-height: 48px; margin-top: 2px; }
.agent-tabs { display: flex; gap: 5px; margin: 0 0 17px; padding: 5px; border: 1px solid var(--line); border-radius: 9px; background: #edf2ee; }
.agent-tabs button { min-height: 40px; display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; border: 0; border-radius: 6px; color: #536862; background: transparent; cursor: pointer; font: 600 13px "DM Sans", sans-serif; }
.agent-tabs button.active { color: var(--petrol); background: #fff; box-shadow: 0 1px 4px rgba(28,55,49,.08); }
.agent-tabs button span, .agent-tabs button i { min-width: 19px; padding: 2px 5px; border-radius: 11px; color: #355e54; background: #e7f0e9; font: 700 11px "DM Sans", sans-serif; }
.agent-tabs button i { color: #773e17; background: #ffebd8; font-style: normal; }
.mcp-oauth-field code { display: block; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.agent-intro, .integration-scope-note { display: flex; align-items: center; gap: 13px; margin: 0 0 17px; padding: 15px 17px; border: 1px solid #dbe6d9; border-radius: 9px; background: linear-gradient(105deg, #f0f6eb, #fbfcf9); }
.agent-intro-mark { width: 35px; height: 35px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 10px; color: var(--petrol); background: var(--signal); font-size: 21px; }
.agent-intro > div { flex: 1; }
.agent-intro strong, .integration-scope-note strong { color: var(--petrol); font-size: 14px; }
.agent-intro p, .integration-scope-note p { margin: 3px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.agent-grid, .integration-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-bottom: 22px; }
.agent-card, .integration-card { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); box-shadow: 0 2px 7px rgba(32,61,55,.025); }
.agent-card > header, .integration-card-head { display: flex; align-items: center; gap: 10px; }
.agent-avatar, .integration-icon { width: 37px; height: 37px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 10px; color: var(--petrol); background: #e7f0e7; font: 800 12px "Manrope", sans-serif; }
.integration-icon { color: #fff; background: #476b60; }
.integration-icon.ai-icon { color: #163b3c; background: #d4eb70; }
.agent-card-title { flex: 1; min-width: 0; }
.agent-card-title h2, .integration-card-head h2 { margin: 0; overflow: hidden; color: var(--ink); font: 700 14px "Manrope", sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.agent-card-title p, .integration-card-head p { margin: 4px 0 0; color: var(--muted-fine); font-size: 11px; }
.integration-card-head > div:nth-child(2) { flex: 1; min-width: 0; }
.integration-card-head p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.integration-card-head code { font: 11px/1.4 ui-monospace, monospace; }
.agent-status { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 4px 7px; border-radius: 12px; color: #5e6e67; background: #edf1ed; font-size: 10px; font-weight: 700; }
.status-completed { color: #266546; background: #e5f2e8; }
.status-needs_approval { color: #825012; background: #fff0d6; }
.status-waiting { color: #4d617b; background: #eaf0f8; }
.status-failed { color: #973d34; background: #fae7e4; }
.status-cancelled { color: #606e67; background: #edf1ed; }
.status-disabled { color: #606e67; background: #edf1ed; }
.agent-description { display: -webkit-box; min-height: 44px; margin: 14px 0; overflow: hidden; color: #435850; font-size: 12px; line-height: 1.55; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.agent-card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.agent-card-meta span { max-width: 100%; padding: 4px 7px; border: 1px solid #e5ebe6; border-radius: 5px; color: #5f7068; font-size: 10px; overflow-wrap: anywhere; }
.agent-card footer { display: flex; gap: 7px; border-top: 1px solid #edf0ed; padding-top: 11px; }
.agent-card footer .button { min-height: 34px; }
.agent-empty { display: grid; justify-items: center; padding: 52px 20px; border: 1px dashed #cddbd0; border-radius: 10px; background: #fafcf9; text-align: center; }
.agent-empty-mark { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; color: #254c48; background: #e7f1e6; font-size: 28px; }
.agent-empty h2 { margin: 15px 0 5px; color: var(--petrol); font: 750 19px "Manrope", sans-serif; }
.agent-empty p { max-width: 52ch; margin: 0 0 15px; color: var(--muted-fine); font-size: 13px; line-height: 1.6; }
.agent-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 20px 0 10px; }
.agent-section-heading h2 { margin: 0; color: var(--petrol); font: 750 16px "Manrope", sans-serif; }
.agent-section-heading p { margin: 4px 0 0; color: var(--muted-fine); font-size: 12px; }
.agent-runs-list { display: grid; gap: 10px; margin: 15px 0 24px; }
.agent-alert-panel { margin: 14px 0 20px; }
.agent-alert-panel .field-grid { margin: 0; }
.agent-alert-disclosure { display: block; margin-top: 10px; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.agent-alert-history { display: grid; gap: 8px; margin-top: 18px; padding-top: 15px; border-top: 1px solid #edf0ed; }
.agent-alert-history .agent-section-heading { align-items: baseline; }
.agent-alert-history h3 { margin: 0; color: var(--petrol); font: 700 13px "Manrope", sans-serif; }
.agent-alert-history .agent-section-heading > small { color: var(--muted-fine); font-size: 10px; }
.agent-alert-delivery { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.agent-alert-delivery > div { display: grid; min-width: 0; gap: 3px; }
.agent-alert-delivery strong { color: #3f5750; font-size: 11px; overflow-wrap: anywhere; }
.agent-alert-delivery small { color: var(--muted-fine); font-size: 10px; overflow-wrap: anywhere; }
.agent-alert-delivery .button { flex: 0 0 auto; }
.agent-run-card { min-width: 0; padding: 15px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.agent-run-card.agent-run-failed { border-color: #e7bd9d; background: #fffdfb; }
.agent-run-card > header, .agent-run-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.agent-run-card > header > div { display: grid; gap: 4px; }
.agent-run-card > header strong { color: var(--petrol); font-size: 13px; }
.agent-run-card > header small, .agent-run-card > footer small { color: var(--muted-fine); font-size: 11px; }
.agent-run-answer { margin: 13px 0 4px; color: #43574f; font-size: 13px; line-height: 1.55; white-space: pre-wrap; }
.agent-action-preview { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 12px; margin: 11px 0; padding: 11px; border: 1px solid #f1e0bc; border-radius: 7px; background: #fffbf3; }
.agent-action-preview > div { display: grid; align-content: start; gap: 4px; }
.agent-action-preview strong { color: #644719; font-size: 12px; }
.agent-action-preview small { color: #756447; font-size: 11px; line-height: 1.4; }
.agent-action-preview pre, .agent-tool-result pre { max-height: 200px; margin: 0; overflow: auto; color: #34453e; font: 11px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.agent-run-card > footer { margin-top: 11px; }
.agent-tool-result { margin-top: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; }
.agent-tool-result summary { color: #3f5750; cursor: pointer; font-size: 11px; font-weight: 700; }
.agent-tool-result pre { margin-top: 7px; }
.integration-scope-note { display: block; margin-bottom: 13px; }
.integration-scope-note > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.integration-scope-note > div span { padding: 4px 8px; border-radius: 12px; color: #456259; background: #e7f0e7; font-size: 10px; font-weight: 600; }
.integration-card { display: flex; flex-direction: column; gap: 13px; }
.integration-form, .mcp-connect-panel form { margin-top: 15px; }
.mcp-catalog-panel { margin: 14px 0 18px; }
.mcp-catalog-disclosure { margin: 0; padding: 10px 12px; border: 1px solid #e8d9b4; border-radius: 7px; color: #665733; background: #fffbf2; font-size: 11px; line-height: 1.55; }
.mcp-catalog-panel form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-top: 13px; }
.mcp-catalog-panel form .field { max-width: 620px; }
.mcp-catalog-panel .integration-form-actions { align-items: center; margin-top: 0; }
.mcp-catalog-results { display: grid; gap: 10px; margin-top: 13px; }
.mcp-catalog-card { min-height: 0; }
.mcp-catalog-card h3 { margin: 0; overflow: hidden; color: var(--ink); font: 700 14px "Manrope", sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.mcp-catalog-card .integration-card-head p { overflow-wrap: anywhere; white-space: normal; }
.mcp-catalog-description { margin: 0; color: #52665e; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.mcp-catalog-endpoint { display: block; padding: 8px 9px; border: 1px solid #e5ebe6; border-radius: 5px; color: #456259; background: #f8faf8; font: 10px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.mcp-catalog-card > small { color: var(--muted-fine); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.mcp-catalog-setup-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 9px; }
.mcp-catalog-setup-field label { display: grid; gap: 6px; overflow-wrap: anywhere; }
.mcp-catalog-setup-field input, .mcp-catalog-setup-field select { min-width: 0; }
.mcp-catalog-unsupported { color: #8b4c37 !important; }
.mcp-catalog-links { display: flex; flex-wrap: wrap; gap: 12px; font-size: 11px; }
.mcp-catalog-links a, .mcp-catalog-panel .text-link { color: #326355; text-decoration: underline; text-underline-offset: 2px; }
.integration-form-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.integration-tool-list { display: grid; gap: 7px; color: #52665e; font-size: 11px; }
.integration-tool-list > div { display: flex; flex-wrap: wrap; gap: 5px; }
.integration-tool-list span { max-width: 100%; padding: 4px 7px; overflow: hidden; border: 1px solid #e2e9e3; border-radius: 4px; color: #476259; font: 10px ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.integration-card > button { align-self: flex-start; margin-top: auto; background: transparent; }
.integration-section-title { margin: 16px 0 10px; color: var(--petrol); font: 750 16px "Manrope", sans-serif; }
.email-provider-card { min-height: 180px; }
.email-icon { color: #fff; background: #4c6b62; font-size: 12px; }
.email-provider-card > small { color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.email-provider-card .integration-form-actions { margin-top: auto; }
.email-inbox { margin: 0 0 20px; padding: 15px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.email-inbox .agent-section-heading { margin-top: 0; }
.email-message-list { display: grid; gap: 7px; }
.email-message { min-width: 0; padding: 10px 11px; border: 1px solid #e6ece7; border-radius: 7px; background: #fbfcfa; }
.email-message > div { display: flex; justify-content: space-between; gap: 12px; }
.email-message strong { min-width: 0; overflow: hidden; color: var(--petrol); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.email-message span { flex: 0 0 auto; color: var(--muted-fine); font-size: 10px; }
.email-message p { margin: 5px 0 0; color: #566b62; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.agent-consent { display: flex; align-items: flex-start; gap: 9px; color: #53675f; font-size: 12px; line-height: 1.5; }
.agent-consent input { width: 18px; height: 18px; flex: 0 0 auto; margin: 1px 0 0; }
.agent-connector-choices { display: grid; gap: 6px; max-height: 150px; overflow: auto; }
.agent-connector-choice { display: flex; align-items: center; gap: 9px; padding: 9px; border: 1px solid #e2e9e3; border-radius: 6px; }
.agent-connector-choice input { width: 17px; height: 17px; }
.agent-connector-choice span { display: grid; gap: 3px; }
.agent-connector-choice strong { color: #41594f; font-size: 12px; }
.agent-connector-choice small { color: #78877f; font-size: 10px; }
.agent-run-guardrail { padding: 10px; border-left: 3px solid #d4eb70; color: #53675f; background: #f6f9f3; font-size: 11px; line-height: 1.5; }
.agent-built-in-tools { display: grid; gap: 3px; margin-top: 9px; padding: 10px; border: 1px solid #dbe6d9; border-radius: 6px; background: #f5f9f3; }
.agent-built-in-tools strong { color: var(--petrol); font-size: 11px; }
.agent-built-in-tools span { color: #63736b; font-size: 10px; line-height: 1.45; }
.agent-email-choices { display: grid; gap: 7px; margin-top: 10px; padding: 10px; border: 1px solid #e2e9e3; border-radius: 6px; background: #fbfcfa; }
.agent-email-choices > strong { color: var(--petrol); font-size: 11px; }
.agent-email-choices .agent-connector-choices { max-height: 130px; }
.workflow-template-picker { display: grid; gap: 10px; padding: 14px; border: 1px solid #cbded0; border-radius: 9px; background: linear-gradient(110deg, #f1f7ee, #fbfcfa); }
.workflow-template-picker > div:first-child { display: grid; gap: 4px; }
.workflow-template-picker strong { color: var(--petrol); font: 700 13px "Manrope", sans-serif; }
.workflow-template-picker small { color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.workflow-template-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.workflow-template-controls select { min-width: 0; min-height: 38px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); font: 500 12px "DM Sans", sans-serif; }
.workflow-builder { display: grid; gap: 10px; padding: 14px; border: 1px solid #dce7dd; border-radius: 8px; background: #f8faf7; }
.workflow-path-map-heading { display: grid; gap: 3px; }
.workflow-path-map-heading strong { color: var(--petrol); font: 700 12px "Manrope", sans-serif; }
.workflow-path-map-heading small, .workflow-map-empty { margin: 0; color: var(--muted-fine); font-size: 10px; line-height: 1.45; }
.workflow-path-map { max-height: 250px; overflow: auto; padding: 1px 4px 4px 1px; }
.workflow-map-canvas { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; min-width: 0; padding: 8px 28px; }
.workflow-map-edges { position: absolute; inset: 0; z-index: 0; overflow: visible; pointer-events: none; }
.workflow-map-edge { fill: none; stroke-width: 1.5; }
.workflow-map-edge.edge-next { stroke: #789487; }
.workflow-map-edge.edge-true { stroke: #6e9d48; }
.workflow-map-edge.edge-false { stroke: #a1aaa3; stroke-dasharray: 4 3; }
.workflow-map-node { position: relative; z-index: 1; min-width: 0; margin-bottom: 17px; padding: 9px; border: 1px solid #dfe8df; border-left: 3px solid #93ad9c; border-radius: 6px; background: #fff; cursor: grab; touch-action: pan-y; }
.workflow-map-node:active { cursor: grabbing; }
.workflow-map-node.is-dragging { opacity: .45; }
.workflow-map-node.is-drop-target { border-color: #76a58a; background: #f0f7ef; }
.workflow-map-node > header { display: flex; align-items: flex-start; gap: 8px; }
.workflow-map-node > header > i { display: grid; width: 23px; height: 23px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #edf4e8; color: #426355; font-size: 9px; font-style: normal; font-weight: 750; }
.workflow-map-node > header > div { display: grid; min-width: 0; gap: 2px; }
.workflow-map-edit { max-width: 100%; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.workflow-map-node > header strong { overflow-wrap: anywhere; color: #324e43; font: 700 10px "Manrope", sans-serif; }
.workflow-map-node > header small { color: var(--muted-fine); font-size: 9px; }
.workflow-map-routes { display: grid; gap: 3px; margin: 7px 0 0 31px; }
.workflow-map-routes > div { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 5px; align-items: start; color: #617269; font-size: 9px; line-height: 1.4; }
.workflow-map-routes > div span { color: #809087; }
.workflow-map-routes > div b { overflow-wrap: anywhere; color: #456455; font-weight: 650; }
.workflow-map-end { position: relative; z-index: 1; display: flex; align-items: center; gap: 7px; width: max-content; max-width: 100%; margin: 0 auto; padding: 7px 10px; border: 1px solid #dfe8df; border-radius: 999px; background: #f4f7f2; color: #63796d; font-size: 9px; }
.workflow-map-end > span { display: grid; width: 16px; height: 16px; place-items: center; border-radius: 50%; background: #e4edd9; color: #527145; font-size: 9px; font-weight: 700; }
.workflow-map-end strong { font-weight: 650; }
.workflow-map-empty { grid-column: 1 / -1; padding: 11px; border: 1px dashed #cdd8cf; border-radius: 6px; }
.workflow-version-panel { display: grid; gap: 9px; padding: 12px 14px; border: 1px solid #dce7dd; border-radius: 8px; background: #fbfcfa; }
.workflow-version-panel > div:first-child { display: grid; gap: 4px; }
.workflow-version-panel > div:first-child strong { color: var(--petrol); font: 700 13px "Manrope", sans-serif; }
.workflow-version-panel > div:first-child small, .workflow-version-panel > p, .workflow-version-row small { color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.workflow-version-panel > p { margin: 0; }
#workflow-version-history { display: grid; gap: 7px; }
.workflow-version-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px; border: 1px solid #e6ece6; border-radius: 6px; background: #fff; }
.workflow-version-row > div { display: grid; min-width: 0; gap: 3px; }
.workflow-version-row > div strong { color: #405b50; font-size: 11px; }
.workflow-version-row small { overflow-wrap: anywhere; }
.workflow-version-row .button { flex: 0 0 auto; }
.agent-trigger-builder { margin-top: 12px; }
.agent-trigger-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; max-height: 270px; overflow: auto; }
.agent-trigger-choice { display: flex; align-items: flex-start; gap: 9px; min-width: 0; padding: 9px; border: 1px solid #e2e9e3; border-radius: 6px; background: #fff; }
.agent-trigger-choice input { width: 17px; height: 17px; flex: 0 0 auto; margin: 1px 0 0; }
.agent-trigger-choice span { display: grid; gap: 3px; min-width: 0; }
.agent-trigger-choice strong { color: #41594f; font-size: 11px; }
.agent-trigger-choice small { color: #78877f; font-size: 10px; line-height: 1.4; }
.agent-trigger-choice.is-disabled { opacity: .55; }
.workflow-builder-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.workflow-builder-heading h3 { margin: 0; color: var(--petrol); font: 750 15px "Manrope", sans-serif; }
.workflow-builder-heading p, .workflow-builder > small { margin: 4px 0 0; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
#workflow-step-list { display: grid; gap: 9px; }
.workflow-step { display: grid; gap: 4px; padding: 12px; border: 1px solid #dfe7df; border-radius: 7px; background: #fff; }
.workflow-step > header { display: flex; align-items: center; justify-content: space-between; color: #476259; font-size: 11px; }
.workflow-step-actions { display: flex; align-items: center; gap: 8px; }
.workflow-move-step { min-width: 24px; padding: 2px 4px; border: 1px solid #dfe7df; border-radius: 4px; font-size: 14px; line-height: 1; }
.workflow-move-step:disabled { opacity: .35; cursor: not-allowed; }
.workflow-step .field { margin-top: 5px; }
.workflow-step .field textarea { min-height: 72px; }
.is-hidden { display: none !important; }
.workflow-condition { display: grid; gap: 8px; margin-top: 8px; padding-top: 9px; border-top: 1px solid #edf1ed; }
.workflow-condition-fields.is-hidden { display: none; }
.workflow-condition-rules { display: grid; gap: 7px; }
.workflow-condition-rule { display: grid; gap: 7px; padding: 9px; border: 1px solid #e5ebe4; border-radius: 6px; background: #fff; }
.workflow-condition-rule > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #536b5f; font-size: 10px; }
.workflow-condition-rule > header button:disabled { opacity: .4; cursor: not-allowed; }
.workflow-condition-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.workflow-condition-controls > small { color: var(--muted-fine); font-size: 10px; line-height: 1.4; }
.workflow-condition-fields > small { display: block; margin-top: 2px; color: var(--muted-fine); font-size: 10px; line-height: 1.45; }
.workflow-condition-fields code { color: #476259; }
.workflow-empty { margin: 0; padding: 12px; color: var(--muted-fine); border: 1px dashed #cdd8cf; border-radius: 6px; font-size: 11px; }
.workflow-run-progress { display: grid; gap: 7px; margin: 11px 0; padding: 10px 12px; border-left: 3px solid #b2d357; background: #f6f9f2; }
.workflow-run-progress > strong { color: var(--petrol); font-size: 11px; }
.workflow-run-progress > div { display: flex; justify-content: space-between; gap: 12px; color: #566b62; font-size: 10px; }
.workflow-run-progress small { color: var(--muted-fine); }
.workflow-simulation-result { display: grid; gap: 8px; padding: 12px; border: 1px solid #dce7dd; border-radius: 7px; background: #f7faf5; }
.workflow-simulation-result > strong { color: var(--petrol); font-size: 12px; }
.workflow-simulation-result ol { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.workflow-simulation-result li { display: grid; gap: 4px; padding: 8px 9px; border-left: 3px solid #8aa99a; background: #fff; }
.workflow-simulation-result li.simulation-skip { border-left-color: #c3c9c4; }
.workflow-simulation-result li.simulation-requires_example { border-left-color: #d4a53a; }
.workflow-simulation-result li.simulation-not_evaluated { border-left-color: #dce3dd; }
.workflow-simulation-result li > span { display: flex; justify-content: space-between; gap: 10px; color: #405b50; font-size: 11px; }
.workflow-simulation-result li em { color: #718279; font-size: 10px; font-style: normal; text-align: right; }
.workflow-simulation-result li small, .workflow-simulation-result > small { color: #66766d; font-size: 10px; line-height: 1.45; }
.workflow-simulation-result > small { padding-top: 4px; border-top: 1px solid #e7ece6; }
.calendar-intro { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin: 0 0 14px; padding: 14px 16px; border: 1px solid #dce7dd; border-radius: 8px; background: #f5f9f4; }
.calendar-intro > div { flex: 1 1 220px; min-width: 0; }
.calendar-intro strong { color: var(--petrol); font-size: 13px; }
.calendar-intro p { margin: 4px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; }
.calendar-intro small { display: block; margin-top: 5px; color: var(--muted-fine); font-size: 10px; overflow-wrap: anywhere; }
.calendar-list { display: grid; gap: 16px; }
.calendar-day { padding: 0 0 5px; }
.calendar-day > h2 { margin: 0 0 8px; color: #567067; font: 700 12px/1.4 "DM Sans", sans-serif; text-transform: capitalize; }
.calendar-event { display: grid; grid-template-columns: 98px minmax(0, 1fr) 36px; align-items: start; gap: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.calendar-event + .calendar-event { margin-top: 6px; }
.calendar-event-time { display: flex; align-items: center; gap: 5px; padding-top: 2px; color: #437166; font: 700 11px ui-monospace, monospace; white-space: nowrap; }
.calendar-event-time i { width: 4px; height: 4px; border-radius: 50%; background: #a1b5a9; }
.calendar-event-copy { min-width: 0; display: grid; gap: 4px; }
.calendar-event-copy > strong { color: var(--ink); font-size: 13px; }
.calendar-event-copy > small { color: #5c7168; font-size: 11px; }
.calendar-event-copy > p { margin: 2px 0 0; color: var(--muted-fine); font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.calendar-event .icon-button { width: 32px; min-height: 32px; }
.crm-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; margin: 0 0 17px; }
.crm-metrics article { min-width: 0; display: grid; gap: 5px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.crm-metrics article > span { color: var(--muted-fine); font-size: 11px; font-weight: 600; }
.crm-metrics article > strong { color: var(--petrol); font: 700 21px/1.2 "Manrope", sans-serif; }
.crm-metrics article > small { color: var(--muted-fine); font-size: 10px; }
.crm-tabs { display: flex; gap: 5px; margin: 0 0 14px; padding: 4px; overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: #f7f9f6; }
.crm-tabs button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 1 0 auto; padding: 0 13px; border: 0; border-radius: 6px; color: #607269; background: transparent; font: 600 12px "DM Sans", sans-serif; cursor: pointer; }
.crm-tabs button.active { color: var(--petrol); background: white; box-shadow: 0 1px 4px rgba(21,53,43,.12); }
.crm-tabs button span { min-width: 19px; padding: 2px 5px; border-radius: 9px; color: #718078; background: #edf1eb; font-size: 10px; }
.crm-import-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -2px 0 15px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 8px; background: #f8faf7; }
.crm-import-toolbar > div { display: grid; gap: 3px; }
.crm-import-toolbar strong { color: var(--petrol); font-size: 12px; }
.crm-import-toolbar small { color: var(--muted-fine); font-size: 11px; line-height: 1.45; }
.crm-import-privacy { margin: 2px 0 16px; padding: 10px 12px; border-left: 3px solid #b8d344; color: #53655d; background: #f7f9f3; font-size: 12px; line-height: 1.5; }
.crm-import-mapping { min-width: 0; margin: 0 0 14px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; }
.crm-import-mapping legend { padding: 0 5px; color: var(--petrol); font-size: 12px; font-weight: 700; }
.crm-import-map-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.crm-import-map-grid .field { min-width: 0; margin: 0; }
.crm-import-error { margin: 0 0 12px; padding: 10px 12px; border: 1px solid #e8c6bc; border-radius: 7px; color: #7b3c2e; background: #fff8f5; font-size: 12px; line-height: 1.5; }
.crm-import-summary { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; margin: 12px 0 8px; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.crm-import-summary strong { color: var(--petrol); }
.crm-import-table-wrap { max-width: 100%; overflow: auto; border: 1px solid var(--line); border-radius: 7px; }
.crm-import-table { width: 100%; border-collapse: collapse; font-size: 11px; text-align: left; }
.crm-import-table th, .crm-import-table td { max-width: 220px; padding: 8px 10px; border-bottom: 1px solid #edf0ec; overflow-wrap: anywhere; }
.crm-import-table th { color: var(--muted-fine); background: #f7f9f6; font-weight: 650; }
.crm-import-table tr:last-child td { border-bottom: 0; }
.crm-import-more { display: block; margin-top: 7px; color: var(--muted-fine); font-size: 10px; }
.crm-record-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.crm-record-card { min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.crm-record-card > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.crm-record-type { width: fit-content; padding: 4px 8px; border-radius: 12px; color: #436b5f; background: #eaf2e9; font-size: 10px; font-weight: 700; }
.crm-record-card h3 { margin: 0; overflow-wrap: anywhere; color: var(--ink); font: 700 14px/1.35 "Manrope", sans-serif; }
.crm-record-card p, .crm-record-card small { margin: 0; overflow-wrap: anywhere; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.crm-record-card small { font-size: 10px; }
.crm-record-notes { padding-top: 7px; border-top: 1px solid #edf0ec; color: #5f7067; font-size: 11px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.crm-record-card footer { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; padding-top: 7px; }
.crm-record-card .button-small { min-height: 34px; padding: 0 10px; }
.crm-contact-timeline-panel { min-width: 0; }
.crm-timeline-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.crm-timeline-summary span { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted-fine); background: var(--paper); font-size: 11px; overflow-wrap: anywhere; }
.crm-timeline-summary strong { color: var(--ink); }
.crm-contact-timeline .timeline-copy { min-width: 0; }
.crm-contact-timeline .timeline-copy strong, .crm-contact-timeline .timeline-copy small { overflow-wrap: anywhere; }
.crm-timeline-source { color: var(--teal); font-weight: 700; }
.crm-timeline-open-chat { display: inline-block; margin-top: 6px; font-size: 11px; }
.crm-empty { display: grid; justify-items: center; gap: 9px; padding: 38px 20px; border: 1px dashed #cbd8ce; border-radius: 9px; background: #fbfcfa; text-align: center; }
.crm-empty-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--teal); background: #eaf2e9; font-size: 21px; }
.crm-empty h2 { margin: 3px 0 0; color: var(--petrol); font: 700 16px "Manrope", sans-serif; }
.crm-empty p { max-width: 410px; margin: 0 0 5px; color: var(--muted-fine); font-size: 12px; line-height: 1.55; }
.crm-form .field-grid { align-items: start; }
.role-hidden { display: none !important; }
.team-profile-role { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 14px; border: 1px solid #dfe8df; border-radius: 7px; background: #f7faf6; }
.team-profile-role span { color: var(--muted-fine); font-size: 12px; }
.team-profile-role strong { color: var(--petrol); font-size: 12px; }
.team-management { display: grid; gap: 14px; min-width: 0; }
.team-panel { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.team-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.team-section-heading h3 { margin: 0; color: var(--petrol); font: 700 14px "Manrope", sans-serif; }
.team-section-heading p { margin: 4px 0 0; color: var(--muted-fine); font-size: 11px; line-height: 1.5; }
.team-section-heading > span { flex: 0 0 auto; padding: 4px 8px; border-radius: 12px; color: #53695f; background: #edf2eb; font-size: 10px; font-weight: 700; }
.team-member-list { display: grid; gap: 8px; min-width: 0; }
.team-member-row, .team-invitation-row { display: grid; grid-template-columns: minmax(120px, 1fr) auto minmax(180px, auto); align-items: center; gap: 9px 12px; min-width: 0; padding: 10px; border: 1px solid #e8eee8; border-radius: 7px; background: #fcfdfb; }
.team-member-row > div:first-child, .team-invitation-row > div:first-child { display: grid; gap: 3px; min-width: 0; }
.team-member-row strong, .team-invitation-row strong { overflow-wrap: anywhere; color: var(--ink); font-size: 12px; }
.team-member-row small, .team-invitation-row small { overflow-wrap: anywhere; color: var(--muted-fine); font-size: 10px; }
.team-role-badge, .team-member-protected { width: fit-content; padding: 4px 8px; border-radius: 12px; color: #466659; background: #edf3eb; font-size: 10px; font-weight: 700; white-space: nowrap; }
.team-member-protected { color: #707d76; background: #f0f2ef; }
.team-member-controls { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 6px; }
.team-member-controls select { width: auto; min-width: 110px; min-height: 34px; padding: 0 8px; font-size: 11px; }
.team-member-controls .button, .team-invitation-row .button { min-height: 34px; }
.team-invite-form-grid { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(130px, .65fr) auto; align-items: end; gap: 10px; }
.team-invite-form-grid .field { min-width: 0; margin: 0; }
.team-invite-form-grid > .button { min-height: 42px; white-space: nowrap; }
.team-invite-result { display: grid; gap: 10px; margin-top: 14px; padding: 12px; border: 1px solid #dbe8d3; border-radius: 7px; background: #f6faf2; }
.team-invite-result > div:first-child { display: grid; gap: 3px; }
.team-invite-result strong { color: var(--petrol); font-size: 12px; }
.team-invite-result small { color: var(--muted-fine); font-size: 10px; line-height: 1.5; }
.team-invite-link-row { display: flex; gap: 7px; min-width: 0; }
.team-invite-link-row input { min-width: 0; flex: 1; font-size: 10px; }
.invite-title { margin: 0; color: var(--petrol); font: 750 23px/1.2 "Manrope", sans-serif; }
.invite-subtitle { margin: 7px 0 22px; color: var(--muted-fine); font-size: 13px; line-height: 1.55; }
@media (max-width: 680px) {
  .team-member-row, .team-invitation-row { grid-template-columns: minmax(0, 1fr) auto; }
  .team-member-row > div:first-child, .team-invitation-row > div:first-child { grid-column: 1; }
  .team-member-row > .team-role-badge, .team-invitation-row > .team-role-badge { grid-column: 2; grid-row: 1; }
  .team-member-controls, .team-invitation-row > .button, .team-member-protected { grid-column: 1 / -1; justify-content: flex-start; }
  .team-invite-form-grid { grid-template-columns: minmax(0, 1fr); }
  .team-invite-form-grid > .button { width: 100%; }
  .team-invite-link-row { flex-direction: column; }
  .team-invite-link-row .button { width: 100%; }
}
@media (max-width: 1000px) { .crm-record-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 900px) { .agent-grid, .integration-grid { grid-template-columns: 1fr; } }
@media (max-width: 680px) {
  .crm-import-toolbar { align-items: stretch; flex-direction: column; }
  .crm-import-toolbar .button { width: 100%; }
  .crm-import-map-grid { grid-template-columns: minmax(0,1fr); }
  .crm-import-table th, .crm-import-table td { max-width: 150px; padding: 7px; }
  .page-heading:has(.heading-actions) { align-items: flex-start; flex-direction: row; }
  .page-heading .heading-actions { width: auto; }
  .page-heading .heading-actions .button { flex: 0 0 44px; width: 44px; min-width: 44px; }
  .service-schedule-row { grid-template-columns: 84px minmax(0,1fr); gap: 7px 9px; padding: 11px; }
  .service-schedule-status { grid-column: 2; }
  .service-schedule-panel .panel-header { align-items: flex-start; flex-direction: column; justify-content: center; gap: 5px; padding: 11px; }
  .service-booking-card, .service-resource-row { align-items: stretch; flex-direction: column; }
  .service-booking-card .button { width: 100%; }
  .service-resource-actions { justify-content: space-between; }
  .service-availability-week { grid-template-columns: minmax(0, 1fr); }
  .service-slot-suggestions { grid-template-columns: minmax(0, 1fr); }
  .service-schedule-form-grid { grid-template-columns: minmax(0,1fr); }
  .service-schedule-resources select { min-height: 96px; }
  .workflow-template-controls { grid-template-columns: minmax(0, 1fr); }
  .workflow-template-controls .button { width: 100%; }
  .workflow-path-map { grid-template-columns: minmax(0, 1fr); }
  .workflow-version-row { align-items: stretch; flex-direction: column; }
  .workflow-version-row .button { width: 100%; }
  .agent-trigger-choices { grid-template-columns: minmax(0, 1fr); max-height: 230px; }
  .crm-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .crm-metrics article { padding: 11px; }
  .crm-record-grid { grid-template-columns: minmax(0,1fr); }
  .crm-tabs button { padding: 0 10px; }
  .agent-tabs { overflow-x: auto; }
  .agent-tabs button { flex: 1 0 auto; justify-content: center; padding: 0 10px; font-size: 12px; }
  .agent-intro { align-items: flex-start; flex-wrap: wrap; }
  .agent-intro > div { flex: 1 1 calc(100% - 55px); }
  .agent-intro > button { width: 100%; }
  .agent-card footer { flex-wrap: wrap; }
  .agent-card footer .button { flex: 1 1 auto; }
  .agent-action-preview { grid-template-columns: 1fr; }
  .integration-card-head { align-items: flex-start; flex-wrap: wrap; }
  .integration-card-head > .agent-status { margin-left: 47px; }
  .calendar-event { grid-template-columns: minmax(0, 1fr) 34px; gap: 5px 8px; }
  .calendar-event-time { grid-column: 1; }
  .calendar-event-copy { grid-column: 1; }
  .calendar-event > .icon-button { grid-column: 2; grid-row: 1 / span 2; }
}
@media (max-width: 400px) {
  .nav-link[data-view="crm"]::after { content: "CRM"; }
  .nav-link[data-view="quotes"]::after { content: "Prop."; }
  .nav-link[data-view="agents"]::after { content: "Agentes"; }
}
@media (max-width: 360px) {
  .nav-link::after { font-size: 9px; }
  .nav-link[data-view="dashboard"]::after { content: "Painel"; }
  .nav-link[data-view="reports"]::after { content: "Rel."; }
  .nav-link[data-view="requests"]::after { content: "Ped."; }
  .nav-link[data-view="quotes"]::after { content: "Prop."; }
  .nav-link[data-view="orders"]::after { content: "Serv."; }
  .nav-link[data-view="payments"]::after { content: "Pagar"; }
  .nav-link[data-view="whatsapp"]::after { content: "Whats"; }
  .nav-link[data-view="agents"]::after { content: "IA"; }
}
.daily-brief-panel{margin:18px 0 20px;overflow:hidden}
.daily-brief-panel>.panel-header{align-items:flex-start}
.daily-brief-loading{color:#60736d;font-size:12px;white-space:nowrap}
.daily-brief-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 16px 16px}
.daily-brief-card{min-width:0;border:1px solid #dce6e1;border-radius:12px;background:#fbfdfc;padding:14px}
.daily-brief-card>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px}
.daily-brief-card>header h3{margin:0;color:#1e3831;font-size:14px;font-weight:700}
.daily-brief-card>header span{flex:0 0 auto;border-radius:999px;background:#e9f3ed;color:#355b4a;padding:4px 8px;font-size:11px;font-weight:700}
.daily-brief-list{display:grid;gap:10px;min-height:72px;align-content:start}
.daily-brief-row{display:flex;align-items:flex-start;gap:9px;min-width:0}
.daily-brief-marker{width:8px;height:8px;flex:0 0 8px;margin-top:5px;border-radius:50%;background:#d1973d}
.daily-brief-marker.is-late{background:#bf5c4e}
.daily-brief-marker.is-event{background:#397f77}
.daily-brief-marker.is-service{background:#7187bd}
.daily-brief-marker.is-stale{background:#c58b43}
.daily-brief-copy{display:grid;gap:3px;min-width:0}
.daily-brief-copy strong{color:#263e37;font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.daily-brief-copy small{color:#667973;font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.daily-brief-card>.text-button{margin-top:12px;font-size:12px}
.daily-brief-empty{margin:0;color:#71817b;font-size:12px;line-height:1.55}
.daily-brief-attention{display:grid;gap:6px;border-left:2px solid #c58b43;padding-left:9px}
.daily-brief-attention strong{color:#594a31;font-size:12px;line-height:1.45}
.daily-brief-attention .text-button{justify-self:start;font-size:12px}
.daily-brief-all-clear{margin:0 16px 16px;padding:10px 12px;border-radius:9px;background:#f0f6f2;color:#42604f;font-size:12px;line-height:1.5}
.daily-brief-error{padding:0 16px 16px;color:#8b453d;font-size:13px}
@media(max-width:1050px){.daily-brief-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.daily-brief-card:last-child{grid-column:1/-1}}
@media(max-width:680px){.daily-brief-panel{margin:14px 0 16px}.daily-brief-grid{grid-template-columns:minmax(0,1fr);padding:0 12px 12px;gap:9px}.daily-brief-card:last-child{grid-column:auto}.daily-brief-card{padding:12px}.daily-brief-panel>.panel-header{padding:14px 12px}.daily-brief-all-clear{margin:0 12px 12px}}