body.live-funnel-control-page .entry-title,
body.live-funnel-control-page .page-title,
body.live-funnel-control-page .post-title,
body.live-funnel-control-page .wp-block-post-title,
body.live-funnel-control-page .elementor-page-title,
body.live-funnel-control-page .page-header,
body.live-funnel-control-page .entry-header {
    display: none !important;
}

body.live-funnel-control-page .live-funnel-admin-message {
    display: none !important;
}

body.live-funnel-control-page .live-funnel-control-app .live-funnel-control-title,
body.live-funnel-control-page .live-funnel-control-app h1,
body.live-funnel-control-page .live-funnel-control-app h2,
body.live-funnel-control-page .live-funnel-control-app h3,
body.live-funnel-control-page .live-funnel-control-app h4 {
    display: block !important;
}

body.live-funnel-control-page {
    background: #f3f7fc;
    position: relative;
    overflow-x: clip;
}

html[data-lfc-control-standalone="true"],
html[data-lfc-control-standalone="true"] body.live-funnel-control-page {
    min-height: 100%;
    background: #f3f7fc;
}

body.live-funnel-control-page .wp-site-blocks,
body.live-funnel-control-page main,
body.live-funnel-control-page .entry-content,
body.live-funnel-control-page .wp-block-post-content,
body.live-funnel-control-page .is-layout-constrained {
    max-width: none !important;
}

body.live-funnel-control-page main,
body.live-funnel-control-page .entry-content,
body.live-funnel-control-page .wp-block-post-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body.live-funnel-control-page .wp-block-post-content > .wp-block-group,
body.live-funnel-control-page .wp-block-post-content > .lfc-control-page-host,
body.live-funnel-control-page .entry-content > .lfc-control-page-host,
body.live-funnel-control-page .lfc-control-page-host {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-top: 0 !important;
    padding: 0 12px !important;
    box-sizing: border-box;
}

body.live-funnel-control-page .lfc-control-page-host > .live-funnel-control-app {
    margin-top: 0;
    margin-bottom: 0;
}

html[data-live-funnel-control-theme="dark"] body.live-funnel-control-page {
    background: #07111f;
}

html[data-lfc-control-standalone="true"][data-live-funnel-control-theme="dark"],
html[data-lfc-control-standalone="true"][data-live-funnel-control-theme="dark"] body.live-funnel-control-page {
    background: #07111f;
}

html[data-lfc-control-standalone="true"] body.live-funnel-control-page::after {
    content: "";
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 0;
    height: calc(54px + env(safe-area-inset-top));
    background: #f3f7fc;
    pointer-events: none;
}

html[data-lfc-control-standalone="true"][data-live-funnel-control-theme="dark"] body.live-funnel-control-page::after {
    background: #07111f;
}

body.live-funnel-control-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 18%, rgba(37, 99, 235, 0.10) 0 1.2px, transparent 1.8px),
        radial-gradient(circle at 68% 34%, rgba(14, 165, 233, 0.08) 0 1px, transparent 1.7px),
        radial-gradient(circle at 30% 72%, rgba(37, 99, 235, 0.07) 0 1px, transparent 1.7px),
        radial-gradient(circle at 16% 20%, rgba(219, 234, 254, 0.74), rgba(219, 234, 254, 0) 32%),
        radial-gradient(circle at 82% 10%, rgba(191, 219, 254, 0.48), rgba(191, 219, 254, 0) 28%);
    background-size:
        24px 24px,
        30px 30px,
        38px 38px,
        100% 100%,
        100% 100%;
    background-position:
        0 0,
        12px 8px,
        6px 18px,
        0 0,
        0 0;
    opacity: 0.72;
}

html[data-live-funnel-control-theme="dark"] body.live-funnel-control-page::before {
    content: "";
    position: fixed;
    inset: -18vh -12vw;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 28% 20%, rgba(96, 165, 250, 0.20) 0, rgba(96, 165, 250, 0.09) 19%, rgba(96, 165, 250, 0) 40%),
        radial-gradient(circle at 76% 32%, rgba(37, 99, 235, 0.18) 0, rgba(37, 99, 235, 0.08) 18%, rgba(37, 99, 235, 0) 38%),
        radial-gradient(circle at 48% 78%, rgba(14, 165, 233, 0.14) 0, rgba(14, 165, 233, 0.06) 22%, rgba(14, 165, 233, 0) 44%),
        linear-gradient(135deg, rgba(7, 17, 31, 0), rgba(8, 22, 42, 0.36));
    filter: blur(22px);
    opacity: 0.9;
}

.live-funnel-control-app {
    --lfc-sidebar-width: 248px;
    --lfc-bg: #f6f9fd;
    --lfc-bg-deep: #eaf3ff;
    --lfc-surface: #ffffff;
    --lfc-surface-soft: #f8fbff;
    --lfc-surface-raised: #ffffff;
    --lfc-text: #102033;
    --lfc-muted: #64748b;
    --lfc-border: #dde7f5;
    --lfc-border-strong: #bed1ea;
    --lfc-accent-light: #eef6ff;
    --lfc-accent-light-2: #dbeeff;
    --lfc-accent: #2563eb;
    --lfc-accent-dark: #1d4ed8;
    --lfc-accent-dark-2: #172554;
    --lfc-hover: #f0f7ff;
    --lfc-active: #dbeafe;
    --lfc-focus: rgba(37, 99, 235, 0.20);
    --lfc-danger: #dc2626;
    --lfc-danger-soft: #fef2f2;
    --lfc-success: #16a34a;
    --lfc-success-dark: #166534;
    --lfc-success-soft: #f0fdf4;
    --lfc-warning: #b45309;
    --lfc-warning-dark: #92400e;
    --lfc-warning-soft: #fffbeb;
    --lfc-shadow: 0 24px 70px rgba(15, 33, 62, 0.12);
    --lfc-shadow-soft: 0 12px 30px rgba(15, 33, 62, 0.05);
    --lfc-radius: 16px;
    --lfc-radius-lg: 22px;
    width: min(1680px, calc(100vw - 24px));
    max-width: none;
    margin-left: calc(50% - min(840px, calc(50vw - 12px)));
    margin-right: auto;
    color: var(--lfc-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
}

.live-funnel-control-app[data-theme="dark"],
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app {
    --lfc-bg: #07111f;
    --lfc-bg-deep: #0b1628;
    --lfc-surface: #101c2d;
    --lfc-surface-soft: #13243a;
    --lfc-surface-raised: #17263b;
    --lfc-text: #eef6ff;
    --lfc-muted: #9fb1c7;
    --lfc-border: #22364f;
    --lfc-border-strong: #36506f;
    --lfc-accent-light: #0d2a4d;
    --lfc-accent-light-2: #123b70;
    --lfc-accent: #60a5fa;
    --lfc-accent-dark: #3b82f6;
    --lfc-accent-dark-2: #bfdbfe;
    --lfc-hover: #142841;
    --lfc-active: #173d70;
    --lfc-focus: rgba(96, 165, 250, 0.30);
    --lfc-danger: #f87171;
    --lfc-danger-soft: #331923;
    --lfc-success: #4ade80;
    --lfc-success-dark: #86efac;
    --lfc-success-soft: #10281a;
    --lfc-warning: #fbbf24;
    --lfc-warning-dark: #fde68a;
    --lfc-warning-soft: #302614;
    --lfc-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
    --lfc-shadow-soft: 0 14px 34px rgba(0, 0, 0, 0.16);
}

@media (prefers-color-scheme: dark) {
    html:not([data-live-funnel-control-theme="light"]) body.live-funnel-control-page {
        background: #07111f;
    }

    html:not([data-live-funnel-control-theme="light"]) body.live-funnel-control-page::before {
        content: "";
        position: fixed;
        inset: -18vh -12vw;
        z-index: 0;
        pointer-events: none;
        background:
            radial-gradient(circle at 28% 20%, rgba(96, 165, 250, 0.20) 0, rgba(96, 165, 250, 0.09) 19%, rgba(96, 165, 250, 0) 40%),
            radial-gradient(circle at 76% 32%, rgba(37, 99, 235, 0.18) 0, rgba(37, 99, 235, 0.08) 18%, rgba(37, 99, 235, 0) 38%),
            radial-gradient(circle at 48% 78%, rgba(14, 165, 233, 0.14) 0, rgba(14, 165, 233, 0.06) 22%, rgba(14, 165, 233, 0) 44%),
            linear-gradient(135deg, rgba(7, 17, 31, 0), rgba(8, 22, 42, 0.36));
        filter: blur(22px);
        opacity: 0.9;
    }

    html:not([data-live-funnel-control-theme="light"]) .live-funnel-control-app {
        --lfc-bg: #07111f;
        --lfc-bg-deep: #0b1628;
        --lfc-surface: #101c2d;
        --lfc-surface-soft: #13243a;
        --lfc-surface-raised: #17263b;
        --lfc-text: #eef6ff;
        --lfc-muted: #9fb1c7;
        --lfc-border: #22364f;
        --lfc-border-strong: #36506f;
        --lfc-accent-light: #0d2a4d;
        --lfc-accent-light-2: #123b70;
        --lfc-accent: #60a5fa;
        --lfc-accent-dark: #3b82f6;
        --lfc-accent-dark-2: #bfdbfe;
        --lfc-hover: #142841;
        --lfc-active: #173d70;
        --lfc-focus: rgba(96, 165, 250, 0.30);
        --lfc-danger: #f87171;
        --lfc-danger-soft: #331923;
        --lfc-warning: #fbbf24;
        --lfc-warning-soft: #302614;
        --lfc-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
    --lfc-shadow-soft: 0 14px 34px rgba(0, 0, 0, 0.16);
    }
}

.live-funnel-control-app * {
    box-sizing: border-box;
}

.live-funnel-control-app {
    position: relative;
    z-index: 1;
}

.live-funnel-control-app[data-lfc-standalone="true"] {
    min-height: 100dvh;
}

.live-funnel-control-app a {
    color: var(--lfc-accent-dark);
}

.live-funnel-control-app[data-theme="dark"] a,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app a {
    color: var(--lfc-accent);
}

.lfc-auth-screen {
    display: grid;
    min-height: min(760px, 82vh);
    place-items: center;
    padding: clamp(18px, 4vw, 44px);
    background: var(--lfc-bg);
    background: linear-gradient(135deg, var(--lfc-accent-light), var(--lfc-bg));
}

.lfc-auth-card {
    width: min(460px, 100%);
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: clamp(24px, 4vw, 34px);
    background: var(--lfc-surface);
    background: color-mix(in srgb, var(--lfc-surface) 96%, transparent);
    box-shadow: var(--lfc-shadow);
}

.lfc-auth-card .lfc-brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: var(--lfc-radius);
    background: var(--lfc-accent-dark);
    color: #fff;
    font-size: 14px;
    font-weight: 850;
    letter-spacing: 0;
    box-shadow: 0 12px 24px rgba(37, 99, 235, 0.24);
}

.lfc-auth-kicker,
.lfc-kicker {
    margin: 0 0 6px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
    letter-spacing: 0;
    text-transform: uppercase;
}

.lfc-auth-card h1,
.lfc-view-head h2 {
    margin: 0;
    color: var(--lfc-text);
    font-size: clamp(24px, 2vw, 31px);
    font-weight: 850;
    line-height: 1.12;
}

.lfc-auth-card p {
    color: var(--lfc-muted);
    line-height: 1.6;
}

.lfc-auth-hint {
    margin: 16px 0 0;
    font-size: 12px;
}

.lfc-choice-card-new {
    position: relative;
    border-color: color-mix(in srgb, var(--lfc-accent) 30%, var(--lfc-border));
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent-light) 38%, transparent), transparent 48%),
        color-mix(in srgb, var(--lfc-surface) 93%, transparent);
}

.lfc-choice-card-new > span:first-child {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, transparent);
    background: color-mix(in srgb, var(--lfc-accent) 14%, var(--lfc-surface));
    color: var(--lfc-accent-dark-2);
}

.lfc-fullpage-config-card,
.lfc-fullpage-sections-card,
.lfc-fullpage-social-card {
    border-color: color-mix(in srgb, var(--lfc-accent) 24%, var(--lfc-border));
}

.lfc-fullpage-simple-builder {
    background: linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent) 8%, var(--lfc-surface)), var(--lfc-surface));
}

.lfc-fullpage-create-v2 > .lfc-wizard-progress {
    max-width: 520px;
}

.lfc-fullpage-builder-v2 {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) minmax(260px, 0.42fr);
    gap: 14px;
    align-items: start;
}

.lfc-fullpage-builder-nav {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 6px;
}

.lfc-fullpage-builder-nav button {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 70%, transparent);
    border-radius: 14px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 70%, transparent);
    color: var(--lfc-muted);
    font: inherit;
    font-size: 13px;
    font-weight: 820;
    text-align: left;
    cursor: pointer;
}

.lfc-fullpage-builder-nav button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 28%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent-light) 46%, var(--lfc-surface));
    color: var(--lfc-accent-dark-2);
}

.lfc-fullpage-builder-main,
.lfc-fullpage-panel {
    min-width: 0;
}

.lfc-fullpage-panel {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 70%, transparent);
    border-radius: 22px;
    padding: 16px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-fullpage-template-grid,
.lfc-fullpage-modal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
    gap: 10px;
}

.lfc-fullpage-template-grid button,
.lfc-fullpage-modal-grid button {
    display: grid;
    gap: 9px;
    min-height: 88px;
    border: 1px solid var(--lfc-border);
    border-radius: 14px;
    padding: 12px;
    background: var(--lfc-surface-muted);
    color: var(--lfc-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.lfc-fullpage-template-grid button.is-active,
.lfc-fullpage-modal-grid button.is-active {
    border-color: var(--lfc-accent);
    background: color-mix(in srgb, var(--lfc-accent) 12%, var(--lfc-surface));
}

.lfc-fullpage-template-grid button span {
    width: 100%;
    height: 28px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--swatch-a), var(--swatch-b));
}

.lfc-fullpage-builder-preview {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 12px;
    min-height: 330px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 20%, var(--lfc-border));
    border-radius: 24px;
    padding: 20px;
    --lfc-fullpage-preview-main: var(--lfc-accent);
    --lfc-fullpage-preview-accent: #14b8a6;
    --lfc-fullpage-preview-bg-image: none;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--lfc-surface) 86%, transparent), color-mix(in srgb, var(--lfc-surface-muted) 82%, transparent)),
        radial-gradient(circle at 10% 0, color-mix(in srgb, var(--lfc-fullpage-preview-accent) 22%, transparent), transparent 38%),
        var(--lfc-fullpage-preview-bg-image),
        linear-gradient(145deg, color-mix(in srgb, var(--lfc-fullpage-preview-main) 8%, var(--lfc-surface)), var(--lfc-surface-muted));
    background-position: center;
    background-size: cover;
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-fullpage-builder-preview.is-dark-template {
    background:
        linear-gradient(145deg, color-mix(in srgb, #020617 28%, transparent), color-mix(in srgb, #020617 18%, transparent)),
        radial-gradient(circle at 10% 0, color-mix(in srgb, var(--lfc-fullpage-preview-accent) 24%, transparent), transparent 38%),
        var(--lfc-fullpage-preview-bg-image),
        linear-gradient(145deg, var(--lfc-fullpage-preview-main), #020617);
    background-position: center;
    background-size: cover;
}

.lfc-fullpage-builder-preview.is-dark-template > strong,
.lfc-fullpage-builder-preview.is-dark-template > p {
    color: #fff;
}

.lfc-fullpage-builder-preview.is-dark-template > span {
    border-color: rgba(255, 255, 255, 0.22);
    color: #fff;
}

.lfc-fullpage-builder-preview-icon {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--lfc-fullpage-preview-accent) 18%, var(--lfc-surface));
    color: var(--lfc-fullpage-preview-main);
    font-size: 26px;
    font-weight: 900;
}

.lfc-fullpage-builder-preview-icon[hidden] {
    display: none !important;
}

.lfc-fullpage-builder-preview-media {
    overflow: hidden;
    min-height: 138px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--lfc-fullpage-preview-main) 10%, var(--lfc-surface-muted));
}

.lfc-fullpage-builder-preview-media[hidden] {
    display: none !important;
}

.lfc-fullpage-builder-preview-media img {
    display: block;
    width: 100%;
    height: 170px;
    object-fit: cover;
}

.lfc-fullpage-builder-preview > span {
    width: max-content;
    max-width: 100%;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 6px 9px;
    color: var(--lfc-fullpage-preview-main);
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}

.lfc-fullpage-builder-preview > strong {
    color: var(--lfc-text);
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.02;
}

.lfc-fullpage-builder-preview > p {
    color: var(--lfc-muted);
    font-size: 15px;
    line-height: 1.55;
}

.lfc-fullpage-builder-preview > button {
    align-self: end;
    border: 0;
    border-radius: 14px;
    padding: 13px 16px;
    background: linear-gradient(135deg, var(--lfc-fullpage-preview-main), var(--lfc-fullpage-preview-accent));
    color: #fff;
    font-weight: 850;
}

.lfc-fullpage-builder-preview-social {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.lfc-fullpage-builder-preview-social span {
    max-width: 100%;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lfc-fullpage-preview-main) 20%, var(--lfc-border));
    border-radius: 999px;
    padding: 7px 10px;
    background: color-mix(in srgb, var(--lfc-fullpage-preview-main) 8%, var(--lfc-surface));
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-fullpage-icon-current {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 13px;
    background: var(--lfc-surface-muted);
    color: var(--lfc-text);
    font: inherit;
    cursor: pointer;
}

.lfc-fullpage-icon-current span,
.lfc-fullpage-modal-grid button span,
.lfc-fullpage-social-pill span {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--lfc-accent) 14%, var(--lfc-surface));
    color: var(--lfc-accent);
    font-weight: 900;
}

.lfc-fullpage-inline-icon {
    display: grid;
    gap: 8px;
}

.lfc-fullpage-icon-current img,
.lfc-fullpage-social-pill span img,
.lfc-fullpage-builder-preview-social b img,
[data-lfc-fullpage-preview-cta-icon] img {
    width: 22px;
    height: 22px;
    object-fit: cover;
    border-radius: 6px;
}

.lfc-fullpage-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.48);
}

.lfc-fullpage-modal[hidden] {
    display: none !important;
}

.lfc-fullpage-modal-panel {
    width: min(760px, 100%);
    max-height: min(760px, calc(100vh - 48px));
    overflow: auto;
    border: 1px solid var(--lfc-border);
    border-radius: 22px;
    padding: 18px;
    background: var(--lfc-surface);
    box-shadow: 0 28px 90px rgba(15, 23, 42, 0.28);
}

.lfc-fullpage-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.lfc-fullpage-icon-category {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.lfc-fullpage-icon-category > span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
}

.lfc-fullpage-social-list {
    display: grid;
    gap: 8px;
    margin-bottom: 12px;
}

.lfc-fullpage-social-pill {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 2px 10px;
    align-items: center;
    border: 1px solid var(--lfc-border);
    border-radius: 14px;
    padding: 10px;
    background: var(--lfc-surface-muted);
}

.lfc-fullpage-social-pill span {
    grid-row: span 2;
}

.lfc-fullpage-social-pill strong,
.lfc-fullpage-social-pill small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-fullpage-social-pill small {
    color: var(--lfc-muted);
}

.lfc-fullpage-social-pill button {
    grid-row: span 2;
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    background: var(--lfc-surface);
    color: var(--lfc-muted);
    cursor: pointer;
}

.lfc-fullpage-social-pill button:hover,
.lfc-fullpage-social-pill button:focus {
    border-color: color-mix(in srgb, #ef4444 40%, var(--lfc-border));
    color: #ef4444;
}

.lfc-fullpage-social-editor.is-modal-managed {
    display: none;
}

.lfc-fullpage-stage-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

.lfc-fullpage-stage-list span {
    display: grid;
    gap: 6px;
    min-height: 76px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-fullpage-stage-list strong {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-accent) 14%, var(--lfc-surface-muted));
    color: var(--lfc-accent);
    font-size: 12px;
}

.lfc-fullpage-advanced {
    padding: 0;
}

.lfc-fullpage-advanced > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 16px 18px;
    color: var(--lfc-text);
    font-weight: 850;
    list-style: none;
}

.lfc-fullpage-advanced > summary::-webkit-details-marker {
    display: none;
}

.lfc-fullpage-advanced > summary::after {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--lfc-surface-muted);
    color: var(--lfc-muted);
}

.lfc-fullpage-advanced[open] > summary::after {
    content: "−";
}

.lfc-fullpage-advanced > .lfc-form-head,
.lfc-fullpage-advanced > .lfc-form-grid,
.lfc-fullpage-advanced > .lfc-fullpage-social-editor,
.lfc-fullpage-advanced > .lfc-button {
    margin-right: 18px;
    margin-left: 18px;
}

.lfc-fullpage-advanced > .lfc-button {
    margin-bottom: 18px;
}

.lfc-fullpage-media-control {
    display: grid;
    gap: 10px;
}

.lfc-fullpage-media-preview {
    display: grid;
    place-items: center;
    min-height: 150px;
    border: 1px dashed var(--lfc-border);
    border-radius: var(--lfc-radius);
    background: var(--lfc-surface-muted);
    overflow: hidden;
}

.lfc-fullpage-media-preview img {
    width: 100%;
    height: 100%;
    max-height: 260px;
    object-fit: cover;
}

.lfc-fullpage-media-preview span {
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 720;
}

.lfc-fullpage-media-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-fullpage-icon-picker {
    display: grid;
    gap: 8px;
}

.lfc-fullpage-icon-picker > span {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 800;
}

.lfc-fullpage-icon-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-fullpage-icon-grid label {
    position: relative;
    display: inline-grid;
}

.lfc-fullpage-icon-grid input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.lfc-fullpage-icon-grid span {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--lfc-border);
    border-radius: 12px;
    background: var(--lfc-surface-muted);
    color: var(--lfc-text);
    font-size: 21px;
    font-weight: 850;
    cursor: pointer;
}

.lfc-fullpage-icon-grid input:checked + span {
    border-color: var(--lfc-accent);
    background: color-mix(in srgb, var(--lfc-accent) 14%, var(--lfc-surface));
    color: var(--lfc-accent);
}

.lfc-fullpage-social-editor {
    display: grid;
    gap: 12px;
}

.lfc-fullpage-social-row {
    display: grid;
    grid-template-columns: minmax(72px, 0.55fr) repeat(3, minmax(130px, 1fr));
    gap: 10px;
    align-items: end;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-muted);
}

.lfc-fullpage-story-preview {
    max-width: 100%;
    min-height: 560px;
}

.lfc-fullpage-story-preview .live-funnel-panel {
    min-height: 520px;
    background: radial-gradient(circle at 10% 0, color-mix(in srgb, var(--lf-primary) 18%, transparent), transparent 36%), var(--lf-panel-bg);
}

.lfc-fullpage-preview-hero {
    display: grid;
    gap: 8px;
    margin: -4px -4px 18px;
    border-radius: calc(var(--lf-container-radius) + 4px);
    padding: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--lf-primary) 14%, var(--lf-bg)), color-mix(in srgb, var(--lf-secondary) 60%, var(--lf-bg)));
}

.lfc-fullpage-preview-hero span {
    color: var(--lf-muted);
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}

.lfc-fullpage-preview-hero strong {
    color: var(--lf-text);
    font-size: 22px;
    line-height: 1.05;
}

@media (max-width: 900px) {
    .lfc-fullpage-builder-v2 {
        grid-template-columns: 1fr;
    }

    .lfc-fullpage-builder-nav,
    .lfc-fullpage-builder-preview {
        position: static;
    }

    .lfc-fullpage-builder-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lfc-fullpage-stage-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lfc-fullpage-social-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .lfc-fullpage-stage-list {
        grid-template-columns: 1fr;
    }
}

.lfc-login-form {
    display: grid;
    gap: 14px;
    margin-top: 22px;
}

.lfc-login-form label,
.lfc-filter label,
.lfc-inline-panel label,
.lfc-form-grid label {
    display: grid;
    gap: 6px;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 720;
}

.lfc-login-form input,
.lfc-filter input,
.lfc-filter select,
.lfc-inline-panel input,
.lfc-inline-panel select,
.lfc-inline-panel textarea,
.lfc-form-grid input,
.lfc-form-grid select,
.lfc-form-grid textarea,
.lfc-rule-condition input,
.lfc-rule-condition select {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 9px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font: inherit;
}

.lfc-login-form input:focus,
.lfc-filter input:focus,
.lfc-filter select:focus,
.lfc-inline-panel input:focus,
.lfc-inline-panel select:focus,
.lfc-inline-panel textarea:focus,
.lfc-form-grid input:focus,
.lfc-form-grid select:focus,
.lfc-form-grid textarea:focus,
.lfc-rule-condition input:focus,
.lfc-rule-condition select:focus {
    border-color: var(--lfc-accent);
    box-shadow: 0 0 0 3px var(--lfc-focus);
    outline: none;
}

.live-funnel-control-app .lfc-button,
.live-funnel-control-app .lfc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    border: 1px solid transparent;
    border-radius: var(--lfc-radius);
    padding: 9px 14px;
    background: var(--lfc-accent-dark);
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 760;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: 0 1px 1px rgba(15, 33, 62, 0.04);
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.live-funnel-control-app .lfc-btn__icon {
    display: inline-grid;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    place-items: center;
    color: currentColor;
}

.live-funnel-control-app .lfc-btn__icon svg {
    display: block;
    width: 16px;
    height: 16px;
}

.live-funnel-control-app .lfc-button:hover,
.live-funnel-control-app .lfc-button:focus-visible,
.live-funnel-control-app .lfc-btn:hover,
.live-funnel-control-app .lfc-btn:focus-visible {
    background: var(--lfc-accent-dark-2);
    color: #fff;
}

.live-funnel-control-app[data-theme="dark"] .lfc-button:hover,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-button:hover,
.live-funnel-control-app[data-theme="dark"] .lfc-button:focus-visible,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-button:focus-visible,
.live-funnel-control-app[data-theme="dark"] .lfc-btn:hover,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-btn:hover,
.live-funnel-control-app[data-theme="dark"] .lfc-btn:focus-visible,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-btn:focus-visible {
    background: var(--lfc-accent-dark);
}

.lfc-button:focus-visible,
.live-funnel-control-app button:focus-visible,
.lfc-side-nav a:focus-visible,
.lfc-mobile-menu a:focus-visible,
.lfc-bottom-nav a:focus-visible,
.lfc-quicklinks a:focus-visible {
    box-shadow: 0 0 0 3px var(--lfc-focus);
    outline: none;
}

.live-funnel-control-app .lfc-button-primary,
.live-funnel-control-app .lfc-btn-primary {
    border-color: transparent;
    background: var(--lfc-accent-dark);
    color: #fff;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--lfc-accent) 13%, transparent);
}

.live-funnel-control-app .lfc-button-secondary,
.live-funnel-control-app .lfc-btn-secondary {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 76%, transparent);
    background: color-mix(in srgb, var(--lfc-surface) 91%, var(--lfc-accent-light));
    color: var(--lfc-accent-dark-2);
}

.live-funnel-control-app .lfc-button-secondary:hover,
.live-funnel-control-app .lfc-button-secondary:focus-visible,
.live-funnel-control-app .lfc-btn-secondary:hover,
.live-funnel-control-app .lfc-btn-secondary:focus-visible,
.live-funnel-control-app .lfc-button-ghost:hover,
.live-funnel-control-app .lfc-button-ghost:focus-visible {
    border-color: var(--lfc-border-strong);
    background: var(--lfc-hover);
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button-ghost,
.live-funnel-control-app .lfc-btn-link {
    border: 1px solid transparent;
    background: transparent;
    color: var(--lfc-accent-dark);
}

.live-funnel-control-app .lfc-button-outline,
.live-funnel-control-app .lfc-btn-secondary-strong {
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 42%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-surface) 96%, var(--lfc-accent-light));
    color: var(--lfc-accent-dark-2);
}

.live-funnel-control-app .lfc-button-muted,
.live-funnel-control-app .lfc-btn-neutral {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 76%, transparent);
    background: color-mix(in srgb, var(--lfc-surface) 94%, transparent);
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button-outline:hover,
.live-funnel-control-app .lfc-button-outline:focus-visible,
.live-funnel-control-app .lfc-btn-secondary-strong:hover,
.live-funnel-control-app .lfc-btn-secondary-strong:focus-visible,
.live-funnel-control-app .lfc-button-muted:hover,
.live-funnel-control-app .lfc-button-muted:focus-visible,
.live-funnel-control-app .lfc-btn-neutral:hover,
.live-funnel-control-app .lfc-btn-neutral:focus-visible {
    border-color: var(--lfc-border-strong);
    background: var(--lfc-hover);
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button-danger,
.live-funnel-control-app .lfc-btn-danger {
    border: 1px solid transparent;
    background: var(--lfc-danger-soft);
    color: var(--lfc-danger);
}

.live-funnel-control-app .lfc-button-danger:hover,
.live-funnel-control-app .lfc-button-danger:focus-visible,
.live-funnel-control-app .lfc-btn-danger:hover,
.live-funnel-control-app .lfc-btn-danger:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-danger) 34%, transparent);
    background: var(--lfc-danger);
    color: #fff;
}

.live-funnel-control-app .lfc-button,
.live-funnel-control-app .lfc-button:visited,
.live-funnel-control-app .lfc-btn,
.live-funnel-control-app .lfc-btn:visited {
    color: #fff;
}

.live-funnel-control-app .lfc-button.lfc-button-secondary,
.live-funnel-control-app .lfc-button.lfc-button-secondary:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary:visited,
.live-funnel-control-app .lfc-button.lfc-button-ghost,
.live-funnel-control-app .lfc-button.lfc-button-ghost:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-link,
.live-funnel-control-app .lfc-btn.lfc-btn-link:visited,
.live-funnel-control-app .lfc-button.lfc-button-outline,
.live-funnel-control-app .lfc-button.lfc-button-outline:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary-strong,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary-strong:visited {
    color: var(--lfc-accent-dark-2);
}

.live-funnel-control-app .lfc-button.lfc-button-secondary:hover,
.live-funnel-control-app .lfc-button.lfc-button-secondary:focus-visible,
.live-funnel-control-app .lfc-button.lfc-button-ghost:hover,
.live-funnel-control-app .lfc-button.lfc-button-ghost:focus-visible,
.live-funnel-control-app .lfc-button.lfc-button-outline:hover,
.live-funnel-control-app .lfc-button.lfc-button-outline:focus-visible,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary:focus-visible,
.live-funnel-control-app .lfc-btn.lfc-btn-link:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-link:focus-visible,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary-strong:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-secondary-strong:focus-visible {
    background: var(--lfc-hover);
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button.lfc-button-muted,
.live-funnel-control-app .lfc-button.lfc-button-muted:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-neutral,
.live-funnel-control-app .lfc-btn.lfc-btn-neutral:visited {
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button.lfc-button-muted:hover,
.live-funnel-control-app .lfc-button.lfc-button-muted:focus-visible,
.live-funnel-control-app .lfc-btn.lfc-btn-neutral:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-neutral:focus-visible {
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-button.lfc-button-danger,
.live-funnel-control-app .lfc-button.lfc-button-danger:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-danger,
.live-funnel-control-app .lfc-btn.lfc-btn-danger:visited {
    border: 1px solid color-mix(in srgb, var(--lfc-danger) 32%, transparent);
    background: var(--lfc-danger-soft);
    color: var(--lfc-danger);
}

.live-funnel-control-app .lfc-button.lfc-button-danger:hover,
.live-funnel-control-app .lfc-button.lfc-button-danger:focus-visible,
.live-funnel-control-app .lfc-btn.lfc-btn-danger:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-danger:focus-visible {
    background: var(--lfc-danger);
    color: #fff;
}

.live-funnel-control-app .lfc-button.lfc-button-primary,
.live-funnel-control-app .lfc-button.lfc-button-primary:visited,
.live-funnel-control-app .lfc-button.lfc-btn-primary,
.live-funnel-control-app .lfc-button.lfc-btn-primary:visited,
.live-funnel-control-app .lfc-btn.lfc-btn-primary,
.live-funnel-control-app .lfc-btn.lfc-btn-primary:visited {
    color: #fff;
}

.live-funnel-control-app .lfc-btn.lfc-btn-logout,
.live-funnel-control-app .lfc-btn.lfc-btn-logout:visited,
.live-funnel-control-app .lfc-logout-button {
    border: 1px solid color-mix(in srgb, var(--lfc-danger) 24%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger-soft) 72%, var(--lfc-surface));
    color: var(--lfc-danger);
}

.live-funnel-control-app .lfc-btn.lfc-btn-logout:hover,
.live-funnel-control-app .lfc-btn.lfc-btn-logout:focus-visible,
.live-funnel-control-app .lfc-logout-button:hover,
.live-funnel-control-app .lfc-logout-button:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-danger) 38%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger-soft) 54%, var(--lfc-surface));
    color: var(--lfc-danger);
}

.live-funnel-control-app .lfc-button:disabled,
.live-funnel-control-app .lfc-btn:disabled,
.live-funnel-control-app .lfc-button[aria-disabled="true"] {
    opacity: 0.68;
    cursor: not-allowed;
}

.lfc-shell {
    display: grid;
    grid-template-columns: var(--lfc-sidebar-width) minmax(0, 1fr);
    min-height: 86vh;
    width: 100%;
    max-width: none;
    margin: 0 auto;
    padding: clamp(14px, 1.7vw, 26px);
    gap: clamp(14px, 1.5vw, 22px);
    background: var(--lfc-bg);
    background-image:
        radial-gradient(circle, rgba(37, 99, 235, 0.075) 0 1.05px, transparent 1.55px),
        radial-gradient(circle, rgba(14, 165, 233, 0.055) 0 1px, transparent 1.5px),
        radial-gradient(circle at 18% 16%, rgba(219, 234, 254, 0.72), rgba(219, 234, 254, 0) 30%),
        radial-gradient(circle at 88% 8%, rgba(191, 219, 254, 0.42), rgba(191, 219, 254, 0) 26%);
    background-size:
        26px 26px,
        34px 34px,
        100% 100%,
        100% 100%;
    background-position:
        0 0,
        13px 9px,
        0 0,
        0 0;
}

.live-funnel-control-app[data-theme="dark"] .lfc-shell,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-shell {
    background: transparent;
}

.lfc-sidebar {
    position: sticky;
    top: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    align-self: start;
    height: calc(100vh - 36px);
    overflow: visible;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 84%, transparent);
    border-radius: 26px;
    padding: 16px;
    background: var(--lfc-surface);
    background: color-mix(in srgb, var(--lfc-surface) 94%, transparent);
    box-shadow:
        0 18px 44px color-mix(in srgb, var(--lfc-text) 6%, transparent),
        inset 0 1px 0 color-mix(in srgb, #fff 38%, transparent);
}

.live-funnel-control-app[data-theme="dark"] .lfc-sidebar,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-sidebar {
    border-color: color-mix(in srgb, var(--lfc-border) 66%, transparent);
    box-shadow:
        0 18px 44px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.lfc-sidebar-main {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
}

.lfc-sidebar-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid color-mix(in srgb, var(--lfc-border) 74%, transparent);
    margin-bottom: 14px;
    padding: 5px 7px 16px;
}

.lfc-sidebar-brand-content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    gap: 11px;
}

.lfc-sidebar-brand-logo {
    display: block;
    flex: 0 0 auto;
    width: 50px;
    height: 50px;
    border: 0;
    border-radius: 0;
    object-fit: contain;
    box-shadow: none;
}

.lfc-sidebar-brand-text {
    min-width: 0;
}

.lfc-sidebar-brand strong,
.lfc-sidebar-brand-text span {
    display: block;
}

.lfc-sidebar-brand strong {
    color: var(--lfc-text);
    font-size: 17px;
    font-weight: 820;
    letter-spacing: 0;
    line-height: 1.15;
}

.lfc-sidebar-brand-text span {
    color: var(--lfc-muted);
    margin-top: 3px;
    font-size: 13px;
}

.lfc-side-nav {
    display: grid;
    align-content: start;
    gap: 5px;
    overflow: visible;
    margin: -2px;
    padding: 2px;
}

.lfc-side-nav a,
.lfc-mobile-menu a,
.lfc-bottom-nav a {
    color: var(--lfc-muted);
    text-decoration: none;
}

.lfc-side-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    border: 1px solid transparent;
    border-radius: 18px;
    padding: 7px 8px;
    font-size: 14px;
    font-weight: 700;
    transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.lfc-nav-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 14px;
    color: currentColor;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface-soft) 96%, #fff), color-mix(in srgb, var(--lfc-surface) 96%, transparent));
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--lfc-border) 48%, transparent),
        0 1px 1px color-mix(in srgb, var(--lfc-text) 2%, transparent);
    transition: background-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
}

.lfc-nav-icon svg {
    display: block;
    width: 20px;
    height: 20px;
    overflow: visible;
    shape-rendering: geometricPrecision;
}

.lfc-nav-icon svg * {
    vector-effect: non-scaling-stroke;
}

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

.lfc-nav-lock {
    margin-left: auto;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 999px;
    padding: 2px 7px;
    color: var(--lfc-muted);
    font-size: 10px;
    font-weight: 820;
    line-height: 1.4;
    background: color-mix(in srgb, var(--lfc-surface-soft) 82%, transparent);
}

.lfc-side-nav a:hover {
    background: color-mix(in srgb, var(--lfc-hover) 78%, transparent);
    color: var(--lfc-accent-dark);
}

.lfc-side-nav a.is-locked,
.lfc-mobile-menu a.is-locked,
.lfc-bottom-nav a.is-locked {
    cursor: not-allowed;
    opacity: 0.48;
    filter: grayscale(0.3);
    pointer-events: none;
}

.lfc-side-nav a.is-locked:hover,
.lfc-side-nav a.is-locked:hover .lfc-nav-icon {
    background: transparent;
    color: var(--lfc-muted);
    box-shadow: none;
}

.lfc-side-nav a:hover .lfc-nav-icon {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-accent-light) 36%, var(--lfc-surface)), color-mix(in srgb, var(--lfc-surface) 96%, transparent));
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 18%, transparent),
        0 6px 14px color-mix(in srgb, var(--lfc-accent) 7%, transparent);
}

.lfc-side-nav a[aria-current="page"] {
    border-color: color-mix(in srgb, var(--lfc-accent) 18%, transparent);
    background: color-mix(in srgb, var(--lfc-active) 72%, transparent);
    color: var(--lfc-accent-dark-2);
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 6%, transparent),
        0 8px 20px color-mix(in srgb, var(--lfc-accent) 7%, transparent);
}

.lfc-side-nav a[aria-current="page"] .lfc-nav-icon {
    background: transparent;
    box-shadow: none;
}

.lfc-side-nav a[aria-current="page"]:hover .lfc-nav-icon {
    background: transparent;
    box-shadow: none;
}

.lfc-locked-panel {
    display: grid;
    min-height: min(520px, 70vh);
    place-items: center;
}

.lfc-locked-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 18px;
    width: min(640px, 100%);
    border: 1px solid color-mix(in srgb, var(--lfc-border) 86%, transparent);
    border-radius: 28px;
    padding: clamp(22px, 3vw, 34px);
    background:
        radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--lfc-accent-light) 44%, transparent), transparent 30%),
        var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-locked-icon {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 18px;
    color: var(--lfc-accent-dark);
    background: color-mix(in srgb, var(--lfc-accent-light) 62%, var(--lfc-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 16%, transparent);
}

.lfc-locked-card h2 {
    margin: 2px 0 8px;
    color: var(--lfc-text);
}

.lfc-locked-card p:not(.lfc-eyebrow) {
    max-width: 48rem;
    margin: 0 0 18px;
    color: var(--lfc-muted);
}

.lfc-workspace {
    display: grid;
    align-content: start;
    gap: clamp(14px, 1.4vw, 20px);
    min-width: 0;
}

.lfc-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 72%, transparent);
    border-radius: 18px;
    padding: 7px 10px 7px 8px;
    background: color-mix(in srgb, var(--lfc-surface) 84%, transparent);
    color: var(--lfc-text);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    font-weight: 760;
    line-height: 1.2;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lfc-text) 5%, transparent);
    backdrop-filter: blur(16px);
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.lfc-theme-toggle:hover {
    border-color: var(--lfc-border-strong);
    background: var(--lfc-hover);
    color: var(--lfc-text);
}

.lfc-theme-toggle-icon,
.lfc-sidebar-action-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 13px;
    background: color-mix(in srgb, var(--lfc-accent-light) 76%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 14%, transparent);
}

.lfc-theme-toggle-icon svg,
.lfc-sidebar-action-icon svg {
    display: block;
    width: 17px;
    height: 17px;
}

.lfc-logout-icon {
    background: color-mix(in srgb, var(--lfc-danger-soft) 76%, var(--lfc-surface));
    color: var(--lfc-danger);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-danger) 18%, transparent);
}

.lfc-theme-toggle-moon {
    display: block;
}

.lfc-theme-toggle-sun {
    display: none !important;
}

.lfc-theme-toggle[aria-pressed="true"] .lfc-theme-toggle-icon {
    background: color-mix(in srgb, var(--lfc-accent-light-2) 78%, rgba(255, 255, 255, 0.10));
    color: #f8fbff;
    box-shadow:
        inset 0 0 0 1px rgba(191, 219, 254, 0.18),
        0 0 22px rgba(96, 165, 250, 0.20);
}

.lfc-theme-toggle[aria-pressed="true"] .lfc-theme-toggle-moon {
    display: none !important;
}

.lfc-theme-toggle[aria-pressed="true"] .lfc-theme-toggle-sun {
    display: block !important;
}

.lfc-sidebar-actions {
    display: grid;
    flex: 0 0 auto;
    gap: 9px;
    border-top: 1px solid color-mix(in srgb, var(--lfc-border) 74%, transparent);
    padding: 15px 2px 2px;
}

.lfc-sidebar-actions form {
    margin: 0;
}

.lfc-sidebar-actions .lfc-logout-button {
    width: 100%;
    justify-content: flex-start;
    min-height: 44px;
    border-radius: 18px;
    padding: 7px 10px 7px 8px;
    gap: 10px;
    font-size: 14px;
    font-weight: 760;
    line-height: 1.2;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lfc-text) 5%, transparent);
    backdrop-filter: blur(16px);
}

@media (min-width: 861px) {
    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-shell,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-shell {
        grid-template-columns: var(--lfc-sidebar-width) minmax(0, 1fr);
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar {
        gap: 12px;
        padding: 14px 9px;
        border-radius: 24px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-brand,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-brand {
        display: flex;
        justify-content: center;
        margin-bottom: 14px;
        padding: 6px 0 14px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-brand-content,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-brand-content {
        justify-content: center;
        width: 100%;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-brand-logo,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-brand-logo {
        width: 46px;
        height: 46px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-brand-text,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-brand-text,
	    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-nav-label,
	    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-nav-label,
	    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-nav-lock,
	    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-nav-lock,
	    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-action-label,
	    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-action-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-side-nav,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-side-nav {
        gap: 6px;
        overflow: visible;
        padding-right: 0;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-side-nav a,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-side-nav a {
        justify-content: center;
        min-height: 44px;
        border-radius: 18px;
        padding: 7px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-nav-icon,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-nav-icon {
        width: 40px;
        height: 40px;
        border-radius: 16px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-actions,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-actions {
        justify-items: center;
        gap: 9px;
        padding: 14px 0 2px;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-actions form,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-actions form {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-theme-toggle,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-theme-toggle,
    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app .lfc-sidebar-actions .lfc-logout-button,
    .live-funnel-control-app.lfc-sidebar-collapsed .lfc-sidebar-actions .lfc-logout-button {
        justify-content: center;
        width: 46px;
        min-width: 46px;
        padding: 8px;
        margin-inline: auto;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app [data-lfc-tooltip],
    .live-funnel-control-app.lfc-sidebar-collapsed [data-lfc-tooltip] {
        position: relative;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app [data-lfc-tooltip]::after,
    .live-funnel-control-app.lfc-sidebar-collapsed [data-lfc-tooltip]::after {
        content: none;
        display: none;
    }

    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app [data-lfc-tooltip]:hover::after,
    html[data-live-funnel-sidebar-collapsed="true"] .live-funnel-control-app [data-lfc-tooltip]:focus-visible::after,
    .live-funnel-control-app.lfc-sidebar-collapsed [data-lfc-tooltip]:hover::after,
    .live-funnel-control-app.lfc-sidebar-collapsed [data-lfc-tooltip]:focus-visible::after {
        content: none;
        display: none;
    }
}

.lfc-sidebar-resize-handle {
    position: absolute;
    top: 18px;
    right: -9px;
    width: 18px;
    height: calc(100% - 36px);
    cursor: col-resize;
    touch-action: none;
}

.lfc-sidebar-resize-handle::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4px;
    height: 44px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-border-strong) 74%, transparent);
    opacity: 0.45;
    transform: translate(-50%, -50%);
    transition: background-color 0.16s ease, opacity 0.16s ease, height 0.16s ease;
}

.lfc-sidebar-resize-handle:hover::before,
.lfc-sidebar-resize-handle:focus-visible::before,
.lfc-is-resizing-sidebar .lfc-sidebar-resize-handle::before {
    height: 64px;
    background: var(--lfc-accent);
    opacity: 0.95;
}

.lfc-is-resizing-sidebar,
.lfc-is-resizing-sidebar * {
    cursor: col-resize !important;
    user-select: none !important;
}

.lfc-mobile-menu,
.lfc-bottom-nav {
    display: none;
}

.lfc-notice {
    border-radius: var(--lfc-radius);
    margin: 0;
    padding: 12px 14px;
    font-weight: 720;
}

.lfc-notice-success {
    border: 1px solid var(--lfc-accent-light-2);
    background: var(--lfc-accent-light);
    color: var(--lfc-accent-dark-2);
}

.lfc-notice-error {
    border: 1px solid #fecaca;
    background: var(--lfc-danger-soft);
    color: var(--lfc-danger);
}

.lfc-view {
    position: relative;
    min-width: 0;
}

.lfc-view-skeleton {
    position: absolute;
    inset: 0;
    z-index: 20;
    border-radius: var(--lfc-radius);
    background: color-mix(in srgb, var(--lfc-bg) 78%, transparent);
    backdrop-filter: blur(8px);
}

.lfc-view.lfc-is-loading {
    min-height: 360px;
}

.lfc-view.lfc-is-loading > :not(.lfc-view-skeleton) {
    visibility: hidden;
}

.lfc-view-skeleton-inner {
    display: grid;
    gap: clamp(14px, 1.5vw, 20px);
}

.lfc-skeleton-head,
.lfc-skeleton-filter,
.lfc-skeleton-grid,
.lfc-skeleton-kpi-grid {
    display: grid;
    gap: 12px;
}

.lfc-skeleton-head {
    max-width: 620px;
}

.lfc-skeleton-filter {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: var(--lfc-radius);
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 88%, transparent);
}

.lfc-skeleton-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.lfc-skeleton-kpi-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.lfc-skeleton-card,
.lfc-skeleton-card-wide {
    display: grid;
    gap: 11px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: var(--lfc-radius);
    padding: clamp(15px, 1.4vw, 20px);
    background: color-mix(in srgb, var(--lfc-surface) 90%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-skeleton-table {
    display: grid;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: var(--lfc-radius);
    background: color-mix(in srgb, var(--lfc-surface) 90%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-skeleton-row {
    display: grid;
    grid-template-columns: 0.8fr 1.4fr 1fr 0.7fr;
    gap: 14px;
    border-bottom: 1px solid var(--lfc-border);
    padding: 14px;
}

.lfc-skeleton-row:last-child {
    border-bottom: 0;
}

.lfc-skeleton {
    position: relative;
    display: block;
    overflow: hidden;
    width: var(--lfc-skeleton-width, 100%);
    max-width: 100%;
    border-radius: 999px;
    background:
        linear-gradient(90deg, transparent, color-mix(in srgb, var(--lfc-accent-light-2) 62%, transparent), transparent),
        color-mix(in srgb, var(--lfc-border) 42%, var(--lfc-surface-soft));
    background-size: 220% 100%, 100% 100%;
    animation: lfc-skeleton-shimmer 1.45s ease-in-out infinite;
}

.lfc-skeleton-line {
    height: 13px;
}

.lfc-skeleton-card .lfc-skeleton-line:first-child,
.lfc-skeleton-head .lfc-skeleton-line:last-child {
    height: 24px;
}

.live-funnel-control-app[data-theme="dark"] .lfc-skeleton,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-skeleton {
    background:
        linear-gradient(90deg, transparent, rgba(96, 165, 250, 0.16), transparent),
        color-mix(in srgb, var(--lfc-surface-raised) 78%, var(--lfc-accent-light));
}

.lfc-button-loading {
    pointer-events: none;
    opacity: 0.76;
}

.lfc-is-submitting {
    cursor: wait;
}

@keyframes lfc-skeleton-shimmer {
    0% {
        background-position: 120% 0, 0 0;
    }

    100% {
        background-position: -120% 0, 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lfc-skeleton {
        animation: none;
        background-position: 0 0;
    }
}

.lfc-panel {
    display: grid;
    gap: clamp(16px, 1.5vw, 22px);
}

.lfc-view-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.lfc-funnel-title-editor {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: min(620px, 58vw);
}

.lfc-funnel-title-editor input {
    width: 100%;
    min-width: min(420px, 52vw);
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 5px 38px 5px 0;
    color: var(--lfc-text);
    background: transparent;
    box-shadow: none;
    font-size: clamp(25px, 3vw, 40px);
    font-weight: 840;
    line-height: 1.1;
}

.lfc-funnel-title-editor input:hover,
.lfc-funnel-title-editor input:focus {
    border-color: var(--lfc-border);
    padding-left: 10px;
    background: color-mix(in srgb, var(--lfc-surface) 86%, transparent);
    outline: none;
}

.lfc-funnel-title-editor svg {
    position: absolute;
    right: 10px;
    color: var(--lfc-muted);
    pointer-events: none;
}

@media (max-width: 980px) {
    .lfc-view-head {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-view-head .lfc-actions {
        justify-content: flex-start;
    }

    .lfc-funnel-title-editor,
    .lfc-funnel-title-editor input {
        min-width: 0;
        max-width: 100%;
    }
}

.lfc-wizard-head-actions {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface-soft);
}

.lfc-wizard-head-actions .lfc-inline-action-form {
    margin: 0;
}

.lfc-wizard-icon-action {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 0;
    color: var(--lfc-muted);
    background: transparent;
    font: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: color 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.lfc-wizard-icon-action:hover,
.lfc-wizard-icon-action:focus {
    color: var(--lfc-text);
    border-color: var(--lfc-border);
    background: var(--lfc-surface);
    outline: none;
    transform: translateY(-1px);
}

.lfc-wizard-icon-action-primary {
    color: #fff;
    background: var(--lfc-accent);
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.18);
}

.lfc-wizard-icon-action-primary:hover,
.lfc-wizard-icon-action-primary:focus {
    color: #fff;
    border-color: var(--lfc-accent-dark);
    background: var(--lfc-accent-dark);
}

.lfc-wizard-icon-action-danger {
    color: var(--lfc-danger);
}

.lfc-wizard-icon-action-danger:hover,
.lfc-wizard-icon-action-danger:focus {
    color: #fff;
    border-color: var(--lfc-danger);
    background: var(--lfc-danger);
}

.lfc-wizard-icon-action:disabled,
.lfc-wizard-icon-action[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.38;
    transform: none;
    box-shadow: none;
}

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

.lfc-stat-grid-primary {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.lfc-stat,
.lfc-card,
.lfc-row-card {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 58%, transparent);
    border-radius: var(--lfc-radius-lg);
    background: color-mix(in srgb, var(--lfc-surface) 91%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-stat {
    position: relative;
    overflow: hidden;
    padding: 17px;
}

.lfc-stat::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: var(--lfc-accent);
    content: "";
}

.lfc-stat strong {
    display: block;
    margin-bottom: 6px;
    color: var(--lfc-text);
    font-size: clamp(26px, 2.3vw, 34px);
    font-weight: 880;
    line-height: 1.05;
}

.lfc-stat span,
.lfc-muted,
.lfc-note span {
    color: var(--lfc-muted);
}

.lfc-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(300px, 1.15fr) repeat(2, minmax(260px, 1fr));
    gap: 14px;
}

.lfc-dashboard-grid .lfc-card:first-child {
    grid-row: span 2;
}

.lfc-smart-dashboard {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lfc-dashboard-topbar,
.lfc-dashboard-editbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.lfc-dashboard-topbar {
    align-items: flex-start;
    flex-wrap: wrap;
}

.lfc-dashboard-actions,
.lfc-dashboard-editbar {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.lfc-dashboard-actions {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 1 auto;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.lfc-dashboard-toolbar {
    gap: 9px;
}

.lfc-dashboard-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: min(100%, 280px);
    padding-top: 2px;
}

.lfc-dashboard-title .lfc-kicker {
    margin: 0;
    color: color-mix(in srgb, var(--lfc-accent) 64%, var(--lfc-muted));
    font-size: 11px;
    font-weight: 820;
    letter-spacing: 0.08em;
}

.lfc-dashboard-title h2 {
    margin: 0;
    color: var(--lfc-text);
    font-size: clamp(30px, 3vw, 42px);
    font-weight: 880;
    line-height: 1.02;
}

.lfc-dashboard-range-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin: 2px 0 0;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 62%, transparent);
    border-radius: 999px;
    padding: 6px 11px;
    background: color-mix(in srgb, var(--lfc-surface) 78%, transparent);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--lfc-text) 4%, transparent);
    font-size: 12px;
    font-weight: 720;
    line-height: 1.2;
}

.lfc-dashboard-icon,
.lfc-live-control [data-lfc-live-icon] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.lfc-dashboard-icon svg {
    display: block;
}

.lfc-dashboard-editbar {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 64%, transparent);
    border-radius: 24px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent) 8%, transparent), transparent 42%),
        color-mix(in srgb, var(--lfc-surface) 92%, transparent);
    box-shadow: var(--lfc-shadow-soft);
    padding: 11px;
    animation: lfc-dashboard-tools-in 0.2s ease both;
}

.lfc-dashboard-editbar[hidden],
.lfc-smart-dashboard:not(.lfc-dashboard-editing) .lfc-dashboard-editbar {
    display: none !important;
}

.lfc-dashboard-editbar-status,
.lfc-dashboard-editbar-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.lfc-dashboard-editbar-status {
    margin-right: auto;
    color: var(--lfc-text);
}

.lfc-dashboard-editbar-status strong,
.lfc-dashboard-editbar-status span {
    display: block;
}

.lfc-dashboard-editbar-status strong {
    font-size: 14px;
}

.lfc-dashboard-editbar-status span {
    margin-top: 2px;
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-dashboard-editbar-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
}

@keyframes lfc-dashboard-tools-in {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lfc-dashboard-range-popover {
    position: relative;
}

.lfc-dashboard-range-popover summary {
    list-style: none;
}

.lfc-dashboard-range-popover summary::-webkit-details-marker {
    display: none;
}

.lfc-dashboard-range-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 66%, transparent);
    border-radius: 18px;
    padding: 0 18px;
    color: var(--lfc-text);
    background: color-mix(in srgb, var(--lfc-surface) 88%, transparent);
    box-shadow: var(--lfc-shadow-soft);
    font-size: 13px;
    font-weight: 780;
    cursor: pointer;
}

.lfc-dashboard-subline {
    max-width: 420px;
    margin: -1px 0 0;
    font-size: 13px;
    line-height: 1.45;
}

.lfc-dashboard-control {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    min-height: 56px;
    gap: 10px;
    border-radius: 18px;
    padding: 0 18px;
    line-height: 1;
}

.lfc-dashboard-actions .lfc-dashboard-control {
    flex: 0 0 auto;
}

.lfc-dashboard-toolbar .lfc-dashboard-icon svg,
.lfc-dashboard-toolbar [data-lfc-live-icon] svg {
    width: 18px;
    height: 18px;
}

.lfc-dashboard-toolbar .lfc-dashboard-control--edit {
    height: 56px;
    min-height: 56px;
    min-width: 190px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 52%, transparent);
    border-radius: 18px;
    padding: 0 18px;
    gap: 11px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-accent) 92%, #ffffff), var(--lfc-accent-dark));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lfc-accent) 15%, transparent);
    color: #fff;
    font-weight: 820;
    line-height: 1;
}

.lfc-dashboard-toolbar .lfc-dashboard-control--edit .lfc-dashboard-icon svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
}

.lfc-dashboard-toolbar .lfc-dashboard-control--edit:hover,
.lfc-dashboard-toolbar .lfc-dashboard-control--edit:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 64%, transparent);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-accent) 96%, #ffffff), var(--lfc-accent-dark-2));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--lfc-accent) 18%, transparent);
    color: #fff;
    transform: translateY(-1px);
}

.lfc-dashboard-range-popover[open] .lfc-dashboard-range-trigger,
.lfc-dashboard-range-trigger:hover,
.lfc-dashboard-range-trigger:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 36%, var(--lfc-border));
    color: var(--lfc-accent-dark);
    background: color-mix(in srgb, var(--lfc-accent) 8%, var(--lfc-surface));
}

.lfc-dashboard-range-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 50;
    display: grid;
    min-width: 218px;
    gap: 5px;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    padding: 8px;
    background: color-mix(in srgb, var(--lfc-surface) 96%, transparent);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.16);
    backdrop-filter: blur(18px);
}

.lfc-dashboard-range-option {
    display: flex;
    align-items: center;
    min-height: 38px;
    border: 0;
    border-radius: 12px;
    padding: 9px 11px;
    color: var(--lfc-text);
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 760;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.lfc-dashboard-range-option:hover,
.lfc-dashboard-range-option:focus-visible,
.lfc-dashboard-range-option.is-active {
    color: var(--lfc-accent-dark);
    background: color-mix(in srgb, var(--lfc-accent) 11%, var(--lfc-surface));
}

.lfc-live-control {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid var(--lfc-border);
    color: var(--lfc-text);
    background: color-mix(in srgb, var(--lfc-surface) 92%, transparent);
    box-shadow: var(--lfc-shadow-soft);
    font: inherit;
    font-weight: 820;
    cursor: pointer;
}

.lfc-live-control:hover,
.lfc-live-control:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 32%, var(--lfc-border));
    transform: translateY(-1px);
}

.lfc-live-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #ef4444;
    box-shadow: 0 0 0 5px rgba(239, 68, 68, 0.13), 0 0 18px rgba(239, 68, 68, 0.42);
}

.lfc-live-control.is-paused .lfc-live-dot {
    background: var(--lfc-muted);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--lfc-muted) 12%, transparent);
}

.lfc-live-label {
    line-height: 1;
}

.lfc-live-meta {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.lfc-live-control:hover .lfc-live-meta,
.lfc-live-control:focus-visible .lfc-live-meta {
    transform: none;
}

.lfc-live-control [data-lfc-live-icon] {
    color: var(--lfc-muted);
}

.lfc-smart-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-flow: row dense;
    grid-auto-rows: minmax(108px, auto);
    gap: 14px;
    align-items: stretch;
}

.lfc-dashboard-widget {
    position: relative;
    display: flex;
    grid-column: span var(--lfc-widget-w, 3);
    grid-row: span var(--lfc-widget-h, 1);
    min-width: 0;
    min-height: 108px;
    flex-direction: column;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 64%, transparent);
    border-radius: 24px;
    background: color-mix(in srgb, var(--lfc-surface) 91%, transparent);
    box-shadow: var(--lfc-shadow-soft);
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.lfc-dashboard-widget.is-dragging,
.lfc-dashboard-widget.is-resizing,
.lfc-dashboard-editing .lfc-dashboard-widget:hover {
    border-color: color-mix(in srgb, var(--lfc-accent) 48%, var(--lfc-border));
    box-shadow: 0 18px 42px rgba(37, 99, 235, 0.13);
}

.lfc-dashboard-widget-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid color-mix(in srgb, var(--lfc-border) 58%, transparent);
    padding: 15px 16px 12px;
}

.lfc-dashboard-widget-head h3 {
    margin: 3px 0 0;
    color: var(--lfc-text);
    font-size: 15px;
    line-height: 1.2;
}

.lfc-dashboard-widget-head span {
    display: inline-flex;
    width: fit-content;
    border-radius: 999px;
    padding: 3px 8px;
    color: color-mix(in srgb, var(--lfc-muted) 88%, var(--lfc-text));
    background: color-mix(in srgb, var(--lfc-muted) 6%, transparent);
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0;
    text-transform: none;
}

.lfc-dashboard-editing .lfc-dashboard-widget-head {
    cursor: grab;
}

.lfc-dashboard-widget-actions {
    display: none;
    flex-shrink: 0;
    gap: 6px;
}

.lfc-dashboard-editing .lfc-dashboard-widget-actions {
    display: flex;
}

.lfc-dashboard-widget-body {
    flex: 1;
    padding: 15px;
}

.lfc-dashboard-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--lfc-border);
    border-radius: 12px;
    padding: 0;
    color: var(--lfc-text);
    background: color-mix(in srgb, var(--lfc-surface) 90%, transparent);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.lfc-dashboard-icon-button:hover,
.lfc-dashboard-icon-button:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 38%, var(--lfc-border));
    color: var(--lfc-accent-dark);
    background: color-mix(in srgb, var(--lfc-accent) 9%, var(--lfc-surface));
    transform: translateY(-1px);
}

.lfc-dashboard-icon-button-danger {
    color: #dc2626;
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(220, 38, 38, 0.38);
}

.lfc-dashboard-icon-button-danger .lfc-dashboard-icon,
.lfc-dashboard-icon-button-danger svg {
    color: #dc2626;
    stroke: currentColor;
}

.lfc-dashboard-icon-button-danger:hover,
.lfc-dashboard-icon-button-danger:focus-visible {
    color: #b91c1c;
    background: rgba(239, 68, 68, 0.16);
    border-color: rgba(220, 38, 38, 0.58);
}

.lfc-dashboard-icon-button-danger:hover .lfc-dashboard-icon,
.lfc-dashboard-icon-button-danger:focus-visible .lfc-dashboard-icon,
.lfc-dashboard-icon-button-danger:hover svg,
.lfc-dashboard-icon-button-danger:focus-visible svg {
    color: #b91c1c;
    stroke: currentColor;
}

.lfc-dashboard-widget-body.lfc-is-loading {
    opacity: 0.62;
    pointer-events: none;
}

.lfc-dashboard-resize-handle {
    position: absolute;
    right: 8px;
    bottom: 8px;
    display: none;
    width: 18px;
    height: 18px;
    border-right: 2px solid color-mix(in srgb, var(--lfc-accent) 55%, transparent);
    border-bottom: 2px solid color-mix(in srgb, var(--lfc-accent) 55%, transparent);
    border-radius: 0 0 7px 0;
    cursor: nwse-resize;
}

.lfc-dashboard-editing .lfc-dashboard-resize-handle {
    display: block;
}

.lfc-dashboard-kpi strong {
    display: block;
    color: var(--lfc-text);
    font-size: clamp(30px, 3vw, 44px);
    font-weight: 880;
    line-height: 1;
}

.lfc-dashboard-kpi span {
    display: block;
    margin-top: 8px;
    color: var(--lfc-muted);
    font-weight: 720;
}

.lfc-dashboard-list-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--lfc-border);
    padding: 10px 0;
}

.lfc-dashboard-list-row:last-child {
    border-bottom: 0;
}

.lfc-dashboard-list-row > div:first-child {
    min-width: 0;
}

.lfc-dashboard-list-row strong {
    display: block;
    overflow: hidden;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 820;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-dashboard-list-row span:not(.lfc-badge) {
    display: block;
    overflow: hidden;
    margin-top: 3px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-dashboard-list-meta {
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}

.lfc-dashboard-list-meta em {
    color: var(--lfc-muted);
    font-size: 11px;
    font-style: normal;
    font-weight: 780;
}

.lfc-dashboard-bar {
    display: grid;
    gap: 7px;
    padding: 9px 0;
}

.lfc-dashboard-bar > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-dashboard-bar > i {
    display: block;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--lfc-accent), color-mix(in srgb, var(--lfc-accent) 52%, #8ec5ff));
}

.lfc-smart-state {
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 14px;
    background: var(--lfc-surface-soft);
}

.lfc-smart-state strong,
.lfc-smart-state span {
    display: block;
}

.lfc-smart-state strong {
    color: var(--lfc-text);
    line-height: 1.35;
}

.lfc-smart-state span {
    margin-top: 8px;
    color: var(--lfc-muted);
    font-size: 13px;
}

.lfc-smart-state-positive {
    border-color: rgba(34, 197, 94, 0.34);
    background: rgba(34, 197, 94, 0.08);
}

.lfc-smart-state-warning {
    border-color: rgba(245, 158, 11, 0.36);
    background: rgba(245, 158, 11, 0.09);
}

.lfc-smart-state-critical {
    border-color: rgba(239, 68, 68, 0.36);
    background: rgba(239, 68, 68, 0.09);
}

.lfc-dashboard-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(15, 23, 42, 0.38);
    backdrop-filter: blur(12px);
}

.lfc-dashboard-modal[hidden] {
    display: none;
}

.lfc-dashboard-modal-panel {
    width: min(780px, 100%);
    max-height: min(720px, 90vh);
    overflow: auto;
    border: 1px solid var(--lfc-border);
    border-radius: 22px;
    background: var(--lfc-surface);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.24);
    padding: 18px;
}

.lfc-dashboard-editor-panel,
.lfc-dashboard-date-panel {
    width: min(620px, 100%);
    padding: 20px;
}

.lfc-dashboard-modal-head,
.lfc-dashboard-modal-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.lfc-dashboard-modal-head {
    margin-bottom: 14px;
}

.lfc-dashboard-modal-head h3 {
    margin: 0;
    color: var(--lfc-text);
    font-size: 20px;
    line-height: 1.15;
}

.lfc-dashboard-modal-actions {
    justify-content: flex-end;
    border-top: 1px solid var(--lfc-border);
    padding-top: 14px;
}

.lfc-dashboard-picker-grid,
.lfc-dashboard-editor-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 10px;
}

.lfc-dashboard-picker-item {
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 14px;
    color: var(--lfc-text);
    background: var(--lfc-surface-soft);
    text-align: left;
    cursor: pointer;
}

.lfc-dashboard-picker-item:hover,
.lfc-dashboard-picker-item:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 52%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 10%, var(--lfc-surface));
}

.lfc-dashboard-picker-item strong,
.lfc-dashboard-picker-item span {
    display: block;
}

.lfc-dashboard-picker-item span {
    margin-top: 6px;
    color: var(--lfc-muted);
    font-size: 13px;
}

.lfc-dashboard-editor-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 18px;
}

.lfc-dashboard-date-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.lfc-dashboard-editor-form label,
.lfc-dashboard-date-grid label {
    display: grid;
    gap: 7px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 12px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 82%, transparent);
}

.lfc-dashboard-editor-form label:first-child {
    grid-column: 1 / -1;
}

.lfc-dashboard-editor-form label span,
.lfc-dashboard-date-grid label span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 790;
}

.lfc-dashboard-editor-form input,
.lfc-dashboard-editor-form select,
.lfc-dashboard-date-grid input {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--lfc-border);
    border-radius: 13px;
    padding: 9px 11px;
    color: var(--lfc-text);
    background: var(--lfc-surface);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34);
    font: inherit;
    font-size: 14px;
    outline: none;
}

.lfc-dashboard-editor-form input:focus,
.lfc-dashboard-editor-form select:focus,
.lfc-dashboard-date-grid input:focus {
    border-color: color-mix(in srgb, var(--lfc-accent) 58%, var(--lfc-border));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--lfc-accent) 14%, transparent);
}

.lfc-breakdowns,
.lfc-two-col {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
}

.lfc-card {
    padding: clamp(16px, 1.4vw, 20px);
}

.lfc-card h3,
.lfc-card h4,
.lfc-mini-table h3 {
    margin: 0 0 12px;
    color: var(--lfc-text);
    font-size: 16px;
    line-height: 1.25;
}

.lfc-metric-row,
.lfc-compact-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--lfc-border);
    padding: 10px 0;
}

.lfc-metric-row:last-child,
.lfc-compact-row:last-child {
    border-bottom: 0;
}

.lfc-compact-row {
    border-radius: var(--lfc-radius);
    color: var(--lfc-text);
    text-decoration: none;
}

.lfc-compact-row:hover {
    color: var(--lfc-accent-dark);
}

.lfc-quicklinks {
    display: grid;
    gap: 8px;
}

.lfc-settings-panel {
    display: grid;
    gap: 18px;
}

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

.lfc-settings-status-card {
    display: grid;
    gap: 8px;
    min-height: 132px;
}

.lfc-settings-status-card > span:first-child {
    font-size: 12px;
    font-weight: 780;
}

.lfc-settings-status-card strong {
    color: var(--lfc-text);
    font-size: clamp(20px, 2.2vw, 28px);
    line-height: 1.05;
}

.lfc-settings-status-card .lfc-badge {
    justify-self: start;
}

.lfc-settings-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 400px);
    gap: 18px;
    align-items: start;
}

.lfc-settings-main,
.lfc-settings-sidebar {
    display: grid;
    gap: 18px;
    align-items: start;
    min-width: 0;
}

.lfc-settings-sidebar {
    align-self: start;
}

.lfc-settings-control-card,
.lfc-settings-session-card,
.lfc-settings-password-card {
    display: grid;
    gap: 16px;
    align-self: start;
}

.lfc-settings-url {
    display: grid;
    gap: 7px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 14px;
    background: var(--lfc-surface-soft);
}

.lfc-settings-url span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lfc-settings-url a {
    overflow-wrap: anywhere;
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 760;
    text-decoration: none;
}

.lfc-settings-url a:hover {
    color: var(--lfc-accent-dark);
}

.lfc-settings-subhead {
    display: grid;
    gap: 4px;
    border-top: 1px solid var(--lfc-border);
    padding-top: 16px;
}

.lfc-settings-subhead span {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 880;
}

.lfc-settings-subhead p {
    margin: 0;
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.45;
}

.lfc-mobile-identity-form {
    display: grid;
    gap: 14px;
}

.lfc-mobile-name-field {
    display: grid;
    gap: 7px;
}

.lfc-mobile-name-field > span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lfc-mobile-icon-field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    padding: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-mobile-icon-preview {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: 22px;
    background: color-mix(in srgb, var(--lfc-accent) 9%, var(--lfc-surface));
    overflow: hidden;
}

.lfc-mobile-icon-preview img {
    width: 52px;
    height: 52px;
    border-radius: 15px;
    object-fit: cover;
}

.lfc-mobile-icon-controls {
    display: grid;
    gap: 6px;
}

.lfc-mobile-icon-controls strong {
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 860;
}

.lfc-mobile-icon-controls > span {
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.4;
}

.lfc-settings-actions,
.lfc-settings-deep-links,
.lfc-settings-form-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.lfc-inline-form {
    display: inline-flex;
    margin: 0;
}

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

.lfc-settings-shortcuts a {
    display: grid;
    gap: 4px;
    min-height: 76px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    text-decoration: none;
}

.lfc-settings-shortcuts a:hover {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border));
    background: var(--lfc-hover);
}

.lfc-settings-shortcuts span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 780;
}

.lfc-settings-shortcuts strong {
    color: var(--lfc-text);
    font-size: 15px;
    font-weight: 880;
}

.lfc-settings-deep-links a {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 5px 10px;
    background: var(--lfc-surface);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.lfc-settings-deep-links a:hover {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border));
    color: var(--lfc-accent-dark);
}

.lfc-settings-empty {
    min-height: 150px;
}

.lfc-settings-session-card form {
    align-self: end;
}

.lfc-settings-form-footer {
    justify-content: space-between;
}

@media (max-width: 1100px) {
    .lfc-settings-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .lfc-settings-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .lfc-settings-status-grid,
    .lfc-settings-layout,
    .lfc-settings-shortcuts {
        grid-template-columns: 1fr;
    }

    .lfc-settings-actions .lfc-button,
    .lfc-settings-form-footer .lfc-button {
        width: 100%;
        justify-content: center;
    }

    .lfc-mobile-icon-field {
        grid-template-columns: 1fr;
    }

    .lfc-mobile-icon-preview {
        width: 84px;
        height: 84px;
    }
}

.lfc-quicklinks a {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 11px 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    text-decoration: none;
}

.lfc-quicklinks a:hover {
    border-color: var(--lfc-accent-light-2);
    background: var(--lfc-hover);
    color: var(--lfc-accent-dark-2);
}

.lfc-filter {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    align-items: end;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 58%, transparent);
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 91%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-filter-compact {
    grid-template-columns: minmax(220px, 360px) auto;
    justify-content: start;
}

.lfc-funnel-filter-panel {
    margin: -4px 0 16px;
}

.lfc-funnel-filter-panel[hidden] {
    display: none;
}

.lfc-funnel-filter-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    border-color: color-mix(in srgb, var(--lfc-border) 82%, transparent);
    border-radius: var(--lfc-radius-lg);
    padding: 16px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 98%, transparent), color-mix(in srgb, var(--lfc-surface-soft) 78%, transparent)),
        var(--lfc-surface);
}

.lfc-funnel-filter-search {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    gap: 10px;
    align-items: end;
}

.lfc-funnel-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(170px, 1fr));
    gap: 10px;
}

.lfc-table-wrap {
    overflow-x: auto;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 58%, transparent);
    border-radius: var(--lfc-radius-lg);
    background: color-mix(in srgb, var(--lfc-surface) 91%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-table-wrap table {
    width: 100%;
    min-width: 780px;
    border-collapse: collapse;
}

.lfc-table-wrap th,
.lfc-table-wrap td {
    border-bottom: 1px solid color-mix(in srgb, var(--lfc-border) 54%, transparent);
    padding: 13px 14px;
    color: var(--lfc-text);
    text-align: left;
    vertical-align: middle;
}

.lfc-table-wrap th {
    background: color-mix(in srgb, var(--lfc-surface-soft) 66%, transparent);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
    letter-spacing: 0;
    text-transform: none;
}

.lfc-table-wrap tr:last-child td {
    border-bottom: 0;
}

.lfc-table-wrap tbody tr:hover td {
    background: color-mix(in srgb, var(--lfc-hover) 64%, transparent);
}

.lfc-table-wrap code {
    border-radius: 6px;
    padding: 3px 6px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-accent-dark-2);
}

.lfc-funnel-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.lfc-funnel-head-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-left: auto;
}

.lfc-filter-toggle {
    position: relative;
    min-width: auto;
}

.lfc-filter-toggle-button {
    gap: 8px;
}

.lfc-filter-toggle-button em {
    border-radius: 999px;
    padding: 2px 7px;
    background: var(--lfc-accent-light);
    color: var(--lfc-accent-dark-2);
    font-size: 11px;
    font-style: normal;
    font-weight: 820;
}

.lfc-filter-toggle-button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-surface) 88%, var(--lfc-accent-light));
}

.lfc-filter-toggle summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 9px 14px;
    background: color-mix(in srgb, var(--lfc-surface) 88%, var(--lfc-accent-light));
    color: var(--lfc-accent-dark-2);
    cursor: pointer;
    font-size: 14px;
    font-weight: 760;
    list-style: none;
    white-space: nowrap;
}

.lfc-funnel-head-actions > .lfc-button,
.lfc-funnel-head-actions .lfc-filter-toggle summary {
    min-height: 42px;
}

.lfc-filter-toggle summary::-webkit-details-marker {
    display: none;
}

.lfc-filter-toggle[open] summary {
    margin-bottom: 10px;
}

.lfc-funnel-head-actions .lfc-filter {
    min-width: min(520px, calc(100vw - 48px));
    margin-top: 10px;
}

.lfc-status-action {
    min-width: 104px;
}

.lfc-trash-note {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 14px 16px;
    background: color-mix(in srgb, var(--lfc-warning-soft) 48%, var(--lfc-surface));
}

.lfc-trash-note strong {
    color: var(--lfc-text);
}

.lfc-trash-note span {
    color: var(--lfc-muted);
}

.lfc-funnel-table-wrap {
    border-color: color-mix(in srgb, var(--lfc-border) 78%, transparent);
}

.lfc-funnel-table {
    min-width: 1120px;
    table-layout: auto;
}

.lfc-funnel-table th,
.lfc-funnel-table td {
    white-space: nowrap;
}

.lfc-funnel-table th {
    letter-spacing: 0;
}

.lfc-funnel-table td {
    height: 68px;
    font-size: 14px;
}

.lfc-funnel-table th:first-child,
.lfc-funnel-table td:first-child {
    width: 280px;
}

.lfc-funnel-table th:nth-child(2),
.lfc-funnel-table td:nth-child(2) {
    width: 130px;
}

.lfc-funnel-table th:nth-child(3),
.lfc-funnel-table td:nth-child(3) {
    width: 240px;
}

.lfc-funnel-table .lfc-shortcode-column,
.lfc-funnel-table td:nth-child(4) {
    min-width: 270px;
    width: 270px;
}

.lfc-funnel-table .lfc-actions-column,
.lfc-funnel-table td:nth-child(5) {
    min-width: 340px;
    width: 340px;
}

.lfc-funnel-trash-table {
    min-width: 920px;
}

.lfc-funnel-trash-table th:first-child,
.lfc-funnel-trash-table td:first-child {
    width: 320px;
}

.lfc-funnel-trash-table th:nth-child(2),
.lfc-funnel-trash-table td:nth-child(2),
.lfc-funnel-trash-table th:nth-child(3),
.lfc-funnel-trash-table td:nth-child(3) {
    width: 170px;
}

.lfc-funnel-trash-table th:nth-child(4),
.lfc-funnel-trash-table td:nth-child(4) {
    min-width: 260px;
    width: 260px;
}

.lfc-funnel-name,
.lfc-funnel-meta {
    display: block;
    overflow: hidden;
    max-width: 240px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-funnel-name {
    color: var(--lfc-text);
    font-size: 15px;
    font-weight: 820;
}

.lfc-funnel-meta {
    margin-top: 4px;
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-funnel-optimization {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 230px;
}

.lfc-funnel-optimization-chip {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 24%, var(--lfc-border));
    border-radius: 999px;
    padding: 4px 9px;
    background: color-mix(in srgb, var(--lfc-accent) 8%, var(--lfc-surface));
    color: var(--lfc-accent-dark-2);
    font-size: 12px;
    font-weight: 820;
}

.lfc-funnel-optimization-chip.is-test {
    border-color: color-mix(in srgb, var(--lfc-success) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-success) 10%, var(--lfc-surface));
    color: var(--lfc-success-dark);
}

.lfc-funnel-optimization-chip.is-rule {
    border-color: color-mix(in srgb, var(--lfc-warning) 32%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-warning) 10%, var(--lfc-surface));
    color: var(--lfc-warning-dark);
}

.lfc-funnel-optimization-chip.is-muted {
    border-color: var(--lfc-border);
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
}

.lfc-funnel-empty-state {
    min-height: 220px;
    border: 0;
    background:
        radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--lfc-accent) 8%, transparent), transparent 34%),
        var(--lfc-surface-soft);
}

.lfc-funnel-empty-state h3 {
    margin: 0;
    color: var(--lfc-text);
    font-size: 18px;
}

.lfc-funnel-empty-state p {
    max-width: 480px;
    margin: 0;
    color: var(--lfc-muted);
    font-size: 14px;
    line-height: 1.5;
}

.lfc-funnels-filter-empty {
    display: grid;
    min-height: min(44vh, 420px);
    place-items: center;
    padding: clamp(18px, 4vw, 42px);
}

.lfc-funnels-filter-empty .lfc-funnel-empty-state {
    width: min(620px, 100%);
    min-height: 0;
    border: 1px solid var(--lfc-border);
    border-radius: 28px;
    padding: 32px;
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-funnels-first-run {
    display: grid;
    place-items: center;
    min-height: min(58vh, 620px);
    padding: clamp(20px, 5vw, 58px) clamp(10px, 3vw, 24px);
}

.lfc-funnels-first-run-card {
    position: relative;
    isolation: isolate;
    display: grid;
    justify-items: center;
    width: min(860px, 100%);
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 34px;
    padding: clamp(28px, 5vw, 54px);
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--lfc-accent) 11%, transparent), transparent 35%),
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 96%, transparent), var(--lfc-surface-soft));
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.10);
    text-align: center;
}

.lfc-first-run-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 66px;
    margin-bottom: 18px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 22%, var(--lfc-border));
    border-radius: 24px;
    background: color-mix(in srgb, var(--lfc-accent) 9%, var(--lfc-surface));
    color: var(--lfc-accent-dark-2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.lfc-first-run-icon svg {
    width: 32px;
    height: 32px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lfc-first-run-copy {
    display: grid;
    justify-items: center;
    gap: 10px;
    max-width: 620px;
}

.lfc-first-run-copy h3 {
    margin: 0;
    color: var(--lfc-text);
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.05;
    letter-spacing: 0;
}

.lfc-first-run-copy > p:not(.lfc-kicker) {
    max-width: 560px;
    margin: 0;
    color: var(--lfc-muted);
    font-size: 16px;
    line-height: 1.55;
}

.lfc-first-run-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 26px;
}

.lfc-first-run-benefits {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.lfc-first-run-benefits span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 0 13px;
    background: color-mix(in srgb, var(--lfc-surface) 74%, transparent);
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 800;
}

.lfc-shortcode-copy {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 34px;
    max-width: 100%;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 5px 10px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-accent-dark-2);
    box-shadow: none;
    white-space: nowrap;
}

.lfc-shortcode-copy code {
    overflow: hidden;
    max-width: 170px;
    padding: 0;
    background: transparent;
    color: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-shortcode-copy span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 780;
}

.live-funnel-control-app .lfc-shortcode-copy:hover {
    border-color: var(--lfc-accent-light-2);
    background: var(--lfc-active);
    color: var(--lfc-accent-dark-2);
}

.live-funnel-control-app .lfc-shortcode-copy.lfc-copy-success {
    border-color: #16a34a;
    background: color-mix(in srgb, #22c55e 16%, var(--lfc-surface));
    color: #166534;
    box-shadow: 0 0 0 4px color-mix(in srgb, #22c55e 18%, transparent);
}

.live-funnel-control-app[data-theme="dark"] .lfc-shortcode-copy.lfc-copy-success,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-shortcode-copy.lfc-copy-success {
    border-color: #4ade80;
    background: color-mix(in srgb, #22c55e 18%, var(--lfc-surface));
    color: #bbf7d0;
}

.lfc-shortcode-copy.lfc-copy-success span {
    color: inherit;
}

.lfc-table-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    max-width: 100%;
    white-space: nowrap;
}

.lfc-table-actions form {
    margin: 0;
}

.lfc-table-actions .lfc-button {
    min-height: 34px;
    flex: 0 0 auto;
    padding: 8px 12px;
    font-size: 13px;
    white-space: nowrap;
}

.lfc-row-more {
    position: relative;
}

.lfc-row-more summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 7px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-muted);
    cursor: pointer;
    font-size: 13px;
    font-weight: 780;
    list-style: none;
}

.lfc-row-more summary::-webkit-details-marker {
    display: none;
}

.lfc-row-more[open] summary {
    border-color: color-mix(in srgb, var(--lfc-accent) 28%, var(--lfc-border));
    color: var(--lfc-text);
}

.lfc-row-more > div {
    position: absolute;
    right: 0;
    z-index: 20;
    display: grid;
    gap: 8px;
    min-width: 180px;
    border: 1px solid var(--lfc-border);
    border-radius: 14px;
    margin-top: 8px;
    padding: 10px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-row-more[data-lfc-row-more-overlay] > div {
    position: fixed;
    right: auto;
    z-index: 100000;
    max-width: calc(100vw - 24px);
    margin-top: 0;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.16);
}

.lfc-row-more[data-lfc-row-more-positioning] > div {
    visibility: hidden;
}

.live-funnel-control-app[data-theme="dark"] .lfc-row-more[data-lfc-row-more-overlay] > div,
html[data-live-funnel-control-theme="dark"] .live-funnel-control-app .lfc-row-more[data-lfc-row-more-overlay] > div {
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.36);
}

.lfc-row-more > div .lfc-button {
    justify-content: center;
    width: 100%;
}

.lfc-copy-toast {
    position: fixed;
    top: max(18px, env(safe-area-inset-top));
    right: max(18px, env(safe-area-inset-right));
    z-index: 99999;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    border: 1px solid color-mix(in srgb, #22c55e 34%, transparent);
    border-radius: 999px;
    padding: 10px 15px;
    background: color-mix(in srgb, #22c55e 12%, var(--lfc-surface));
    color: var(--lfc-text);
    box-shadow: var(--lfc-shadow-soft);
    font-size: 14px;
    font-weight: 780;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity 160ms ease, transform 160ms ease;
}

.lfc-copy-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.lfc-copy-toast.is-error {
    border-color: color-mix(in srgb, var(--lfc-danger) 34%, transparent);
    background: color-mix(in srgb, var(--lfc-danger-soft) 70%, var(--lfc-surface));
}

.lfc-empty-cell {
    color: var(--lfc-muted);
    text-align: center !important;
}

.lfc-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-actions form {
    margin: 0;
}

.lfc-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border: 1px solid var(--lfc-accent-light-2);
    border-radius: 999px;
    padding: 4px 9px;
    background: var(--lfc-accent-light);
    color: var(--lfc-accent-dark-2);
    font-size: 12px;
    font-weight: 820;
}

.lfc-pill-critical {
    border-color: #fecaca;
    background: var(--lfc-danger-soft);
    color: var(--lfc-danger);
}

.lfc-pill-warning {
    border-color: #fde68a;
    background: var(--lfc-warning-soft);
    color: var(--lfc-warning);
}

.lfc-card-list {
    display: grid;
    gap: 12px;
}

.lfc-row-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
}

.lfc-row-card h3 {
    margin: 8px 0 4px;
    color: var(--lfc-text);
    font-size: 17px;
}

.lfc-row-card p {
    margin: 0 0 5px;
    color: var(--lfc-muted);
}

.lfc-note {
    border-bottom: 1px solid var(--lfc-border);
    margin: 0;
    padding: 9px 0;
    color: var(--lfc-text);
}

.lfc-pagination {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lfc-pagination a {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 8px 11px;
    background: var(--lfc-surface);
    text-decoration: none;
}

.lfc-detail {
    display: grid;
    gap: 16px;
    border-top: 1px solid var(--lfc-border);
    margin-top: 4px;
    padding-top: 18px;
}

.lfc-inline-panel {
    display: grid;
    gap: 10px;
}

.lfc-mini-table p {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin: 8px 0;
    color: var(--lfc-text);
}

.lfc-leads {
    gap: 14px;
}

.lfc-leads-head .lfc-actions {
    align-items: center;
}

.lfc-leads-head .lfc-button {
    gap: 7px;
}

.lfc-leads-head .lfc-button span,
.lfc-lead-detail-link span {
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: color-mix(in srgb, currentColor 9%, transparent);
    font-weight: 900;
    line-height: 1;
}

.lfc-leads-head .lfc-admin-link {
    min-height: 36px;
    padding-inline: 10px;
    color: var(--lfc-muted);
}

.lfc-lead-kpis {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.lfc-lead-stat {
    gap: 8px;
    padding: 15px;
}

.lfc-lead-stat strong {
    margin-bottom: 0;
    font-size: clamp(24px, 2vw, 30px);
}

.lfc-lead-stat .lfc-stat-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
    line-height: 1.25;
    text-transform: none;
}

.lfc-lead-stat .lfc-info-dot {
    flex: 0 0 auto;
    margin-left: 0;
    opacity: 0.44;
}

.lfc-lead-stat .lfc-info-dot::before {
    content: "?";
}

.lfc-leads-filter-panel {
    margin-top: 0;
}

.lfc-leads-table table {
    min-width: 1040px;
}

.lfc-leads-table th,
.lfc-leads-table td {
    padding: 11px 12px;
}

.lfc-leads-table th {
    font-size: 11px;
    font-weight: 760;
    letter-spacing: 0;
    text-transform: none;
}

.lfc-lead-row td {
    font-size: 13px;
}

.lfc-lead-person,
.lfc-lead-funnel,
.lfc-lead-date {
    display: grid;
    gap: 3px;
    color: var(--lfc-text);
    text-decoration: none;
}

.lfc-lead-person strong {
    font-size: 14px;
    font-weight: 850;
}

.lfc-lead-person span,
.lfc-lead-funnel small,
.lfc-lead-date small {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
}

.lfc-lead-detail-link {
    display: inline-flex;
    gap: 6px;
    min-height: 34px;
    padding: 7px 9px;
    font-size: 12px;
    white-space: nowrap;
}

.lfc-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 27px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 4px 8px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 820;
    white-space: nowrap;
}

.lfc-badge-hot,
.lfc-badge-abgeschlossen {
    border-color: color-mix(in srgb, var(--lfc-success) 34%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-success) 11%, var(--lfc-surface));
    color: var(--lfc-success-dark);
}

.lfc-badge-medium,
.lfc-badge-begonnen,
.lfc-badge-recovered {
    border-color: color-mix(in srgb, var(--lfc-warning) 34%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-warning) 12%, var(--lfc-surface));
    color: var(--lfc-warning-dark);
}

.lfc-badge-cold,
.lfc-badge-neu,
.lfc-badge-neutral {
    color: var(--lfc-muted);
}

.lfc-badge-abgebrochen {
    border-color: color-mix(in srgb, var(--lfc-danger) 32%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger) 10%, var(--lfc-surface));
    color: var(--lfc-danger);
}

.lfc-badge-sent,
.lfc-badge-success {
    border-color: color-mix(in srgb, var(--lfc-success) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-success) 10%, var(--lfc-surface));
    color: var(--lfc-success-dark);
}

.lfc-badge-failed,
.lfc-badge-error {
    border-color: color-mix(in srgb, var(--lfc-danger) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger) 9%, var(--lfc-surface));
    color: var(--lfc-danger);
}

.lfc-badge-queued,
.lfc-badge-skipped {
    border-color: color-mix(in srgb, var(--lfc-warning) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-warning) 10%, var(--lfc-surface));
    color: var(--lfc-warning-dark);
}

.lfc-score-pill {
    display: inline-grid;
    gap: 5px;
    min-width: 58px;
}

.lfc-score-pill strong {
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 850;
}

.lfc-score-pill i {
    display: block;
    width: 58px;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--lfc-surface-soft);
}

.lfc-score-pill i::before {
    display: block;
    width: var(--lfc-score, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--lfc-accent), var(--lfc-success));
    content: "";
}

.lfc-drawer-shell {
    position: fixed;
    inset: 0;
    z-index: 99920;
    display: grid;
    justify-items: end;
}

.lfc-drawer-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.42);
}

.lfc-lead-drawer {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: start;
    gap: 16px;
    width: min(560px, calc(100vw - 22px));
    height: 100vh;
    overflow-y: auto;
    border-left: 1px solid var(--lfc-border);
    padding: 22px;
    background: var(--lfc-app-bg);
    box-shadow: -24px 0 60px rgba(15, 23, 42, 0.24);
}

.lfc-drawer-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.lfc-drawer-head h3 {
    margin: 0;
    color: var(--lfc-text);
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.08;
}

.lfc-drawer-head span {
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 720;
}

.lfc-drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font-size: 22px;
    line-height: 1;
    text-decoration: none;
}

.lfc-drawer-badges,
.lfc-drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

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

.lfc-drawer-summary span {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 10px;
    background: var(--lfc-surface);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-drawer-summary strong {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 840;
    line-height: 1.25;
}

.lfc-drawer-section {
    display: grid;
    gap: 12px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 88%, transparent);
    border-radius: var(--lfc-radius);
    padding: 15px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-drawer-section h4 {
    margin: 0;
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 860;
}

.lfc-contact-grid,
.lfc-field-value-list {
    display: grid;
    gap: 9px;
}

.lfc-contact-grid {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.lfc-contact-grid span,
.lfc-field-value-list div {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 10px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-contact-grid strong,
.lfc-field-value-list strong {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 780;
    word-break: break-word;
}

.lfc-lead-update-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lfc-lead-update-form .lfc-wide,
.lfc-lead-update-form button {
    grid-column: 1 / -1;
}

.lfc-timeline {
    display: grid;
    gap: 8px;
}

.lfc-timeline p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-left: 3px solid var(--lfc-accent);
    margin: 0;
    border-radius: 0 var(--lfc-radius) var(--lfc-radius) 0;
    padding: 8px 10px;
    background: var(--lfc-surface-soft);
}

.lfc-timeline strong {
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-timeline span {
    color: var(--lfc-muted);
    font-size: 12px;
    white-space: nowrap;
}

.lfc-activity-list {
    display: grid;
    gap: 8px;
}

.lfc-activity-list p {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    margin: 0;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 10px;
    background: var(--lfc-surface-soft);
}

.lfc-activity-list strong {
    min-width: 0;
    overflow: hidden;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 830;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-activity-list small {
    grid-column: 1 / -1;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 700;
}

.lfc-analytics {
    display: grid;
    gap: 14px;
}

.lfc-analytics-filter-panel {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 88%, transparent);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-analytics-filter-panel summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 58px;
    padding: 10px 12px 10px 16px;
    color: var(--lfc-text);
    cursor: pointer;
    list-style: none;
}

.lfc-analytics-filter-panel summary::-webkit-details-marker {
    display: none;
}

.lfc-analytics-toolbar-text {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 700;
}

.lfc-analytics-toolbar-text strong {
    color: var(--lfc-text);
}

.lfc-analytics-toolbar-text em {
    color: var(--lfc-muted);
    font-style: normal;
}

.lfc-filter-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 8px 11px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 820;
}

.lfc-filter-button b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    border-radius: 999px;
    background: var(--lfc-accent);
    color: #fff;
    font-size: 11px;
}

.lfc-active-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 5px 9px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-chip a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    color: var(--lfc-muted);
    text-decoration: none;
}

.lfc-chip a:hover,
.lfc-chip a:focus-visible {
    background: var(--lfc-hover);
    color: var(--lfc-text);
}

.lfc-chip-info {
    border-color: color-mix(in srgb, var(--lfc-accent) 22%, var(--lfc-border));
}

.lfc-chip i,
.lfc-info-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-accent) 12%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    font-size: 11px;
    font-style: normal;
    font-weight: 850;
}

.lfc-info-dot {
    margin-left: 5px;
}

.lfc-analytics-filter {
    display: grid;
    gap: 14px;
    border: 0;
    border-top: 1px solid var(--lfc-border);
    border-radius: 0;
    margin: 0;
    padding: 16px;
    background: color-mix(in srgb, var(--lfc-surface) 96%, var(--lfc-surface-soft));
    box-shadow: none;
}

.lfc-filter-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-filter-presets label {
    display: inline-flex;
}

.lfc-filter-presets input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.lfc-filter-presets span {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 8px 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 780;
    cursor: pointer;
}

.lfc-filter-presets input:checked + span,
.lfc-filter-presets input:focus-visible + span {
    border-color: color-mix(in srgb, var(--lfc-accent) 58%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 10%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lfc-accent) 12%, transparent);
}

.lfc-analytics-filter-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    gap: 10px;
}

.lfc-analytics-filter-grid label {
    display: grid;
    gap: 6px;
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 760;
}

.lfc-analytics-filter-grid input,
.lfc-analytics-filter-grid select {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 9px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font: inherit;
}

.lfc-analytics-filter-grid input:focus,
.lfc-analytics-filter-grid select:focus {
    border-color: var(--lfc-accent);
    box-shadow: 0 0 0 3px var(--lfc-focus);
    outline: none;
}

.lfc-filter-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid var(--lfc-border);
    padding-top: 12px;
}

.lfc-switch-row {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 720;
}

.lfc-switch-row input {
    width: 18px;
    height: 18px;
    accent-color: var(--lfc-accent);
}

.lfc-analytics-note {
    display: grid;
    gap: 3px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: var(--lfc-radius);
    padding: 12px 14px;
    background: color-mix(in srgb, var(--lfc-accent) 7%, var(--lfc-surface));
    color: var(--lfc-muted);
    font-size: 13px;
}

.lfc-analytics-note strong {
    color: var(--lfc-text);
}

.lfc-mail-view {
    gap: 14px;
}

.lfc-mail-view .lfc-view-head .lfc-actions {
    align-items: center;
    flex-wrap: wrap;
}

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

.lfc-kpi-card {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-kpi-card span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
    text-transform: uppercase;
}

.lfc-kpi-card strong {
    color: var(--lfc-text);
    font-size: clamp(24px, 2vw, 32px);
    font-weight: 900;
    line-height: 1;
}

.lfc-kpi-card small {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
}

.lfc-mail-center-grid,
.lfc-recovery-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
    gap: 14px;
    align-items: start;
}

.lfc-recovery-layout:not(:has(.lfc-mail-detail)) {
    grid-template-columns: minmax(0, 1fr);
}

.lfc-mail-row {
    align-items: center;
    grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1fr) auto;
}

.lfc-mail-row-main,
.lfc-mail-row-meta {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.lfc-mail-row-main h3 {
    margin: 0;
}

.lfc-mail-row-main h3 a {
    color: inherit;
    text-decoration: none;
}

.lfc-mail-row-main h3 a:hover {
    color: var(--lfc-accent);
}

.lfc-mail-row-main p,
.lfc-mail-row-meta span {
    overflow: hidden;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-mail-row .lfc-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
}

.lfc-recovery-card {
    grid-template-columns: minmax(220px, 1fr) minmax(300px, 1.25fr) auto;
}

.lfc-recovery-metrics,
.lfc-recovery-detail-grid {
    display: grid;
    gap: 8px;
}

.lfc-recovery-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lfc-recovery-metrics span,
.lfc-recovery-detail-grid span {
    display: grid;
    gap: 3px;
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 80%, transparent);
    border-radius: var(--lfc-radius);
    padding: 9px;
    background: var(--lfc-surface-soft);
}

.lfc-recovery-metrics small,
.lfc-recovery-detail-grid small {
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 820;
    text-transform: uppercase;
}

.lfc-recovery-metrics strong,
.lfc-recovery-detail-grid strong {
    min-width: 0;
    overflow: hidden;
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 820;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-recovery-detail-grid {
    grid-template-columns: 1fr;
}

.lfc-mail-detail,
.lfc-mail-builder {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 14px;
}

.lfc-mail-detail-head,
.lfc-mail-builder-head,
.lfc-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.lfc-mail-detail-head h3,
.lfc-mail-builder-head h3,
.lfc-section-head h3 {
    margin: 4px 0 0;
}

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

.lfc-mail-detail-grid section,
.lfc-mail-detail-section {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-mail-detail-grid h4,
.lfc-mail-detail-section h4 {
    margin: 0 0 10px;
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-mail-detail-grid p {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 7px;
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-field-value-list {
    display: grid;
    gap: 7px;
    margin: 0;
}

.lfc-field-value-list dt {
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.lfc-field-value-list dd {
    margin: -4px 0 4px;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 700;
}

.lfc-mail-builder-form {
    display: grid;
    gap: 12px;
}

.lfc-full-field {
    display: grid;
    gap: 6px;
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 760;
}

.lfc-full-field input,
.lfc-full-field textarea,
.lfc-mail-builder-actions input {
    width: 100%;
    border: 1px solid var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 10px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font: inherit;
}

.lfc-placeholder-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    border: 1px dashed var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 10px;
    background: var(--lfc-surface-soft);
}

.lfc-placeholder-bar span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
}

.lfc-placeholder-bar code {
    border-radius: 999px;
    padding: 4px 7px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font-size: 11px;
}

.lfc-mail-preview {
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-accent) 5%, var(--lfc-surface));
}

.lfc-mail-preview h4 {
    margin: 2px 0 10px;
    color: var(--lfc-text);
    font-size: 16px;
}

.lfc-mail-preview p {
    color: var(--lfc-muted);
}

.lfc-mail-builder-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 10px;
    border-top: 1px solid var(--lfc-border);
    padding-top: 12px;
}

.lfc-mail-builder-actions label {
    display: grid;
    gap: 5px;
    min-width: 210px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-mail-log-card {
    display: grid;
    gap: 12px;
}

.lfc-mail-log-list {
    display: grid;
    gap: 8px;
}

.lfc-mail-log-row {
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr) auto auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 9px 10px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-mail-log-row strong {
    color: var(--lfc-text);
}

.lfc-mail-log-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-mail-builder-mode {
    gap: 16px;
}

.lfc-mail-overview-head .lfc-actions {
    align-items: center;
}

.lfc-mail-overview-list {
    display: grid;
    gap: 10px;
}

.lfc-mail-row-modern {
    grid-template-columns: minmax(240px, 1.15fr) minmax(240px, 1fr) auto;
}

.lfc-mail-builder-workspace {
    display: grid;
    gap: 14px;
}

.lfc-mail-builder-topbar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-mail-builder-topbar h2 {
    margin: 2px 0 0;
}

.lfc-mail-builder-topbar .lfc-actions {
    align-items: end;
}

.lfc-mail-test-inline {
    display: grid;
    gap: 5px;
    min-width: 190px;
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 800;
}

.lfc-mail-test-inline input {
    min-height: 36px;
}

.lfc-mail-builder-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 8px;
    background: var(--lfc-surface);
}

.lfc-mail-builder-steps a {
    border-radius: 999px;
    padding: 9px 12px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
    text-decoration: none;
}

.lfc-mail-builder-steps a.is-active,
.lfc-mail-builder-steps a:hover {
    background: color-mix(in srgb, var(--lfc-accent) 12%, var(--lfc-surface-soft));
    color: var(--lfc-text);
}

.lfc-mail-builder-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 14px;
    align-items: start;
}

.lfc-mail-builder-main {
    display: grid;
    gap: 14px;
}

.lfc-mail-builder-section,
.lfc-mail-preview-studio {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 16px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

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

.lfc-mail-template-card {
    display: grid;
    gap: 10px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 13px;
    background: var(--lfc-surface-soft);
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.lfc-mail-template-card:hover,
.lfc-mail-template-card.is-selected {
    border-color: color-mix(in srgb, var(--lfc-accent) 46%, var(--lfc-border));
    box-shadow: 0 14px 32px rgba(37, 99, 235, 0.12);
    transform: translateY(-1px);
}

.lfc-mail-template-card.is-selected {
    background: color-mix(in srgb, var(--lfc-accent) 7%, var(--lfc-surface));
}

.lfc-mail-template-card h4,
.lfc-mail-block-tools h4 {
    margin: 0;
    color: var(--lfc-text);
}

.lfc-mail-template-card p,
.lfc-mail-template-card small {
    margin: 0;
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.45;
}

.lfc-mail-template-preview {
    display: grid;
    gap: 7px;
    min-height: 108px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: linear-gradient(180deg, var(--lfc-surface), color-mix(in srgb, var(--lfc-accent) 5%, var(--lfc-surface-soft)));
}

.lfc-mail-template-preview span {
    width: 36px;
    height: 8px;
    border-radius: 999px;
    background: var(--lfc-accent);
}

.lfc-mail-template-preview strong {
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-mail-template-preview small {
    color: var(--lfc-muted);
}

.lfc-mail-logo-card {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(130px, 180px);
    gap: 12px;
    align-items: end;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 13px;
    margin-bottom: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-mail-logo-card h4,
.lfc-mail-logo-card p {
    margin: 0;
}

.lfc-mail-logo-card p {
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.45;
}

.lfc-mail-logo-card label {
    display: grid;
    gap: 6px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-mail-logo-card input[type="url"],
.lfc-mail-logo-card input[type="text"],
.lfc-mail-logo-card input[type="number"],
.lfc-mail-test-inline input {
    width: 100%;
    border: 1px solid var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 9px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    font: inherit;
}

.lfc-mail-logo-card input:focus,
.lfc-mail-test-inline input:focus {
    border-color: var(--lfc-accent);
    box-shadow: 0 0 0 3px var(--lfc-focus);
    outline: none;
}

.lfc-mail-logo-card .lfc-mini-check {
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: center;
}

.lfc-mail-logo-preview {
    display: grid;
    align-items: center;
    justify-items: center;
    min-height: 92px;
    border: 1px dashed var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 10px;
    background: var(--lfc-surface);
}

.lfc-mail-logo-preview img {
    max-width: 160px;
    max-height: 74px;
    object-fit: contain;
}

.lfc-mail-logo-preview span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-mail-setup-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lfc-mail-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 240px);
    gap: 12px;
    align-items: start;
}

.lfc-mail-compose-panel {
    display: grid;
    gap: 12px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    margin-top: 12px;
    background: color-mix(in srgb, var(--lfc-surface) 92%, var(--lfc-surface-soft));
}

.lfc-mail-block-tools {
    display: grid;
    gap: 8px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-placeholder-panel {
    display: grid;
    gap: 10px;
}

.lfc-placeholder-groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    border: 1px dashed var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-placeholder-groups section {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-content: flex-start;
}

.lfc-placeholder-groups strong {
    flex-basis: 100%;
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 840;
    text-transform: uppercase;
}

.lfc-placeholder-groups button {
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 6px 9px;
    background: var(--lfc-surface);
    color: var(--lfc-text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 760;
}

.lfc-followup-timeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}

.lfc-followup-stage {
    display: grid;
    gap: 7px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 13px;
    background: var(--lfc-surface-soft);
}

.lfc-followup-stage span {
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 840;
    text-transform: uppercase;
}

.lfc-followup-stage strong {
    color: var(--lfc-text);
    font-size: 28px;
    line-height: 1;
}

.lfc-followup-stage small,
.lfc-followup-stage a {
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-mail-test-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
}

.lfc-mail-test-panel > span {
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.45;
}

.lfc-mail-test-panel label {
    display: grid;
    gap: 6px;
    min-width: min(280px, 100%);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-mail-preview-studio {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 12px;
}

.lfc-mail-preview-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.lfc-mail-preview-toolbar .lfc-segmented {
    display: inline-flex;
    gap: 4px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 3px;
    background: var(--lfc-surface-soft);
}

.lfc-mail-preview-toolbar .lfc-segmented button {
    border: 0;
    border-radius: 999px;
    padding: 7px 10px;
    background: transparent;
    color: var(--lfc-muted);
    font: inherit;
    font-size: 12px;
    font-weight: 820;
    cursor: pointer;
}

.lfc-mail-preview-toolbar .lfc-segmented button.is-active,
.lfc-mail-preview-toolbar .lfc-segmented button:hover,
.lfc-mail-preview-toolbar .lfc-segmented button:focus-visible {
    background: var(--lfc-surface);
    color: var(--lfc-text);
    box-shadow: var(--lfc-shadow-soft);
    outline: none;
}

.lfc-mail-preview-toolbar > span {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 860;
}

.lfc-mail-device-preview {
    display: grid;
    justify-items: center;
    border-radius: var(--lfc-radius-lg);
    padding: 18px;
    background: color-mix(in srgb, var(--lfc-muted) 8%, var(--lfc-surface-soft));
}

.lfc-mail-device-preview[data-lfc-mail-device="mobile"] .lfc-mail-preview-envelope {
    max-width: 330px;
}

.lfc-mail-preview-envelope {
    width: 100%;
    max-width: 620px;
    overflow: hidden;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    background: #fff;
    color: #111827;
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-mail-preview-envelope > small {
    display: block;
    padding: 14px 18px 0;
    color: #6b7280;
    font-size: 12px;
}

.lfc-mail-preview-envelope > h4 {
    margin: 0;
    padding: 14px 18px;
    border-bottom: 1px solid #e5e7eb;
    color: #111827;
    font-size: 18px;
}

.lfc-mail-preview-logo {
    padding: 18px 18px 0;
    text-align: center;
}

.lfc-mail-preview-logo.lfc-mail-logo-card,
.lfc-mail-preview-logo.lfc-mail-logo-hero {
    padding: 0 0 18px;
}

.lfc-mail-preview-logo.lfc-mail-logo-footer {
    padding: 18px 18px 20px;
}

.lfc-mail-preview-logo img {
    display: inline-block;
    width: 100%;
    height: auto;
    border: 0;
    object-fit: contain;
}

.lfc-mail-preview-logo.lfc-mail-logo-card img,
.lfc-mail-preview-logo.lfc-mail-logo-hero img {
    border-radius: 14px;
}

.lfc-mail-preview-envelope > div {
    color: #111827;
}

.lfc-mail-log-row {
    display: block;
    padding: 0;
}

.lfc-mail-log-row summary {
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr) auto auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 9px 10px;
    cursor: pointer;
}

.lfc-mail-log-row > div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border-top: 1px solid var(--lfc-border);
    padding: 10px;
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-analytics-stat {
    display: grid;
    gap: 6px;
}

.lfc-analytics-stat .lfc-stat-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
    text-transform: uppercase;
}

.lfc-analytics-stat strong {
    margin-bottom: 0;
}

.lfc-analytics-stat p {
    margin: 0;
    color: var(--lfc-muted);
    font-size: 13px;
    line-height: 1.45;
}

.lfc-trend {
    display: inline-flex;
    width: fit-content;
    border-radius: var(--lfc-radius);
    padding: 5px 8px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 780;
}

.lfc-trend.is-good {
    background: color-mix(in srgb, #16a34a 12%, var(--lfc-surface));
    color: #15803d;
}

.lfc-trend.is-bad {
    background: color-mix(in srgb, var(--lfc-danger) 11%, var(--lfc-surface));
    color: var(--lfc-danger);
}

.lfc-analytics-empty {
    display: grid;
    gap: 5px;
    text-align: left;
}

.lfc-analytics-main {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
    gap: 14px;
}

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

.lfc-card-head p,
.lfc-funnel-performance p,
.lfc-bar-list > p {
    margin: 4px 0 0;
    font-size: 13px;
    line-height: 1.45;
}

.lfc-line-chart {
    display: block;
    width: 100%;
    height: 190px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    background:
        linear-gradient(to right, transparent 0, transparent 24%, var(--lfc-border) 25%, transparent 26%, transparent 49%, var(--lfc-border) 50%, transparent 51%, transparent 74%, var(--lfc-border) 75%, transparent 76%),
        linear-gradient(to top, transparent 0, transparent 24%, var(--lfc-border) 25%, transparent 26%, transparent 49%, var(--lfc-border) 50%, transparent 51%, transparent 74%, var(--lfc-border) 75%, transparent 76%),
        var(--lfc-surface-soft);
}

.lfc-line-chart polyline {
    fill: none;
    stroke-width: 2.6;
    vector-effect: non-scaling-stroke;
}

.lfc-line-chart .is-pageviews {
    stroke: var(--lfc-accent);
}

.lfc-line-chart .is-starts {
    stroke: #16a34a;
}

.lfc-line-chart .is-completions {
    stroke: #f59e0b;
}

.lfc-chart-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
}

.lfc-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 780;
}

.lfc-chart-legend span::before {
    width: 18px;
    height: 3px;
    border-radius: 999px;
    background: currentColor;
    content: "";
}

.lfc-chart-legend .is-pageviews {
    color: #2563eb;
}

.lfc-chart-legend .is-starts {
    color: #16a34a;
}

.lfc-chart-legend .is-completions {
    color: #f59e0b;
}

.lfc-chart-mode-toggle {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 3px;
    background: var(--lfc-surface-soft);
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 58%, transparent);
}

.lfc-chart-mode-toggle button {
    min-height: 30px;
    border: 0;
    border-radius: 999px;
    padding: 6px 12px;
    background: transparent;
    color: var(--lfc-muted);
    cursor: pointer;
    font-size: 12px;
    font-weight: 820;
}

.lfc-chart-mode-toggle button.is-active {
    background: var(--lfc-surface);
    color: var(--lfc-text);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.lfc-tracking-chart {
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 86%, transparent);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--lfc-accent) 9%, transparent), transparent 32%),
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 96%, #fff), var(--lfc-surface-soft));
    padding: clamp(12px, 1.4vw, 18px);
}

.lfc-chart-canvas {
    display: none;
}

.lfc-chart-canvas[hidden] {
    display: none !important;
}

.lfc-chart-canvas.is-active {
    display: block;
}

.lfc-premium-chart {
    display: block;
    width: 100%;
    height: 280px;
    overflow: visible;
}

.lfc-chart-grid {
    stroke: color-mix(in srgb, var(--lfc-border) 78%, transparent);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

.lfc-chart-axis {
    stroke: color-mix(in srgb, var(--lfc-border-strong) 64%, transparent);
    stroke-width: 1.15;
    vector-effect: non-scaling-stroke;
}

.lfc-chart-y-label,
.lfc-chart-x-label {
    fill: var(--lfc-muted);
    font-size: 11px;
    font-weight: 720;
}

.lfc-chart-y-label {
    text-anchor: end;
}

.lfc-chart-x-label {
    text-anchor: middle;
}

.lfc-chart-line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.7;
    filter: drop-shadow(0 7px 10px rgba(15, 23, 42, 0.06));
    vector-effect: non-scaling-stroke;
}

.lfc-premium-chart .lfc-chart-line {
    fill: none !important;
}

.lfc-chart-area {
    opacity: 0.96;
    stroke: none;
    shape-rendering: geometricPrecision;
}

.lfc-premium-area-chart .lfc-chart-area {
    mix-blend-mode: normal;
}

[data-live-funnel-control-theme="dark"] .lfc-premium-area-chart .lfc-chart-area {
    mix-blend-mode: normal;
    opacity: 0.82;
}

.lfc-premium-area-chart .lfc-chart-line {
    stroke-width: 2.5;
}

.lfc-site-tracking {
    display: grid;
    gap: 16px;
}

.lfc-site-tracking-head {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 80%, transparent);
    border-radius: 18px;
    padding: clamp(12px, 1.5vw, 16px);
    background:
        radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--lfc-accent) 6%, transparent), transparent 28%),
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 98%, #fff), var(--lfc-surface));
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-site-tracking-head h1 {
    margin-bottom: 3px;
    font-size: clamp(26px, 2.6vw, 34px);
    letter-spacing: 0;
}

.lfc-site-tracking-head p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    max-width: 560px;
    margin: 0;
    font-size: 13px;
}

.lfc-site-tracking-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 20%, var(--lfc-border));
    border-radius: 999px;
    padding: 3px 8px;
    background: color-mix(in srgb, var(--lfc-accent) 7%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.lfc-site-tracking .lfc-view-head .lfc-actions {
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 82%, transparent);
    border-radius: 16px;
    padding: 7px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 70%, var(--lfc-surface));
    row-gap: 7px;
}

.lfc-toggle-switch {
    position: relative;
    gap: 8px;
    min-height: 36px;
    border-radius: 999px;
    padding: 5px 8px 5px 5px;
    background: transparent;
    cursor: pointer;
}

.lfc-toggle-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.lfc-toggle-switch > span {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    width: 38px;
    height: 22px;
    border: 1px solid color-mix(in srgb, var(--lfc-border-strong) 70%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-muted) 15%, var(--lfc-surface-soft));
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.lfc-toggle-switch > span::after {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
    content: "";
    transition: transform 160ms ease;
}

.lfc-toggle-switch input:checked + span {
    border-color: color-mix(in srgb, var(--lfc-accent) 74%, transparent);
    background: var(--lfc-accent);
}

.lfc-toggle-switch input:checked + span::after {
    transform: translateX(16px);
}

.lfc-toggle-switch input:focus-visible + span {
    box-shadow: 0 0 0 3px var(--lfc-focus), inset 0 1px 2px rgba(15, 23, 42, 0.08);
}

.lfc-toggle-switch em {
    color: var(--lfc-text);
    font-size: 12px;
    font-style: normal;
    font-weight: 780;
    white-space: nowrap;
}

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

.lfc-site-lists {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
}

.lfc-site-chart-card {
    min-height: 330px;
}

.lfc-site-tracking .lfc-kpi-grid {
    gap: 12px;
}

.lfc-site-tracking .lfc-kpi-card {
    min-height: 126px;
    border-color: color-mix(in srgb, var(--lfc-border) 82%, transparent);
    border-radius: 20px;
    padding: 16px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 98%, #fff), color-mix(in srgb, var(--lfc-surface-soft) 72%, var(--lfc-surface)));
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.lfc-site-tracking .lfc-kpi-card span {
    color: color-mix(in srgb, var(--lfc-muted) 88%, var(--lfc-text));
    letter-spacing: 0.035em;
}

.lfc-site-tracking .lfc-kpi-card strong {
    margin-top: 3px;
    font-size: clamp(28px, 2.4vw, 38px);
    letter-spacing: 0;
}

.lfc-site-tracking .lfc-kpi-card small {
    color: color-mix(in srgb, var(--lfc-muted) 88%, var(--lfc-text));
    font-weight: 720;
}

.lfc-site-sparkline {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    min-height: 230px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 82%, transparent);
    border-radius: 18px;
    padding: 18px;
    background:
        linear-gradient(to top, color-mix(in srgb, var(--lfc-border) 50%, transparent) 1px, transparent 1px) 0 0 / 100% 25%,
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 96%, #fff), var(--lfc-surface-soft));
}

.lfc-site-sparkline span {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    flex: 1 1 8px;
    min-width: 6px;
    height: 190px;
}

.lfc-site-sparkline i {
    display: block;
    width: min(12px, 42%);
    min-height: 3px;
    border-radius: 999px 999px 3px 3px;
    background: var(--lfc-accent);
    box-shadow: 0 8px 16px color-mix(in srgb, var(--lfc-accent) 16%, transparent);
}

.lfc-site-sparkline .is-clicks {
    background: #16a34a;
    box-shadow: 0 8px 16px rgba(22, 163, 74, 0.14);
}

.lfc-site-bars {
    display: grid;
    gap: 11px;
}

.lfc-site-list-card {
    min-height: 238px;
    border-color: color-mix(in srgb, var(--lfc-border) 84%, transparent);
    border-radius: 20px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 98%, #fff), var(--lfc-surface));
}

.lfc-site-list-card .lfc-card-head {
    margin-bottom: 14px;
}

.lfc-site-list-card .lfc-card-head h2 {
    font-size: 15px;
    letter-spacing: 0;
}

.lfc-site-bar-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    width: 100%;
    border: 1px solid transparent;
    border-radius: 12px;
    margin: 0;
    padding: 7px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.lfc-site-bar-row:hover,
.lfc-site-bar-row:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 7%, var(--lfc-surface));
    outline: none;
    transform: translateY(-1px);
}

.lfc-site-bar-row span {
    overflow: hidden;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 780;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-site-bar-row strong {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
}

.lfc-site-bar-row i {
    grid-column: 1 / -1;
    display: block;
    height: 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-border) 48%, transparent);
    overflow: hidden;
}

.lfc-site-bar-row i::before {
    display: block;
    width: var(--lfc-site-bar, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--lfc-accent), color-mix(in srgb, var(--lfc-accent) 58%, #16a34a));
    content: "";
}

.lfc-empty-muted {
    margin: 0;
    color: var(--lfc-muted);
    font-size: 13px;
    line-height: 1.45;
}

.lfc-site-modal {
    position: fixed;
    z-index: 100000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: clamp(16px, 3vw, 36px);
    background: rgba(15, 23, 42, 0.34);
    backdrop-filter: blur(14px);
}

.lfc-site-modal[hidden] {
    display: none !important;
}

.lfc-site-modal-panel {
    position: relative;
    display: grid;
    gap: 14px;
    width: min(920px, 100%);
    max-height: min(820px, 92vh);
    overflow: auto;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 26px;
    padding: clamp(20px, 3vw, 30px);
    background:
        radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--lfc-accent) 10%, transparent), transparent 32%),
        var(--lfc-surface);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
}

.lfc-site-modal-panel h2 {
    margin: -4px 44px 0 0;
    color: var(--lfc-text);
    font-size: clamp(24px, 3vw, 34px);
    letter-spacing: 0;
}

.lfc-site-modal-panel > p {
    margin: 0;
    max-width: 620px;
    color: var(--lfc-muted);
    font-size: 14px;
    line-height: 1.5;
}

.lfc-site-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    cursor: pointer;
    font-size: 22px;
    line-height: 1;
}

.lfc-site-modal-close:hover,
.lfc-site-modal-close:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 8%, var(--lfc-surface));
    outline: none;
}

.lfc-site-detail-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
}

.lfc-site-detail-kpis article {
    display: grid;
    gap: 4px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 84%, transparent);
    border-radius: 18px;
    padding: 13px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 76%, var(--lfc-surface));
}

.lfc-site-detail-kpis span {
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 840;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.lfc-site-detail-kpis strong {
    color: var(--lfc-text);
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
}

.lfc-site-detail-body {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}

.lfc-site-detail-body section {
    display: grid;
    gap: 10px;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 96%, var(--lfc-surface-soft));
}

.lfc-site-detail-body h3 {
    margin: 0;
    color: var(--lfc-text);
    font-size: 14px;
    letter-spacing: 0;
}

.lfc-site-detail-list {
    display: grid;
    gap: 9px;
}

.lfc-site-detail-list > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px 10px;
    align-items: center;
}

.lfc-site-detail-list span {
    overflow: hidden;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-site-detail-list strong {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 850;
}

.lfc-site-detail-list i {
    grid-column: 1 / -1;
    height: 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-border) 50%, transparent);
    overflow: hidden;
}

.lfc-site-detail-list i::before {
    display: block;
    width: var(--lfc-site-bar, 0%);
    height: 100%;
    border-radius: inherit;
    background: var(--lfc-accent);
    content: "";
}

.lfc-site-customize-panel {
    width: min(560px, 100%);
}

.lfc-site-customize-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
}

.lfc-site-customize-list label {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--lfc-border);
    border-radius: 14px;
    padding: 11px 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 780;
}

.lfc-site-customize-list input {
    width: 18px;
    height: 18px;
    accent-color: var(--lfc-accent);
}

.lfc-site-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid var(--lfc-border);
    padding-top: 14px;
}

.lfc-chart-line.is-pageviews {
    stroke: #2563eb;
    fill: none !important;
}

.lfc-chart-point.is-pageviews {
    stroke: var(--lfc-surface);
    fill: #2563eb;
}

.lfc-chart-bar.is-pageviews {
    stroke: #2563eb;
    fill: #2563eb;
}

.lfc-chart-line.is-starts {
    stroke: #16a34a;
    fill: none !important;
}

.lfc-chart-point.is-starts {
    stroke: var(--lfc-surface);
    fill: #16a34a;
}

.lfc-chart-bar.is-starts {
    stroke: #16a34a;
    fill: #16a34a;
}

.lfc-chart-line.is-completions {
    stroke: #f59e0b;
    fill: none !important;
}

.lfc-chart-point.is-completions {
    stroke: var(--lfc-surface);
    fill: #f59e0b;
}

.lfc-chart-bar.is-completions {
    stroke: #f59e0b;
    fill: #f59e0b;
}

.lfc-chart-area.is-pageviews {
    color: #2563eb;
}

.lfc-chart-area.is-starts {
    color: #16a34a;
}

.lfc-chart-area.is-completions {
    color: #f59e0b;
}

.lfc-chart-point {
    stroke: var(--lfc-surface);
    stroke-width: 2.4;
    cursor: crosshair;
    opacity: 0.62;
    transition: opacity 150ms ease, r 150ms ease, filter 150ms ease;
    vector-effect: non-scaling-stroke;
}

.lfc-chart-point:hover,
.lfc-chart-point:focus,
.lfc-chart-point.is-hovered {
    opacity: 1;
    filter: drop-shadow(0 6px 9px rgba(15, 23, 42, 0.2));
    outline: none;
}

.lfc-chart-bar {
    cursor: crosshair;
    opacity: 0.86;
    transition: opacity 150ms ease, filter 150ms ease;
}

.lfc-chart-bar:hover,
.lfc-chart-bar:focus,
.lfc-chart-bar.is-hovered {
    opacity: 1;
    filter: drop-shadow(0 9px 12px rgba(15, 23, 42, 0.16));
    outline: none;
}

.lfc-chart-tooltip {
    position: absolute;
    z-index: 3;
    min-width: 138px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 72%, transparent);
    border-radius: 14px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--lfc-surface) 94%, #fff);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16);
    color: var(--lfc-text);
    font-size: 12px;
    font-weight: 760;
    line-height: 1.35;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -110%);
    transition: opacity 120ms ease;
}

.lfc-chart-tooltip.is-visible {
    opacity: 1;
}

.lfc-chart-tooltip strong {
    display: block;
    margin-bottom: 3px;
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-chart-tooltip span {
    display: block;
    color: var(--lfc-muted);
}

.lfc-chart-empty {
    display: grid;
    place-items: center;
    min-height: 240px;
    border: 1px dashed var(--lfc-border-strong);
    border-radius: 18px;
    padding: 24px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    text-align: center;
}

.lfc-chart-empty strong {
    color: var(--lfc-text);
}

.lfc-webhooks-view {
    gap: 16px;
}

.lfc-webhook-kpis {
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
}

.lfc-webhook-builder {
    display: grid;
    gap: 16px;
}

.lfc-webhook-form-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
}

.lfc-webhook-safe-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: 16px;
    padding: 13px 14px;
    background: color-mix(in srgb, var(--lfc-accent) 6%, var(--lfc-surface-soft));
}

.lfc-webhook-safe-note strong {
    flex: 0 0 auto;
    color: var(--lfc-text);
    font-size: 13px;
}

.lfc-webhook-safe-note span {
    color: var(--lfc-muted);
    font-size: 13px;
    line-height: 1.45;
}

.lfc-webhook-list {
    gap: 10px;
}

.lfc-webhook-row {
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 82%, transparent);
    background: color-mix(in srgb, var(--lfc-surface) 94%, var(--lfc-surface-soft));
}

.lfc-webhook-main {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.lfc-webhook-main h3 {
    margin: 0;
}

.lfc-webhook-main p {
    overflow: hidden;
    max-width: min(680px, 58vw);
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-webhook-log-card {
    display: grid;
    gap: 12px;
}

.lfc-webhook-empty-log {
    min-height: 150px;
}

.lfc-warnings-view {
    gap: 16px;
}

.lfc-warning-kpis {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

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

.lfc-warning-rule-card {
    display: grid;
    gap: 7px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 14px;
    background: var(--lfc-surface);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-warning-rule-card strong {
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 880;
}

.lfc-warning-rule-card span {
    color: var(--lfc-muted);
    font-size: 13px;
    line-height: 1.45;
}

.lfc-warning-settings {
    padding: 0;
}

.lfc-warning-settings summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px;
    cursor: pointer;
    list-style: none;
}

.lfc-warning-settings summary::-webkit-details-marker {
    display: none;
}

.lfc-warning-settings summary span {
    display: grid;
    gap: 4px;
}

.lfc-warning-settings summary strong {
    color: var(--lfc-text);
    font-size: 16px;
}

.lfc-warning-settings summary em {
    color: var(--lfc-muted);
    font-size: 13px;
    font-style: normal;
}

.lfc-warning-settings summary b {
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 7px 11px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
}

.lfc-warning-form {
    border-top: 1px solid var(--lfc-border);
    padding: 18px;
}

.lfc-warning-health {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.lfc-warning-health .lfc-card {
    display: grid;
    gap: 6px;
}

.lfc-warning-health span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.lfc-warning-health strong {
    color: var(--lfc-text);
    font-size: 17px;
}

.lfc-warning-health p {
    margin: 0;
    color: var(--lfc-muted);
}

.lfc-warning-error {
    border-color: color-mix(in srgb, var(--lfc-danger) 36%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger-soft) 52%, var(--lfc-surface));
}

.lfc-warning-row {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 82%, transparent);
    background: var(--lfc-surface);
}

.lfc-funnel-stage,
.lfc-bar-row {
    display: grid;
    gap: 8px;
    border-top: 1px solid var(--lfc-border);
    padding: 12px 0;
}

.lfc-funnel-stage:first-of-type,
.lfc-bar-row:first-of-type {
    border-top: 0;
}

.lfc-funnel-stage > div,
.lfc-bar-row > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.lfc-funnel-stage strong,
.lfc-bar-row strong {
    color: var(--lfc-text);
    font-size: 14px;
}

.lfc-funnel-stage span,
.lfc-bar-row span,
.lfc-bar-row small {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 720;
}

.lfc-funnel-stage em,
.lfc-bar-row em {
    display: block;
    width: 100%;
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--lfc-surface-soft);
}

.lfc-funnel-stage em::before,
.lfc-bar-row em::before {
    display: block;
    width: var(--lfc-bar, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--lfc-accent), color-mix(in srgb, var(--lfc-accent) 65%, #16a34a));
    content: "";
}

.lfc-bar-list {
    display: grid;
    align-content: start;
}

.lfc-bar-row small {
    margin-left: 8px;
}

@media (max-width: 1080px) {
    .lfc-analytics-filter-grid {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }

    .lfc-analytics-main {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .lfc-analytics-filter-panel summary {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-filter-button {
        width: fit-content;
    }

    .lfc-analytics-filter-grid {
        grid-template-columns: 1fr;
    }

    .lfc-filter-actions,
    .lfc-funnel-stage > div,
    .lfc-bar-row > div {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-line-chart {
        height: 180px;
    }

    .lfc-card-head {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-chart-mode-toggle {
        width: fit-content;
    }

    .lfc-premium-chart {
        height: 230px;
    }

    .lfc-webhook-form-grid {
        grid-template-columns: 1fr;
    }

    .lfc-webhook-row {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-webhook-main p {
        max-width: 100%;
        white-space: normal;
    }

    .lfc-warning-settings summary,
    .lfc-warning-row {
        align-items: stretch;
        flex-direction: column;
    }
}

.lfc-empty {
    border: 1px dashed var(--lfc-border-strong);
    border-radius: var(--lfc-radius);
    margin: 0;
    padding: 22px;
    color: var(--lfc-muted);
    text-align: center;
}

.lfc-editor-shell {
    display: grid;
    gap: 16px;
}

.lfc-designer-shell {
    --lfc-radius: 10px;
    --lfc-radius-lg: 14px;
}

.lfc-designer-hero {
    padding: clamp(18px, 2.4vw, 28px);
}

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

.lfc-designer-primary-form,
.lfc-designer-step {
    display: grid;
    gap: 16px;
}

.lfc-designer-step[hidden] {
    display: none !important;
}

.lfc-designer-section-intro {
    background: color-mix(in srgb, var(--lfc-surface) 94%, transparent);
}

.lfc-designer-subhead {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: var(--lfc-radius-lg);
    padding: 16px 18px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 74%, transparent);
}

.lfc-designer-summary code {
    color: var(--lfc-accent-dark-2);
}

.lfc-publication-card,
.lfc-publication-result {
    display: grid;
    gap: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 18px;
    background: color-mix(in srgb, var(--lfc-surface) 92%, var(--lfc-bg));
}

.lfc-publication-result {
    border-color: color-mix(in srgb, #16a34a 28%, var(--lfc-border));
    background: color-mix(in srgb, #dcfce7 32%, var(--lfc-surface));
}

.lfc-action-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.lfc-segmented-nav {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 6px;
    background: color-mix(in srgb, var(--lfc-surface) 88%, var(--lfc-bg));
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-segmented-nav a {
    flex: 0 0 auto;
    border-radius: 7px;
    padding: 9px 12px;
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 760;
    text-decoration: none;
}

.lfc-segmented-nav a:hover {
    background: var(--lfc-hover);
    color: var(--lfc-accent-dark);
}

.lfc-segmented-nav a[aria-current="page"] {
    background: var(--lfc-surface);
    color: var(--lfc-accent-dark-2);
    box-shadow: 0 8px 18px rgba(15, 33, 62, 0.08);
}

.lfc-form-card {
    display: grid;
    gap: 16px;
}

.lfc-form-head h3,
.lfc-field-card h4 {
    margin: 0 0 5px;
    color: var(--lfc-text);
    font-size: 17px;
}

.lfc-form-head p {
    margin: 0;
    color: var(--lfc-muted);
}

.lfc-form-hint {
    margin-top: 8px !important;
    color: var(--lfc-muted) !important;
    font-size: 12px;
    font-weight: 650;
}

.lfc-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 13px;
}

.lfc-form-grid-compact {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.lfc-wide {
    grid-column: 1 / -1;
}

.lfc-check-row {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    min-height: 42px;
    gap: 9px;
}

.lfc-check-row input {
    width: auto;
    min-height: auto;
}

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

.lfc-step-card,
.lfc-field-card {
    display: grid;
    gap: 13px;
}

.lfc-field-card {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    margin-top: 12px;
    padding: 14px;
    background: var(--lfc-surface-soft);
}

.lfc-field-card-new {
    background: color-mix(in srgb, var(--lfc-accent-light) 44%, var(--lfc-surface));
}

.lfc-field-delete {
    margin-top: 8px;
}

.lfc-variant-list {
    display: grid;
    gap: 12px;
}

.lfc-rule-condition {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(150px, 0.8fr) minmax(180px, 1.2fr);
    gap: 10px;
    margin-top: 9px;
}

.lfc-danger-zone {
    border-color: color-mix(in srgb, var(--lfc-danger) 30%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-danger-soft) 54%, var(--lfc-surface));
}

.lfc-create-shell {
    display: grid;
    gap: 16px;
    max-width: 920px;
}

.lfc-create-shell:has(.lfc-wizard) {
    max-width: 1120px;
}

.lfc-create-hero {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 54%, transparent);
    border-radius: 28px;
    padding: clamp(20px, 2.4vw, 28px);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent-light) 44%, transparent), transparent 42%),
        color-mix(in srgb, var(--lfc-surface) 89%, transparent);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--lfc-text) 5%, transparent);
}

.lfc-create-hero h3 {
    max-width: 620px;
    margin: 0 0 7px;
    color: var(--lfc-text);
    font-size: clamp(25px, 2.5vw, 34px);
    font-weight: 860;
    letter-spacing: 0;
    line-height: 1.08;
}

.lfc-create-hero p:not(.lfc-kicker) {
    max-width: 760px;
    margin: 0;
    color: var(--lfc-muted);
    font-size: 14px;
    line-height: 1.55;
}

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

.lfc-template-grid {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.lfc-choice-card,
.lfc-template-card {
    display: grid;
    align-content: start;
    gap: 9px;
    min-height: 176px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 58%, transparent);
    border-radius: 24px;
    padding: 18px;
    color: var(--lfc-text);
    text-decoration: none;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 94%, transparent), color-mix(in srgb, var(--lfc-surface-soft) 58%, transparent)),
        color-mix(in srgb, var(--lfc-surface) 92%, transparent);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lfc-text) 4%, transparent);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.lfc-choice-card:hover,
.lfc-template-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--lfc-text) 7%, transparent);
}

.lfc-choice-card span,
.lfc-template-card small {
    justify-self: start;
    min-height: 26px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: 999px;
    padding: 4px 9px;
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-accent-light) 74%, transparent);
    font-size: 12px;
    font-weight: 780;
    line-height: 1.15;
}

.lfc-choice-card strong,
.lfc-template-card strong {
    color: var(--lfc-text);
    font-size: 17px;
    font-weight: 820;
    line-height: 1.2;
}

.lfc-choice-card p,
.lfc-template-card p {
    margin: 0;
    color: var(--lfc-muted);
    font-size: 14px;
    line-height: 1.48;
}

.lfc-choice-card small {
    display: block;
    max-width: 34ch;
    color: color-mix(in srgb, var(--lfc-muted) 88%, var(--lfc-text));
    font-size: 12px;
    font-weight: 690;
    line-height: 1.42;
}

.lfc-create-guidance {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 62%, transparent);
    border-radius: 26px;
    padding: clamp(16px, 2vw, 22px);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent-light) 32%, transparent), transparent 45%),
        color-mix(in srgb, var(--lfc-surface) 92%, transparent);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--lfc-text) 5%, transparent);
}

.lfc-create-type-mark,
.lfc-template-icon,
.lfc-step-task-head > span {
    display: inline-grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent-light) 64%, var(--lfc-surface));
    color: var(--lfc-accent-dark-2);
}

.lfc-create-type-mark {
    width: 56px;
    height: 56px;
    border-radius: 18px;
}

.lfc-create-type-mark svg,
.lfc-create-guide-summary svg,
.lfc-guided-progress svg,
.lfc-template-icon svg,
.lfc-step-task-head svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lfc-create-type-mark svg {
    width: 25px;
    height: 25px;
}

.lfc-create-type-copy {
    min-width: 0;
}

.lfc-create-type-copy h3 {
    margin: 2px 0 5px;
    color: var(--lfc-text);
    font-size: clamp(24px, 2.15vw, 32px);
    font-weight: 870;
    line-height: 1.08;
}

.lfc-create-type-copy p:not(.lfc-kicker) {
    max-width: 58ch;
    margin: 0;
    color: var(--lfc-muted);
    font-size: 13px;
    line-height: 1.5;
}

.lfc-create-guide-summary {
    display: grid;
    justify-items: start;
    gap: 5px;
}

.lfc-create-guide-summary span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 70%, transparent);
    border-radius: 14px;
    padding: 8px 10px;
    color: var(--lfc-muted);
    background: color-mix(in srgb, var(--lfc-surface-soft) 74%, transparent);
    font-size: 12px;
    font-weight: 810;
}

.lfc-create-guide-summary span {
    border-color: color-mix(in srgb, var(--lfc-accent) 28%, var(--lfc-border));
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-accent-light) 50%, var(--lfc-surface));
}

.lfc-create-guide-summary strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-create-guide-summary small {
    margin-left: 3px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 680;
}

.lfc-template-icon {
    width: 36px;
    height: 36px;
    border-radius: 13px;
}

.lfc-wizard {
    display: grid;
    gap: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: 28px;
    padding: clamp(14px, 2vw, 20px);
    background: color-mix(in srgb, var(--lfc-surface) 94%, transparent);
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-wizard-progress {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 8px;
}

.lfc-wizard-progress button {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-height: 44px;
    border: 1px solid var(--lfc-border);
    border-radius: 12px;
    padding: 8px 10px;
    color: var(--lfc-muted);
    background: var(--lfc-surface-soft);
    font-size: 13px;
    font-weight: 740;
}

.lfc-wizard-progress button span {
    display: inline-grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border-radius: 999px;
    color: var(--lfc-accent-dark-2);
    background: var(--lfc-accent-light);
}

.lfc-wizard-progress button[aria-current="step"] {
    border-color: var(--lfc-accent-light-2);
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-accent-light) 58%, var(--lfc-surface));
    box-shadow: 0 12px 28px rgba(37, 99, 235, 0.12);
}

.lfc-guided-progress {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lfc-guided-progress button {
    min-height: 52px;
    border-radius: 16px;
    padding: 10px 12px;
}

.lfc-guided-progress button strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-guided-progress button .lfc-step-icon {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    color: currentColor;
    background: color-mix(in srgb, var(--lfc-surface) 82%, transparent);
}

.lfc-guided-progress button[aria-current="step"] .lfc-step-icon {
    background: var(--lfc-surface);
}

.lfc-wizard-step {
    display: grid;
    gap: 14px;
    min-height: 260px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 24px;
    padding: clamp(15px, 1.8vw, 20px);
    background: var(--lfc-surface);
}

.lfc-wizard-step[hidden] {
    display: none;
}

.lfc-step-task-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 720px;
}

.lfc-step-task-head > span {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 14px;
}

.lfc-step-task-head h3 {
    margin-bottom: 3px;
    font-size: 18px;
    font-weight: 860;
}

.lfc-step-task-head p {
    max-width: 58ch;
    font-size: 13px;
    line-height: 1.45;
}

.lfc-design-lab {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    gap: 16px;
    align-items: start;
}

.lfc-design-controls {
    display: grid;
    gap: 10px;
}

.lfc-config-mode-switch,
.lfc-preview-mode-switch {
    display: inline-grid;
    grid-auto-flow: column;
    gap: 4px;
    justify-self: start;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 4px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 72%, var(--lfc-surface));
}

.lfc-config-mode-switch button,
.lfc-preview-mode-switch button {
    min-height: 34px;
    border: 0;
    border-radius: 10px;
    padding: 7px 12px;
    color: var(--lfc-muted);
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 780;
}

.lfc-config-mode-switch button.is-active,
.lfc-preview-mode-switch button.is-active {
    color: var(--lfc-accent-dark-2);
    background: var(--lfc-surface);
    box-shadow: 0 8px 18px rgba(15, 33, 62, 0.08);
}

.lfc-quick-config,
.lfc-pro-config {
    display: grid;
    gap: 12px;
}

.lfc-design-lab-wizard[data-lfc-config-mode="quick"] .lfc-pro-config,
.lfc-design-lab-wizard[data-lfc-config-mode="pro"] .lfc-quick-config {
    display: none;
}

.lfc-quick-card {
    display: grid;
    gap: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 16px;
    background: var(--lfc-surface-soft);
}

.lfc-quick-color-row {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.lfc-quick-color-row > input[type="color"] {
    width: 76px;
    min-height: 54px;
    border-radius: 14px;
}

.lfc-quick-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lfc-quick-swatches button {
    width: 34px;
    height: 34px;
    border: 1px solid color-mix(in srgb, var(--lfc-border-strong) 78%, transparent);
    border-radius: 10px;
    background: var(--lfc-swatch);
    cursor: pointer;
    box-shadow: inset 0 0 0 2px color-mix(in srgb, #fff 54%, transparent);
}

.lfc-quick-swatches button span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.lfc-quick-style-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.lfc-quick-style-head h4 {
    margin: 0 0 4px;
}

.lfc-quick-style-head p {
    margin: 0;
    color: var(--lfc-muted);
}

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

.lfc-quick-style-card {
    display: grid;
    gap: 6px;
    min-height: 116px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 14px;
    color: var(--lfc-text);
    text-align: left;
    background: var(--lfc-surface);
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.lfc-quick-style-card:hover,
.lfc-quick-style-card.is-selected {
    transform: translateY(-1px);
    border-color: var(--lfc-accent-light-2);
    box-shadow: 0 0 0 4px var(--lfc-focus);
}

.lfc-quick-style-card strong {
    font-size: 14px;
}

.lfc-quick-style-card span {
    color: var(--lfc-muted);
    font-size: 12px;
    line-height: 1.45;
}

.lfc-pro-link {
    justify-self: start;
    border: 0;
    padding: 0;
    color: var(--lfc-accent-dark);
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 780;
}

.lfc-design-controls details {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface-soft);
    overflow: visible;
}

.lfc-design-controls summary {
    cursor: pointer;
    padding: 14px 16px;
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 780;
    list-style: none;
}

.lfc-design-controls summary::-webkit-details-marker {
    display: none;
}

.lfc-design-controls details[open] summary {
    border-bottom: 1px solid var(--lfc-border);
    background: color-mix(in srgb, var(--lfc-accent-light) 34%, transparent);
}

.lfc-design-controls details > .lfc-form-grid {
    padding: 14px;
}

.lfc-pro-option {
    position: relative;
}

.lfc-pro-option.is-style-focused {
    border-radius: 12px;
    outline: 3px solid var(--lfc-focus);
    outline-offset: 4px;
}

.lfc-info-button {
    display: inline-grid;
    width: 18px;
    height: 18px;
    place-items: center;
    margin-left: 6px;
    border: 1px solid var(--lfc-border-strong);
    border-radius: 999px;
    padding: 0;
    color: var(--lfc-muted);
    background: var(--lfc-surface);
    cursor: help;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
}

.lfc-info-button:hover::after,
.lfc-info-button:focus-visible::after {
    content: attr(data-lfc-info);
    position: absolute;
    z-index: 20;
    left: 0;
    top: calc(100% + 8px);
    width: min(260px, 70vw);
    border: 1px solid var(--lfc-border);
    border-radius: 12px;
    padding: 10px 12px;
    color: var(--lfc-text);
    background: var(--lfc-surface-raised);
    box-shadow: var(--lfc-shadow-soft);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.45;
    text-transform: none;
}

.lfc-design-controls details:not(.is-expanded) .lfc-form-grid > label:nth-of-type(n+4) {
    display: none !important;
}

.lfc-pro-more {
    margin: 0 14px 14px;
    border: 0;
    padding: 0;
    color: var(--lfc-accent-dark);
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 780;
}

.lfc-form-grid input[type="color"] {
    min-height: 44px;
    padding: 5px;
}

.lfc-style-preview {
    --lf-preview-primary: #2563eb;
    --lf-preview-primary-hover: #1d4ed8;
    --lf-preview-secondary: #dbeafe;
    --lf-preview-background: #f8fafc;
    --lf-preview-panel: #ffffff;
    --lf-preview-gradient: #eff6ff;
    --lf-preview-text: #0f172a;
    --lf-preview-muted: #64748b;
    --lf-preview-radius: 20px;
    --lf-preview-button-radius: 14px;
    --lf-preview-input-radius: 12px;
    --lf-preview-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    --lf-preview-button-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    --lf-preview-input-shadow: none;
    --lf-preview-border: #dbe4f0;
    --lf-preview-border-width: 1px;
    --lf-preview-button-text: #ffffff;
    --lf-preview-input-bg: #ffffff;
    --lf-preview-input-border: #cbd5e1;
    --lf-preview-input-text: #0f172a;
    --lf-preview-placeholder: #94a3b8;
    --lf-preview-progress-bg: #e5e7eb;
    --lf-preview-progress-fill: #2563eb;
    --lf-preview-progress-height: 8px;
    --lf-preview-progress-radius: 999px;
    --lf-preview-headline-size: 28px;
    --lf-preview-body-size: 16px;
    --lf-preview-field-size: 15px;
    --lf-preview-button-size: 15px;
    --lf-preview-focus: #2563eb;
    position: sticky;
    top: 16px;
    display: grid;
    gap: 12px;
    border: var(--lf-preview-border-width) solid var(--lf-preview-border);
    border-radius: var(--lf-preview-radius);
    padding: 18px;
    color: var(--lf-preview-text);
    background: var(--lf-preview-panel);
    box-shadow: var(--lf-preview-shadow);
    overflow: hidden;
}

.lfc-style-preview.has-gradient {
    background: linear-gradient(135deg, var(--lf-preview-panel), var(--lf-preview-gradient));
}

.lfc-style-preview.has-soft-glow::before {
    content: "";
    position: absolute;
    inset: -70px -90px auto auto;
    width: 190px;
    height: 190px;
    border-radius: 999px;
    background: radial-gradient(circle, color-mix(in srgb, var(--lf-preview-primary) 24%, transparent), transparent 64%);
    pointer-events: none;
}

.lfc-style-preview > * {
    position: relative;
    z-index: 1;
}

.lfc-style-preview-kicker {
    color: var(--lf-preview-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

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

.lfc-style-preview h4 {
    margin: 0;
    color: var(--lf-preview-text);
    font-size: var(--lf-preview-headline-size);
    line-height: 1.08;
}

.lfc-style-preview p {
    margin: 0;
    color: var(--lf-preview-muted);
    font-size: var(--lf-preview-body-size);
    line-height: 1.5;
}

.lfc-style-preview label {
    display: grid;
    gap: 6px;
    color: var(--lf-preview-text);
    font-size: var(--lf-preview-field-size);
    font-weight: 700;
}

.lfc-style-preview input,
.lfc-style-preview select,
.lfc-style-preview textarea {
    min-height: 42px;
    border: 1px solid var(--lf-preview-input-border);
    border-radius: var(--lf-preview-input-radius);
    padding: 10px 12px;
    color: var(--lf-preview-input-text);
    background: var(--lf-preview-input-bg);
    box-shadow: var(--lf-preview-input-shadow);
    font: inherit;
}

.lfc-style-preview textarea {
    resize: none;
}

.lfc-style-preview input::placeholder,
.lfc-style-preview textarea::placeholder {
    color: var(--lf-preview-placeholder);
}

.lfc-style-preview button:not([data-lfc-preview-mode]) {
    min-height: 42px;
    border: 0;
    border-radius: var(--lf-preview-button-radius);
    padding: 10px 14px;
    color: var(--lf-preview-button-text);
    background: var(--lf-preview-primary);
    box-shadow: var(--lf-preview-button-shadow);
    font-size: var(--lf-preview-button-size);
    font-weight: 800;
}

.lfc-style-preview button:not([data-lfc-preview-mode]):hover {
    background: var(--lf-preview-primary-hover);
}

.lfc-preview-progress {
    height: var(--lf-preview-progress-height);
    overflow: hidden;
    border-radius: var(--lf-preview-progress-radius);
    background: var(--lf-preview-progress-bg);
}

.lfc-preview-progress span {
    display: block;
    width: 58%;
    height: 100%;
    border-radius: inherit;
    background: var(--lf-preview-progress-fill);
}

.lfc-preview-area {
    border-radius: calc(var(--lf-preview-radius) + 10px);
    padding: 10px;
    background: color-mix(in srgb, var(--lf-preview-background) 84%, var(--lf-preview-secondary));
}

.lfc-preview-card-outline {
    display: grid;
    gap: 12px;
}

.lfc-preview-detail-fields {
    display: none;
    gap: 12px;
}

.lfc-style-preview[data-lfc-preview-view="detailed"] .lfc-preview-detail-fields {
    display: grid;
}

.lfc-preview-choice-row {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--lf-preview-text);
    font-size: var(--lf-preview-field-size);
    font-weight: 700;
}

.lfc-preview-choice-row span {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid var(--lf-preview-input-border);
    border-radius: 6px;
    background: var(--lf-preview-input-bg);
}

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

.lfc-preview-image-options span {
    min-height: 54px;
    border: 1px solid var(--lf-preview-input-border);
    border-radius: var(--lf-preview-input-radius);
    padding: 10px;
    color: var(--lf-preview-text);
    background:
        radial-gradient(circle at 22% 22%, color-mix(in srgb, var(--lf-preview-primary) 22%, transparent), transparent 30%),
        var(--lf-preview-input-bg);
    font-size: 13px;
    font-weight: 780;
}

.lfc-style-preview [data-lfc-preview-part] {
    transition: outline-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.lfc-style-preview [data-lfc-preview-part]:hover,
.lfc-style-preview [data-lfc-preview-part]:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--lf-preview-focus) 42%, transparent);
    outline-offset: 3px;
    cursor: pointer;
}

.live-funnel-control-app [data-lfc-edit-target] {
    position: relative;
    cursor: pointer;
    transition: box-shadow 160ms ease, outline-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.live-funnel-control-app [data-lfc-edit-target]:hover,
.live-funnel-control-app [data-lfc-edit-target]:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--lfc-accent) 24%, transparent);
    outline-offset: 4px;
    box-shadow: 0 10px 26px color-mix(in srgb, var(--lfc-accent) 10%, transparent);
}

.live-funnel-control-app [data-lfc-edit-target]::after {
    content: attr(data-lfc-edit-label);
    position: absolute;
    z-index: 8;
    right: 0;
    bottom: calc(100% + 8px);
    max-width: min(220px, 70vw);
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 18%, var(--lfc-border));
    border-radius: 999px;
    padding: 5px 9px;
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-surface) 94%, transparent);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--lfc-text) 8%, transparent);
    font-size: 11px;
    font-weight: 780;
    line-height: 1;
    opacity: 0;
    pointer-events: none;
    transform: translateY(3px);
    transition: opacity 140ms ease, transform 140ms ease;
    white-space: nowrap;
}

.live-funnel-control-app [data-lfc-edit-target]:hover::after,
.live-funnel-control-app [data-lfc-edit-target]:focus-visible::after,
.live-funnel-control-app [data-lfc-edit-target].is-preview-edit-selected::after {
    opacity: 1;
    transform: translateY(0);
}

.live-funnel-control-app [data-lfc-edit-target].is-preview-edit-selected {
    outline: 2px solid color-mix(in srgb, var(--lfc-accent) 34%, transparent);
    outline-offset: 4px;
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--lfc-accent-light) 48%, transparent);
}

.lfc-preview-edit-hint {
    position: sticky;
    right: 18px;
    bottom: 18px;
    z-index: 20;
    justify-self: end;
    max-width: min(320px, 100%);
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 20%, var(--lfc-border));
    border-radius: 999px;
    padding: 9px 13px;
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-surface-raised) 94%, transparent);
    box-shadow: var(--lfc-shadow-soft);
    font-size: 13px;
    font-weight: 760;
}

.lfc-preview-edit-hint[hidden] {
    display: none;
}

.live-funnel-control-app .is-inline-edit-target {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border)) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--lfc-accent-light) 50%, transparent) !important;
}

.lfc-style-editor-head {
    margin-top: 16px;
}

.lfc-content-builder {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    gap: 16px;
    align-items: start;
}

.lfc-content-builder-controls {
    display: grid;
    grid-column: 1;
    min-width: 0;
    gap: 16px;
}

.lfc-builder-card,
.lfc-builder-page-card,
.lfc-builder-custom-field {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface-soft);
    box-shadow: 0 12px 30px rgba(15, 33, 62, 0.06);
}

.lfc-builder-card,
.lfc-builder-page-card {
    padding: clamp(16px, 2vw, 20px);
}

.lfc-content-builder > .lfc-content-preview-card {
    position: sticky;
    top: 16px;
    grid-column: 2;
    grid-row: 1;
    max-height: calc(100vh - 32px);
    overflow: auto;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.lfc-builder-page-head,
.lfc-builder-custom-field-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.lfc-builder-page-head span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 840;
    letter-spacing: 0;
    text-transform: uppercase;
}

.live-funnel-control-preview-root {
    max-width: 100%;
    margin: 0;
}

.live-funnel-control-preview-root [data-lfc-focus-target] {
    border-radius: 10px;
    cursor: pointer;
}

.live-funnel-control-preview-root [data-lfc-focus-target]:hover,
.live-funnel-control-preview-root [data-lfc-focus-target]:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--lf-input-focus, var(--lf-primary, #2563eb)) 42%, transparent);
    outline-offset: 3px;
}

.live-funnel-control-preview-root input,
.live-funnel-control-preview-root select,
.live-funnel-control-preview-root textarea {
    pointer-events: none;
}

.live-funnel-control-preview-root [data-lfc-content-preview-fields] input,
.live-funnel-control-preview-root [data-lfc-content-preview-fields] select,
.live-funnel-control-preview-root [data-lfc-content-preview-fields] textarea {
    pointer-events: auto;
}

.live-funnel-control-preview-root [data-lfc-content-preview-fields] {
    display: grid;
    gap: var(--lf-field-gap);
}

.live-funnel-control-preview-root [data-lfc-preview-edit-image] {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.live-funnel-control-preview-root [data-lfc-preview-edit-image]::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: color-mix(in srgb, var(--lf-primary, #2563eb) 10%, transparent);
    opacity: 0;
    transition: opacity 160ms ease;
    pointer-events: none;
}

.live-funnel-control-preview-root [data-lfc-preview-edit-image]:hover,
.live-funnel-control-preview-root [data-lfc-preview-edit-image]:focus-visible {
    border-color: color-mix(in srgb, var(--lf-primary, #2563eb) 52%, var(--lf-input-border, #cbd5e1));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--lf-primary, #2563eb) 14%, transparent);
}

.live-funnel-control-preview-root [data-lfc-preview-edit-image]:hover::before,
.live-funnel-control-preview-root [data-lfc-preview-edit-image]:focus-visible::before {
    opacity: 1;
}

.lfc-preview-image-edit-overlay {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(15, 23, 42, 0.72);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
    font-size: 11px;
    font-weight: 780;
    line-height: 1;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 160ms ease, transform 160ms ease;
    pointer-events: none;
}

.live-funnel-control-preview-root [data-lfc-preview-edit-image]:hover .lfc-preview-image-edit-overlay,
.live-funnel-control-preview-root [data-lfc-preview-edit-image]:focus-visible .lfc-preview-image-edit-overlay {
    opacity: 1;
    transform: translateY(0);
}

.live-funnel-control-preview-root [data-lfc-content-preview-fields]:empty {
    display: none;
}

.live-funnel-preview-empty {
    grid-column: 1 / -1;
    border: 1px dashed var(--lf-border);
    border-radius: var(--lf-input-radius);
    padding: 14px;
    color: var(--lf-muted);
    background: color-mix(in srgb, var(--lf-bg) 84%, var(--lf-primary) 6%);
    font-size: 13px;
    font-weight: 700;
}

.live-funnel-control-preview-root .live-funnel-success {
    margin-top: var(--lf-field-gap);
}

.live-funnel-control-preview-root .live-funnel-success--card {
    margin-top: 0;
}

.lfc-content-preview-note {
    margin: 10px 0 0;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.45;
}

.lfc-preview-test-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    padding: 8px 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 74%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-surface) 88%, var(--lfc-accent) 6%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.lfc-preview-test-nav[hidden] {
    display: none !important;
}

.lfc-preview-test-nav > span {
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 760;
    letter-spacing: 0;
    white-space: nowrap;
}

.lfc-preview-test-nav > div {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.lfc-preview-test-nav button {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 82%, transparent);
    border-radius: 999px;
    padding: 7px 11px;
    background: color-mix(in srgb, var(--lfc-surface) 92%, #ffffff 8%);
    color: var(--lfc-text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 820;
    line-height: 1;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.lfc-preview-test-nav button:hover:not(:disabled),
.lfc-preview-test-nav button:focus-visible:not(:disabled) {
    border-color: color-mix(in srgb, var(--lfc-accent) 36%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 12%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    outline: none;
    transform: translateY(-1px);
}

.lfc-preview-test-nav button:disabled {
    cursor: default;
    opacity: 0.42;
}

.lfc-builder-card {
    display: grid;
    gap: 14px;
}

.lfc-content-hidden-fields {
    display: none !important;
}

.lfc-fullpage-question-mode .lfc-page-editor-nav,
.lfc-fullpage-question-mode .lfc-page-editor-actions {
    display: none;
}

.lfc-fullpage-question-mode .lfc-builder-field-layout {
    display: none;
}

.lfc-fullpage-question-mode .lfc-builder-page-head label {
    display: none;
}

.lfc-fullpage-legacy-social-panel {
    display: none !important;
}

.lfc-fullpage-question-mode .lfc-builder-page-card:not(.lfc-builder-success-page) {
    display: none !important;
}

.lfc-fullpage-create-v2 .lfc-fullpage-optional-control,
.lfc-fullpage-edit-v2 .lfc-fullpage-optional-control,
.lfc-fullpage-create-v2 .lfc-fullpage-advanced,
.lfc-fullpage-edit-v2 .lfc-fullpage-advanced {
    display: none !important;
}

.lfc-fullpage-question-mode.is-success-editor-active .lfc-fullpage-simple-questions {
    display: none;
}

.lfc-fullpage-simple-questions {
    gap: 18px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 96%, var(--lfc-accent) 4%), var(--lfc-surface));
}

.lfc-simple-builder-head,
.lfc-simple-contact-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.lfc-simple-builder-head h4,
.lfc-simple-contact-head h5 {
    margin: 0;
    color: var(--lfc-text);
    font-size: 18px;
    font-weight: 880;
    letter-spacing: 0;
}

.lfc-simple-builder-head p,
.lfc-simple-contact-head p {
    margin: 4px 0 0;
    color: var(--lfc-muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
}

.lfc-simple-question-list {
    display: grid;
    gap: 10px;
}

.lfc-simple-question-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 86px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 88%, transparent);
    border-radius: 18px;
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 96%, #fff 4%);
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.06);
    cursor: pointer;
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.lfc-simple-question-card:hover,
.lfc-simple-question-card.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 44%, var(--lfc-border));
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.09);
    transform: translateY(-1px);
}

.lfc-simple-question-number {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-accent) 12%, var(--lfc-surface));
    color: var(--lfc-accent);
    font-size: 15px;
    font-weight: 900;
}

.lfc-simple-question-body {
    min-width: 0;
}

.lfc-simple-question-body strong,
.lfc-simple-question-body small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-simple-question-body strong {
    color: var(--lfc-text);
    font-size: 16px;
    font-weight: 880;
}

.lfc-simple-question-body small {
    margin-top: 3px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
}

.lfc-simple-question-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.lfc-simple-question-badges span {
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 3px 8px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 11px;
    font-weight: 820;
}

.lfc-simple-question-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.lfc-simple-contact-block {
    display: grid;
    gap: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    padding: 16px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 78%, var(--lfc-surface) 22%);
}

.lfc-simple-contact-head {
    justify-content: flex-start;
}

.lfc-simple-contact-head > span {
    display: grid;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--lfc-accent) 13%, var(--lfc-surface));
    color: var(--lfc-accent);
    font-weight: 900;
}

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

.lfc-simple-contact-card {
    display: grid;
    gap: 10px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 12px;
    background: var(--lfc-surface);
}

.lfc-simple-contact-card.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 40%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 7%, var(--lfc-surface));
}

.lfc-simple-contact-card > button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--lfc-text);
    font: inherit;
    font-weight: 850;
    text-align: left;
    cursor: pointer;
}

.lfc-simple-contact-card > button > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-accent);
    font-weight: 900;
}

.lfc-simple-required-toggle,
.lfc-simple-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: max-content;
    max-width: 100%;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 8px 11px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
}

.lfc-simple-required-toggle input,
.lfc-simple-toggle input {
    width: 34px;
    height: 20px;
    min-width: 34px;
    appearance: none;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lfc-muted) 28%, var(--lfc-surface));
    cursor: pointer;
}

.lfc-simple-required-toggle input::before,
.lfc-simple-toggle input::before {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    margin: 2px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 7px rgba(15, 23, 42, 0.2);
    transition: transform .16s ease;
}

.lfc-simple-required-toggle input:checked,
.lfc-simple-toggle input:checked {
    background: var(--lfc-accent);
}

.lfc-simple-required-toggle input:checked::before,
.lfc-simple-toggle input:checked::before {
    transform: translateX(14px);
}

.lfc-simple-required-toggle input:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.lfc-fullpage-question-sheet {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(15, 23, 42, 0.46);
    backdrop-filter: blur(8px);
}

.lfc-fullpage-question-sheet[hidden] {
    display: none !important;
}

.lfc-fullpage-question-sheet-panel {
    display: grid;
    gap: 16px;
    width: min(720px, 100%);
    max-height: min(780px, calc(100vh - 36px));
    overflow: auto;
    border: 1px solid var(--lfc-border);
    border-radius: 22px;
    padding: 18px;
    background: var(--lfc-surface);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.26);
}

.lfc-simple-sheet-body {
    display: grid;
    gap: 14px;
}

.lfc-simple-sheet-body label,
.lfc-simple-thanks-form label {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.lfc-simple-sheet-body input,
.lfc-simple-sheet-body textarea,
.lfc-simple-sheet-body select,
.lfc-simple-thanks-form input,
.lfc-simple-thanks-form textarea,
.lfc-simple-thanks-form select {
    width: 100%;
    min-width: 0;
}

.lfc-simple-question-field input {
    min-height: 52px;
    font-size: 17px;
    font-weight: 760;
}

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

.lfc-simple-answer-types button {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 64px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.lfc-simple-answer-types button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 45%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 9%, var(--lfc-surface));
}

.lfc-simple-answer-types button span {
    display: grid;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: var(--lfc-surface);
    color: var(--lfc-accent);
    font-size: 12px;
    font-weight: 900;
}

.lfc-simple-answer-types button strong {
    min-width: 0;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.lfc-simple-sheet-body > .lfc-simple-toggle {
    justify-self: start;
}

.lfc-simple-thanks-card {
    background: linear-gradient(180deg, color-mix(in srgb, var(--lfc-surface) 96%, var(--lfc-accent) 4%), var(--lfc-surface));
}

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

.lfc-simple-field-label {
    display: block;
    margin-bottom: 8px;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 850;
}

.lfc-simple-icon-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

.lfc-simple-icon-grid button {
    display: grid;
    place-items: center;
    gap: 8px;
    min-height: 86px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 12px 8px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    cursor: pointer;
}

.lfc-simple-icon-grid button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 45%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 9%, var(--lfc-surface));
}

.lfc-simple-icon-grid button span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 999px;
    background: var(--lfc-surface);
    color: var(--lfc-accent);
    font-size: 18px;
    font-weight: 900;
}

.lfc-simple-icon-grid button strong {
    font-size: 12px;
    font-weight: 850;
    text-align: center;
}

.lfc-simple-thanks-button-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    padding: 14px;
    background: var(--lfc-surface-soft);
}

.lfc-simple-thanks-button-fields[hidden] {
    display: none !important;
}

.lfc-fullpage-question-list {
    display: grid;
    gap: 10px;
}

.lfc-fullpage-question-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface);
}

.lfc-fullpage-question-item > div:last-child {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.lfc-fullpage-question-item.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 36%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent) 8%, var(--lfc-surface));
}

.lfc-fullpage-question-item span,
.lfc-fullpage-question-item small {
    display: block;
    overflow: hidden;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-fullpage-question-item strong {
    display: block;
    overflow: hidden;
    margin: 3px 0;
    color: var(--lfc-text);
    font-size: 15px;
    font-weight: 860;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lfc-page-editor-nav,
.lfc-page-editor-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.lfc-page-editor-nav {
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 8px;
    background: var(--lfc-surface-soft);
}

.lfc-page-editor-nav button {
    min-height: 40px;
    border: 1px solid transparent;
    border-radius: var(--lfc-radius);
    padding: 9px 13px;
    color: var(--lfc-muted);
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 820;
    cursor: pointer;
}

.lfc-page-editor-nav button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 28%, var(--lfc-border));
    color: var(--lfc-accent-dark);
    background: var(--lfc-surface);
    box-shadow: 0 8px 20px rgba(15, 33, 62, 0.07);
}

.lfc-page-editor-nav button[hidden],
.lfc-page-editor-actions [hidden] {
    display: none;
}

.lfc-builder-pages {
    display: grid;
    gap: 14px;
}

.lfc-builder-page-card {
    display: grid;
    gap: 14px;
    background: var(--lfc-surface);
}

.lfc-builder-page-card[hidden] {
    display: none;
}

.lfc-builder-page-head strong {
    display: block;
    margin-top: 3px;
    color: var(--lfc-text);
    font-size: 18px;
}

.lfc-builder-page-head label {
    min-width: min(260px, 100%);
    margin: 0;
}

.lfc-builder-field-layout,
.lfc-progress-choice-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.lfc-builder-field-layout > span {
    width: 100%;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 780;
}

.lfc-builder-field-layout label,
.lfc-progress-choice-grid label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    margin: 0;
    padding: 8px 11px;
    color: var(--lfc-text);
    background: var(--lfc-surface-soft);
    font-size: 13px;
    font-weight: 740;
}

.lfc-builder-field-layout input,
.lfc-progress-choice-grid input {
    width: auto;
    min-height: auto;
}

.lfc-builder-field-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 10px;
}

.lfc-builder-field-pill {
    display: grid;
    gap: 8px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface-soft);
}

.lfc-builder-field-pill > label:first-child {
    display: flex !important;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 780;
}

.lfc-builder-field-pill input {
    width: auto;
    min-height: auto;
}

.lfc-builder-custom-fields {
    display: grid;
    gap: 12px;
}

.lfc-builder-custom-field {
    display: grid;
    gap: 12px;
    padding: 14px;
}

.lfc-builder-custom-field-head strong {
    color: var(--lfc-text);
}

.lfc-custom-field-picker {
    display: grid;
    gap: 14px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 84%, transparent);
    border-radius: 22px;
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 82%, var(--lfc-accent-light) 18%);
}

.lfc-custom-field-picker[hidden],
.lfc-field-type-summary[hidden] {
    display: none !important;
}

.lfc-field-type-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 22%, var(--lfc-border));
    border-radius: 18px;
    padding: 10px;
    background: color-mix(in srgb, var(--lfc-accent-light) 38%, var(--lfc-surface));
}

.lfc-field-type-summary > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background: var(--lfc-surface);
    color: var(--lfc-accent-dark);
    font-size: 12px;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 18%, transparent);
}

.lfc-field-type-summary strong,
.lfc-field-type-summary small {
    display: block;
    min-width: 0;
}

.lfc-field-type-summary strong {
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 860;
}

.lfc-field-type-summary small {
    margin-top: 2px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
}

.lfc-field-type-summary button {
    border: 1px solid color-mix(in srgb, var(--lfc-accent) 24%, var(--lfc-border));
    border-radius: 999px;
    padding: 8px 11px;
    background: var(--lfc-surface);
    color: var(--lfc-accent-dark);
    cursor: pointer;
    font-size: 12px;
    font-weight: 820;
    white-space: nowrap;
}

.lfc-field-type-summary button:hover,
.lfc-field-type-summary button:focus-visible {
    background: color-mix(in srgb, var(--lfc-accent-light) 58%, var(--lfc-surface));
    outline: none;
}

.lfc-custom-field-picker-head {
    display: grid;
    gap: 3px;
}

.lfc-custom-field-picker-head span {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 840;
}

.lfc-custom-field-picker-head small {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
}

.lfc-field-type-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
    gap: 12px;
}

.lfc-field-type-grid button {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 9px 12px;
    min-height: 92px;
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 88%, transparent);
    border-radius: 20px;
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface) 94%, #ffffff 6%);
    color: var(--lfc-text);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.lfc-field-type-grid button > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    grid-row: span 2;
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    border-radius: 16px;
    background: color-mix(in srgb, var(--lfc-accent-light) 72%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
}

.lfc-field-type-grid button strong,
.lfc-field-type-grid button small {
    display: block;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

.lfc-field-type-grid button strong {
    align-self: end;
    font-size: 15px;
    font-weight: 840;
    line-height: 1.18;
}

.lfc-field-type-grid button strong.lfc-field-type-title-break {
    line-height: 1.08;
}

.lfc-field-type-grid button small {
    align-self: start;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.28;
}

.lfc-field-type-grid button:first-child {
    border-color: color-mix(in srgb, var(--lfc-accent) 28%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent-light) 34%, var(--lfc-surface));
}

.lfc-field-type-grid button:first-child > span {
    background: color-mix(in srgb, var(--lfc-accent) 14%, var(--lfc-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 18%, transparent);
}

.lfc-builder-custom-field[data-lfc-custom-field-type="image_choice"] [data-lfc-standard-options],
.lfc-builder-custom-field[data-lfc-custom-field-type="image_choice"] [data-lfc-placeholder-field] {
    display: none !important;
}

.lfc-simple-options,
.lfc-simple-image-options {
    display: grid;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 18px;
    padding: 12px;
    background: color-mix(in srgb, var(--lfc-surface) 90%, var(--lfc-accent-light) 10%);
}

.lfc-simple-options[hidden],
.lfc-simple-image-options[hidden] {
    display: none !important;
}

.lfc-simple-options-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.lfc-simple-options-head strong {
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 850;
}

.lfc-simple-option-list,
.lfc-simple-image-option-list {
    display: grid;
    gap: 8px;
}

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

.lfc-simple-option-item input,
.lfc-simple-image-option-card input {
    min-height: 40px;
    border-radius: 13px;
}

.lfc-simple-option-item button,
.lfc-simple-image-option-actions button {
    border: 0;
    border-radius: 999px;
    padding: 8px 10px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 82%, var(--lfc-border) 18%);
    color: var(--lfc-muted);
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
}

.lfc-simple-option-item button:disabled,
.lfc-simple-image-option-actions button:disabled {
    cursor: default;
    opacity: 0.42;
}

.lfc-simple-image-option-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lfc-simple-image-option-card {
    display: grid;
    gap: 9px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 80%, transparent);
    border-radius: 18px;
    padding: 10px;
    background: var(--lfc-surface);
}

.lfc-simple-image-option-thumb {
    display: grid;
    place-items: center;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-radius: 14px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent-light) 54%, var(--lfc-surface)), var(--lfc-surface-soft));
}

.lfc-simple-image-option-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lfc-simple-image-option-thumb span {
    width: 34px;
    height: 26px;
    border: 2px solid color-mix(in srgb, var(--lfc-accent) 32%, var(--lfc-border));
    border-radius: 8px;
}

.lfc-simple-image-option-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.lfc-simple-image-option-actions button:first-child {
    background: color-mix(in srgb, var(--lfc-accent-light) 58%, var(--lfc-surface));
    color: var(--lfc-accent-dark);
}

.lfc-field-type-grid button:hover,
.lfc-field-type-grid button:focus-visible {
    border-color: color-mix(in srgb, var(--lfc-accent) 34%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent-light) 32%, var(--lfc-surface));
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.10);
    outline: none;
    transform: translateY(-1px);
}

.lfc-field-type-grid button.is-active {
    border-color: color-mix(in srgb, var(--lfc-accent) 48%, var(--lfc-border));
    background: color-mix(in srgb, var(--lfc-accent-light) 52%, var(--lfc-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 22%, transparent);
}

.lfc-builder-custom-field .lfc-mini-check {
    display: inline-flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 999px;
    padding: 7px 8px 7px 14px;
    background: color-mix(in srgb, var(--lfc-surface) 92%, var(--lfc-surface-soft) 8%);
    color: var(--lfc-text) !important;
    font-size: 13px;
    font-weight: 780 !important;
}

.lfc-builder-custom-field .lfc-mini-check input[type="checkbox"] {
    position: relative;
    flex: 0 0 auto;
    width: 44px;
    min-width: 44px;
    height: 26px;
    min-height: 26px;
    margin: 0;
    border: 0;
    border-radius: 999px;
    appearance: none;
    background: color-mix(in srgb, var(--lfc-border) 74%, var(--lfc-surface));
    cursor: pointer;
    transition: background 0.18s ease, box-shadow 0.18s ease;
}

.lfc-builder-custom-field .lfc-mini-check input[type="checkbox"]::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 8px rgba(15, 33, 62, 0.18);
    transition: transform 0.18s ease;
}

.lfc-builder-custom-field .lfc-mini-check input[type="checkbox"]:checked {
    background: var(--lfc-accent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lfc-accent-dark) 28%, transparent);
}

.lfc-builder-custom-field .lfc-mini-check input[type="checkbox"]:checked::after {
    transform: translateX(18px);
}

.lfc-builder-custom-field .lfc-mini-check input[type="checkbox"]:focus-visible {
    outline: 3px solid var(--lfc-focus);
    outline-offset: 2px;
}

.lfc-custom-field-details {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 16px;
    padding: 0;
    background: color-mix(in srgb, var(--lfc-surface) 86%, var(--lfc-surface-soft) 14%);
}

.lfc-custom-field-details > summary,
.lfc-image-choice-details > summary {
    cursor: pointer;
    padding: 12px 13px;
    color: var(--lfc-text);
    font-size: 13px;
    font-weight: 820;
    list-style: none;
}

.lfc-custom-field-details > summary::-webkit-details-marker,
.lfc-image-choice-details > summary::-webkit-details-marker {
    display: none;
}

.lfc-custom-field-details > summary::after,
.lfc-image-choice-details > summary::after {
    content: "+";
    float: right;
    color: var(--lfc-muted);
    font-weight: 900;
}

.lfc-custom-field-details[open] > summary::after,
.lfc-image-choice-details[open] > summary::after {
    content: "-";
}

.lfc-custom-field-details > .lfc-form-grid {
    padding: 0 13px 13px;
}

.lfc-image-choice-details {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 76%, transparent);
    border-radius: 14px;
    background: var(--lfc-surface-soft);
}

.lfc-image-choice-details .lfc-image-choice-config {
    padding: 0 12px 12px;
}

.lfc-media-fallback-note {
    margin: 0;
    border: 1px solid color-mix(in srgb, var(--lfc-warning) 24%, var(--lfc-border));
    border-radius: var(--lfc-radius);
    padding: 10px 12px;
    color: var(--lfc-text);
    background: color-mix(in srgb, var(--lfc-warning) 12%, var(--lfc-surface));
    font-size: 12px;
    font-weight: 720;
}

.lfc-image-choice-config {
    display: grid;
    gap: 12px;
}

.lfc-image-option-grid {
    display: grid;
    gap: 12px;
}

.lfc-image-option-row {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    padding: 12px;
    background: var(--lfc-surface);
}

.lfc-image-option-row[hidden] {
    display: none;
}

.lfc-image-option-head,
.lfc-image-option-actions,
.lfc-image-option-row .lfc-wide {
    grid-column: 1 / -1;
}

.lfc-image-option-head,
.lfc-image-option-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.lfc-image-option-preview {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius);
    background: linear-gradient(135deg, color-mix(in srgb, var(--lfc-accent) 16%, var(--lfc-surface)), var(--lfc-surface-soft));
}

.lfc-image-option-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lfc-image-option-preview span {
    width: 42%;
    aspect-ratio: 1;
    border-radius: 14px;
    background: color-mix(in srgb, var(--lfc-accent) 18%, transparent);
}

.lfc-field-limit-warning {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    border: 1px solid color-mix(in srgb, var(--lfc-warning) 38%, transparent);
    border-radius: var(--lfc-radius);
    padding: 13px;
    color: var(--lfc-warning);
    background: var(--lfc-warning-soft);
}

.lfc-field-limit-warning[hidden] {
    display: none;
}

.lfc-field-limit-warning p {
    flex: 1 1 260px;
    margin: 0;
    font-size: 13px;
    font-weight: 740;
}

.lfc-autosave-note {
    border-radius: var(--lfc-radius);
    margin: 0;
    padding: 11px 13px;
    color: var(--lfc-muted);
    background: var(--lfc-surface-soft);
    font-size: 13px;
    font-weight: 720;
}

.lfc-autosave-note[hidden] {
    display: none;
}

.live-funnel-control-app input.is-focus-pulse,
.live-funnel-control-app textarea.is-focus-pulse {
    box-shadow: 0 0 0 4px var(--lfc-focus);
}

.lfc-field-choice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.lfc-field-choice {
    display: grid;
    gap: 8px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 13px;
    background: var(--lfc-surface-soft);
}

.lfc-field-choice label,
.lfc-mini-check {
    display: flex !important;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: var(--lfc-text);
    font-weight: 720;
}

.lfc-field-choice input {
    width: auto;
    min-height: auto;
}

.lfc-mini-select {
    display: grid !important;
    gap: 5px !important;
    align-items: stretch !important;
    color: var(--lfc-muted) !important;
    font-size: 12px;
    font-weight: 680 !important;
}

.lfc-mini-select select {
    min-height: 36px;
}

.lfc-mini-check {
    color: var(--lfc-muted) !important;
    font-size: 12px;
    font-weight: 680 !important;
}

.lfc-segmented-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.lfc-segmented-cards label {
    position: relative;
    margin: 0;
}

.lfc-segmented-cards input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.lfc-segmented-cards label > span:not(.lfc-autosave-settings-toggle) {
    display: grid;
    gap: 5px;
    min-height: 100%;
    padding: 16px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.lfc-segmented-cards strong {
    font-size: 15px;
}

.lfc-segmented-cards small {
    color: var(--lfc-muted);
    line-height: 1.45;
}

.lfc-segmented-cards input:checked + span:not(.lfc-autosave-settings-toggle),
.lfc-segmented-cards input:focus-visible + span:not(.lfc-autosave-settings-toggle) {
    border-color: var(--lfc-accent-dark);
    box-shadow: 0 0 0 4px var(--lfc-focus);
}

.lfc-autosave-mode-card > span:not(.lfc-autosave-settings-toggle) {
    padding-right: 48px;
}

.lfc-autosave-settings-toggle {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--lfc-muted);
    cursor: pointer;
    transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease;
}

.lfc-autosave-settings-toggle:hover,
.lfc-autosave-settings-toggle:focus {
    color: var(--lfc-accent-dark);
    background: var(--lfc-surface);
    outline: none;
    transform: translateY(-1px);
}

.lfc-autosave-settings {
    display: grid;
    gap: 12px;
    margin-top: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    padding: 16px;
    background: var(--lfc-surface);
}

.lfc-autosave-settings[hidden] {
    display: none !important;
}

.lfc-custom-field-builder {
    display: grid;
    gap: 14px;
    margin-top: 22px;
}

.lfc-image-choice-config {
    display: grid;
    gap: 14px;
}

.lfc-image-option-grid {
    display: grid;
    gap: 10px;
}

.lfc-image-option-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--lfc-border);
    border-radius: var(--lfc-radius-lg);
    background: var(--lfc-surface-soft);
}

.lfc-image-option-row strong,
.lfc-image-option-row .lfc-wide {
    grid-column: 1 / -1;
}

.lfc-soft-note,
.lfc-template-summary {
    border: 1px solid var(--lfc-accent-light-2);
    border-radius: var(--lfc-radius);
    margin: 0;
    padding: 16px;
    color: var(--lfc-accent-dark-2);
    background: color-mix(in srgb, var(--lfc-accent-light) 64%, var(--lfc-surface));
}

.lfc-template-summary p {
    margin: 7px 0 0;
    color: var(--lfc-muted);
}

.lfc-wizard-summary {
    display: grid;
    gap: 8px;
}

.lfc-wizard-summary p {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid var(--lfc-border);
    margin: 0;
    padding: 11px 0;
}

.lfc-wizard-summary span {
    color: var(--lfc-muted);
}

.lfc-wizard-summary strong {
    color: var(--lfc-text);
    text-align: right;
}

.live-funnel-control-app input[readonly] {
    color: var(--lfc-muted);
    background: var(--lfc-surface-soft);
}

@media (min-width: 1360px) {
    .lfc-shell {
        grid-template-columns: var(--lfc-sidebar-width) minmax(0, 1fr);
    }

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

@media (max-width: 1120px) {
    .lfc-dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .lfc-dashboard-widget {
        grid-column: span 6;
    }

    .lfc-dashboard-grid .lfc-card:first-child {
        grid-row: auto;
    }

    .lfc-design-lab {
        grid-template-columns: 1fr;
    }

    .lfc-style-preview {
        position: relative;
        top: auto;
    }

    .lfc-funnel-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .lfc-dashboard-topbar,
    .lfc-dashboard-actions,
    .lfc-dashboard-editbar {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-dashboard-actions .lfc-btn,
    .lfc-dashboard-editbar .lfc-btn,
    .lfc-live-control,
    .lfc-dashboard-range-popover,
    .lfc-dashboard-range-trigger {
        width: 100%;
    }

    .lfc-dashboard-control {
        height: 52px;
        min-height: 52px;
    }

    .lfc-dashboard-range-panel {
        right: auto;
        left: 0;
        width: 100%;
    }

    .lfc-dashboard-editbar-status,
    .lfc-dashboard-editbar-actions,
    .lfc-dashboard-modal-head,
    .lfc-dashboard-modal-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-dashboard-editor-form,
    .lfc-dashboard-date-grid {
        grid-template-columns: 1fr;
    }

    .lfc-smart-dashboard-grid {
        display: block;
    }

    .lfc-dashboard-widget {
        min-height: 0;
        margin-bottom: 12px;
    }
}

@media (max-width: 860px) {
    body.live-funnel-control-page {
        padding-bottom: calc(76px + env(safe-area-inset-bottom));
    }

    .live-funnel-control-app {
        width: 100%;
        margin-left: 0;
    }

    .lfc-shell {
        display: block;
        min-height: auto;
        padding: 12px;
    }

    .lfc-sidebar {
        display: none;
    }

    .lfc-sidebar-resize-handle {
        display: none;
    }

    .lfc-workspace {
        gap: 12px;
    }

    .lfc-theme-toggle {
        min-height: 38px;
        padding: 8px 10px;
    }

    .lfc-mobile-menu {
        display: block;
        border: 1px solid var(--lfc-border);
        border-radius: var(--lfc-radius);
        background: var(--lfc-surface);
        box-shadow: var(--lfc-shadow-soft);
    }

    .lfc-mobile-menu summary {
        min-height: 46px;
        padding: 12px 14px;
        color: var(--lfc-text);
        cursor: pointer;
        font-weight: 820;
    }

    .lfc-mobile-menu nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 0 12px 12px;
    }

    .lfc-sidebar-actions-mobile {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid var(--lfc-border);
        padding: 12px;
    }

    .lfc-view.lfc-is-loading {
        min-height: 420px;
    }

    .lfc-skeleton-row {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .lfc-skeleton-filter,
    .lfc-skeleton-grid,
    .lfc-skeleton-kpi-grid {
        grid-template-columns: 1fr;
    }

    .lfc-segmented-cards,
    .lfc-image-option-row {
        grid-template-columns: 1fr;
    }

    .lfc-mobile-menu a {
        border-radius: var(--lfc-radius);
        padding: 10px;
        background: var(--lfc-surface-soft);
        font-weight: 720;
    }

    .lfc-mobile-menu a[aria-current="page"] {
        background: var(--lfc-active);
        color: var(--lfc-accent-dark-2);
    }

    .lfc-bottom-nav {
        position: fixed;
        right: 10px;
        bottom: calc(10px + env(safe-area-inset-bottom));
        left: 10px;
        z-index: 1000;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 4px;
        border: 1px solid var(--lfc-border);
        border-radius: var(--lfc-radius);
        padding: 7px;
        background: var(--lfc-surface);
        background: color-mix(in srgb, var(--lfc-surface) 96%, transparent);
        box-shadow: var(--lfc-shadow);
    }

    .lfc-bottom-nav a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 42px;
        border-radius: var(--lfc-radius);
        padding: 6px;
        font-size: 11px;
        font-weight: 820;
        text-align: center;
    }

    .lfc-bottom-nav a[aria-current="page"] {
        background: var(--lfc-active);
        color: var(--lfc-accent-dark-2);
    }

    .lfc-view-head,
    .lfc-row-card {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-filter,
    .lfc-filter-compact {
        grid-template-columns: 1fr;
    }

    .lfc-funnel-filter-search,
    .lfc-funnel-filter-grid {
        grid-template-columns: 1fr;
    }

    .lfc-dashboard-grid,
    .lfc-breakdowns,
    .lfc-two-col,
    .lfc-create-guidance,
    .lfc-content-builder,
    .lfc-mail-builder-layout,
    .lfc-mail-editor-grid,
    .lfc-mail-logo-card,
    .lfc-mail-setup-grid,
    .lfc-mail-center-grid,
    .lfc-recovery-layout,
    .lfc-warning-rule-grid,
    .lfc-form-grid,
    .lfc-form-grid-compact,
    .lfc-rule-condition,
    .lfc-choice-grid,
    .lfc-template-grid,
    .lfc-quick-style-grid,
    .lfc-wizard-progress {
        grid-template-columns: 1fr;
    }

    .lfc-create-guidance {
        align-items: start;
    }

    .lfc-recovery-card,
    .lfc-recovery-metrics {
        grid-template-columns: 1fr;
    }

    .lfc-quick-color-row,
    .lfc-quick-style-head,
    .lfc-preview-toolbar,
    .lfc-simple-builder-head,
    .lfc-builder-page-head,
    .lfc-builder-custom-field-head {
        display: grid;
        grid-template-columns: 1fr;
    }

    .lfc-simple-question-card,
    .lfc-simple-contact-grid,
    .lfc-simple-answer-types,
    .lfc-simple-thanks-form,
    .lfc-simple-icon-grid,
    .lfc-field-type-grid,
    .lfc-simple-image-option-list,
    .lfc-simple-thanks-button-fields {
        grid-template-columns: 1fr;
    }

    .lfc-field-type-summary {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .lfc-field-type-summary button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .lfc-simple-question-card {
        align-items: start;
    }

    .lfc-simple-question-actions {
        justify-content: flex-start;
    }

    .lfc-content-builder > .lfc-content-preview-card {
        position: static;
        grid-column: 1;
        grid-row: auto;
        max-height: none;
        overflow: visible;
    }

    .lfc-content-builder-controls {
        grid-column: 1;
    }

    .live-funnel-control-preview-root [data-lfc-content-preview-fields],
    .lfc-builder-field-list {
        grid-template-columns: 1fr;
    }

    .lfc-image-option-row {
        grid-template-columns: 1fr;
    }

    .lfc-mail-detail,
    .lfc-mail-builder,
    .lfc-mail-preview-studio {
        position: static;
    }

    .lfc-mail-builder-topbar {
        grid-template-columns: 1fr;
    }

    .lfc-mail-row {
        grid-template-columns: 1fr;
    }

    .lfc-site-grid,
    .lfc-site-lists {
        grid-template-columns: 1fr;
    }

    .lfc-site-sparkline {
        min-height: 190px;
        padding: 14px;
    }

    .lfc-site-sparkline span {
        height: 150px;
    }

    .lfc-mail-row .lfc-actions {
        justify-content: flex-start;
    }

    .lfc-mail-detail-grid,
    .lfc-mail-log-row summary {
        grid-template-columns: 1fr;
    }

    .lfc-wizard-summary p {
        display: grid;
        gap: 4px;
    }

    .lfc-wizard-summary strong {
        text-align: left;
    }

    .lfc-segmented-nav {
        margin-right: -12px;
        margin-left: -12px;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }

    .lfc-responsive-table {
        overflow: visible;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .lfc-responsive-table table,
    .lfc-responsive-table thead,
    .lfc-responsive-table tbody,
    .lfc-responsive-table tr,
    .lfc-responsive-table td {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .lfc-responsive-table thead {
        display: none;
    }

    .lfc-responsive-table tr {
        border: 1px solid var(--lfc-border);
        border-radius: var(--lfc-radius);
        margin-bottom: 12px;
        padding: 10px;
        background: var(--lfc-surface);
        box-shadow: var(--lfc-shadow-soft);
    }

    .lfc-responsive-table td {
        display: flex;
        justify-content: space-between;
        gap: 14px;
        border-bottom: 1px solid var(--lfc-border);
        padding: 9px 0;
    }

    .lfc-responsive-table td:last-child {
        border-bottom: 0;
    }

    .lfc-responsive-table td::before {
        content: attr(data-label);
        color: var(--lfc-muted);
        font-size: 12px;
        font-weight: 820;
        text-transform: uppercase;
    }

    .lfc-leads-table .lfc-lead-row {
        display: grid;
        gap: 2px;
    }

    .lfc-leads-table td {
        align-items: flex-start;
    }

    .lfc-leads-table td::before {
        min-width: 92px;
    }

    .lfc-lead-update-form {
        grid-template-columns: 1fr;
    }

    .lfc-lead-drawer {
        width: 100vw;
        padding: 18px 14px;
    }

    .lfc-drawer-summary {
        grid-template-columns: 1fr;
    }

    .lfc-timeline p {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .lfc-timeline span {
        white-space: normal;
    }

    .lfc-actions {
        justify-content: flex-end;
    }
}

@media (max-width: 520px) {
    .lfc-auth-screen {
        padding: 16px;
    }

    .lfc-auth-card {
        padding: 22px;
    }

    .lfc-stat-grid {
        grid-template-columns: 1fr;
    }

    .lfc-sidebar-actions-mobile {
        grid-template-columns: 1fr;
    }
}
.lfc-appointment-funnel .lfc-section-header {
    align-items: flex-start;
}

.lfc-appointment-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.lfc-appointment-card {
    height: auto;
}

.lfc-appointment-profile {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}

.lfc-appointment-profile img {
    width: 76px;
    height: 76px;
    object-fit: cover;
    border-radius: 22px;
    background: var(--lfc-surface-soft);
}

.lfc-appointment-profile p {
    margin: 8px 0 0;
    color: var(--lfc-muted);
    font-size: 13px;
}

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

.lfc-appointment-funnel .lfc-form-span {
    grid-column: 1 / -1;
}

.lfc-appointment-funnel label span,
.lfc-appointment-method .lfc-toggle-row span,
.lfc-availability-day .lfc-toggle-row span,
.lfc-compact-check span {
    font-weight: 800;
}

.lfc-appointment-methods {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.lfc-appointment-method {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    background: var(--lfc-surface-soft);
}

.lfc-toggle-row,
.lfc-compact-check {
    display: inline-flex;
    gap: 9px;
    align-items: center;
}

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

.lfc-availability-day {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--lfc-border);
    border-radius: 18px;
    background: var(--lfc-surface-soft);
}

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

.lfc-time-window span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
}

.lfc-blocked-list {
    display: grid;
    gap: 10px;
}

.lfc-blocked-row {
    display: grid;
    grid-template-columns: minmax(180px, 1.2fr) repeat(4, minmax(118px, .8fr)) auto;
    gap: 8px;
    align-items: center;
}

.lfc-appointment-actions {
    justify-content: space-between;
    align-items: center;
}

.lfc-appointment-actions code {
    display: inline-flex;
    margin-left: 10px;
    padding: 7px 10px;
    border-radius: 10px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-text);
}

@media (max-width: 980px) {
    .lfc-appointment-layout,
    .lfc-availability-grid,
    .lfc-appointment-funnel .lfc-form-grid {
        grid-template-columns: 1fr;
    }

    .lfc-blocked-row {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .lfc-appointment-profile,
    .lfc-appointment-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .lfc-time-window,
    .lfc-blocked-row {
        grid-template-columns: 1fr;
    }

    .lfc-time-window span {
        display: none;
    }
}

/* Appointment funnel settings cleanup: progressive availability and blocked-time editors. */
.lfc-appointment-funnel .lfc-availability-day-head,
.lfc-appointment-funnel .lfc-time-summary,
.lfc-appointment-funnel .lfc-blocked-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.lfc-appointment-funnel .lfc-time-window-list,
.lfc-appointment-funnel .lfc-blocked-list {
    display: grid;
    gap: 9px;
}

.lfc-appointment-funnel .lfc-time-window,
.lfc-appointment-funnel .lfc-blocked-row {
    display: block;
    border: 1px solid var(--lfc-border);
    border-radius: 16px;
    background: var(--lfc-surface);
    padding: 11px;
}

.lfc-appointment-funnel .lfc-time-window.is-hidden,
.lfc-appointment-funnel .lfc-blocked-row.is-hidden,
.lfc-appointment-funnel .lfc-time-summary[hidden],
.lfc-appointment-funnel .lfc-time-editor[hidden],
.lfc-appointment-funnel .lfc-blocked-summary[hidden],
.lfc-appointment-funnel .lfc-blocked-editor[hidden] {
    display: none !important;
}

.lfc-appointment-funnel .lfc-time-summary strong,
.lfc-appointment-funnel .lfc-blocked-summary strong {
    color: var(--lfc-text);
    font-size: 14px;
    font-weight: 900;
}

.lfc-appointment-funnel .lfc-time-summary span,
.lfc-appointment-funnel .lfc-blocked-actions {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 7px;
}

.lfc-appointment-funnel .lfc-blocked-summary span {
    display: block;
    margin-top: 3px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 720;
}

.lfc-appointment-funnel .lfc-time-summary button,
.lfc-appointment-funnel .lfc-blocked-actions button,
.lfc-appointment-funnel .lfc-mini-action {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    border: 1px solid var(--lfc-border);
    border-radius: 999px;
    padding: 0 12px;
    background: var(--lfc-surface-soft);
    color: var(--lfc-primary);
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
}

.lfc-appointment-funnel .lfc-time-summary button[data-lfc-clear-slot],
.lfc-appointment-funnel .lfc-blocked-actions button[data-lfc-delete-blocked] {
    color: #dc2626;
    background: rgba(239, 68, 68, 0.08);
    border-color: rgba(239, 68, 68, 0.2);
}

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

.lfc-appointment-funnel .lfc-time-editor span {
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 800;
}

.lfc-appointment-funnel .lfc-blocked-editor {
    display: grid;
    grid-template-columns: minmax(170px, 1.2fr) repeat(4, minmax(112px, .8fr)) auto;
    gap: 8px;
    align-items: center;
}

.lfc-appointment-funnel .lfc-blocked-add-button {
    width: 100%;
    margin-top: 12px;
}

[data-live-funnel-control-theme="dark"] .lfc-appointment-funnel .lfc-time-window,
[data-live-funnel-control-theme="dark"] .lfc-appointment-funnel .lfc-blocked-row {
    background: rgba(255, 255, 255, .035);
}

@media (max-width: 980px) {
    .lfc-appointment-funnel .lfc-blocked-editor {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .lfc-appointment-funnel .lfc-availability-day-head,
    .lfc-appointment-funnel .lfc-time-summary,
    .lfc-appointment-funnel .lfc-blocked-summary {
        align-items: stretch;
        flex-direction: column;
    }

    .lfc-appointment-funnel .lfc-time-summary span,
    .lfc-appointment-funnel .lfc-blocked-actions {
        width: 100%;
    }

    .lfc-appointment-funnel .lfc-time-summary button,
    .lfc-appointment-funnel .lfc-blocked-actions button,
    .lfc-appointment-funnel .lfc-mini-action {
        flex: 1 1 auto;
    }

    .lfc-appointment-funnel .lfc-time-editor,
    .lfc-appointment-funnel .lfc-blocked-editor {
        grid-template-columns: 1fr;
    }

    .lfc-appointment-funnel .lfc-time-editor span {
        display: none;
    }
}

/* Control form polish: premium cockpit inputs without touching data logic. */
.live-funnel-control-app {
    --lfc-field-bg: color-mix(in srgb, var(--lfc-surface-raised) 82%, var(--lfc-bg));
    --lfc-field-bg-hover: color-mix(in srgb, var(--lfc-surface-raised) 92%, var(--lfc-accent-light));
    --lfc-field-border: color-mix(in srgb, var(--lfc-border-strong) 72%, transparent);
    --lfc-field-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 1px 2px rgba(15, 33, 62, .04);
}

html[data-live-funnel-control-theme="dark"] .live-funnel-control-app,
.live-funnel-control-app[data-theme="dark"] {
    --lfc-field-bg: color-mix(in srgb, var(--lfc-surface-raised) 72%, #020617);
    --lfc-field-bg-hover: color-mix(in srgb, var(--lfc-surface-raised) 84%, var(--lfc-accent-light));
    --lfc-field-border: color-mix(in srgb, var(--lfc-border-strong) 78%, transparent);
    --lfc-field-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 14px 28px rgba(0, 0, 0, .10);
}

.live-funnel-control-app .lfc-login-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-filter input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-filter select,
.live-funnel-control-app .lfc-inline-panel input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-inline-panel select,
.live-funnel-control-app .lfc-inline-panel textarea,
.live-funnel-control-app .lfc-form-grid input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-form-grid select,
.live-funnel-control-app .lfc-form-grid textarea,
.live-funnel-control-app .lfc-rule-condition input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-rule-condition select,
.live-funnel-control-app .lfc-appointment-funnel input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),
.live-funnel-control-app .lfc-appointment-funnel select,
.live-funnel-control-app .lfc-appointment-funnel textarea {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--lfc-field-border);
    border-radius: 15px;
    padding: 11px 13px;
    background: var(--lfc-field-bg);
    color: var(--lfc-text);
    font: inherit;
    line-height: 1.35;
    box-shadow: var(--lfc-field-shadow);
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.live-funnel-control-app .lfc-form-grid textarea,
.live-funnel-control-app .lfc-inline-panel textarea,
.live-funnel-control-app .lfc-appointment-funnel textarea {
    min-height: 104px;
    resize: vertical;
}

.live-funnel-control-app .lfc-appointment-method textarea {
    min-height: 74px;
}

.live-funnel-control-app .lfc-form-grid select,
.live-funnel-control-app .lfc-filter select,
.live-funnel-control-app .lfc-inline-panel select,
.live-funnel-control-app .lfc-rule-condition select,
.live-funnel-control-app .lfc-appointment-funnel select {
    appearance: none;
    padding-right: 38px;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--lfc-muted) 50%),
        linear-gradient(135deg, var(--lfc-muted) 50%, transparent 50%);
    background-position:
        calc(100% - 19px) 51%,
        calc(100% - 14px) 51%;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

.live-funnel-control-app input::placeholder,
.live-funnel-control-app textarea::placeholder {
    color: color-mix(in srgb, var(--lfc-muted) 78%, transparent);
}

.live-funnel-control-app .lfc-login-form input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-filter input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-filter select:focus,
.live-funnel-control-app .lfc-inline-panel input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-inline-panel select:focus,
.live-funnel-control-app .lfc-inline-panel textarea:focus,
.live-funnel-control-app .lfc-form-grid input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-form-grid select:focus,
.live-funnel-control-app .lfc-form-grid textarea:focus,
.live-funnel-control-app .lfc-rule-condition input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-rule-condition select:focus,
.live-funnel-control-app .lfc-appointment-funnel input:not([type="checkbox"]):not([type="radio"]):focus,
.live-funnel-control-app .lfc-appointment-funnel select:focus,
.live-funnel-control-app .lfc-appointment-funnel textarea:focus {
    border-color: color-mix(in srgb, var(--lfc-accent) 76%, var(--lfc-border-strong));
    background: var(--lfc-field-bg-hover);
    box-shadow: 0 0 0 4px var(--lfc-focus), var(--lfc-field-shadow);
    outline: none;
}

.live-funnel-control-app input[readonly],
.live-funnel-control-app input:disabled,
.live-funnel-control-app select:disabled,
.live-funnel-control-app textarea:disabled {
    opacity: .72;
    cursor: not-allowed;
}

.live-funnel-control-app input[type="checkbox"] {
    appearance: none;
    display: inline-grid;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    place-content: center;
    border: 1px solid var(--lfc-field-border);
    border-radius: 7px;
    background: var(--lfc-field-bg);
    box-shadow: var(--lfc-field-shadow);
    cursor: pointer;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.live-funnel-control-app input[type="checkbox"]::before {
    content: "";
    width: 10px;
    height: 10px;
    transform: scale(0);
    border-radius: 3px;
    background: #fff;
    clip-path: polygon(14% 52%, 0 66%, 39% 100%, 100% 22%, 84% 8%, 36% 68%);
    transition: transform .14s ease;
}

.live-funnel-control-app input[type="checkbox"]:checked {
    border-color: color-mix(in srgb, var(--lfc-accent) 86%, var(--lfc-border-strong));
    background: linear-gradient(135deg, var(--lfc-accent), var(--lfc-accent-dark));
    box-shadow: 0 0 0 4px var(--lfc-focus), 0 10px 22px color-mix(in srgb, var(--lfc-accent) 24%, transparent);
}

.live-funnel-control-app input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.live-funnel-control-app input[type="checkbox"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px var(--lfc-focus), var(--lfc-field-shadow);
}

.live-funnel-control-app .lfc-toggle-row,
.live-funnel-control-app .lfc-compact-check,
.live-funnel-control-app .lfc-check-row,
.live-funnel-control-app .lfc-mini-check {
    gap: 10px;
    align-items: center;
    min-height: 32px;
    color: var(--lfc-text);
}

.live-funnel-control-app .lfc-toggle-row span,
.live-funnel-control-app .lfc-compact-check span,
.live-funnel-control-app .lfc-check-row span,
.live-funnel-control-app .lfc-mini-check {
    line-height: 1.35;
}

.lfc-appointment-funnel .lfc-form-grid label {
    gap: 7px;
    color: var(--lfc-muted);
    font-size: 12px;
    font-weight: 820;
}

.lfc-appointment-funnel .lfc-form-grid label > span {
    color: var(--lfc-muted);
    letter-spacing: .01em;
}

.lfc-appointment-gradient-preview {
    display: flex;
    align-items: flex-end;
    min-height: 84px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 76%, transparent);
    border-radius: 18px;
    padding: 14px;
    overflow: hidden;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
}

.lfc-appointment-gradient-preview span {
    display: inline-flex;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(255, 255, 255, .14);
    color: inherit;
    font-size: 12px;
    font-weight: 800;
}

.lfc-appointment-funnel .lfc-appointment-card {
    border-color: color-mix(in srgb, var(--lfc-border) 82%, transparent);
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--lfc-surface-raised) 88%, transparent), color-mix(in srgb, var(--lfc-surface) 96%, transparent));
    box-shadow: var(--lfc-shadow-soft);
}

.lfc-appointment-funnel .lfc-appointment-profile {
    padding: 13px;
    border: 1px solid color-mix(in srgb, var(--lfc-border) 80%, transparent);
    border-radius: 20px;
    background: color-mix(in srgb, var(--lfc-surface-soft) 74%, transparent);
}

.lfc-appointment-funnel .lfc-appointment-profile img {
    border: 1px solid color-mix(in srgb, var(--lfc-border-strong) 60%, transparent);
    box-shadow: 0 12px 24px rgba(15, 33, 62, .08);
}

.lfc-appointment-funnel .lfc-appointment-method {
    position: relative;
    gap: 12px;
    padding: 16px;
    border-color: color-mix(in srgb, var(--lfc-border) 78%, transparent);
    border-radius: 20px;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--lfc-surface-soft) 84%, transparent), color-mix(in srgb, var(--lfc-surface) 94%, transparent));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 12px 26px rgba(15, 33, 62, .04);
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.lfc-appointment-funnel .lfc-appointment-method:has(input[type="checkbox"]:checked) {
    border-color: color-mix(in srgb, var(--lfc-accent) 54%, var(--lfc-border));
    background:
        radial-gradient(circle at 0 0, color-mix(in srgb, var(--lfc-accent) 12%, transparent), transparent 42%),
        linear-gradient(145deg, color-mix(in srgb, var(--lfc-accent-light) 28%, var(--lfc-surface)), color-mix(in srgb, var(--lfc-surface) 94%, transparent));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--lfc-accent) 18%, transparent), 0 16px 34px color-mix(in srgb, var(--lfc-accent) 10%, transparent);
}

.lfc-appointment-funnel .lfc-appointment-method .lfc-toggle-row {
    justify-content: flex-start;
    width: fit-content;
    font-size: 13px;
}

.lfc-appointment-funnel .lfc-time-window,
.lfc-appointment-funnel .lfc-blocked-row,
.lfc-appointment-funnel .lfc-availability-day {
    border-color: color-mix(in srgb, var(--lfc-border) 78%, transparent);
    background: color-mix(in srgb, var(--lfc-surface-soft) 74%, transparent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

.lfc-appointment-funnel .lfc-time-editor,
.lfc-appointment-funnel .lfc-blocked-editor {
    align-items: end;
}

.lfc-appointment-funnel .lfc-appointment-actions {
    border: 1px solid color-mix(in srgb, var(--lfc-border) 80%, transparent);
    border-radius: 20px;
    padding: 14px;
    background: color-mix(in srgb, var(--lfc-surface-raised) 76%, transparent);
}

/* Production UI quality pass: appointment control should feel like a cockpit, not raw forms. */
.lfc-appointment-funnel .lfc-appointment-layout {
    align-items: start;
}

.lfc-appointment-funnel .lfc-panel-header p {
    max-width: 62ch;
}

.lfc-appointment-funnel .lfc-mini-action,
.lfc-appointment-funnel .lfc-time-summary button,
.lfc-appointment-funnel .lfc-blocked-actions button {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    border: 1px solid color-mix(in srgb, var(--lfc-border-strong) 68%, transparent);
    border-radius: 999px;
    padding: 7px 12px;
    background: color-mix(in srgb, var(--lfc-surface-raised) 82%, transparent);
    color: var(--lfc-text);
    font: inherit;
    font-size: 12px;
    font-weight: 820;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.lfc-appointment-funnel .lfc-mini-action:hover,
.lfc-appointment-funnel .lfc-time-summary button:hover,
.lfc-appointment-funnel .lfc-blocked-actions button:hover {
    border-color: color-mix(in srgb, var(--lfc-accent) 42%, var(--lfc-border-strong));
    background: color-mix(in srgb, var(--lfc-accent-light) 34%, var(--lfc-surface-raised));
}

.lfc-appointment-funnel .lfc-mini-action:focus-visible,
.lfc-appointment-funnel .lfc-time-summary button:focus-visible,
.lfc-appointment-funnel .lfc-blocked-actions button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px var(--lfc-focus);
}

.lfc-appointment-funnel .lfc-time-editor input,
.lfc-appointment-funnel .lfc-blocked-editor input {
    min-width: 0;
}

.lfc-appointment-funnel .lfc-time-summary strong,
.lfc-appointment-funnel .lfc-blocked-summary strong {
    color: var(--lfc-text);
}

.lfc-appointment-funnel .lfc-blocked-summary span {
    color: var(--lfc-muted);
    line-height: 1.35;
}

.lfc-appointment-funnel .lfc-appointment-profile p {
    margin: 7px 0 0;
    color: var(--lfc-muted);
    line-height: 1.4;
}

@media (max-width: 720px) {
    .lfc-appointment-funnel .lfc-appointment-layout,
    .lfc-appointment-funnel .lfc-availability-grid {
        grid-template-columns: 1fr;
    }

    .lfc-appointment-funnel .lfc-form-actions {
        align-items: stretch;
    }
}