:root {
  color-scheme: light;
  --paper: #fff;
  --surface: #fff;
  --ink: #181818;
  --ink-soft: #383838;
  --muted: #666;
  --line: #dedede;
  --line-strong: #bcbcbc;
  --green: #181818;
  --green-deep: #333;
  --green-wash: #efefef;
  --sidebar: #fafafa;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --shadow: 0 12px 45px #1c1c1c12;
  --radius: 3px;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 15px/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
button, input, select, textarea, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
button:disabled, input:disabled, select:disabled { cursor: not-allowed; opacity: .55; }
button, input, select, textarea { max-width: 100%; }
input, select, textarea { color: var(--ink); background: var(--surface); }
input:not([type='checkbox']):not([type='radio']), select, textarea { min-height: 42px; border: 1px solid var(--line-strong); border-radius: 2px; padding: 10px 12px; }
input::placeholder, textarea::placeholder { color: #828282; opacity: 1; }
input[type='checkbox'], input[type='radio'] { width: 17px; height: 17px; margin: 0; flex-shrink: 0; accent-color: var(--green); cursor: pointer; }
textarea { display: block; width: 100%; resize: vertical; min-height: 108px; line-height: 1.6; }
a { color: var(--green); text-underline-offset: 3px; }
a:hover { color: var(--green-deep); }
button, a, input, select, textarea, summary, [tabindex] { outline-offset: 4px; }
:focus-visible { outline: 2px solid var(--ink); }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--green); }
button svg, a svg { flex-shrink: 0; }
svg { vertical-align: middle; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -.035em; line-height: 1.08; }
h1 { font-size: clamp(32px, 3vw, 40px); }
h2 { font-size: 28px; }
h3 { font-size: 15px; font-weight: 650; line-height: 1.4; }
h4 { font-size: 14px; font-weight: 650; }
p + p { margin-top: 10px; }
ul, ol { padding-left: 20px; }
hr { border: 0; border-top: 1px solid var(--line); }
::selection { color: #fff; background: var(--ink); }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.muted { color: var(--muted); }
.small-text { font-size: 12px; line-height: 1.55; }
.mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .88em; }
.divider { height: 1px; margin: 22px 0; border: 0; background: var(--line); }

.app-shell { min-height: 100dvh; }
.sidebar { position: fixed; z-index: 30; inset: 0 auto 0 0; display: flex; flex-direction: column; width: 224px; border-right: 1px solid var(--line); padding: 25px 15px 16px; color: var(--ink); background: #fafafa; }
.brand { display: flex; align-items: center; gap: 11px; min-height: 37px; margin: 0 10px 33px; color: var(--ink); text-decoration: none; }
.brand:hover { color: #555; }
.brand-mark { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; color: var(--ink); font: 500 29px/1 var(--serif); letter-spacing: -.07em; }
.brand-name { color: inherit; font-size: 10px; line-height: 1.5; font-weight: 500; letter-spacing: .15em; }
.brand-name small { display: block; margin-top: 5px; color: var(--muted); font-size: 9px; font-weight: 400; letter-spacing: .1em; }
.nav-group { display: flex; flex-direction: column; gap: 3px; margin-bottom: 25px; }
.nav-label { margin: 0 11px 7px; color: var(--muted); font-size: 10px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
.nav-item { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 42px; border: 1px solid transparent; border-radius: 2px; padding: 9px 11px; color: #555; background: transparent; font-size: 14px; font-weight: 400; line-height: 1.4; text-align: left; text-decoration: none; transition: background .15s, color .15s; }
.nav-item:hover { color: var(--ink); background: #ededed; }
.nav-item.active { border-color: var(--ink); color: #fff; background: var(--ink); }
.nav-icon { display: inline-flex; justify-content: center; flex-shrink: 0; width: 18px; color: currentColor; }
.nav-item.active .nav-icon { color: #fff; }
.nav-count { min-width: 19px; margin-left: auto; padding: 0 4px; color: #666; font-size: 11px; font-variant-numeric: tabular-nums; text-align: center; }
.nav-item.active .nav-count { color: #fff; background: transparent; }
.sidebar-bottom { margin-top: auto; border-top: 1px solid var(--line); padding: 14px 9px 0; color: var(--muted); font-size: 11px; }
.sidebar-bottom a { color: #444; }
.sidebar-bottom .nav-item { margin-top: 9px; }
.workspace { min-width: 0; margin-left: 224px; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 53px; border-bottom: 1px solid var(--line); padding: 10px 30px; background: #fff; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; }
.breadcrumbs strong { color: var(--ink-soft); font-weight: 500; }
.breadcrumbs a { color: var(--muted); text-decoration: none; }
.topbar-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.status-pill { display: inline-flex; align-items: center; gap: 7px; color: #555; font-size: 11px; white-space: nowrap; }
.status-pill::before { width: 5px; height: 5px; border-radius: 50%; background: #555; content: ""; }
.avatar { display: inline-grid; flex-shrink: 0; place-items: center; width: 31px; height: 31px; border: 1px solid #d3d3d3; border-radius: 50%; color: #565656; background: #e7e7e7; font-size: 11px; font-weight: 700; }
.page-body { max-width: 1800px; margin: 0 auto; padding: 25px 30px 24px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 21px; }
.page-heading p { max-width: 680px; margin-top: 8px; color: var(--muted); font-size: 14px; }
.eyebrow { display: block; margin-bottom: 9px; color: var(--green); font-size: 10px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; }
.heading-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.page-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; border: 1px solid #bbb; border-radius: 2px; padding: 8px 13px; color: var(--ink); background: #fff; font-size: 14px; font-weight: 400; line-height: 1.45; text-decoration: none; transition: background .15s, border-color .15s; }
.btn:hover { border-color: #9f9f9f; color: var(--ink); background: #f3f3f3; }
.btn.primary { border-color: var(--green); color: #ffffff; background: var(--green); }
.btn.primary:hover { border-color: var(--green-deep); color: #ffffff; background: var(--green-deep); }
.btn.subtle { border-color: transparent; color: var(--muted); background: transparent; }
.btn.subtle:hover { color: var(--green); background: var(--green-wash); }
.btn.danger { border-color: #888; color: var(--ink); background: #fff; }
.btn.danger:hover { border-color: var(--ink); color: #fff; background: var(--ink); }
.btn.small { min-height: 33px; padding: 6px 10px; font-size: 11px; }
.icon-button { display: inline-grid; flex-shrink: 0; place-items: center; width: 36px; height: 36px; border: 1px solid transparent; border-radius: 2px; padding: 5px; color: var(--muted); background: transparent; font-size: 18px; }
.icon-button:hover { border-color: var(--line); color: var(--ink); background: #eeeeee; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-bottom: 22px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.metric { min-width: 0; border: 0; border-right: 1px solid var(--line); border-radius: 0; padding: 15px 18px 14px; background: transparent; text-align: left; appearance: none; }
.metric.accent { background: #f6f6f6; }
.metric-label { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: #636363; font-size: 11px; font-weight: 500; }
.metric-label svg { color: #848484; }
.metric-value { display: block; margin: 6px 0 5px; font: 500 32px/1.02 var(--serif); letter-spacing: -.035em; font-variant-numeric: lining-nums tabular-nums; }
.metric-note { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; color: var(--muted); font-size: 10px; }
.metric-note strong { color: var(--green); font-weight: 600; }

.toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 11px; margin-bottom: 16px; }
.search-wrap { position: relative; display: flex; align-items: center; flex: 1 1 220px; max-width: 400px; min-width: 0; }
.search-wrap > svg, .search-wrap > span:first-child { position: absolute; z-index: 1; left: 12px; color: #838383; pointer-events: none; }
.search-wrap input { width: 100%; min-height: 40px !important; padding-left: 37px !important; font-size: 12px; }
.search-wrap .icon-button { position: absolute; right: 3px; width: 30px; height: 30px; }
.filters { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.filter-select { min-height: 38px; min-width: 106px; max-width: 220px; border-color: var(--line) !important; padding: 8px 27px 8px 10px !important; font-size: 11px; }
.view-switch { display: inline-flex; gap: 2px; border: 1px solid var(--line); border-radius: 2px; padding: 3px; background: #ffffff; }
.view-switch button { display: inline-flex; justify-content: center; align-items: center; gap: 5px; min-height: 30px; border: 0; border-radius: 3px; padding: 5px 9px; color: var(--muted); background: transparent; font-size: 11px; }
.view-switch button.active, .view-switch button[aria-pressed='true'] { color: var(--green); background: var(--green-wash); }
.view-switch button:hover { color: var(--ink); background: #efefef; }
.table-wrap { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.lead-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; }
.lead-table th { border-bottom: 1px solid var(--line); padding: 12px 15px; color: #777777; background: #f9f9f9; font-size: 10px; font-weight: 550; letter-spacing: .045em; white-space: nowrap; }
.lead-table th button { display: inline-flex; align-items: center; gap: 5px; border: 0; padding: 0; color: inherit; background: none; font: inherit; letter-spacing: inherit; }
.lead-table th button:hover { color: var(--green); }
.lead-table td { border-bottom: 1px solid #ececec; padding: 16px 15px; vertical-align: middle; }
.lead-table tr:last-child td { border-bottom: 0; }
.lead-table tbody tr { transition: background .12s; }
.lead-table tbody tr:hover { background: #f9f9f9; }
.lead-table tbody tr.selected, .lead-table tbody tr[aria-selected='true'] { background: #efefef; }
.lead-table td:first-child, .lead-table th:first-child { padding-left: 19px; }
.lead-table td:last-child, .lead-table th:last-child { padding-right: 19px; }
.lead-table td a, .lead-table td button[data-open] { text-decoration: none; }
.lead-table td input[type='checkbox'] { vertical-align: middle; }
.lead-identity { display: flex; align-items: center; gap: 10px; min-width: 170px; }
.lead-avatar { display: inline-grid; flex-shrink: 0; place-items: center; width: 34px; height: 34px; border: 1px solid #dfdfdf; border-radius: 2px; color: #595959; background: #eeeeee; font-size: 10px; font-weight: 650; letter-spacing: .03em; }
.lead-name { display: block; border: 0; padding: 0; color: var(--ink); background: transparent; font-size: 14px; font-weight: 600; text-align: left; }
.lead-name:hover { color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.lead-org { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.lead-title { display: block; max-width: 270px; margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.badge { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; border: 1px solid transparent; border-radius: 4px; padding: 3px 7px; color: #666666; background: #efefef; font-size: 10px; font-weight: 550; line-height: 1.35; white-space: nowrap; }
.badge.new { color: #6d6d6d; background: #f2f2f2; }
.badge.qualified { color: #575757; background: #ededed; }
.badge.won { color: #494949; background: #e3e3e3; }
.badge.lost { color: #727272; background: #eaeaea; }
.badge.urgent { border-color: var(--ink); color: #fff; background: var(--ink); font-weight: 500; }
.badge.high { border-color: #bbb; color: var(--ink); background: #eee; font-weight: 500; }
.badge.normal { color: #656565; background: #eeeeee; }
.badge.nurture { color: #838383; background: #f2f2f2; }
.badge.muted { color: #7b7b7b; background: #f0f0f0; }
.score { display: inline-flex; align-items: center; gap: 7px; min-width: 75px; color: #505050; font-size: 12px; font-weight: 650; font-variant-numeric: tabular-nums; }
.score-track { display: inline-block; width: 43px; height: 4px; overflow: hidden; border-radius: 3px; background: #e7e7e7; }
.score-bar { display: block; height: 100%; border-radius: inherit; background: #777777; }
.bulk-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 13px; border: 1px solid #d1d1d1; border-radius: 2px; padding: 10px 13px; color: #434343; background: #ededed; font-size: 12px; }
.bulk-bar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.pagination { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 16px; color: var(--muted); font-size: 11px; }
.pagination > div { display: flex; align-items: center; gap: 6px; }
.empty-state { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 12px; min-height: 230px; padding: 40px 24px; color: var(--muted); text-align: center; }
.empty-state h2 { color: var(--ink-soft); }
.empty-state p { max-width: 450px; }
.empty-state svg { color: #8a8a8a; }
.notice { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 20px; border: 1px solid #d7d7d7; border-radius: 2px; padding: 12px 15px; color: #5d5d5d; background: #eeeeee; font-size: 12px; }
.notice.warning { border-color: #ccc; border-left: 3px solid var(--ink); color: var(--ink); background: #f4f4f4; }
.notice.error { border-color: #ccc; border-left: 3px solid var(--ink); color: var(--ink); background: #f4f4f4; }
.notice.success { border-color: #aaa; color: var(--ink); background: #fafafa; }
.notice p { margin: 0; }
.notice .btn { margin-left: auto; }
.demo-banner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; border-bottom: 1px solid #cdcdcd; padding: 10px 36px; color: #585858; background: #eaeaea; font-size: 12px; }

.panel { min-width: 0; margin-bottom: 21px; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 19px 0; background: #fff; }
.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 12px; margin-bottom: 19px; }
.panel-heading h2 { font-size: 24px; }
.panel-heading p { margin-top: 5px; color: var(--muted); font-size: 12px; }
.panel-heading .btn { flex-shrink: 0; }
.two-column { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.three-column { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 15px; max-width: 100%; overflow-x: auto; padding-bottom: 14px; overscroll-behavior-x: contain; }
.board-column { min-height: 300px; border: 0; border-top: 2px solid #aaa; border-radius: 0; padding: 11px; background: #f5f5f5; }
.board-header { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 3px 2px 14px; color: #5e5e5e; font-size: 11px; font-weight: 650; }
.board-header .badge { background: #dfdfdf; }
.lead-card { display: block; margin-top: 10px; border: 1px solid var(--line); border-radius: 2px; padding: 13px; color: var(--ink); background: #fff; text-align: left; text-decoration: none; }
.lead-card:hover { border-color: #888; color: var(--ink); }
.lead-card .lead-title { margin-top: 11px; }
.lead-card .lead-identity { min-width: 0; }
.lead-card .badge { margin-top: 10px; }
.lead-card .card-footer .badge { margin-top: 0; }
.card-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; border-top: 1px solid #ededed; padding-top: 11px; color: var(--muted); font-size: 11px; }
.task-row { display: flex; align-items: flex-start; gap: 12px; border-bottom: 1px solid var(--line); padding: 16px 0; }
.task-row:last-child { border-bottom: 0; }
.task-row > input { margin-top: 3px; }
.task-row > div:not(.task-date) { flex: 1; min-width: 0; }
.task-row p { margin-top: 4px; color: var(--muted); font-size: 12px; }
.task-row .btn, .task-row .icon-button { flex-shrink: 0; }
.task-date { flex-shrink: 0; color: #848484; font-size: 11px; text-align: right; }
.task-date.overdue { color: #6c6c6c; }
.insight-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.chart-row { display: grid; grid-template-columns: minmax(110px, 1.2fr) minmax(60px, 2fr) 34px; align-items: center; gap: 12px; margin: 15px 0; font-size: 12px; }
.chart-label { min-width: 0; color: var(--ink-soft); overflow-wrap: anywhere; }
.chart-row > div:not(.chart-label):not(.chart-bar) { border-radius: 3px; background: #ededed; }
.chart-bar { min-width: 2px; height: 8px; border-radius: 3px; background: #8b8b8b; }
.pipeline-strip { display: flex; gap: 3px; min-height: 9px; overflow: hidden; border-radius: 4px; margin: 20px 0 12px; background: #ececec; }
.pipeline-segment { min-width: 3px; background: #747474; }
.pipeline-segment:nth-child(2) { background: #9c9c9c; }
.pipeline-segment:nth-child(3) { background: #bababa; }
.pipeline-segment:nth-child(4) { background: #d1d1d1; }
.pipeline-segment:nth-child(5) { background: #a7a7a7; }
.pipeline-segment:nth-child(6) { background: #989898; }

.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; margin-bottom: 17px; }
.field > label, .field > span:first-child, .field-label { color: #535353; font-size: 11px; font-weight: 600; }
.field > input, .field > select, .field > textarea { width: 100%; font-size: 13px; }
.field:last-child { margin-bottom: 0; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.field-grid .full, .field-grid .span-two { grid-column: 1 / -1; }
.check-field { display: flex; align-items: flex-start; gap: 10px; min-height: 35px; margin: 8px 0; color: #505050; font-size: 13px; cursor: pointer; }
.check-field input { margin-top: 2px; }
.check-field small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.help { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.field .help { margin-top: 0; }
.rule-card, .template-card { min-width: 0; margin-bottom: 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 19px 0; background: #fff; }
.rule-card p, .template-card p { margin-top: 7px; color: var(--muted); font-size: 12px; }
.rule-card .card-footer, .template-card .card-footer { margin-top: 16px; }
.rule-card.disabled { background: #f7f7f7; opacity: .8; }
.template-preview { max-height: 300px; overflow-y: auto; margin-top: 14px; border: 1px solid #e4e4e4; border-radius: 2px; padding: 16px; color: #4e4e4e; background: #f7f7f7; font-size: 12px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.integration-step { display: flex; align-items: flex-start; gap: 13px; margin: 17px 0; }
.integration-step > span:first-child { display: inline-grid; place-items: center; flex-shrink: 0; width: 26px; height: 26px; border: 1px solid #d7d7d7; border-radius: 50%; color: #6b6b6b; background: #f0f0f0; font-size: 11px; font-weight: 600; }
.integration-step p { margin-top: 5px; color: var(--muted); font-size: 12px; }
.integration-step code { overflow-wrap: anywhere; }

.drawer-backdrop, .dialog-backdrop { position: fixed; z-index: 80; inset: 0; background: #1e1e1e5c; backdrop-filter: blur(2px); }
.drawer { position: fixed; z-index: 81; inset: 0 0 0 auto; display: flex; flex-direction: column; width: min(700px, 100vw); max-height: 100dvh; background: var(--paper); box-shadow: -14px 0 60px #17171726; animation: drawer-in .2s ease-out; }
.drawer-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; flex-shrink: 0; border-bottom: 1px solid var(--line); padding: 26px 28px 22px; background: #ffffff; }
.drawer-header h2 { margin-top: 5px; font-size: 33px; overflow-wrap: anywhere; }
.drawer-header p { margin-top: 5px; color: var(--muted); font-size: 12px; }
.drawer-header .lead-avatar { width: 43px; height: 43px; font-size: 13px; }
.drawer-body { min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; padding: 23px 28px 32px; }
.drawer-footer { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; flex-shrink: 0; gap: 8px; border-top: 1px solid var(--line); padding: 15px 28px; background: #ffffff; }
.drawer-footer .help { margin-right: auto; }
.tabs { display: flex; flex-wrap: wrap; gap: 18px; border-bottom: 1px solid var(--line); margin-bottom: 22px; }
.tab { position: relative; min-height: 42px; border: 0; border-bottom: 2px solid transparent; padding: 10px 0 12px; color: var(--muted); background: transparent; font-size: 12px; font-weight: 500; }
.tab:hover { color: var(--green); }
.tab.active { border-bottom-color: var(--green); color: var(--green); font-weight: 650; }
.detail-section { margin-bottom: 22px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0 0 21px; background: #fff; }
.detail-section h3 { margin-bottom: 15px; }
.detail-section > p { font-size: 13px; line-height: 1.75; overflow-wrap: anywhere; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.detail-label { margin-bottom: 5px; color: #7d7d7d; font-size: 10px; font-weight: 550; }
.detail-value { color: var(--ink-soft); font-size: 13px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.detail-value a { overflow-wrap: anywhere; }
.score-reasons { margin: 12px 0 0; padding-left: 16px; color: #616161; font-size: 12px; line-height: 1.8; }
.score-reasons li + li { margin-top: 3px; }
.timeline { position: relative; margin-top: 6px; }
.timeline-item { position: relative; display: grid; grid-template-columns: 11px minmax(0, 1fr); column-gap: 14px; padding-bottom: 24px; }
.timeline-item::before { position: absolute; left: 5px; top: 10px; bottom: 0; width: 1px; background: var(--line); content: ''; }
.timeline-item:last-child::before { display: none; }
.timeline-dot { z-index: 1; width: 11px; height: 11px; margin-top: 4px; border: 2px solid var(--paper); border-radius: 50%; background: #9f9f9f; box-shadow: 0 0 0 1px #d7d7d7; }
.timeline-time { margin-bottom: 6px; color: #898989; font-size: 10px; }
.timeline-text { color: #535353; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; white-space: pre-wrap; }
.timeline-text strong { color: var(--ink-soft); font-weight: 600; }
.compare-grid { display: grid; grid-template-columns: 150px repeat(var(--compare-count, 3), minmax(220px, 1fr)); max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 2px; background: #ffffff; overscroll-behavior-x: contain; }
.compare-label { position: sticky; left: 0; z-index: 1; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 17px; color: #6b6b6b; background: #f5f5f5; font-size: 11px; font-weight: 600; }
.compare-cell { min-width: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 17px; color: var(--ink-soft); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.compare-cell .lead-name { margin-bottom: 4px; }

.dialog-backdrop { z-index: 90; display: grid; place-items: center; padding: 22px; }
.dialog { position: relative; z-index: 91; display: flex; flex-direction: column; width: min(580px, 100%); max-height: calc(100dvh - 44px); border: 1px solid #d6d6d6; border-radius: 2px; background: var(--paper); box-shadow: var(--shadow); animation: dialog-in .15s ease-out; }
.dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line); padding: 22px 24px 18px; }
.dialog-header h2 { font-size: 28px; }
.dialog-body { min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; padding: 23px 24px; }
.dialog-body > p { margin-bottom: 16px; color: var(--muted); font-size: 13px; }
.dialog-footer { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--line); padding: 15px 24px; }
.toast { position: fixed; z-index: 120; right: 23px; bottom: 23px; max-width: min(430px, calc(100vw - 36px)); border: 1px solid var(--ink); border-radius: 2px; padding: 13px 17px; color: #fff; background: var(--ink); box-shadow: 0 5px 20px #0002; font-size: 14px; animation: dialog-in .15s ease-out; }
.toast.error { border: 2px solid #fff; outline: 1px solid var(--ink); background: var(--ink); }
.loading { display: flex; align-items: center; justify-content: center; gap: 11px; min-height: 160px; color: var(--muted); font-size: 13px; }
.loading::before { width: 17px; height: 17px; border: 2px solid #dbdbdb; border-top-color: var(--green); border-radius: 50%; content: ''; animation: spin .8s linear infinite; }
.access-screen { display: grid; place-items: center; min-height: 100dvh; padding: 30px 20px; background: #fafafa; }
.access-card { width: min(480px, 100%); border: 1px solid var(--line); border-radius: 2px; padding: 35px; background: #fff; }
.access-card .brand { margin: 0 0 30px; color: var(--ink); }
.access-card .brand-mark { border-color: #bbbbbb; color: var(--green); }
.access-card h1 { margin-bottom: 14px; font-size: 35px; }
.access-card > p { margin-bottom: 24px; color: var(--muted); font-size: 13px; }
.access-card .btn.primary { width: 100%; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes drawer-in { from { transform: translateX(30px); opacity: .65; } to { transform: translateX(0); opacity: 1; } }
@keyframes dialog-in { from { transform: translateY(6px); opacity: .6; } to { transform: translateY(0); opacity: 1; } }

@media (min-width: 1600px) {
  .page-body { padding-right: 48px; padding-left: 48px; }
  .topbar { padding-right: 48px; padding-left: 48px; }
  .metrics { gap: 18px; }
  .metric { padding: 23px; }
  .lead-table td { padding-top: 18px; padding-bottom: 18px; }
}

@media (max-width: 1180px) {
  .page-body { padding: 27px 24px; }
  .topbar { padding-right: 24px; padding-left: 24px; }
  .demo-banner { padding-right: 24px; padding-left: 24px; }
  .metric { padding: 17px 15px; }
  .metric-value { font-size: 32px; }
  .two-column { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; }
  .three-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .toolbar { align-items: flex-start; }
  .filters { flex: 1 1 100%; }
  .search-wrap { max-width: none; }
  .panel { padding: 18px; }
}

@media (max-width: 900px) {
  .sidebar { position: relative; inset: auto; width: 100%; padding: 16px 20px 10px; }
  .brand { align-self: flex-start; margin: 0 0 16px; }
  .brand-name { font-size: 9px; }
  .brand-mark { width: 32px; height: 32px; font-size: 20px; }
  .nav-group { flex-direction: row; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
  .nav-label { flex: 1 0 100%; margin: 3px 7px 1px; font-size: 9px; }
  .nav-item { width: auto; flex: 0 1 auto; min-height: 38px; padding: 8px 10px; font-size: 12px; }
  .nav-count { min-width: 18px; font-size: 10px; }
  .nav-icon { width: 16px; font-size: 15px; }
  .sidebar-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 4px; padding: 9px 7px 0; font-size: 10px; }
  .sidebar-bottom .nav-item { margin-top: 0; padding: 5px 8px; }
  .workspace { margin-left: 0; }
  .topbar { min-height: 60px; padding: 12px 24px; }
  .page-body { padding: 26px 24px; }
  .metrics { gap: 11px; }
  .settings-grid { gap: 16px; }
}

@media (max-width: 680px) {
  h1 { font-size: 35px; }
  .page-body { padding: 24px 18px; }
  .topbar { gap: 10px; padding: 12px 18px; }
  .topbar-actions { gap: 8px; }
  .topbar-actions .btn { min-height: 34px; padding: 6px 8px; font-size: 11px; }
  .breadcrumbs { gap: 5px; font-size: 10px; }
  .status-pill { font-size: 10px; }
  .page-heading { align-items: flex-start; gap: 16px; margin-bottom: 22px; }
  .heading-actions { width: 100%; }
  .heading-actions .btn { flex: 1 1 auto; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 23px; }
  .metric { padding: 17px 15px; }
  .metric-value { margin-top: 11px; font-size: 32px; }
  .metric-note { font-size: 10px; }
  .toolbar { gap: 10px; }
  .search-wrap { flex: 1 1 100%; }
  .filters { width: 100%; gap: 7px; }
  .filter-select { flex: 1 1 110px; max-width: 100%; }
  .view-switch { margin-left: auto; }
  .two-column, .three-column, .insight-grid, .settings-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .panel { padding: 18px; }
  .lead-table th, .lead-table td { padding-right: 12px; padding-left: 12px; }
  .lead-table td { padding-top: 15px; padding-bottom: 15px; }
  .lead-table td:first-child, .lead-table th:first-child { padding-left: 14px; }
  .lead-table td:last-child, .lead-table th:last-child { padding-right: 14px; }
  .lead-title { max-width: 210px; }
  .board { grid-auto-columns: minmax(255px, 82vw); }
  .task-row { flex-wrap: wrap; gap: 9px; }
  .task-date { margin-left: auto; }
  .chart-row { grid-template-columns: minmax(110px, 1.2fr) minmax(60px, 1.5fr) 28px; gap: 9px; }
  .drawer-header { padding: 22px 20px 19px; }
  .drawer-body { padding: 20px; }
  .drawer-footer { padding: 14px 20px; }
  .drawer-header h2 { font-size: 30px; }
  .tabs { gap: 16px; }
  .tab { font-size: 11px; }
  .detail-section { padding: 17px; }
  .compare-grid { grid-template-columns: 114px repeat(var(--compare-count, 3), minmax(220px, 1fr)); }
  .compare-label, .compare-cell { padding: 14px 12px; }
  .dialog-backdrop { padding: 14px; }
  .dialog { max-height: calc(100dvh - 28px); }
  .dialog-header { padding: 20px; }
  .dialog-body { padding: 20px; }
  .dialog-footer { padding: 14px 20px; }
  .demo-banner { padding: 10px 18px; font-size: 11px; }
  .notice { padding: 12px; }
  .toast { right: 18px; bottom: 18px; }
}

@media (max-width: 400px) {
  .sidebar { padding-right: 14px; padding-left: 14px; }
  .nav-group { gap: 4px; }
  .nav-item { gap: 6px; padding-right: 8px; padding-left: 8px; font-size: 11px; }
  .sidebar-bottom { align-items: flex-start; }
  .topbar { flex-wrap: wrap; }
  .topbar-actions { margin-left: auto; }
  .page-body { padding-right: 14px; padding-left: 14px; }
  .page-heading p { font-size: 12px; }
  .metric { padding: 15px 12px; }
  .metric-label { font-size: 10px; }
  .field-grid, .detail-grid { grid-template-columns: minmax(0, 1fr); }
  .field-grid .full, .field-grid .span-two { grid-column: auto; }
  .drawer-header { padding: 18px 16px; }
  .drawer-body { padding: 18px 16px; }
  .drawer-footer { padding: 12px 16px; }
  .drawer-footer .btn { flex: 1 1 auto; }
  .tabs { gap: 13px; }
  .access-card { padding: 26px 22px; }
  .access-card h1 { font-size: 31px; }
}

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

@media print {
  body { background: #ffffff; font-size: 11px; }
  .sidebar, .topbar, .heading-actions, .toolbar, .bulk-bar, .pagination, .drawer, .drawer-backdrop, .dialog, .dialog-backdrop, .toast, .demo-banner { display: none !important; }
  .workspace { margin: 0; }
  .page-body { max-width: none; padding: 0; }
  .metrics { grid-template-columns: repeat(4, 1fr); }
  .metric, .panel, .lead-card { break-inside: avoid; box-shadow: none; }
  .table-wrap, .compare-grid, .board { overflow: visible; }
  .lead-table { font-size: 11px; }
  .lead-table td, .lead-table th { padding: 8px; }
  a { color: inherit; }
}
/* Working-surface refinements shared across the responsive views. */
button.metric { text-align: left; cursor: pointer; }
button.metric:hover { background: #f0f0f0; }
.metric-label, .metric-note, .help, .small-text, .badge, .lead-org, .lead-title, .nav-label, .brand-name, .brand-name small, .nav-count, .status-pill, .breadcrumbs, .page-footer, .eyebrow, .detail-label, .timeline-time { font-size: 12px; }
.btn, .btn.small, .nav-item, .field > span:first-child, .field > input, .field > select, .field > textarea, .filter-select, .search-wrap input, .view-switch button, .tab, .check-field, .detail-value, .rule-card p, .template-card p, .dialog-body > p { font-size: 14px; }
.page-heading p, .drawer-header p, .detail-section > p, .access-card > p { font-size: 15px; }
.lead-table th { font-size: 12px; }
.request-title { padding: 0; border: 0; background: transparent; text-align: left; line-height: 1.5; }
.request-title:hover { color: var(--green); text-decoration: underline; }
.lead-table .lead-title { min-width: 170px; }
.lead-table td { padding-top: 14px; padding-bottom: 14px; }
.score meter { width: 44px; height: 8px; }
.chart-row meter { width: 100%; }
meter::-webkit-meter-bar { border: 0; background: #e6e6e6; }
meter::-webkit-meter-optimum-value { background: #7a7a7a; }
.view-switch { flex-wrap: wrap; }
.metric { appearance: none; }
.panel { margin-bottom: 20px; }
.panel > h2, .detail-section > h2 { margin-bottom: 18px; }
.score-reasons { padding-left: 0; }
.drawer > .tabs { flex-shrink: 0; padding: 0 28px; margin: 0; background: white; gap: 20px; }
.drawer-footer { justify-content: space-between; }
.drawer-footer > span { font-size: 12px; }
.original-answers { margin: 16px 0; }
.original-answers dd { margin-left: 0; }
.timeline-item > :not(.timeline-dot) { grid-column: 2; }
.timeline-dot { grid-row: 1 / 4; }
.timeline-item > strong { font-size: 14px; }
.timeline-text { margin-top: 5px; font-size: 14px; }
.wide-dialog { width: min(1150px, 100%); }
.comparison td { min-width: 210px; max-width: 320px; white-space: pre-wrap; }
.comparison th { min-width: 140px; }
.overdue-text { color: var(--ink); font-weight: 600; text-decoration: underline dotted; text-underline-offset: 3px; }
.extra-filters { margin-bottom: 16px; padding: 15px; border: 1px solid var(--line); background: #fafafa; align-items: end; }
.extra-filters .field { flex: 1 1 160px; margin-bottom: 0; }
.saved-views { margin-bottom: 16px; }
.card-stage { width: 100%; margin-top: 14px; font-size: 14px; }
.integration-step { display: block; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.integration-step .endpoint { display: block; margin: 10px 0; padding: 10px; background: var(--paper); font-size: 13px; word-break: break-all; }
.integration-step code { font-size: 13px; }
.rule-card { display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.rule-card > div:first-child { flex: 1; }
.rule-card > .heading-actions { flex-shrink: 0; }
.overlay-open { overflow: hidden; }
.access-card > .brand-mark { margin-bottom: 24px; }
.demo-banner { margin-bottom: 16px; padding: 0 0 10px; color: var(--muted); background: #fff; }
.skip-link:focus { position: fixed; z-index: 150; top: 8px; left: 8px; width: auto; height: auto; clip: auto; padding: 10px 20px; color: #ffffff; background: var(--green); }
@media (max-width: 680px) {
 .rule-card { align-items: stretch; flex-direction: column; }
 .drawer > .tabs { padding: 0 18px; gap: 15px; }
 .topbar .breadcrumbs { display: none; }
 .topbar-actions { width: 100%; justify-content: flex-end; }
 .view-switch { width: 100%; }
 .view-switch button { flex: 1 1 auto; }
 .metric-note { font-size: 12px; }
 .brand-name, .brand-name small { font-size: 12px; }
 .nav-label { font-size: 12px; }
 .field-grid { grid-template-columns: 1fr; }
 .filters > .btn { flex: 1; }
 .rule-card > .heading-actions { width: auto; }
}

/* Simple, shared working surfaces. */
.metric:first-child { padding-left: 0; }
.metric:last-child { border-right: 0; }
.metric-value { margin: 6px 0 5px; }
.metric-label svg { color: #777; }
.metric-note strong, .task-date.overdue { color: var(--ink); }
.badge { border: 1px solid #ddd; border-radius: 2px; }
.badge.new, .badge.qualified, .badge.normal, .badge.nurture, .badge.muted { color: #555; background: #f7f7f7; }
.badge.won { border-color: #bbb; color: var(--ink); background: #eee; }
.badge.lost { color: #777; background: #fff; }
.lead-name { font-weight: 500; }
.btn.small { min-height: 35px; }
.view-switch { padding: 0; gap: 0; }
.view-switch button { min-height: 37px; border-radius: 0; border-right: 1px solid var(--line); padding: 7px 10px; }
.view-switch button:last-child { border-right: 0; }
.view-switch button.active, .view-switch button[aria-pressed='true'] { color: #fff; background: var(--ink); }
.view-switch button:hover:not([aria-pressed='true']) { color: var(--ink); background: #eee; }
.panel-heading h2 { font-size: 27px; }
.detail-section:last-child { border-bottom: 0; }
.lead-card > .card-footer:first-child { margin: 0 0 12px; border: 0; padding: 0; }
input[type='range'] { width: 100%; min-height: 32px !important; margin: 0; border: 0 !important; padding: 0 !important; accent-color: var(--ink); cursor: pointer; }
meter::-webkit-meter-bar { border-radius: 0; background: #e6e6e6; }
meter::-webkit-meter-optimum-value, meter::-moz-meter-bar { background: #555; }
.compact-stats { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; border-block: 1px solid var(--line); padding: 12px 0; margin-bottom: 20px; color: var(--muted); font-size: 13px; }
.compact-stats strong { margin-right: 5px; color: var(--ink); font-weight: 600; }

.priority-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: start; gap: 32px; }
.priority-main { min-width: 0; }
.priority-layout > aside { position: sticky; top: 22px; }
.priority-layout > aside .priority-preview { position: static; }
.priority-preview { position: sticky; top: 22px; min-width: 0; border: 1px solid var(--line); border-radius: 2px; padding: 21px; background: #fafafa; }
.priority-preview h2 { font-size: 28px; }
.priority-preview > p { margin-top: 8px; color: var(--muted); font-size: 13px; }
.priority-step { border-top: 1px solid var(--line); padding: 22px 0; }
.priority-step:first-child { padding-top: 18px; }
.priority-step > h2, .priority-step > header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
.priority-step > p { margin-bottom: 17px; color: var(--muted); font-size: 14px; }
.step-number { display: inline-grid; place-items: center; flex-shrink: 0; min-width: 26px; height: 26px; margin-top: 1px; border: 1px solid #bdbdbd; border-radius: 50%; color: #555; font: 12px/1 var(--sans); letter-spacing: 0; }
.priority-presets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.preset-button { position: relative; display: block; min-width: 0; min-height: 120px; border: 1px solid #ccc; border-radius: 2px; padding: 13px; color: #444; background: #fff; text-align: left; }
.preset-button:hover { border-color: var(--ink); background: #fafafa; }
.preset-button.active, .preset-button[aria-pressed='true'] { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); color: var(--ink); background: #f4f4f4; }
.preset-title { display: block; margin-bottom: 7px; font-size: 14px; font-weight: 600; line-height: 1.4; }
.preset-description { display: block; color: var(--muted); font-size: 12px; line-height: 1.55; }
.importance-row { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(160px, 1fr); align-items: center; gap: 24px; border-bottom: 1px solid var(--line); padding: 15px 0; }
.importance-row:last-child { border-bottom: 0; }
.importance-label { display: block; min-width: 0; color: #333; font-size: 14px; font-weight: 500; }
.importance-label p, .importance-label small, .importance-label span { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 400; }
.importance-control { min-width: 0; }
.importance-control select { width: 100%; }
.importance-control output { display: block; margin-top: 3px; text-align: right; font-size: 13px; }
.range-labels { display: flex; justify-content: space-between; gap: 8px; margin-top: 1px; color: var(--muted); font-size: 11px; }
.service-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; }
.service-choices .check-field { align-items: center; margin: 0; min-height: 42px; }
.service-choices label { min-width: 0; }
.priority-preview-list { margin: 17px 0 0; padding: 0; list-style: none; }
.priority-preview-item { display: flex; align-items: flex-start; gap: 11px; border-top: 1px solid #ddd; padding: 13px 0; }
.priority-preview-item > div { flex: 1; min-width: 0; }
.priority-preview-item .lead-name { font-size: 14px; }
.priority-preview-item .lead-org, .priority-preview-item p { margin-top: 3px; color: var(--muted); font-size: 12px; }
.preview-rank { flex-shrink: 0; min-width: 18px; padding-top: 2px; color: #777; font-size: 12px; font-variant-numeric: tabular-nums; }
.priority-change { display: inline-block; margin-top: 5px; color: var(--ink); font-size: 11px; font-weight: 500; }
.rule-summary { margin-top: 5px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.rule-summary > div { min-width: 0; }
.rule-summary h3, .rule-summary strong { font-size: 14px; font-weight: 500; }
.rule-summary p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.rule-switch { display: inline-flex; align-items: center; flex-shrink: 0; gap: 8px; min-height: 32px; font-size: 13px; cursor: pointer; }
.rule-switch input { accent-color: var(--ink); }
.disclosure { border-top: 1px solid var(--line); padding: 0; }
.disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 50px; padding: 13px 0; list-style: none; color: #444; font-size: 14px; font-weight: 500; cursor: pointer; }
.disclosure > summary::-webkit-details-marker { display: none; }
.disclosure > summary::after { content: '+'; flex-shrink: 0; font-size: 22px; font-weight: 400; line-height: 1; }
.disclosure[open] > summary::after { content: '−'; }
.disclosure > :not(summary) { margin-top: 8px; }
.priority-controls { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; border-top: 1px solid var(--line); padding: 17px 0 0; }
.priority-controls p, .priority-controls > span { color: var(--muted); font-size: 13px; }

@media (min-width: 1600px) {
  .page-body, .topbar { padding-right: 42px; padding-left: 42px; }
  .metrics { gap: 0; }
  .metric { padding: 15px 22px; }
  .priority-layout { gap: 42px; }
}
@media (max-width: 1240px) {
  .priority-layout { grid-template-columns: minmax(0, 1fr) 310px; gap: 23px; }
  .priority-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .preset-button { min-height: 100px; }
  .priority-preview { padding: 18px; }
}
@media (max-width: 1100px) {
  .priority-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .priority-preview, .priority-layout > aside { position: static; }
  .priority-preview-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
  .priority-presets { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .sidebar { position: relative; inset: auto; width: 100%; border-right: 0; border-bottom: 1px solid var(--line); padding: 13px 18px 11px; background: #fff; }
  .brand { align-self: flex-start; margin: 0 0 12px; min-height: 30px; }
  .brand-mark { width: 30px; height: 30px; font-size: 27px; }
  .brand-name { font-size: 9px; }
  .brand-name small, .nav-label, .sidebar-bottom > p { display: none; }
  .sidebar nav { display: flex; flex-wrap: wrap; gap: 4px; }
  .nav-group { display: contents; }
  .nav-item { width: auto; min-height: 37px; gap: 7px; padding: 8px 10px; font-size: 13px; }
  .nav-icon { width: 15px; }
  .nav-icon svg { width: 15px; height: 15px; }
  .nav-count { min-width: 16px; padding: 0 2px; font-size: 10px; }
  .sidebar-bottom { position: absolute; top: 11px; right: 18px; margin: 0; border: 0; padding: 0; }
  .sidebar-bottom .nav-item { min-height: 32px; margin: 0; padding: 7px 0; font-size: 11px; }
  .workspace { margin-left: 0; }
  .topbar { min-height: 46px; padding: 7px 20px; }
  .page-body { padding: 22px 20px; }
  .metrics { gap: 0; }
}
@media (max-width: 680px) {
  .sidebar { padding-right: 14px; padding-left: 14px; }
  .sidebar nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
  .nav-item { justify-content: center; min-height: 39px; padding: 7px 4px; font-size: 12px; text-align: center; }
  .nav-icon { display: none; }
  .nav-count { margin-left: 1px; }
  .sidebar-bottom { right: 15px; }
  .topbar { gap: 8px; padding: 6px 16px; }
  .topbar-actions { gap: 10px; }
  .page-body { padding: 20px 16px; }
  .page-heading { gap: 13px; margin-bottom: 18px; }
  .page-heading p { font-size: 14px; }
  .metrics { gap: 0; margin-bottom: 18px; }
  .metrics .metric, .metrics .metric:first-child { padding: 12px 13px; }
  .metric:nth-child(2) { border-right: 0; }
  .metric:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .metric-value { font-size: 30px; }
  .panel { margin-bottom: 12px; padding: 17px 0; }
  .priority-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .preset-button { min-height: 112px; padding: 12px; }
  .priority-step { padding: 19px 0; }
  .importance-row { grid-template-columns: minmax(0, 1fr); gap: 9px; padding: 15px 0; }
  .importance-control { width: 100%; }
  .service-choices { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .priority-preview { padding: 17px; }
  .priority-preview-list { display: block; }
  .rule-summary { gap: 12px; }
  .priority-controls { align-items: stretch; }
  .priority-controls .btn { flex: 1 1 auto; }
  .detail-section { padding: 0 0 17px; }
  .compact-stats { gap: 8px 15px; font-size: 12px; }
}
@media (max-width: 400px) {
  .nav-item { font-size: 11px; }
  .brand-name { font-size: 8px; }
  .sidebar-bottom .nav-item { font-size: 10px; }
}
@media print {
  .priority-layout { grid-template-columns: 1fr; }
  .priority-preview, .priority-layout > aside { position: static; }
  .priority-step { break-inside: avoid; }
}



.metrics.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 680px) {
  .metrics.three .metric, .metrics.three .metric:first-child { padding: 12px 9px; border-bottom: 0; }
  .metrics.three .metric:nth-child(2) { border-right: 1px solid var(--line); }
  .metrics.three .metric-label { font-size: 11px; gap: 3px; }
  .metrics.three .metric-label svg { display: none; }
  .metrics.three .metric-note { font-size: 11px; }
}

.inquiry-pricing { display:flex; align-items:center; gap:16px; justify-content:space-between; border:1px solid var(--line); padding:14px; margin-top:16px; }
.inquiry-pricing > div { min-width:0; }
.commercial-presets { grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:16px; }
.commercial-presets .preset-button { min-height:65px; white-space:normal; }
.commercial-summary { border-left:2px solid #aaa; padding-left:8px; margin:8px 0; }
@media(max-width:680px) { .commercial-presets { grid-template-columns:1fr; } .inquiry-pricing { flex-direction:column; align-items:stretch; } }

.date-shortcuts { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin:-6px 0 16px; }
.invoice-followups .task-row { flex-wrap:wrap; }
.invoice-followups .task-row > div:first-child { flex:1; min-width:190px; }

#owner-access-form { margin-top: 26px; }
#owner-code { font-size: 22px; letter-spacing: .25em; padding: 13px 14px; }
#access-feedback { min-height: 20px; margin: -5px 0 14px; }
#owner-access-form + .help { margin: 22px 0 0; }

/* The four daily destinations stay visible; secondary tools remain one step away. */
.nav-more { display:none; }
.page-heading h1 { font-size:clamp(28px,2.5vw,38px); }
@media(max-width:900px){
  .sidebar nav { display:flex;flex-wrap:wrap;align-items:center;gap:4px; }
  .nav-primary { display:flex;flex:1;gap:4px; }
  .nav-primary .nav-item { flex:1; }
  .nav-more { display:block;max-width:100%; }
  .nav-secondary { display:none;width:100%;border-top:1px solid var(--line);padding-top:8px;margin-top:5px; }
  .nav-secondary.is-open { display:flex;flex-wrap:wrap;gap:5px; }
  .nav-secondary .nav-group { display:flex;flex-wrap:wrap;width:100%;gap:4px; }
  .nav-secondary .nav-label { display:block;width:100%;margin:6px 4px;font-size:10px; }
  .nav-secondary .nav-item { justify-content:flex-start;text-align:left;min-height:44px; }
}
@media(max-width:680px){
  .nav-primary { flex-basis:100%; }
  .nav-primary .nav-item { min-height:44px;font-size:12px;gap:3px; }
  .nav-more { min-height:32px;margin-left:auto;padding:5px 8px; }
  .sidebar { padding-bottom:6px; }
}

.mobile-session { display:none; }
@media(max-width:900px){
  .sidebar .brand { margin-bottom:6px; }
  .sidebar-bottom { display:none; }
  .nav-more { position:absolute;top:10px;right:16px;margin:0;max-width:60%; }
  .nav-secondary .mobile-session { display:flex;width:100%;border-top:1px solid var(--line);margin-top:6px; }
}