:root {
    --ink-950: #0b1220;
    --ink-900: #111a2c;
    --ink-800: #1c2940;
    --ink-700: #33445f;
    --ink-600: #52637d;
    --ink-500: #718198;
    --line: #dfe6ef;
    --line-strong: #cbd6e3;
    --surface: #ffffff;
    --surface-soft: #f7f9fc;
    --canvas: #eef3f8;
    --brand: #3157d5;
    --brand-strong: #2346bd;
    --brand-soft: #edf2ff;
    --teal: #0c8a7b;
    --success: #08745d;
    --success-soft: #e7f8f3;
    --warning: #9a5b07;
    --warning-soft: #fff7dd;
    --danger: #b42336;
    --danger-soft: #fff0f1;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 14px rgba(15, 23, 42, .04);
    --shadow-lg: 0 24px 70px rgba(15, 23, 42, .16);
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
}

.platform-ui {
    margin: 0;
    color: var(--ink-950);
    background: var(--canvas);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}

.platform-ui button,
.platform-ui input {
    font: inherit;
}

.platform-ui a,
.platform-ui button,
.platform-ui input {
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.platform-ui :focus-visible {
    outline: 3px solid rgba(49, 87, 213, .25);
    outline-offset: 2px;
}

.brand-lockup {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    font-weight: 750;
    letter-spacing: -.02em;
}

.brand-mark {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: linear-gradient(145deg, #5578ed, #3157d5 58%, #17379b);
    color: #fff;
    font-size: 13px;
    letter-spacing: -.03em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 8px 20px rgba(30, 64, 175, .25);
}

.eyebrow,
.section-kicker {
    display: block;
    margin-bottom: 10px;
    color: var(--brand);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    line-height: 1.2;
    text-transform: uppercase;
}

.eyebrow-light { color: #a9bbff; }

/* Sign in */
.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 32px;
    background:
        radial-gradient(circle at 12% 12%, rgba(82, 117, 232, .14), transparent 30%),
        radial-gradient(circle at 90% 88%, rgba(12, 138, 123, .11), transparent 34%),
        #edf2f7;
}

.auth-shell {
    display: grid;
    grid-template-columns: minmax(360px, .92fr) minmax(390px, 1.08fr);
    width: min(100%, 980px);
    min-height: 610px;
    overflow: hidden;
    border: 1px solid rgba(203, 214, 227, .8);
    border-radius: 30px;
    background: var(--surface);
    box-shadow: var(--shadow-lg);
}

.auth-introduction {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 46px;
    color: #fff;
    background:
        radial-gradient(circle at 100% 0, rgba(82, 117, 232, .55), transparent 38%),
        linear-gradient(155deg, #101a30 0%, #14284c 58%, #153f50 100%);
}

.auth-introduction::after {
    content: "";
    position: absolute;
    right: -100px;
    bottom: -110px;
    width: 300px;
    height: 300px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50%;
    box-shadow: 0 0 0 42px rgba(255,255,255,.035), 0 0 0 84px rgba(255,255,255,.025);
}

.auth-introduction-copy { position: relative; z-index: 1; }
.auth-introduction h2 {
    max-width: 460px;
    margin: 0;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 1.08;
    letter-spacing: -.045em;
}

.auth-introduction p {
    max-width: 450px;
    margin: 20px 0 0;
    color: #c7d3e7;
    font-size: 15px;
    line-height: 1.7;
}

.auth-trust-list {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.auth-trust-list span {
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    color: #dbe6f8;
    font-size: 11px;
    font-weight: 650;
}

.auth-page .login-card {
    width: auto;
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 64px 72px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.login-card-header h1 {
    margin: 0 0 10px;
    font-size: 36px;
    line-height: 1.15;
    letter-spacing: -.04em;
}

.login-card-header p { margin: 0 0 8px; color: var(--ink-600); }
.mobile-brand { display: none; }
.auth-page label { margin-top: 22px; color: var(--ink-800); font-size: 13px; }
.auth-page input {
    min-height: 50px;
    padding: 13px 15px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: #fbfcfe;
    color: var(--ink-950);
}

.auth-page input:hover { border-color: #aebdd0; }
.auth-page input:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(49,87,213,.11); background: #fff; }
.auth-page .primary-action {
    min-height: 50px;
    border-radius: var(--radius-sm);
    background: linear-gradient(135deg, #3d63dc, #294ec5);
    box-shadow: 0 10px 24px rgba(49,87,213,.22);
}
.auth-page .primary-action:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(49,87,213,.28); }
.auth-page .footer { margin-top: 8px; color: var(--ink-500); }

/* Owner home */
.owner-home { min-height: 100vh; background: var(--canvas); }
.owner-home .top-nav {
    min-height: 82px;
    padding: 16px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11, 18, 32, .97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}

.nav-brand-copy { display: grid; gap: 2px; }
.nav-brand-copy strong { font-size: 15px; }
.nav-brand-copy small { color: #91a1ba; font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.nav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.platform-ui .nav-links { display: flex; align-items: center; gap: 5px; min-width: 0; }
.platform-ui .nav-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #aebbd0;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}
.platform-ui .nav-links a:hover { border-color: #42516a; background: #1c2940; color: #fff; }
.platform-ui .nav-links a.active,
.platform-ui .nav-links a[aria-current="page"] { border-color: rgba(255,255,255,.14); background: #fff; color: var(--ink-950); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.nav-action,
.management-nav-action {
    display: inline-flex !important;
    align-items: center;
    min-height: 38px;
    margin-left: 0 !important;
    padding: 8px 12px !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: #cbd5e1 !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.nav-action[hidden],
.management-nav-action[hidden] { display: none !important; }
.nav-action:hover,
.management-nav-action:hover { border-color: #42516a !important; background: #1c2940 !important; color: #fff !important; }
.owner-home .owner-badge {
    margin: 0 4px;
    padding: 7px 10px;
    border: 1px solid rgba(91, 226, 190, .2);
    border-radius: 999px;
    background: rgba(12,138,123,.16);
    color: #80e0cc;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.owner-home .container { max-width: 1520px; margin: 0 auto; padding: 52px 16px 80px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.owner-home .page-title { margin: 0; font-size: clamp(34px, 4vw, 48px); line-height: 1.08; letter-spacing: -.045em; }
.owner-home .page-subtitle { max-width: 650px; margin: 12px 0 0; color: var(--ink-600); font-size: 15px; line-height: 1.6; }
.environment-pill { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; padding: 9px 12px; border: 1px solid #cce9e1; border-radius: 999px; background: #f0fbf8; color: var(--success); font-size: 11px; font-weight: 750; }
.environment-pill span { width: 7px; height: 7px; border-radius: 50%; background: #16a085; box-shadow: 0 0 0 4px rgba(22,160,133,.1); }

.owner-home .card {
    margin-bottom: 22px;
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
}
.owner-home .create-card { border-color: #d9e2f8; background: linear-gradient(135deg, #fff, #f8faff); }
.section-heading { display: flex; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.section-heading h2 { margin: 0; color: var(--ink-950); font-size: 21px; letter-spacing: -.025em; }
.section-heading p { margin: 7px 0 0; color: var(--ink-600); font-size: 13px; line-height: 1.55; }
.owner-home .form-row { align-items: stretch; }
.owner-home label { color: var(--ink-700); font-size: 12px; }
.owner-home input { min-height: 48px; padding: 12px 15px; border-color: var(--line-strong); background: #fff; }
.owner-home input:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.owner-home .create-button { min-height: 48px; padding-inline: 20px; border-radius: var(--radius-sm); background: var(--brand); box-shadow: 0 8px 20px rgba(49,87,213,.18); }
.owner-home .create-button:hover { background: var(--brand-strong); transform: translateY(-1px); }

.owner-home .business-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.owner-home .agency-overview-card { border-color: #cedaf8; background: linear-gradient(145deg, #ffffff, #f5f8ff); }
.agency-overview-card .section-heading { align-items: flex-start; }
.agency-health { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; padding: 9px 12px; border: 1px solid #cce9e1; border-radius: 999px; background: #f0fbf8; color: var(--success); font-size: 10px; font-weight: 750; }
.agency-health span { width: 7px; height: 7px; border-radius: 50%; background: #16a085; box-shadow: 0 0 0 4px rgba(22,160,133,.1); }
.agency-health.attention { border-color: #f2d596; background: var(--warning-soft); color: var(--warning); }
.agency-health.attention span { background: #d28a16; box-shadow: 0 0 0 4px rgba(210,138,22,.12); }
.owner-home .agency-metric-grid { margin-bottom: 24px; }
.owner-home .agency-metric-grid .metric { min-height: 118px; }
.owner-home .agency-metric-grid small { display: block; margin-top: 7px; color: var(--ink-600); font-size: 10px; font-weight: 650; }
.agency-activity-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.agency-activity-heading h3 { margin: 0; color: var(--ink-950); font-size: 16px; }
.agency-activity-heading p { margin: 6px 0 0; color: var(--ink-600); font-size: 11px; }
.agency-activity-list { margin-top: 12px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.agency-activity-item { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: var(--surface); }
.agency-activity-item:last-child { border-bottom: 0; }
.agency-activity-item > div:first-child { display: grid; gap: 4px; min-width: 0; }
.agency-activity-item strong { color: var(--ink-900); font-size: 12px; }
.agency-activity-item span { color: var(--ink-600); font-size: 10px; }
.agency-activity-usage { flex: 0 0 auto; color: var(--ink-700); font-size: 11px; font-weight: 750; }
.agency-client-operations-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
.agency-client-operations-heading h3 { margin:0; color:var(--ink-950); font-size:16px; }
.agency-client-operations-heading p { margin:6px 0 0; color:var(--ink-600); font-size:10px; }
.agency-client-operations-heading > span { flex:0 0 auto; color:var(--ink-600); font-size:10px; font-weight:750; }
.agency-client-operations-tools { display:grid; grid-template-columns:minmax(220px,1fr) minmax(180px,260px); gap:12px; margin-top:14px; }
.agency-client-operations-tools .field { margin:0; }
.agency-client-operations-tools .field > span { display:block; margin-bottom:6px; color:var(--ink-700); font-size:9px; font-weight:750; }
.agency-client-operations-tools input,.agency-client-operations-tools select { min-height:42px; margin:0; padding:9px 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--ink-950); font-size:10px; }
.agency-client-operations { overflow:hidden; margin-top:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.agency-client-operation-row { display:grid; grid-template-columns:minmax(150px,.75fr) minmax(460px,2fr) minmax(130px,auto); align-items:center; gap:18px; padding:16px; border-bottom:1px solid var(--line); }
.agency-client-operation-row:last-child { border-bottom:0; }
.agency-client-operation-identity { display:grid; gap:4px; min-width:0; }
.agency-client-operation-identity > strong { overflow:hidden; color:var(--ink-950); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.agency-client-operation-identity > span { overflow:hidden; color:var(--ink-500); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.agency-operation-health { justify-self:start; margin-top:4px; padding:5px 8px; border-radius:999px; font-size:8px; }
.agency-operation-health.healthy { background:var(--success-soft); color:var(--success); }
.agency-operation-health.attention { background:var(--warning-soft); color:var(--warning); }
.agency-client-operation-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.agency-client-operation-facts > div { min-width:0; padding-left:10px; border-left:1px solid var(--line); }
.agency-client-operation-facts span,.agency-client-operation-facts small { display:block; overflow:hidden; color:var(--ink-500); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.agency-client-operation-facts strong { display:block; overflow:hidden; margin:4px 0; color:var(--ink-900); font-size:10px; text-overflow:ellipsis; text-transform:capitalize; white-space:nowrap; }
.agency-client-operation-actions { display:grid; gap:7px; }
.agency-client-operation-actions a { justify-content:center; text-align:center; white-space:nowrap; }
.agency-client-panel { margin-top: 16px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.agency-client-panel-heading h3 { margin: 0; color: var(--ink-950); font-size: 15px; }
.agency-client-panel-heading p { margin: 6px 0 14px; color: var(--ink-600); font-size: 11px; line-height: 1.5; }
.agency-client-list { overflow: hidden; margin-bottom: 13px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.agency-client-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 13px; border-bottom: 1px solid var(--line); }
.agency-client-row:last-child { border-bottom: 0; }
.agency-client-identity { display: flex; align-items: center; gap: 9px; min-width: 0; }
.agency-client-identity strong { overflow: hidden; color: var(--ink-900); font-size: 11px; text-overflow: ellipsis; }
.agency-client-invite-form,
.agency-invitation-link { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 9px; }
.agency-client-invite-form input,
.agency-invitation-link input { min-height: 42px; margin: 0; }
.agency-client-result:empty { display: none; }
.agency-client-result p { margin: 0 0 9px; }
.owner-home .agency-credit-center { border-color: #cedaf8; background: linear-gradient(145deg,#fff,#f8faff); }
.agency-payment-status { display:inline-flex; align-items:center; align-self:flex-start; flex:0 0 auto; min-height:30px; padding:6px 10px; border:1px solid #ead8a4; border-radius:9px; background:var(--warning-soft); color:var(--warning); font-size:10px; font-weight:750; line-height:1.2; white-space:nowrap; }
.agency-credit-metrics { margin-bottom:18px; }
.agency-credit-metrics .metric { min-height:108px; }
.agency-credit-metrics small { display:block; margin-top:7px; color:var(--ink-600); font-size:10px; }
.agency-credit-warning { margin:0 0 20px; padding:13px 15px; border:1px solid #ead8a4; border-radius:10px; background:var(--warning-soft); color:var(--warning); font-size:11px; font-weight:650; line-height:1.5; }
.agency-funding-section { padding-top:20px; border-top:1px solid var(--line); }
.agency-subheading { margin-bottom:12px; }
.agency-subheading h3 { margin:0; color:var(--ink-950); font-size:16px; }
.agency-subheading p { margin:5px 0 0; color:var(--ink-600); font-size:10px; line-height:1.5; }
.agency-funding-list,.agency-credit-history { overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.agency-funding-row { display:grid; grid-template-columns:minmax(180px,1.1fr) minmax(190px,.8fr) minmax(260px,1.25fr); align-items:center; gap:16px; padding:15px; border-bottom:1px solid var(--line); }
.agency-funding-row:last-child,.agency-credit-history-row:last-child { border-bottom:0; }
.agency-funding-identity { display:grid; gap:4px; min-width:0; }
.agency-funding-identity strong { overflow:hidden; color:var(--ink-950); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.agency-funding-identity span { color:var(--ink-500); font-size:9px; text-transform:capitalize; }
.agency-funding-figures { display:flex; flex-wrap:wrap; gap:8px 14px; color:var(--ink-600); font-size:9px; }
.agency-funding-figures strong { color:var(--ink-900); font-size:11px; }
.agency-funding-controls { display:grid; gap:8px; }
.agency-funding-controls select,.agency-allocation-control input { min-height:41px; margin:0; padding:9px 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--ink-950); font-size:10px; }
.agency-allocation-control { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.agency-allocation-control .create-button { min-height:41px; }
.agency-credit-split { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:22px; }
.agency-credit-history-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; border-bottom:1px solid var(--line); }
.agency-credit-history-row > div { display:grid; gap:4px; min-width:0; }
.agency-credit-history-row strong { color:var(--ink-900); font-size:10px; }
.agency-credit-history-row span { overflow:hidden; color:var(--ink-500); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.agency-credit-history-row b { flex:0 0 auto; font-size:11px; }
.credit-positive { color:var(--success); }.credit-negative { color:var(--danger); }
.owner-home .agency-pricing-card { border-color:#cbdcf3; background:linear-gradient(145deg,#fff,#f7fbff); }
.agency-pricing-notice { display:grid; gap:5px; margin-bottom:20px; padding:14px 16px; border:1px solid #cbdcf3; border-radius:11px; background:#edf5ff; }
.agency-pricing-notice strong { color:var(--ink-950); font-size:12px; }
.agency-pricing-notice span { color:var(--ink-600); font-size:10px; line-height:1.5; }
.agency-pricing-form { display:grid; gap:20px; }
.agency-pricing-plan { display:grid; grid-template-columns:minmax(260px,1fr) minmax(220px,.55fr); gap:18px; align-items:stretch; }
.agency-money-input { display:flex; align-items:center; overflow:hidden; margin-top:7px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface); }
.agency-money-input > span { padding:0 0 0 13px; color:var(--ink-600); font-size:13px; font-weight:750; }
.agency-money-input input { min-height:45px; margin:0; border:0; background:transparent; color:var(--ink-950); box-shadow:none; }
.agency-pricing-form .field > small,.agency-pricing-packages label > small { display:block; margin-top:6px; color:var(--ink-500); font-size:9px; line-height:1.45; }
.agency-pricing-margin { display:grid; align-content:center; padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.agency-pricing-margin span { color:var(--ink-600); font-size:10px; }
.agency-pricing-margin strong { margin:5px 0; color:var(--success); font-size:24px; }
.agency-pricing-margin small { color:var(--ink-500); font-size:9px; }
.agency-pricing-packages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.agency-pricing-packages > label { display:block; padding:15px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink-900); font-size:11px; font-weight:750; }
.agency-pricing-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.agency-pricing-actions > span { color:var(--ink-500); font-size:9px; }
.agency-team-list { overflow:hidden; margin-top:18px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.agency-team-row { display:grid; grid-template-columns:minmax(180px,1fr) auto minmax(220px,auto); align-items:center; gap:14px; padding:14px 15px; border-bottom:1px solid var(--line); }
.agency-team-row:last-child { border-bottom:0; }
.agency-team-identity { display:grid; gap:4px; min-width:0; }
.agency-team-identity strong { overflow:hidden; color:var(--ink-950); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.agency-team-identity span { color:var(--ink-500); font-size:9px; }
.agency-team-status { padding:6px 9px; border-radius:999px; font-size:9px; font-weight:750; }
.agency-team-status.status-active { background:var(--success-soft); color:var(--success); }
.agency-team-status.status-pending { background:var(--warning-soft); color:var(--warning); }
.agency-team-status.status-suspended { background:var(--danger-soft); color:var(--danger); }
.agency-team-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.owner-home .agency-remove-button { border-color:#efc4ca; color:var(--danger); }
.owner-home .business-item { position: relative; min-width: 0; padding: 20px; border-color: var(--line); border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.025); }
.owner-home .business-item:hover { border-color: #bccae0; box-shadow: 0 12px 32px rgba(15,23,42,.07); transform: translateY(-1px); }
.business-item-header { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; }
.business-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; background: var(--brand-soft); color: var(--brand); font-size: 12px; font-weight: 850; letter-spacing: .02em; }
.business-identity { min-width: 0; }
.owner-home .business-name { overflow: hidden; margin: 0 0 3px; color: var(--ink-950); font-size: 15px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.owner-home .business-id { overflow: hidden; margin: 0; color: var(--ink-500); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.owner-home .status { padding: 5px 8px; font-size: 9px; letter-spacing: .02em; text-transform: capitalize; }
.owner-home .status-active,
.owner-home .status-published { background: var(--success-soft); color: var(--success); }
.owner-home .status-onboarding,
.owner-home .status-draft { background: var(--warning-soft); color: var(--warning); }
.owner-home .version-label { color: var(--ink-600); font-size: 10px; }
.owner-home .business-actions { padding-top: 14px; border-top: 1px solid #edf1f6; }
.owner-home .setup-button,
.owner-home .preview-button,
.owner-home .versions-button { padding: 9px 11px; border-radius: 8px; font-size: 10px; }
.owner-home .setup-button { background: var(--ink-900); }
.owner-home .preview-button { background: var(--brand); }
.owner-home .versions-button { background: #fff; color: #5a3aa8; border: 1px solid #d9cef3; }
.owner-home .versions-button:hover { background: #f5f0ff; }
.owner-home .version-panel { background: var(--surface-soft); border-color: var(--line); }

/* Business setup */
.setup-page { min-height: 100vh; background: var(--canvas); }
.setup-page .top-nav {
    min-height: 82px;
    padding: 16px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11, 18, 32, .97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.setup-page .back-link {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #42516a;
    border-radius: 9px;
    background: #1c2940;
    color: #e6edf7;
    font-size: 12px;
    font-weight: 650;
}
.setup-page .back-link:hover { border-color: #657590; background: #263650; color: #fff; }
.setup-page .container { max-width: 1520px; margin: 0 auto; padding: 48px 16px 90px; }
.setup-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.setup-page .page-title { margin: 0; font-size: clamp(34px, 4vw, 48px); line-height: 1.08; letter-spacing: -.045em; }
.setup-heading .business-id { margin: 10px 0 0; color: var(--ink-500); font-size: 12px; }
.draft-context-pill { display: inline-flex; align-items: center; gap: 9px; flex: 0 0 auto; padding: 10px 13px; border: 1px solid #d7e1f4; border-radius: 999px; background: #f8faff; color: var(--ink-700); font-size: 11px; font-weight: 700; }
.draft-context-pill span { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 4px rgba(49,87,213,.1); }

.setup-page .workflow { grid-template-columns: 1fr 46px 1fr 46px 1fr; margin: 0 0 22px; }
.setup-page .workflow-step { min-height: 112px; display: grid; place-content: center; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow-sm); }
.setup-page .workflow-step.active { border-color: #e6c76e; background: linear-gradient(145deg, #fffdf5, #fff8df); box-shadow: 0 8px 26px rgba(154,91,7,.08); }
.setup-page .workflow-number { color: var(--ink-500); font-size: 10px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.setup-page .workflow-name { color: var(--ink-950); font-size: 16px; letter-spacing: -.02em; }
.setup-page .workflow-arrow { color: #9aa9be; font-size: 18px; }
.setup-page #workflow-test-access,
.setup-page #workflow-publish-access { margin-top: 8px; }
.setup-page #workflow-publish-access p { margin: 10px 0 6px !important; color: var(--ink-600); font-size: 10px; }

.setup-page .card { margin-bottom: 16px; padding: 26px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow-sm); }
.setup-page .card > h2,
.setup-page .card-collapse-toggle { color: var(--ink-950); letter-spacing: -.025em; }
.setup-page .card-collapse-header { min-height: 42px; gap: 18px; }
.setup-page .card-collapse-toggle { gap: 12px; font-size: 18px; font-weight: 760; }
.setup-page .card-collapse-arrow,
.setup-page .readiness-arrow { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--surface-soft); color: var(--brand); font-size: 11px; }
.setup-page .card-collapse-content { padding-top: 24px; margin-top: 18px; border-top: 1px solid #edf1f6; }
.setup-page .card-collapse-content[hidden] { display: none; }
.setup-page .client-access-button { min-width: 118px; min-height: 34px; padding: 7px 11px; border: 1px solid var(--line-strong); border-radius: 999px; background: #f8fafc; color: var(--ink-700); font-size: 10px; font-weight: 800; }
.setup-page .client-access-button[data-access-level="client_view"] { border-color: #cdd9f7; background: var(--brand-soft); color: var(--brand-strong); }
.setup-page .client-access-button[data-access-level="client_edit"] { border-color: #bde9da; background: var(--success-soft); color: var(--success); }
.setup-page .client-access-button:hover { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(15,23,42,.08); }

.setup-page .readiness-card { padding: 0; overflow: hidden; }
.setup-page .readiness-toggle { min-height: 82px; padding: 20px 26px; gap: 12px; color: var(--ink-950); font-size: 18px; font-weight: 760; }
.setup-page .readiness-body { padding: 0 26px 26px; border-top: 1px solid #edf1f6; }
.setup-page .readiness-summary { border: 1px solid transparent; border-radius: 11px; font-size: 12px; }
.setup-page .readiness-summary.ready { border-color: #c5eadf; background: var(--success-soft); color: var(--success); }
.setup-page .readiness-summary.not-ready { border-color: #f2dda4; background: var(--warning-soft); color: var(--warning); }
.setup-page .readiness-item { border-color: var(--line); border-radius: 12px; background: #fbfcfe; }

.setup-page .setup-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.setup-page .setup-item { min-width: 0; padding: 18px; border-color: var(--line); border-radius: 12px; background: var(--surface-soft); }
.setup-page .setup-item h3 { color: var(--ink-900); font-size: 13px; }
.setup-page .setup-item p { color: var(--ink-600); font-size: 11px; }
.setup-page .owner-only { margin-top: 12px; background: #f0ebff; color: #6742b6; font-size: 9px; letter-spacing: .03em; text-transform: uppercase; }

.setup-page .business-id { color: var(--ink-600); line-height: 1.6; }
.setup-page .form-grid { gap: 18px; }
.setup-page .form-field label { margin-bottom: 7px; color: var(--ink-800); font-size: 12px; font-weight: 750; }
.setup-page input[type="text"],
.setup-page input[type="email"],
.setup-page input[type="url"],
.setup-page input[type="search"],
.setup-page select,
.setup-page textarea { border: 1px solid var(--line-strong); border-radius: 10px; background: #fbfcfe; color: var(--ink-950); }
.setup-page input[type="text"]:focus,
.setup-page input[type="email"]:focus,
.setup-page input[type="url"]:focus,
.setup-page input[type="search"]:focus,
.setup-page select:focus,
.setup-page textarea:focus { outline: 0; border-color: var(--brand); background: #fff; box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.setup-page .field-help { color: var(--ink-500); font-size: 10px; line-height: 1.55; }
.emoji-picker { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.emoji-option { display: grid; width: 38px; height: 38px; padding: 0; place-items: center; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface-soft); color: var(--ink-950); font: 21px/1 sans-serif; box-shadow: none; cursor: pointer; }
.emoji-option:hover { border-color: var(--brand); background: var(--brand-soft); transform: translateY(-1px); }
.emoji-option[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); box-shadow: 0 0 0 3px rgba(49,87,213,.12); }
.setup-page .launcher-emoji-field { min-width: 0; padding-bottom: 6px; }
.setup-page .launcher-emoji-field .field-help { max-width: 680px; margin-top: 10px; }
.branding-editor .emoji-picker { margin: -4px 0 4px; }
.branding-editor .field-help { display: block; margin: -2px 0 8px; color: var(--ink-500); font-size: 11px; line-height: 1.5; }
.setup-page .color-input-row { min-height: 48px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.setup-page input[type="color"] { overflow: hidden; border: 0; border-radius: 8px; background: transparent; }
.setup-page .color-value { color: var(--ink-600); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; }
.setup-page .save-button,
.setup-page .process-button { min-height: 42px; padding: 10px 15px; border: 0; border-radius: 9px; background: var(--brand); color: #fff; font-size: 11px; font-weight: 750; box-shadow: 0 7px 18px rgba(49,87,213,.16); }
.setup-page .save-button:hover:not(:disabled),
.setup-page .process-button:hover:not(:disabled) { background: var(--brand-strong); transform: translateY(-1px); }
.setup-page .save-button:disabled,
.setup-page .process-button:disabled { box-shadow: none; opacity: .48; }
.setup-page .expand-editor-button { border: 1px solid #cdd9f7; border-radius: 8px; background: var(--brand-soft); color: var(--brand-strong); font-size: 10px; font-weight: 750; }
.setup-page .feature-options { gap: 12px; }
.setup-page .feature-option { padding: 17px; border-color: var(--line); border-radius: 12px; background: #fbfcfe; }
.setup-page .feature-option:hover { border-color: #b9c8de; background: #fff; }
.setup-page .feature-title { color: var(--ink-900); font-size: 12px; }
.setup-page .feature-description { color: var(--ink-600); font-size: 10px; line-height: 1.5; }
.setup-page .security-note { border: 1px solid #f0dca3; border-radius: 11px; background: var(--warning-soft); color: #744706; font-size: 11px; line-height: 1.6; }
.setup-page .integration-receiver-guide { margin: 14px 0; padding: 13px 15px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); color: var(--ink-700); font-size: 11px; line-height: 1.6; }
.setup-page .integration-receiver-guide summary { cursor: pointer; color: var(--ink-900); font-weight: 750; }
.setup-page .integration-receiver-guide p { margin: 10px 0 0; }
.setup-page .integration-receiver-guide code { padding: 2px 5px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--ink-900); font-size: 10px; }
.setup-page .appointment-status,
.setup-page .integration-status { border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); color: var(--ink-700); font-size: 11px; }
.setup-page .form-message { border-radius: 10px; font-size: 11px; }
.setup-page .knowledge-files { margin-top: 22px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.setup-page .knowledge-file-row { border-color: var(--line); background: #fff; }

.setup-page .client-access-dialog { width: min(92vw, 580px); padding: 0; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow-lg); }
.setup-page .client-access-dialog::backdrop { background: rgba(11,18,32,.62); backdrop-filter: blur(3px); }
.setup-page .client-access-dialog-content { padding: 26px; }
.setup-page .client-access-option { border-color: var(--line); border-radius: 11px; background: #fbfcfe; }
.setup-page .client-access-option:has(input:checked) { border-color: #9fb2ec; background: var(--brand-soft); box-shadow: 0 0 0 3px rgba(49,87,213,.08); }

/* Private test and published chatbot */
.test-page { min-height: 100vh; background: var(--page-background, var(--canvas)); }
.test-page .test-top-nav {
    min-height: 82px;
    padding: 16px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11,18,32,.97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.test-page.published-chat-mode .test-top-nav { background: var(--primary-color, #3157d5); }
.test-page .back-button {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #42516a;
    border-radius: 9px;
    background: #1c2940;
    color: #e6edf7;
    font-size: 12px;
    font-weight: 650;
}
.test-page .back-button:hover { border-color: #657590; background: #263650; color: #fff; }
.test-shell { width: min(100% - 40px, 1040px); margin: 0 auto; padding: 44px 0 80px; }
.test-page .test-warning { position: relative; margin: 0 0 18px; padding: 15px 18px 15px 48px; border: 1px solid #efd993; border-radius: 13px; background: rgba(255,248,221,.94); color: #7d4b05; box-shadow: var(--shadow-sm); font-size: 12px; line-height: 1.55; }
.test-page .test-warning::before { content: "i"; position: absolute; left: 17px; top: 50%; display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid currentColor; border-radius: 50%; font: 800 12px/1 Georgia, serif; transform: translateY(-50%); }
.test-page.published-chat-mode .test-warning { border-color: #cdd9f7; background: rgba(245,248,255,.95); color: var(--brand-strong); }
.test-page .card { padding: 28px; border: 1px solid rgba(203,214,227,.9); border-radius: 20px; background: rgba(255,255,255,.97); box-shadow: 0 20px 60px rgba(15,23,42,.11); }
.chat-business-header { display: flex; align-items: center; gap: 18px; min-height: 72px; }
.test-page .business-logo { flex: 0 0 auto; width: 64px; height: 64px; max-width: 64px; max-height: 64px; margin: 0; padding: 4px; border: 1px solid var(--line); border-radius: 16px; background: #fff; object-fit: contain; box-shadow: var(--shadow-sm); }
.test-page .chat-business-header h1 { margin: 0; color: var(--text-color, var(--ink-950)); font-size: clamp(26px, 3vw, 36px); line-height: 1.12; letter-spacing: -.04em; }
.test-page .chat-business-header .eyebrow { margin-bottom: 7px; color: var(--primary-color, var(--brand)); }
.test-page .business-id { margin: 8px 0 0; color: color-mix(in srgb, var(--text-color, #0f172a) 62%, transparent); font-size: 12px; }
.test-page .chat-messages { height: min(52vh, 510px); min-height: 390px; margin-top: 24px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb, var(--page-background, #f4f7fb) 65%, white); scrollbar-color: #aab6c7 transparent; scrollbar-width: thin; }
.test-page .message-row { margin-bottom: 14px; }
.test-page .message { max-width: min(76%, 680px); padding: 12px 15px; border-radius: 15px; font-size: 13px; line-height: 1.58; box-shadow: 0 2px 8px rgba(15,23,42,.045); }
.test-page .message-row.user .message { border-bottom-right-radius: 5px; box-shadow: 0 5px 15px color-mix(in srgb, var(--user-message-color, #2563eb) 20%, transparent); }
.test-page .message-row.assistant .message { border-color: color-mix(in srgb, var(--text-color, #0f172a) 14%, transparent); border-bottom-left-radius: 5px; }
.test-page .message a, .client-test-bubble a { color: inherit; font-weight: 700; text-decoration: underline; overflow-wrap: anywhere; }
.test-page .chat-form { align-items: center; gap: 10px; margin-top: 14px; padding: 6px; border: 1px solid var(--line-strong); border-radius: 13px; background: #fff; box-shadow: 0 4px 16px rgba(15,23,42,.045); }
.test-page .chat-form:focus-within { border-color: var(--primary-color, var(--brand)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary-color, #3157d5) 12%, transparent); }
.test-page .chat-form input { min-width: 0; padding: 10px 11px; border: 0; background: transparent; color: var(--text-color, var(--ink-950)); font-size: 14px; }
.test-page .chat-form input:focus { border: 0; box-shadow: none; }
.test-page .send-button { min-width: 92px; min-height: 42px; padding: 10px 18px; border-radius: 9px; background: var(--primary-color, var(--brand)); font-size: 12px; box-shadow: 0 7px 18px color-mix(in srgb, var(--primary-color, #3157d5) 20%, transparent); }
.test-page .send-button:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(.96); }
.test-page .chat-error { margin: 8px 4px 0; color: var(--danger); font-size: 11px; }
.test-page .typing-message { color: color-mix(in srgb, var(--text-color, #0f172a) 58%, transparent); }
.test-page .typing-message { display:inline-flex; min-width:52px; min-height:36px; align-items:center; justify-content:center; gap:5px; }
.test-page .typing-message .typing-dot { display:block; width:7px; height:7px; border-radius:50%; background:currentColor; animation:chatbotTyping 1.1s infinite ease-in-out; }
.test-page .typing-message .typing-dot:nth-child(2) { animation-delay:.14s; }
.test-page .typing-message .typing-dot:nth-child(3) { animation-delay:.28s; }
@keyframes chatbotTyping { 0%,60%,100%{transform:translateY(0);opacity:.38} 30%{transform:translateY(-4px);opacity:1} }
.test-page .booking-embed-card { border-color: var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); }
.test-page .booking-embed-header { border-color: var(--line); background: var(--surface-soft); color: var(--ink-800); font-size: 12px; }
.test-page .booking-embed-control { border-color: var(--line-strong); color: var(--ink-700); }
.test-page .publish-card { margin-top: 18px; border: 1px solid #bde5d6; background: linear-gradient(145deg, #fff, #f5fcf9); box-shadow: var(--shadow-sm); }
.test-page .publish-card h2 { margin: 0 0 8px; color: var(--ink-950); font-size: 20px; letter-spacing: -.025em; }
.test-page .publish-card .business-id { color: var(--ink-600); line-height: 1.55; }
.test-page .publish-confirmation { margin: 18px 0; padding: 14px; border: 1px solid #d7e8e2; border-radius: 11px; background: rgba(255,255,255,.75); color: var(--ink-700); font-size: 12px; }
.test-page .publish-confirmation input { accent-color: var(--success); }
.test-page .publish-button { min-height: 43px; padding: 10px 16px; border-radius: 9px; background: var(--success); font-size: 12px; box-shadow: 0 7px 18px rgba(8,116,93,.17); }
.test-page .publish-button:hover:not(:disabled) { transform: translateY(-1px); background: #065f4d; }
.test-page .publish-message { border-radius: 10px; font-size: 11px; }

@media (max-width: 680px) {
    .test-page .test-top-nav { align-items: flex-start; padding: 14px 16px; }
    .test-page .brand-lockup { width: 100%; }
    .test-shell { width: min(100% - 24px, 1040px); padding: 24px 0 50px; }
    .test-page .card { padding: 16px; border-radius: 16px; }
    .chat-business-header { align-items: flex-start; }
    .test-page .business-logo { width: 52px; height: 52px; max-width: 52px; max-height: 52px; border-radius: 13px; }
    .test-page .chat-business-header h1 { font-size: 25px; }
    .test-page .chat-messages { height: 54vh; min-height: 340px; padding: 14px; }
    .test-page .message { max-width: 88%; font-size: 12px; }
    .test-page .chat-form { flex-direction: row; }
    .test-page .send-button { width: auto; min-width: 76px; }
}

/* Client dashboard */
.client-dashboard-page { min-height: 100vh; background: var(--canvas); }
.client-dashboard-page .top-nav {
    min-height: 82px;
    height: auto;
    padding: 14px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11,18,32,.97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.client-nav-actions { min-width: 0; flex: 1 1 auto; }
.client-dashboard-page .nav-links { display: flex; align-items: center; gap: 5px; }
.client-dashboard-page .nav-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #aebbd0;
    font-size: 11px;
    font-weight: 650;
}
.client-dashboard-page .nav-links a:hover { border-color: #42516a; background: #1c2940; color: #fff; }
.client-dashboard-page .nav-links a.active { border-color: rgba(255,255,255,.14); background: #fff; color: var(--ink-950); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.client-dashboard-page .dashboard { max-width: 1240px; margin: 0 auto; padding: 48px 28px 90px; }
.client-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.client-dashboard-page .page-title { margin: 0; font-size: clamp(34px, 4vw, 48px); line-height: 1.08; letter-spacing: -.045em; }
.client-dashboard-page .page-subtitle { max-width: 620px; margin: 12px 0 0; color: var(--ink-600); font-size: 14px; line-height: 1.55; }
.client-dashboard-page .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.client-dashboard-page .stat-card { position: relative; overflow: hidden; min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.client-dashboard-page .stat-card::after { content: ""; position: absolute; top: 0; right: 0; width: 72px; height: 4px; border-radius: 0 0 0 6px; background: var(--stat-accent, var(--brand)); }
.client-dashboard-page .stat-conversations { --stat-accent: #3157d5; }
.client-dashboard-page .stat-leads { --stat-accent: #0c8a7b; }
.client-dashboard-page .stat-conversion { --stat-accent: #7957c7; }
.client-dashboard-page .stat-no-lead { --stat-accent: #718198; }
.client-dashboard-page .stat-title { margin-bottom: 12px; color: var(--ink-600); font-size: 11px; font-weight: 650; }
.client-dashboard-page .stat-number { color: var(--ink-950); font-size: 32px; line-height: 1; letter-spacing: -.04em; }
.client-dashboard-page .card { padding: 23px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.client-dashboard-page .top-interests-card { margin: 0 0 18px; }
.dashboard-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.client-dashboard-page .dashboard-card-heading h2 { margin: 0; color: var(--ink-950); font-size: 18px; letter-spacing: -.025em; }
.client-dashboard-page .section-kicker { margin-bottom: 7px; font-size: 9px; }
.client-dashboard-page .content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.client-dashboard-page .view-all { flex: 0 0 auto; margin: 0; padding: 7px 9px; border-radius: 8px; background: var(--brand-soft); color: var(--brand-strong); font-size: 10px; text-decoration: none; }
.client-dashboard-page .view-all:hover { background: #dfe7ff; text-decoration: none; }
.client-dashboard-page .recent-item { min-width: 0; padding: 14px 2px; border-color: #edf1f6; }
.client-dashboard-page .recent-item:hover { background: transparent; }
.client-dashboard-page .recent-item > div:first-child { min-width: 0; }
.client-dashboard-page .recent-detail { overflow: hidden; color: var(--ink-600); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.client-dashboard-page .recent-status { flex: 0 0 auto; padding: 5px 8px; background: var(--surface-soft); color: var(--ink-700); font-size: 9px; font-weight: 700; }
.client-dashboard-page .interest-row { padding: 12px 2px; border-color: #edf1f6; }
.client-dashboard-page .interest-name { color: var(--ink-700); font-size: 12px; }
.client-dashboard-page .interest-count { display: inline-grid; place-items: center; min-width: 29px; height: 25px; padding: 0 7px; border-radius: 999px; background: var(--brand-soft); color: var(--brand-strong); font-size: 10px; }
.client-dashboard-page .empty { padding: 28px 0; color: var(--ink-500); font-size: 12px; }

@media (max-width: 1060px) {
    .client-dashboard-page .top-nav { align-items: flex-start; }
    .client-dashboard-page .brand-lockup { width: 100%; }
    .client-nav-actions { width: 100%; align-items: flex-start; }
    .client-dashboard-page .nav-links { flex-wrap: wrap; }
    .client-dashboard-page .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
    .client-dashboard-page .top-nav { padding: 14px 16px; }
    .client-nav-actions { display: grid; justify-items: start; }
    .client-dashboard-page .nav-links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .client-dashboard-page .nav-links a { flex: 0 0 auto; }
    .client-dashboard-page .dashboard { padding: 34px 14px 60px; }
    .client-page-heading { align-items: flex-start; flex-direction: column; }
    .client-dashboard-page .stats,
    .client-dashboard-page .content-grid { grid-template-columns: 1fr; }
    .client-dashboard-page .card,
    .client-dashboard-page .stat-card { padding: 18px; }
    .dashboard-card-heading { align-items: flex-start; }
}

/* Conversation and lead workspaces */
.conversations-page,
.leads-page { min-height: 100vh; background: var(--canvas); }
.conversations-page .topbar,
.leads-page .top-nav {
    min-height: 82px;
    height: auto;
    padding: 14px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11,18,32,.97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.conversations-page .topbar h1 { margin: 0; color: #fff; font-size: 15px; line-height: 1.2; }
.conversations-page .nav-links,
.leads-page .nav-links { display: flex; align-items: center; gap: 5px; }
.conversations-page .nav-links a,
.leads-page .nav-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #aebbd0;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
}
.conversations-page .nav-links a:hover,
.leads-page .nav-links a:hover { border-color: #42516a; background: #1c2940; color: #fff; }
.conversations-page .nav-links a.active,
.leads-page .nav-links a.active { border-color: rgba(255,255,255,.14); background: #fff; color: var(--ink-950); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.conversations-page .dashboard,
.leads-page .dashboard { max-width: 1400px; margin: 0 auto; padding: 44px 28px 80px; }
.leads-page .dashboard { max-width: 1240px; }
.workspace-heading { margin-bottom: 24px; }
.workspace-heading h2 { margin: 0; color: var(--ink-950); font-size: clamp(30px, 3vw, 40px); line-height: 1.1; letter-spacing: -.04em; }
.workspace-heading p { margin: 10px 0 0; color: var(--ink-600); font-size: 13px; }
.conversations-page .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.conversations-page .provider-access-panel { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 9px 24px; margin-bottom: 18px; padding: 19px 21px; border: 1px solid #cdd9f7; border-radius: 15px; background: #f7f9ff; box-shadow: var(--shadow-sm); }
.conversations-page .provider-access-panel h3 { margin: 0; color: var(--ink-950); font-size: 16px; }
.conversations-page .provider-access-panel p { margin: 7px 0 0; color: var(--ink-600); font-size: 10px; line-height: 1.55; }
.conversations-page .provider-access-control { display: inline-flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 10px; background: #fff; color: var(--ink-800); font-size: 10px; font-weight: 700; cursor: pointer; }
.conversations-page .provider-access-control input { width: 17px; height: 17px; accent-color: var(--brand); }
.conversations-page .provider-access-status { grid-column: 1 / -1; }
.conversations-page .stat-card,
.leads-page .lead-stat-card { position: relative; overflow: hidden; min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.conversations-page .stat-card::after,
.leads-page .lead-stat-card::after { content: ""; position: absolute; top: 0; right: 0; width: 72px; height: 4px; border-radius: 0 0 0 6px; background: var(--stat-accent, var(--brand)); }
.conversations-page .stat-conversations,
.leads-page .stat-conversations { --stat-accent: #3157d5; }
.conversations-page .stat-leads,
.leads-page .stat-leads { --stat-accent: #0c8a7b; }
.conversations-page .stat-no-lead { --stat-accent: #718198; }
.leads-page .stat-conversion { --stat-accent: #7957c7; }
.conversations-page .stat-title,
.leads-page .lead-stat-title { margin-bottom: 11px; color: var(--ink-600); font-size: 11px; font-weight: 650; }
.conversations-page .stat-number,
.leads-page .lead-stat-number { color: var(--ink-950); font-size: 31px; line-height: 1; letter-spacing: -.04em; }

.conversations-page .conversation-layout { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); height: min(720px, calc(100vh - 300px)); min-height: 560px; border: 1px solid var(--line); border-radius: 17px; background: #fff; box-shadow: 0 18px 50px rgba(15,23,42,.09); }
.conversations-page .sidebar { border-color: var(--line); background: #fbfcfe; }
.conversations-page .sidebar-header { padding: 17px; border-color: var(--line); background: #fff; }
.conversations-page .search { min-height: 44px; padding: 11px 13px; border-color: var(--line-strong); border-radius: 10px; background: #fbfcfe; color: var(--ink-950); font-size: 12px; }
.conversations-page .search:focus { border-color: var(--brand); background: #fff; box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.conversations-page .filters { gap: 6px; margin-top: 11px; overflow-x: auto; padding-bottom: 2px; }
.conversations-page .filter-button { flex: 0 0 auto; min-height: 31px; padding: 6px 10px; border: 1px solid transparent; background: #f0f3f7; color: var(--ink-700); font-size: 10px; font-weight: 700; }
.conversations-page .filter-button:hover { border-color: var(--line-strong); background: #fff; }
.conversations-page .filter-button.active { background: var(--ink-900); color: #fff; }
.conversations-page .retention-settings { margin: 0; padding: 13px 17px; border-bottom: 1px solid var(--line); border-radius: 0; background: #fbfcfe; }
.conversations-page .retention-settings label { color: var(--ink-700); font-size: 10px; }
.conversations-page .retention-settings select { min-height: 34px; padding: 6px 9px; border-color: var(--line-strong); color: var(--ink-800); font-size: 10px; }
.conversations-page #conversation-list { scrollbar-color: #aab6c7 transparent; scrollbar-width: thin; }
.conversations-page .conversation-item { padding: 15px 17px; border-color: #e9eef5; }
.conversations-page .conversation-item:hover { background: #f4f7fb; }
.conversations-page .conversation-item.active { background: var(--brand-soft); box-shadow: inset 3px 0 0 var(--brand); }
.conversations-page .conversation-name { color: var(--ink-900); font-size: 12px; }
.conversations-page .conversation-time { color: var(--ink-500); font-size: 9px; }
.conversations-page .conversation-service,
.conversations-page .conversation-preview { color: var(--ink-600); font-size: 10px; }
.conversations-page .status { padding: 4px 7px; font-size: 8px; font-weight: 750; letter-spacing: .02em; }
.conversations-page .status-lead { background: var(--success-soft); color: var(--success); }
.conversations-page .status-no-lead { background: #edf1f6; color: var(--ink-700); }
.conversations-page .status-blocked { background: var(--danger-soft); color: var(--danger); }
.conversations-page .status-shared { background: var(--brand-soft); color: var(--brand-strong); }
.conversations-page .chat-panel { background: #fff; }
.conversations-page .chat-header { min-height: 91px; padding: 18px 22px; border-color: var(--line); background: #fff; }
.conversations-page .chat-header h2 { color: var(--ink-950); font-size: 16px; letter-spacing: -.02em; }
.conversations-page .chat-header p { color: var(--ink-600); font-size: 10px; }
.conversations-page .header-actions { gap: 7px; }
.conversations-page .block-button,
.conversations-page .delete-button,
.conversations-page .share-button { min-height: 35px; padding: 8px 11px; border-radius: 8px; font-size: 9px; }
.conversations-page .share-button { border: 1px solid #cdd9f7; background: var(--brand-soft); color: var(--brand-strong); }
.conversations-page .share-button:hover:not(:disabled) { background: #dfe7ff; }
.conversations-page .share-button:disabled { cursor: default; opacity: .8; }
.conversations-page #chat-messages { padding: 24px; background: #f7f9fc; scrollbar-color: #aab6c7 transparent; scrollbar-width: thin; }
.conversations-page .message-row { margin-bottom: 14px; }
.conversations-page .bubble { max-width: min(76%, 680px); padding: 11px 14px; border-radius: 14px; color: var(--ink-900); font-size: 12px; line-height: 1.55; box-shadow: 0 2px 8px rgba(15,23,42,.04); }
.conversations-page .assistant .bubble { border: 1px solid var(--line); background: #fff; border-bottom-left-radius: 5px; }
.conversations-page .customer .bubble { background: var(--brand); color: #fff; border-bottom-right-radius: 5px; }
.conversations-page .empty { color: var(--ink-500); font-size: 11px; }

.leads-page .client-page-heading { margin-bottom: 26px; }
.leads-page #dashboard-title { margin: 0; color: var(--ink-950); font-size: clamp(34px, 4vw, 48px); line-height: 1.08; letter-spacing: -.045em; }
.leads-page .page-subtitle { max-width: 650px; margin: 12px 0 0; color: var(--ink-600); font-size: 13px; line-height: 1.55; }
.leads-page .lead-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 0 18px; }
.leads-page .interest-summary-card,
.leads-page .card { margin-top: 0; margin-bottom: 18px; padding: 23px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.leads-page .dashboard-card-heading h2 { margin: 0; color: var(--ink-950); font-size: 18px; letter-spacing: -.025em; }
.leads-page .interest-summary-row { padding: 11px 2px; border-color: #edf1f6; }
.leads-page .interest-summary-name { color: var(--ink-700); font-size: 12px; }
.leads-page .interest-summary-count { display: inline-grid; place-items: center; min-width: 29px; height: 25px; padding: 0 7px; border-radius: 999px; background: var(--brand-soft); color: var(--brand-strong); font-size: 10px; }
.leads-page .lead-search,
.leads-page .lead-filter,
.leads-page .date-filter input { min-height: 43px; border-color: var(--line-strong); border-radius: 9px; background: #fbfcfe; color: var(--ink-900); font-size: 11px; }
.leads-page .lead-search { margin-bottom: 12px; }
.leads-page .lead-search:focus,
.leads-page .lead-filter:focus,
.leads-page .date-filter input:focus { outline: 0; border-color: var(--brand); background: #fff; box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.leads-page .lead-filter { width: min(100%, 260px); margin-bottom: 14px; }
.leads-page .date-filter { margin-bottom: 18px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); }
.leads-page .date-filter label { color: var(--ink-700); font-size: 10px; }
.leads-page #clear-dates { min-height: 41px; padding: 9px 13px; border-radius: 8px; background: var(--ink-900); font-size: 10px; font-weight: 700; }
.leads-page .table-scroll { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.leads-page table { min-width: 780px; }
.leads-page th,
.leads-page td { padding: 13px 14px; border-color: #edf1f6; font-size: 10px; }
.leads-page th { background: var(--ink-900); color: #e7edf7; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
.leads-page tbody tr:hover { background: #f8faff; }

@media (max-width: 900px) {
    .conversations-page .topbar,
    .leads-page .top-nav { align-items: flex-start; }
    .conversations-page .brand-lockup,
    .leads-page .brand-lockup { width: 100%; }
    .conversation-nav-actions,
    .leads-page .client-nav-actions { width: 100%; align-items: flex-start; }
    .conversations-page .nav-links,
    .leads-page .nav-links { flex-wrap: wrap; }
    .conversations-page .stats,
    .leads-page .lead-stats { grid-template-columns: 1fr; }
    .conversations-page .provider-access-panel { grid-template-columns: 1fr; }
    .conversations-page .provider-access-status { grid-column: auto; }
    .conversations-page .conversation-layout { height: auto; min-height: 0; }
    .conversations-page .sidebar { height: 430px; }
    .conversations-page .chat-panel { height: 620px; }
}

@media (max-width: 650px) {
    .conversations-page .topbar,
    .leads-page .top-nav { padding: 14px 16px; }
    .conversation-nav-actions,
    .leads-page .client-nav-actions { display: grid; justify-items: start; }
    .conversations-page .nav-links,
    .leads-page .nav-links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .conversations-page .nav-links a,
    .leads-page .nav-links a { flex: 0 0 auto; }
    .conversations-page .dashboard,
    .leads-page .dashboard { padding: 32px 12px 55px; }
    .conversations-page .conversation-layout { border-radius: 14px; }
    .conversations-page .chat-header { padding: 15px; }
    .conversations-page .chat-header-top { flex-direction: column; }
    .conversations-page #chat-messages { padding: 14px; }
    .conversations-page .bubble { max-width: 88%; font-size: 11px; }
    .leads-page .interest-summary-card,
    .leads-page .card,
    .leads-page .lead-stat-card { padding: 17px; }
    .leads-page .date-filter { align-items: stretch; flex-direction: column; }
    .leads-page .date-filter input,
    .leads-page #clear-dates { width: 100%; }
}

/* Client settings and blocked visitors */
.settings-page,
.blocked-page { min-height: 100vh; background: var(--canvas); }
.settings-page .top-nav,
.blocked-page .top-nav {
    min-height: 82px;
    height: auto;
    padding: 14px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11,18,32,.97);
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.settings-page .nav-links,
.blocked-page .nav-links { display: flex; align-items: center; gap: 5px; }
.settings-page .nav-links a,
.blocked-page .nav-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #aebbd0;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
}
.settings-page .nav-links a:hover,
.blocked-page .nav-links a:hover { border-color: #42516a; background: #1c2940; color: #fff; }
.settings-page .nav-links a.active,
.blocked-page .nav-links a.active { border-color: rgba(255,255,255,.14); background: #fff; color: var(--ink-950); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.settings-page .container,
.blocked-page .dashboard { max-width: 1120px; margin: 0 auto; padding: 46px 28px 90px; }
.settings-page .client-page-heading,
.blocked-page .client-page-heading { margin-bottom: 28px; }
.settings-page h1,
.blocked-page .page-title { margin: 0; color: var(--ink-950); font-size: clamp(34px, 4vw, 48px); line-height: 1.08; letter-spacing: -.045em; }
.settings-page .subtitle,
.blocked-page .page-subtitle { max-width: 680px; margin: 12px 0 0; color: var(--ink-600); font-size: 13px; line-height: 1.55; }
.settings-page .card,
.blocked-page .card { margin: 0 0 18px; padding: 24px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.settings-card-heading { margin-bottom: 20px; }
.settings-page .settings-card-heading h2,
.blocked-page .dashboard-card-heading h2 { margin: 0; color: var(--ink-950); font-size: 18px; letter-spacing: -.025em; }
.settings-page .field { margin-bottom: 18px; }
.settings-page label { margin-bottom: 7px; color: var(--ink-800); font-size: 11px; font-weight: 750; }
.settings-page input,
.settings-page select { min-height: 44px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: #fbfcfe; color: var(--ink-950); font-size: 12px; }
.settings-page input:focus,
.settings-page select:focus { outline: 0; border-color: var(--brand); background: #fff; box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.settings-page .readonly { border-style: dashed; background: #f2f5f9; color: var(--ink-600); }
.settings-page .help { color: var(--ink-500); font-size: 10px; line-height: 1.55; }
.settings-page .color-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.settings-page .color-grid .field { padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); }
.settings-page input[type="color"] { height: 46px; padding: 4px; border-radius: 9px; background: #fff; }
.settings-page .appearance-preview { margin-top: 20px; padding: 22px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.settings-page .preview-window { border: 1px solid rgba(203,214,227,.9); border-radius: 15px; box-shadow: 0 16px 38px rgba(15,23,42,.11); }
.settings-page .preview-header { padding: 14px 16px; font-size: 12px; }
.settings-page .preview-messages { min-height: 180px; padding: 18px; background: #fbfcfe; }
.settings-page .preview-message { padding: 10px 13px; border-radius: 12px; font-size: 11px; line-height: 1.5; }
.settings-page .settings-save-bar { position: sticky; bottom: 14px; z-index: 5; display: flex; align-items: center; gap: 14px; padding: 12px; border: 1px solid rgba(203,214,227,.9); border-radius: 13px; background: rgba(255,255,255,.92); box-shadow: 0 12px 32px rgba(15,23,42,.13); backdrop-filter: blur(10px); }
.settings-page .save-button { min-height: 43px; padding: 10px 17px; border-radius: 9px; background: var(--brand); font-size: 11px; box-shadow: 0 7px 18px rgba(49,87,213,.18); }
.settings-page .save-button:hover:not(:disabled) { background: var(--brand-strong); transform: translateY(-1px); opacity: 1; }
.settings-page #status { margin: 0; color: var(--success); font-size: 11px; }

.blocked-page .card { overflow: hidden; }
.blocked-page .dashboard-card-heading { margin-bottom: 16px; }
.blocked-page .table-scroll { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.blocked-page table { min-width: 700px; }
.blocked-page th,
.blocked-page td { padding: 13px 14px; border-color: #edf1f6; font-size: 10px; }
.blocked-page th { background: var(--ink-900); color: #e7edf7; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
.blocked-page tbody tr:hover { background: #f8faff; }
.blocked-page .empty { padding: 36px; color: var(--ink-500); font-size: 11px; }
.blocked-page .unblock-button { min-height: 35px; padding: 8px 11px; border: 1px solid #bde9da; border-radius: 8px; background: var(--success-soft); color: var(--success); font-size: 9px; }
.blocked-page .unblock-button:hover { background: #d6f4ea; transform: translateY(-1px); }

@media (max-width: 900px) {
    .settings-page .top-nav,
    .blocked-page .top-nav { align-items: flex-start; }
    .settings-page .brand-lockup,
    .blocked-page .brand-lockup { width: 100%; }
    .settings-page .client-nav-actions,
    .blocked-page .client-nav-actions { width: 100%; align-items: flex-start; }
    .settings-page .nav-links,
    .blocked-page .nav-links { flex-wrap: wrap; }
}

@media (max-width: 650px) {
    .settings-page .top-nav,
    .blocked-page .top-nav { padding: 14px 16px; }
    .settings-page .client-nav-actions,
    .blocked-page .client-nav-actions { display: grid; justify-items: start; }
    .settings-page .nav-links,
    .blocked-page .nav-links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .settings-page .nav-links a,
    .blocked-page .nav-links a { flex: 0 0 auto; }
    .settings-page .container,
    .blocked-page .dashboard { padding: 32px 12px 60px; }
    .settings-page .card,
    .blocked-page .card { padding: 17px; }
    .settings-page .color-grid { grid-template-columns: 1fr; }
    .settings-page .appearance-preview { padding: 12px; }
    .settings-page .settings-save-bar { bottom: 8px; }
}

/* Primary client portal (/client) */
.client-portal-page { min-height: 100vh; background: var(--canvas); }
.client-portal-page .top-nav {
    min-height: 82px;
    padding: 14px clamp(24px, 4vw, 64px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(11,18,32,.97);
    color: #fff;
    box-shadow: 0 8px 30px rgba(15,23,42,.1);
}
.client-portal-page .nav-links { display: flex; align-items: center; gap: 5px; }
.client-portal-page .nav-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #aebbd0;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
}
.client-portal-page .nav-links a:hover { border-color: #42516a; background: #1c2940; color: #fff; }
.client-portal-page .nav-links a.active { border-color: rgba(255,255,255,.14); background: #fff; color: var(--ink-950); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.client-portal-page .portal-main { max-width: 1520px; margin: 0 auto; padding: 48px 16px 90px; }
.client-portal-page .portal-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding: 0; margin: 0 0 26px; background: transparent; color: var(--ink-950); }
.client-portal-page .portal-heading h1 { margin: 0; color: var(--ink-950); font-size: clamp(34px,4vw,48px); line-height: 1.08; letter-spacing: -.045em; }
.client-portal-page .portal-heading p { max-width: 680px; margin: 12px 0 0; color: var(--ink-600); font-size: 13px; line-height: 1.55; }
.client-portal-page .portal-message:empty { display: none; }
.client-portal-page .portal-message { margin: 0 0 16px; padding: 12px 14px; border: 1px solid #c5eadf; border-radius: 10px; background: var(--success-soft); color: var(--success); font-size: 11px; }
.client-portal-page .provider-notice { position: relative; margin: 0 0 18px; padding: 16px 18px 16px 48px; border: 1px solid #cdd9f7; border-radius: 13px; background: #f5f8ff; color: var(--ink-700); font-size: 11px; line-height: 1.65; }
.client-portal-page .provider-notice::before { content: "i"; position: absolute; left: 17px; top: 18px; display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid var(--brand); border-radius: 50%; color: var(--brand); font: 800 12px/1 Georgia,serif; }
.client-portal-page .provider-notice strong { color: var(--brand-strong); }
.client-portal-page .portal-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.client-portal-page .card { margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); }
.client-portal-page .portal-stat { position: relative; overflow: hidden; }
.client-portal-page .portal-stat::after { content: ""; position: absolute; top: 0; right: 0; width: 82px; height: 4px; border-radius: 0 0 0 6px; background: var(--stat-accent,var(--brand)); }
.client-portal-page .stat-conversations { --stat-accent: #3157d5; }
.client-portal-page .stat-leads { --stat-accent: #0c8a7b; }
.client-portal-page .portal-stat > span { display: block; color: var(--ink-600); font-size: 11px; font-weight: 650; }
.client-portal-page .portal-stat > strong { display: block; margin: 10px 0 7px; color: var(--ink-950); font-size: 33px; line-height: 1; letter-spacing: -.04em; }
.client-portal-page .portal-stat > small { color: var(--ink-500); font-size: 9px; }
.client-portal-page .portal-recent-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-bottom: 30px; }
.client-portal-page .dashboard-card-heading { margin-bottom: 8px; }
.client-portal-page .dashboard-card-heading h2 { margin: 0; color: var(--ink-950); font-size: 17px; letter-spacing: -.025em; }
.client-portal-page .portal-link { flex: 0 0 auto; padding: 7px 9px; border-radius: 8px; background: var(--brand-soft); color: var(--brand-strong); font-size: 9px; font-weight: 700; text-decoration: none; }
.client-portal-page .portal-link:hover { background: #dfe7ff; }
.client-portal-page .record-list { color: var(--ink-500); font-size: 11px; }
.client-portal-page .record-list.empty { padding: 24px 2px 12px; color: var(--ink-500); }
.client-portal-page .record-list .row { padding: 13px 2px; border-color: #edf1f6; }
.client-portal-page .record-list dl { display: grid; grid-template-columns: 100px minmax(0,1fr); gap: 6px 12px; margin: 0; }
.client-portal-page .record-list dt { margin: 0; color: var(--ink-500); font-size: 9px; text-transform: capitalize; }
.client-portal-page .record-list dd { min-width: 0; margin: 0; overflow: hidden; color: var(--ink-800); font-size: 10px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.shared-workspace { margin-top: 6px; }
.shared-workspace-heading { margin-bottom: 16px; }
.shared-workspace-heading h2 { margin: 0; color: var(--ink-950); font-size: 25px; letter-spacing: -.035em; }
.shared-workspace-heading p { margin: 9px 0 0; color: var(--ink-600); font-size: 12px; }
.setup-sidebar-layout { display: grid; grid-template-columns: minmax(260px, 300px) minmax(0, 1fr); align-items: start; gap: 24px; margin: 18px 0; }
.setup-sidebar-nav { position: sticky; top: 18px; display: grid; gap: 7px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow-sm); }
.setup-page .setup-sidebar-nav { max-height: calc(100vh - 36px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.setup-sidebar-tab { width: 100%; min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 15px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--ink-700); font: inherit; text-align: left; box-shadow: none; cursor: pointer; }
.setup-sidebar-tab:hover { border-color: var(--line); background: var(--surface-soft); color: var(--ink-950); transform: none; }
.setup-sidebar-tab[aria-selected="true"] { border-color: #cdd9f7; background: var(--brand-soft); color: var(--brand-strong); box-shadow: inset 3px 0 0 var(--brand); }
.setup-sidebar-tab-label { min-width: 0; font-size: 13px; font-weight: 760; line-height: 1.4; }
.setup-sidebar-tab small { flex: 0 0 auto; color: var(--ink-500); font-size: 9px; font-weight: 700; }
.setup-sidebar-tab[aria-selected="true"] small { color: var(--brand-strong); }
.setup-sidebar-panels { min-width: 0; }
.setup-sidebar-panel[hidden] { display: none; }
.setup-sidebar-panel > .card { width: 100%; margin: 0; }
.setup-sidebar-card-title { margin: 0; color: var(--ink-950); font-size: 18px; letter-spacing: -.025em; }
.setup-sidebar-panel-card .card-collapse-toggle { cursor: default; }
.setup-sidebar-panel-card .card-collapse-arrow { display: none; }
.setup-sidebar-panel-card > summary { cursor: default; }
.setup-sidebar-panel-card > summary::before { display: none !important; }
.client-portal-page #shared-sections { display: grid; gap: 12px; }
.client-portal-page #shared-sections > .setup-sidebar-layout { margin-top: 0; }
.client-portal-page #shared-sections .setup-sidebar-panel > .card { overflow: hidden; padding: 0; }
.client-portal-page #shared-sections .setup-sidebar-panel > .card > summary { min-height: 66px; display: flex; align-items: center; padding: 18px 21px; border-bottom: 1px solid #edf1f6; color: var(--ink-950); font-size: 13px; font-weight: 750; list-style: none; }
.client-portal-page #shared-sections .setup-sidebar-panel > .card > summary::-webkit-details-marker { display: none; }
.client-portal-page #shared-sections .setup-sidebar-panel > .card > :not(summary) { margin-left: 21px; margin-right: 21px; }
.client-portal-page #shared-sections .setup-sidebar-panel > .card > :last-child { margin-bottom: 22px; }
.client-portal-page #shared-sections > .card { overflow: hidden; padding: 0; }
.client-portal-page #shared-sections > .card > summary { min-height: 66px; display: flex; align-items: center; padding: 18px 21px; color: var(--ink-950); font-size: 13px; font-weight: 750; list-style: none; }
.client-portal-page #shared-sections > .card > summary::-webkit-details-marker { display: none; }
.client-portal-page #shared-sections > .card > summary::before { content: "▶"; display: inline-grid; place-items: center; width: 27px; height: 27px; margin-right: 11px; border-radius: 8px; background: var(--surface-soft); color: var(--brand); font-size: 9px; transition: transform .18s ease; }
.client-portal-page #shared-sections > .card[open] > summary::before { transform: rotate(90deg); }
.client-portal-page #shared-sections > .card[open] > summary { border-bottom: 1px solid #edf1f6; }
.client-portal-page #shared-sections > .card > :not(summary) { margin-left: 21px; margin-right: 21px; }
.client-portal-page #shared-sections > .card > :last-child { margin-bottom: 22px; }
.client-portal-page #shared-sections dl { display: grid; grid-template-columns: minmax(150px,.4fr) minmax(0,1fr); gap: 8px 18px; }
.client-portal-page #shared-sections dt { margin: 0; color: var(--ink-500); font-size: 9px; text-transform: capitalize; }
.client-portal-page #shared-sections dd { margin: 0; color: var(--ink-800); font-size: 11px; }
.client-portal-page label { color: var(--ink-800); font-size: 11px; }
.client-portal-page input,
.client-portal-page select,
.client-portal-page textarea { border-color: var(--line-strong); border-radius: 9px; background: #fbfcfe; color: var(--ink-950); font-size: 11px; }
.client-portal-page input:focus,
.client-portal-page select:focus,
.client-portal-page textarea:focus { outline: 0; border-color: var(--brand); background: #fff; box-shadow: 0 0 0 4px rgba(49,87,213,.1); }
.client-portal-page button { min-height: 39px; padding: 9px 13px; border-radius: 8px; background: var(--brand); font-size: 10px; font-weight: 700; }
.client-portal-page .emoji-option { width: 38px; height: 38px; min-height: 38px; padding: 0; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface-soft); color: var(--ink-950); font: 21px/1 sans-serif; }
.client-portal-page .emoji-option:hover { border-color: var(--brand); background: var(--brand-soft); }
.client-portal-page .emoji-option[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); }
.client-portal-page button:hover:not(:disabled) { background: var(--brand-strong); transform: translateY(-1px); }
.client-portal-page button.secondary { border: 1px solid var(--line-strong); background: #fff; color: var(--ink-700); }
.client-portal-page button.secondary:hover:not(:disabled) { background: var(--surface-soft); }
.client-portal-page .setup-sidebar-tab { min-height: 58px; padding: 14px 15px; border: 1px solid transparent; background: transparent; color: var(--ink-700); font-size: inherit; }
.client-portal-page .setup-sidebar-tab:hover:not(:disabled) { border-color: var(--line); background: var(--surface-soft); color: var(--ink-950); transform: none; }
.client-portal-page .setup-sidebar-tab[aria-selected="true"] { border-color: #cdd9f7; background: var(--brand-soft); color: var(--brand-strong); }
.client-portal-page .branding-editor { max-width: 880px; padding-bottom: 4px; }
.client-portal-page .branding-editor p { color: var(--ink-600); font-size: 10px; }
.client-portal-page .knowledge-file-row { border-color: var(--line); }
.client-portal-page .knowledge-dialog { border-color: var(--line); border-radius: 17px; box-shadow: var(--shadow-lg); }
.client-portal-page .client-test-log { border: 1px solid var(--line); background: var(--surface-soft); }
.client-portal-page .client-test-bubble { border-color: var(--line); color: var(--ink-900); font-size: 11px; }

@media (max-width: 1000px) {
    .client-portal-page .top-nav { align-items: flex-start; }
    .client-portal-page .brand-lockup { width: 100%; }
    .client-portal-page .client-nav-actions { width: 100%; align-items: flex-start; }
    .client-portal-page .nav-links { flex-wrap: wrap; }
}

@media (max-width: 720px) {
    .client-portal-page .top-nav { padding: 14px 16px; }
    .client-portal-page .client-nav-actions { display: grid; justify-items: start; }
    .client-portal-page .nav-links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .client-portal-page .nav-links a { flex: 0 0 auto; }
    .client-portal-page .portal-main { padding: 34px 12px 60px; }
    .client-portal-page .portal-heading { align-items: flex-start; flex-direction: column; }
    .client-portal-page .portal-stats,
    .client-portal-page .portal-recent-grid { grid-template-columns: 1fr; }
    .client-portal-page .card { padding: 17px; }
    .client-portal-page #shared-sections > .card { padding: 0; }
    .client-portal-page #shared-sections > .card > summary { padding: 16px; }
    .client-portal-page #shared-sections > .card > :not(summary) { margin-left: 16px; margin-right: 16px; }
    .client-portal-page #shared-sections dl { grid-template-columns: 1fr; gap: 4px; }
    .client-portal-page #shared-sections dd { margin-bottom: 9px; }
}

@media (max-width: 800px) {
    .setup-sidebar-layout { grid-template-columns: 1fr; gap: 12px; }
    .setup-sidebar-nav { position: static; display: flex; overflow-x: auto; padding: 7px; scroll-snap-type: x proximity; }
    .setup-page .setup-sidebar-nav { max-height: none; overflow-y: hidden; scrollbar-gutter: auto; }
    .setup-sidebar-tab { flex: 0 0 min(210px, 72vw); scroll-snap-align: start; }
}

@media (max-width: 900px) {
    .setup-page .setup-list { grid-template-columns: 1fr 1fr; }
    .setup-heading { align-items: flex-start; flex-direction: column; }
    .setup-page .workflow { grid-template-columns: 1fr; gap: 8px; }
    .setup-page .workflow-step { min-height: 86px; }
    .setup-page .workflow-arrow { transform: rotate(90deg); }
}

@media (max-width: 880px) {
    .auth-shell { grid-template-columns: 1fr; width: min(100%, 540px); min-height: 0; }
    .auth-introduction { display: none; }
    .auth-page .login-card { padding: 48px; }
    .mobile-brand { display: block; margin-bottom: 42px; }
    .owner-home .business-list { grid-template-columns: 1fr; }
    .owner-home .top-nav { align-items: flex-start; }
    .nav-actions { flex-wrap: wrap; justify-content: flex-end; }
}

@media (max-width: 620px) {
    .auth-page { padding: 14px; }
    .auth-shell { border-radius: 22px; }
    .auth-page .login-card { padding: 36px 24px; }
    .login-card-header h1 { font-size: 31px; }
    .owner-home .container { padding: 36px 16px 60px; }
    .owner-home .top-nav { padding: 14px 16px; }
    .owner-home .brand-lockup { width: 100%; }
    .nav-actions { justify-content: flex-start; }
    .owner-home .owner-badge { display: none; }
    .page-heading { align-items: flex-start; flex-direction: column; }
    .owner-home .card { padding: 20px; }
    .agency-overview-card .section-heading,
    .agency-activity-item { align-items: flex-start; flex-direction: column; }
    .agency-health { align-self: flex-start; }
    .agency-activity-usage { flex: 0 0 auto; }
    .agency-client-row,
    .agency-client-identity { align-items: flex-start; flex-direction: column; }
    .agency-client-invite-form,
    .agency-invitation-link { grid-template-columns: 1fr; }
    .agency-client-invite-form .create-button,
    .agency-invitation-link .versions-button { width: 100%; }
    .agency-payment-status { align-self:flex-start; }
    .agency-funding-row { grid-template-columns:1fr; }
    .agency-credit-split { grid-template-columns:1fr; }
    .agency-team-row { grid-template-columns:1fr; align-items:flex-start; }
    .agency-team-status { justify-self:start; }
    .agency-team-actions { justify-content:flex-start; }
    .agency-client-operations-heading { align-items:flex-start; flex-direction:column; }
    .agency-client-operations-tools { grid-template-columns:1fr; }
    .agency-client-operation-row { grid-template-columns:1fr; align-items:flex-start; }
    .agency-client-operation-facts { width:100%; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .agency-client-operation-actions { width:100%; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .agency-pricing-plan,.agency-pricing-packages { grid-template-columns:1fr; }
    .setup-page .container { padding: 34px 14px 60px; }
    .setup-page .top-nav { align-items: flex-start; padding: 14px 16px; }
    .setup-page .brand-lockup { width: 100%; }
    .setup-page .card { padding: 18px; border-radius: 14px; }
    .setup-page .readiness-card { padding: 0; }
    .setup-page .readiness-toggle { padding: 18px; }
    .setup-page .readiness-body { padding: 0 18px 18px; }
    .setup-page .card-collapse-header { align-items: flex-start; }
    .setup-page .card-collapse-toggle { font-size: 15px; text-align: left; }
    .setup-page .client-access-button { min-width: 104px; }
    .setup-page .setup-list,
    .setup-page .form-grid { grid-template-columns: 1fr; }
    .setup-page .form-field.full { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .platform-ui *, .platform-ui *::before, .platform-ui *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Direct-customer plans and billing */
.billing-page { min-height:100vh; }
.billing-nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:15px max(24px,calc((100vw - 1320px)/2)); border-bottom:1px solid var(--line); background:var(--surface); }
.billing-nav .brand-lockup { color:var(--ink-950); text-decoration:none; }
.billing-nav .nav-actions { display:flex; align-items:center; gap:9px; }
.billing-nav-link { padding:9px 12px; border-radius:9px; color:var(--ink-700); font-size:13px; font-weight:750; text-decoration:none; }
.billing-nav-link:hover { background:var(--surface-soft); color:var(--brand); }
.billing-shell { width:min(100%,1320px); margin:0 auto; padding:48px 24px 70px; }
.billing-hero { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:38px; align-items:end; }
.billing-hero h1 { max-width:780px; margin:0; color:var(--ink-950); font-size:clamp(35px,4vw,56px); letter-spacing:-.045em; line-height:1.04; }
.billing-hero p { max-width:720px; margin:18px 0 0; color:var(--ink-600); font-size:17px; line-height:1.65; }
.billing-balance { padding:22px 24px; border:1px solid #29498f; border-radius:18px; background:linear-gradient(145deg,#132341,#1c3c78); color:#fff; box-shadow:0 14px 36px rgba(24,55,116,.18); }
.billing-balance span,.billing-balance small { display:block; color:#becdf0; font-size:12px; }
.billing-balance strong { display:block; margin:5px 0 3px; font-size:36px; line-height:1.1; }
.billing-launch-notice { display:flex; align-items:center; gap:13px; margin:34px 0 46px; padding:15px 18px; border:1px solid #d8c274; border-radius:14px; background:var(--warning-soft); color:var(--warning); }
.billing-launch-notice strong,.billing-launch-notice span { display:block; }
.billing-launch-notice strong { margin-bottom:2px; color:#6f4307; font-size:13px; }
.billing-launch-notice span { font-size:12px; line-height:1.45; }
.billing-launch-icon { display:grid !important; flex:0 0 30px; width:30px; height:30px; place-items:center; border-radius:9px; background:#fff2bd; }
.billing-section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:18px; }
.billing-section-heading .section-kicker { margin-bottom:7px; }
.billing-section-heading h2,.billing-rules h2,.billing-agency-message h2 { margin:0; color:var(--ink-950); font-size:25px; letter-spacing:-.025em; }
.billing-section-heading p { margin:8px 0 0; color:var(--ink-600); font-size:13px; }
.billing-section-note { padding:7px 11px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--ink-600); font-size:11px; font-weight:750; }
.billing-heading-spaced { margin-top:48px; }
.billing-plan-card { display:grid; grid-template-columns:minmax(220px,1.05fr) 180px minmax(300px,1.2fr) 210px; gap:28px; align-items:center; padding:28px; border:1px solid #b9c9f6; border-radius:22px; background:linear-gradient(135deg,#f8faff,#edf3ff); box-shadow:var(--shadow-sm); }
.billing-plan-label,.billing-service-tag { display:inline-flex; margin-bottom:9px; color:var(--brand); font-size:10px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.billing-plan-summary h3,.billing-service-card h3 { margin:0 0 9px; color:var(--ink-950); font-size:25px; }
.billing-plan-summary p,.billing-service-card > p { margin:0; color:var(--ink-600); font-size:13px; line-height:1.55; }
.billing-price strong { display:block; color:var(--ink-950); font-size:40px; letter-spacing:-.04em; }
.billing-price span { color:var(--ink-600); font-weight:700; }
.billing-price small { display:block; margin-top:5px; color:var(--ink-500); font-size:10px; }
.billing-feature-list { display:grid; gap:9px; margin:0; padding:0; list-style:none; color:var(--ink-700); font-size:12px; line-height:1.45; }
.billing-feature-list li { position:relative; padding-left:22px; }
.billing-feature-list li::before { content:"✓"; position:absolute; left:0; top:-1px; display:grid; width:16px; height:16px; place-items:center; border-radius:50%; background:#dce6ff; color:var(--brand); font-size:10px; font-weight:900; }
.billing-checkout-button,.billing-secondary-button,.billing-credit-card button { min-height:47px; padding:11px 15px; border:0; border-radius:10px; font-size:11px; font-weight:800; }
.billing-checkout-button { background:var(--brand); color:#fff; }
.billing-secondary-button,.billing-credit-card button { border:1px solid var(--line-strong); background:var(--surface); color:var(--ink-700); }
.billing-page button:disabled { cursor:not-allowed; opacity:.72; }
.billing-credit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.billing-credit-card { display:grid; grid-template-columns:1fr auto; gap:2px 14px; align-items:center; padding:21px; border:1px solid var(--line); border-radius:17px; background:var(--surface); box-shadow:var(--shadow-sm); }
.billing-credit-card > strong { color:var(--ink-950); font-size:22px; }
.billing-credit-card > span { color:var(--ink-500); font-size:11px; }
.billing-credit-card > b { grid-row:1/3; grid-column:2; color:var(--brand); font-size:25px; }
.billing-credit-card button { grid-column:1/-1; margin-top:15px; }
.billing-service-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.billing-service-card { display:flex; flex-direction:column; padding:27px; border:1px solid var(--line); border-radius:20px; background:var(--surface); box-shadow:var(--shadow-sm); }
.billing-service-highlight { border-color:#b9c9f6; box-shadow:0 14px 36px rgba(49,87,213,.1); }
.billing-service-price { display:flex; align-items:baseline; gap:9px; margin:14px 0; }
.billing-service-price strong { color:var(--ink-950); font-size:36px; letter-spacing:-.04em; }
.billing-service-price span { color:var(--ink-500); font-size:12px; font-weight:700; }
.billing-service-card .billing-feature-list { margin:22px 0; }
.billing-service-card button { width:100%; margin-top:auto; }
.billing-edit-notes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 24px; margin-top:20px; padding:22px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.billing-edit-notes p { margin:0; font-size:13px; line-height:1.6; color:var(--ink-600); }
.billing-edit-notes strong { color:var(--ink-900); }
@media(max-width:760px){.billing-edit-notes{grid-template-columns:1fr;padding:18px}}
.billing-feature-list.compact { min-height:105px; }
.billing-rules { display:grid; grid-template-columns:240px 1fr; gap:38px; margin-top:48px; padding:28px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }
.billing-rule-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px 30px; }
.billing-rule-grid p { margin:0; color:var(--ink-600); font-size:12px; line-height:1.55; }
.billing-rule-grid strong { color:var(--ink-900); }
.billing-agency-message { max-width:780px; margin:30px auto 0; padding:36px; border:1px solid var(--line); border-radius:22px; background:var(--surface); text-align:center; box-shadow:var(--shadow-sm); }
.billing-agency-message p { margin:14px auto 24px; color:var(--ink-600); line-height:1.6; }
.billing-primary-link { display:inline-flex; padding:12px 17px; border-radius:10px; background:var(--brand); color:#fff; font-size:13px; font-weight:800; text-decoration:none; }
.billing-footer { display:flex; justify-content:space-between; gap:20px; margin-top:30px; padding-top:22px; border-top:1px solid var(--line); color:var(--ink-500); font-size:11px; }
.billing-footer p { margin:0; }
.billing-footer a { color:var(--brand); font-weight:750; text-decoration:none; }
@media(max-width:1060px){.billing-plan-card{grid-template-columns:1fr 160px}.billing-feature-list{grid-column:1}.billing-plan-card>.billing-checkout-button{grid-column:2;grid-row:2}.billing-rules{grid-template-columns:1fr}.billing-hero{grid-template-columns:1fr 260px}}
@media(max-width:760px){.billing-nav{align-items:flex-start;padding:13px 16px}.billing-nav .nav-actions{justify-content:flex-end;flex-wrap:wrap}.billing-shell{padding:34px 14px 55px}.billing-hero,.billing-plan-card,.billing-service-grid,.billing-credit-grid,.billing-rule-grid{grid-template-columns:1fr}.billing-balance{width:100%}.billing-plan-card>.billing-checkout-button,.billing-feature-list{grid-column:auto;grid-row:auto}.billing-section-heading{align-items:flex-start;flex-direction:column}.billing-credit-card{grid-template-columns:1fr auto}.billing-rules{padding:22px}.billing-footer{flex-direction:column}}

/* Website installation */
.setup-link-button { display:inline-flex; align-items:center; text-decoration:none; }
.installation-page { min-height:100vh; }
.installation-nav { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:22px; padding:15px max(24px,calc((100vw - 1180px)/2)); border-bottom:1px solid var(--line); background:var(--surface); }
.installation-nav .brand-lockup { color:var(--ink-950); text-decoration:none; }
.installation-back { color:var(--ink-700); font-size:13px; font-weight:750; text-decoration:none; }
.installation-shell { width:min(100%,1180px); margin:0 auto; padding:46px 24px 70px; }
.installation-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:28px; }
.installation-heading h1 { margin:0; color:var(--ink-950); font-size:clamp(34px,4vw,50px); letter-spacing:-.045em; }
.installation-heading p { max-width:700px; margin:14px 0 0; color:var(--ink-600); line-height:1.6; }
.installation-state { padding:9px 13px; border:1px solid #d8c274; border-radius:999px; background:var(--warning-soft); color:var(--warning); font-size:11px; font-weight:800; white-space:nowrap; }
.installation-state.ready { border-color:#acd9ca; background:var(--success-soft); color:var(--success); }
.installation-status-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:20px; }
.installation-status-grid article { padding:18px; border:1px solid var(--line); border-radius:15px; background:var(--surface); }
.installation-status-grid span,.installation-status-grid strong,.installation-status-grid small { display:block; }
.installation-status-grid span { color:var(--ink-500); font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.06em; }
.installation-status-grid strong { margin:7px 0 4px; color:var(--ink-950); font-size:15px; }
.installation-status-grid small { color:var(--ink-500); font-size:10px; }
.installation-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr); gap:18px; margin-bottom:18px; }
.installation-card,.installation-preview-card { padding:27px; border:1px solid var(--line); border-radius:19px; background:var(--surface); box-shadow:var(--shadow-sm); }
.installation-card h2,.installation-preview-card h2 { margin:0 0 9px; color:var(--ink-950); font-size:22px; }
.installation-card>p,.installation-preview-card>p { color:var(--ink-600); font-size:12px; line-height:1.6; }
.installation-card code { font-family:"SFMono-Regular",Consolas,monospace; }
.installation-code { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:20px; padding:10px; border:1px solid var(--line-strong); border-radius:13px; background:#101a2b; }
.installation-code code { overflow:auto; padding:4px 7px; color:#dbe7ff; font-size:11px; white-space:nowrap; }
.installation-code button { min-height:42px; padding:10px 15px; border:0; border-radius:9px; background:var(--brand); color:#fff; font-size:11px; font-weight:800; }
.installation-code button:disabled { background:#536179; cursor:not-allowed; }
.installation-message { min-height:19px; margin-bottom:0 !important; color:var(--success) !important; font-weight:700; }
.installation-preview-card { display:flex; flex-direction:column; background:linear-gradient(145deg,#f8faff,#edf3ff); }
.installation-preview-link { display:flex; justify-content:center; margin-top:auto; padding:12px; border-radius:10px; background:var(--brand); color:#fff; font-size:12px; font-weight:800; text-decoration:none; }
.installation-preview-link[aria-disabled="true"] { pointer-events:none; opacity:.5; }
.installation-steps { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:20px; }
.installation-steps>div { display:flex; gap:12px; padding:15px; border:1px solid var(--line); border-radius:13px; background:var(--surface-soft); }
.installation-steps b { display:grid; flex:0 0 28px; width:28px; height:28px; place-items:center; border-radius:9px; background:var(--brand-soft); color:var(--brand); font-size:11px; }
.installation-steps p,.installation-steps strong,.installation-steps span { display:block; margin:0; }
.installation-steps strong { color:var(--ink-900); font-size:12px; }
.installation-steps span { margin-top:4px; color:var(--ink-500); font-size:10px; line-height:1.5; }
.installation-safety { display:flex; gap:18px; margin-top:18px; padding:18px 20px; border:1px solid #aed9ca; border-radius:14px; background:var(--success-soft); color:var(--success); }
.installation-safety strong { flex:0 0 auto; }
.installation-safety p { margin:0; font-size:11px; line-height:1.55; }

/* Published chatbot inside the customer website widget */
.test-page.embedded-chat-mode { min-height:100%; background:var(--surface); }
.embedded-chat-mode .test-top-nav,.embedded-chat-mode .test-warning,.embedded-chat-mode .theme-toggle { display:none !important; }
.embedded-chat-mode .test-shell { width:100%; height:100vh; margin:0; padding:0; }
.embedded-chat-mode .chat-workspace { display:flex; height:100%; flex-direction:column; padding:18px; border:0; border-radius:0; box-shadow:none; }
.embedded-chat-mode .chat-business-header { flex:0 0 auto; }
.embedded-chat-mode .chat-business-header h1 { font-size:21px; }
.embedded-chat-mode .chat-business-header .business-logo { width:46px; height:46px; }
.embedded-chat-mode .chat-messages { flex:1 1 auto; height:auto; min-height:0; margin-top:15px; padding:14px; }
.embedded-chat-mode .message { max-width:88%; padding:10px 12px; font-size:13px; }
.embedded-chat-mode .chat-form { flex:0 0 auto; gap:8px; }
.embedded-chat-mode .chat-form input { min-width:0; padding:11px; font-size:13px; }
.embedded-chat-mode .send-button { padding:10px 14px; font-size:12px; }
@media(max-width:720px){.installation-nav{align-items:flex-start;padding:13px 16px}.installation-shell{padding:34px 14px 55px}.installation-heading{align-items:flex-start;flex-direction:column}.installation-status-grid,.installation-layout,.installation-steps{grid-template-columns:1fr}.installation-code{grid-template-columns:1fr}.installation-code button{width:100%}.installation-safety{flex-direction:column;gap:5px}}
/* Shared Analytics and Conversations calendar filters. */
.platform-ui .reporting-date-filter { margin: 0 0 24px; padding: 20px; border: 1px solid #94a3b866; border-radius: 16px; }
.platform-ui .reporting-date-fields { display: flex; flex-wrap: wrap; align-items: end; gap: 14px; }
.platform-ui .reporting-date-fields label { display: grid; gap: 6px; font-weight: 600; }
.platform-ui .reporting-date-fields input { font: inherit; color: inherit; background: transparent; border: 1px solid #94a3b8; border-radius: 8px; padding: 10px; min-width: 160px; }
.platform-ui .reporting-date-fields button { font: inherit; padding: 11px 18px; border-radius: 8px; cursor: pointer; }
.platform-ui .reporting-date-status { margin: 12px 0 6px; }
.platform-ui .reporting-date-filter small { display: block; line-height: 1.5; }
html[data-theme="dark"] .reporting-date-fields input { color-scheme: dark; }
@media (max-width: 600px) { .platform-ui .reporting-date-fields > * { flex: 1 1 100%; } }

#management-navigation-error { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:14px 4vw; background:var(--surface-soft,#eef2ff); color:var(--ink-950,#14243f); border-bottom:1px solid var(--line,#cbd5e1); }
#management-navigation-error p { margin:0; font:inherit; }
#management-navigation-error button { cursor:pointer; padding:8px 12px; border:1px solid var(--line,#94a3b8); border-radius:8px; background:var(--surface,#fff); color:inherit; font:inherit; }