/* ==================================================
   ABALLEL DESIGN SYSTEM
   Layers:
   1. Foundations / tokens
   2. Base / shell
   3. Shared components
   4. Utilities
   5. Surface families
   6. Page-specific compositions
   ================================================== */

:root {
    --color-primary: #3B57ED;
    --color-primary-dark: #0D0DCC;
    --color-primary-blue: #3B57ED;
    --color-primary-blue-dark: #0D0DCC;
    --color-primary-red: #E33F2A;
    --color-primary-red-dark: #B50600;
    --color-primary-purple: #ED52C9;
    --color-primary-purple-dark: #AA00AA;
    --color-primary-yellow: #F8DC66;
    --color-primary-yellow-dark: #EDB212;
    --color-primary-green: #53CE26;
    --color-primary-green-dark: #008805;
    --color-primary-orange: #F5B43A;
    --color-primary-orange-dark: #ED8812;
    --color-secondary: #ED52C9;
    --color-accent-orange: #ED8812;
    --color-text-primary: #000;
    --color-text-secondary: #5f5f67;
    --color-background: #fff;
    --color-background-secondary: #f6f2ec;
    --color-background-hover: #f1ece4;
    --color-background-elevated: rgba(255, 255, 255, 0.97);
    --color-white: #fff;
    --color-border: #000;
    --color-border-light: rgba(0, 0, 0, 0.12);
    --color-border-medium: rgba(0, 0, 0, 0.2);
    --color-gray-50: #f7f5f2;
    --color-gray-400: #98a2b3;
    --color-warning-light: #fff4cf;
    --color-warning-dark: #8b5e00;
    --color-info-light: #e8edff;
    --color-info-dark: #2240c7;
    --color-success-light: #e7fadf;
    --color-success-dark: #0b5d0d;
    --color-error-light: #fde7e3;
    --color-error-dark: #8b0f0b;
    --space-4: 4px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-16: 16px;
    --space-18: 18px;
    --space-20: 20px;
    --space-24: 24px;
    --space-28: 28px;
    --space-32: 32px;
    --space-40: 40px;
    --space-56: 56px;
    --space-72: 72px;
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --type-12: 12px;
    --type-14: 14px;
    --type-16: 16px;
    --type-20: 20px;
    --type-24: 24px;
    --type-32: 32px;
    --type-40: 40px;
    --type-56: 56px;
    --radius-xs: 12px;
    --radius-sm: 16px;
    --radius-md: 20px;
    --radius-lg: 28px;
    --radius-xl: 28px;
    --radius-pill: 999px;
    --border-radius-lg: 28px;
    --border-width-control: 2px;
    --border-width-strong: 3px;
    --border-width-panel: 4px;
    --control-height-shell: 48px;
    --shadow-soft: 0 6px 14px rgba(0, 0, 0, 0.08);
    --shadow-card: 0 16px 30px rgba(17, 24, 39, 0.12);
    --shadow-float: 0 22px 44px rgba(17, 24, 39, 0.16);
    --shadow-control: 0 4px 0 rgba(0, 0, 0, 0.08);
    --shadow-offset: 0 6px 0 rgba(0, 0, 0, 0.1);
    --dashboard-section-gap: 24px;
    --dashboard-footer-gap: 24px;
    --surface-accent: var(--color-primary-blue);
    --surface-accent-dark: var(--color-primary-blue-dark);
    --surface-triangle-gradient: linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    --surface-header-gradient: radial-gradient(ellipse at 47.2% 5.2%, #3B57ED 0%, #0D0DCC 100%);
    --surface-header-shadow: #3B57ED;
    --surface-header-ink: #fff;
    --surface-info-tint: rgba(59, 87, 237, 0.18);
    --surface-info-tone: #0D0DCC;
    --surface-success-tint: rgba(125, 222, 64, 0.2);
    --surface-success-tone: #0b5d0d;
    --surface-error-tint: rgba(227, 63, 42, 0.18);
    --surface-error-tone: #8b0f0b;
    --app-nav-active-color: var(--color-primary-blue-dark);
    --app-nav-active-tint: rgba(59, 87, 237, 0.12);
}

body.surface-workspace {
    --surface-accent: var(--color-primary-blue);
    --surface-accent-dark: var(--color-primary-blue-dark);
    --surface-triangle-gradient: linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    --surface-header-gradient: radial-gradient(ellipse at 47.2% 5.2%, #3B57ED 0%, #0D0DCC 100%);
    --surface-header-shadow: #3B57ED;
    --surface-header-ink: #fff;
    --surface-info-tint: rgba(59, 87, 237, 0.18);
    --surface-info-tone: #0D0DCC;
    --app-nav-active-color: var(--color-primary-blue-dark);
    --app-nav-active-tint: rgba(59, 87, 237, 0.12);
}

body.surface-library {
    --surface-accent: var(--color-primary-purple);
    --surface-accent-dark: var(--color-primary-purple-dark);
    --surface-triangle-gradient: linear-gradient(180deg, #ED52C9 0%, #AA00AA 100%);
    --surface-header-gradient: radial-gradient(ellipse at 47.2% 5.2%, #ED52C9 0%, #AA00AA 100%);
    --surface-header-shadow: #ED52C9;
    --surface-header-ink: #fff;
    --surface-info-tint: rgba(237, 82, 201, 0.18);
    --surface-info-tone: #8B1276;
    --app-nav-active-color: var(--color-primary-purple-dark);
    --app-nav-active-tint: rgba(237, 82, 201, 0.14);
}

body.surface-wizard {
    --surface-accent: var(--color-primary-yellow);
    --surface-accent-dark: var(--color-primary-yellow-dark);
    --surface-triangle-gradient: linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
    --surface-header-gradient: radial-gradient(ellipse at 47.2% 5.2%, #F8DC66 0%, #EDB212 100%);
    --surface-header-shadow: #F8DC66;
    --surface-header-ink: #000;
    --surface-info-tint: rgba(248, 220, 102, 0.26);
    --surface-info-tone: #7A5A06;
    --app-nav-active-color: var(--color-primary-blue-dark);
    --app-nav-active-tint: rgba(59, 87, 237, 0.12);
}

body.surface-build {
    --surface-accent: var(--color-primary-red);
    --surface-accent-dark: var(--color-primary-red-dark);
    --surface-triangle-gradient: linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    --surface-header-gradient: radial-gradient(ellipse at 47.2% 5.2%, #E33F2A 0%, #B50600 100%);
    --surface-header-shadow: #E33F2A;
    --surface-header-ink: #fff;
    --surface-info-tint: rgba(227, 63, 42, 0.18);
    --surface-info-tone: #8B0F0B;
    --app-nav-active-color: var(--color-primary-red-dark);
    --app-nav-active-tint: rgba(227, 63, 42, 0.14);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    transition-duration: 0.2s;
    transition-timing-function: ease;
    transition-property: color, background-color, border-color, box-shadow, opacity, transform;
    /*border: 1px solid black !important;*/
    color: #000;
}

html {
    height: 100%;
    font-family: alga, serif;
    font-weight: 500;
    text-align: left;
    width: 100%;
    overflow-x: hidden;
    scroll-behavior: smooth;
    background-color: #fff;
}

body {
    min-height: 100%;
    width: 100%;
    position: relative;
    isolation: isolate;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    background: var(--color-background);
    color: var(--color-text-primary);
}

.nav-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ui-review-copy-fallback {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

body.ui-review-mode [data-ui],
body.ui-review-mode [data-ui-region] {
    cursor: crosshair;
}

.ui-review-highlight {
    outline: 3px solid var(--surface-accent);
    outline-offset: 4px;
    box-shadow: 0 0 0 6px var(--surface-info-tint);
}

.ui-review-chip {
    position: absolute;
    z-index: 12000;
    max-width: 240px;
}

.ui-review-chip__button {
    padding: var(--space-8) var(--space-12);
    border: var(--border-width-strong) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-background);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-soft);
    font: inherit;
    font-size: var(--type-12);
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
}

main {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 0 7vw;
}

button,
input,
textarea,
select {
    font-family: alga, serif;
    color: var(--color-text-primary);
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.is-hidden {
    display: none !important;
}

[hidden] {
    display: none !important;
}

/* BACKGROUND COLORS */

.blue-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #3B57ED 0%, #0D0DCC 100%);
}
.red-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #E33F2A 0%, #B50600 100%);
}
.purple-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #ED52C9 0%, #AA00AA 100%);
}
.yellow-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #F8DC66 0%, #EDB212 100%);
    color: black;
}
.green-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #7DDE40 0%, #008805 100%);
}
.orange-gradient {
    background: radial-gradient(ellipse at 47.2% 5.2%, #F5B43A 0%, #ED8812 100%);
}
.black-background {
    background-color: #000;
}
.light-grey-background {
    background-color: #DDDDDD
}

.background-gradient-blue {
    background: linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
}
.background-gradient-red {
    background: linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
}
.background-gradient-purple {
    background: linear-gradient(180deg, #ED52C9 0%, #AA00AA 100%);
}
.background-gradient-yellow {
    background: linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}
.background-gradient-green {
    background: linear-gradient(180deg, #7DDE40 0%, #008805 100%);
}
.background-gradient-orange {
    background: linear-gradient(180deg, #F5B43A 0%, #ED8812 100%);
}

/* BACKGROUND TRIANGLE EFFECT */
.background-triangle {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0;
    pointer-events: none;
    clip-path: polygon(100% 35%, 100% 100%, 25% 100%);
    background: var(--surface-triangle-gradient);
    transition: 0s;
}

/* TEXT COLORS */
.white-text {
    color: #fff;
}
.black-text {
    color: #000;
}
.grey-text {
    color: #AAAAAA
}

/* SHADOW COLORS*/
.blue-shadow {
    box-shadow: 0 4px 0 0 #3B57ED;
}
.red-shadow {
    box-shadow: 0 4px 0 0 #E33F2A;
}
.purple-shadow {
    box-shadow: 0 4px 0 0 #ED52C9;
}
.yellow-shadow {
    box-shadow: 0 4px 0 0 #F8DC66;
}
.green-shadow {
    box-shadow: 0 4px 0 0 #7DDE40;
}
.orange-shadow {
    box-shadow: 0 4px 0 0 #F5B43A;
}


/* HEADER STYLES */
.gradient-header-container {
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--type-24);
    font-weight: 700;
    line-height: 1.1;
    padding: 16px 28px;
    min-height: 64px;
    width: 100%;
    margin-bottom: var(--space-40);
    box-shadow: var(--shadow-offset);
}

/* Variant for headers used inside cards – same styling but without the large bottom margin */
.gradient-header-container-card {
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--type-20);
    font-weight: 700;
    line-height: 1.15;
    padding: 12px 22px;
    min-height: 56px;
    width: 100%;
    margin-bottom: 0; /* remove extra space within card */
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.08);
}

h2 {
    font-size: 56px;
    font-weight: 700;
}

/* TEXT STYLES */
.text-lg {
    font-size: 28px;
    font-weight: 500;
}
.bold {
    font-size: 24px;
    font-weight: 700;
}

.text-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
}


.image-and-text {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}


/* CARD STYLES */
h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
}

.sub-header {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--color-text-secondary);
    margin-bottom: 16px;
}

.card-style {
    border: var(--border-width-panel) solid #000;
    border-radius: var(--radius-lg);
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: var(--shadow-card);
    overflow: hidden;
}

.large-card {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 20px;
    align-items: stretch;
    padding: 28px;
    border-radius: 28px;
}

.small-card {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    padding: 20px;
    gap: 16px;
    border-radius: 24px;
}
.card-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}
.card-btn {
    width: 100%;
    color: #fff;
    background-color: #000;
    border-radius: 8px;
    padding: 16px;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    border: none;
    cursor: pointer;
}
.small-card-container{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 0;
    max-height: 60vh;
    overflow: auto;

    --fade: 20px; /* only bottom fade */

    -webkit-mask-image: linear-gradient(
        to bottom,
        black calc(100% - var(--fade)),
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom,
        black calc(100% - var(--fade)),
        transparent 100%
    );

    scrollbar-width: none;
}

/* Dashboard task card tweaks */
.task-card{ width:calc(50% - 8px); min-height: 240px; }
.task-card .avatar{ width:64px; height:64px; border-radius:50%; }
@media(max-width:900px){ .task-card{ width:100%; } }

/* NAVIGATION STYLES */
.top-navigation-container {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 36px 0 28px;
}
.settings-container {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
}
.workspace-controls {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
}
.workspace-control {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:var(--control-height-shell);
    padding:0 16px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-sm);
    background:var(--color-white);
    box-shadow:var(--shadow-control);
    color:var(--color-text-primary);
    font-size:var(--type-14);
    font-weight:700;
    line-height:1;
}
.workspace-control--neutral {
    background:var(--color-white);
    color:var(--color-text-primary);
}
.workspace-control--primary {
    background:var(--color-border);
    color:var(--color-white);
}
.workspace-pill {
    gap:8px;
}
.workspace-user {
    display:flex;
    flex-direction:row;
    align-items:center;
    line-height:1;
}
.workspace-user strong {
    font-size:14px;
    font-weight:700;
}
.workspace-user span {
    display:none;
}
.workspace-select-wrap {
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    gap:10px;
    min-width:220px;
    padding:0 14px;
}
.workspace-select-label {
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.06em;
}
.workspace-client-select {
    font-family:alga, serif;
    font-weight:700;
    font-size:14px;
    border:none;
    background:transparent;
    min-width:160px;
    outline:none;
    height:100%;
    color:inherit;
    appearance:none;
}
.workspace-nav-btn {
    padding:0 18px;
    cursor:pointer;
}
.workspace-nav-btn-secondary {
    background:var(--color-white);
    color:var(--color-text-primary);
}
.workspace-banner {
    width:100%;
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    padding:14px 18px;
    margin:-8px 0 24px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:var(--color-white);
    box-shadow:var(--shadow-control);
}
.workspace-banner-eyebrow {
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}
.workspace-banner strong {
    font-size:20px;
    font-weight:700;
}
.workspace-banner-meta {
    font-size:13px;
    color:var(--color-text-secondary);
}
body[data-workspace-context="compact"] .workspace-banner {
    display:none;
}
.launch-momentum-strip {
    width:100%;
    margin:-8px 0 24px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:var(--color-white);
    box-shadow:var(--shadow-control);
}
.launch-momentum-strip__content {
    display:grid;
    grid-template-columns:minmax(220px, 1fr) minmax(180px, 320px) auto;
    align-items:center;
    gap:18px;
    padding:14px 18px;
}
.launch-momentum-strip__copy {
    min-width:0;
}
.launch-momentum-strip__eyebrow {
    margin:0 0 4px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
    color:var(--color-text-secondary);
}
.launch-momentum-strip__title {
    margin:0;
    font-size:20px;
    line-height:1.18;
    font-weight:700;
    color:var(--color-text-primary);
}
.launch-momentum-strip__meta {
    margin:4px 0 0;
    font-size:13px;
    color:var(--color-text-secondary);
}
.launch-momentum-strip__progress {
    min-width:0;
}
.launch-momentum-progress {
    display:block;
    width:100%;
    height:12px;
    overflow:hidden;
    border:none;
    border-radius:999px;
    background:var(--color-background-secondary);
}
.launch-momentum-progress::-webkit-progress-bar {
    border-radius:999px;
    background:var(--color-background-secondary);
}
.launch-momentum-progress::-webkit-progress-value {
    border-radius:999px;
    background:linear-gradient(90deg, var(--color-primary-blue), var(--color-primary-red));
}
.launch-momentum-progress::-moz-progress-bar {
    border-radius:999px;
    background:linear-gradient(90deg, var(--color-primary-blue), var(--color-primary-red));
}
.launch-momentum-strip__reward {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    white-space:nowrap;
}
.launch-momentum-strip__reward span {
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:var(--color-background-secondary);
    font-size:13px;
    font-weight:700;
    color:var(--color-text-primary);
}
.launch-momentum-strip__reward a {
    display:inline-flex;
    align-items:center;
    min-height:32px;
    font-size:13px;
    font-weight:700;
    color:var(--color-primary-blue-dark);
    text-decoration:none;
}
.launch-momentum-strip__reward a:hover {
    text-decoration:underline;
}
.launch-momentum-strip.is-earned {
    border-color:var(--color-primary-blue);
}
.logo-and-text-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 40px;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.nav-text {
    font-size: 32px;
    font-weight: 700;
    color: #000;
}

/* LOGO IMAGE STYLE */
.logo-img {
    height: 40px;
    width: auto;
    display: block;
}

/* PAGE LAYOUT STYLES */
.three-column-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 32px;
}
.column {
    width: 30%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.one-column-container{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.app-back-link,
.campaign-editor-back-link,
.campaign-overview-back-link {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 8px;
    margin: -8px 0 24px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #000;
    text-decoration: none;
    border-bottom: 2px solid transparent;
}

.app-back-link:hover,
.campaign-editor-back-link:hover,
.campaign-overview-back-link:hover {
    border-color: #000;
}

.page-split-layout {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
    gap: 32px;
    align-items: flex-start;
}

.page-main-column,
.page-sidebar-column {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.section-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: -16px;
}

.section-toolbar--spread {
    justify-content: space-between;
}

.heading-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.heading-with-icon img {
    width: 24px;
    height: 24px;
}

.panel-message,
.empty-state-copy {
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.muted-paragraph {
    margin: 12px 0 20px;
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.centered-empty-state {
    text-align: center;
    padding: 24px;
}

.centered-empty-state--spacious {
    padding: 40px 24px;
}

body.dashboard-page main {
    padding: 0 clamp(28px, 2vw, 40px) 64px;
}

.dashboard-top-navigation,
.app-shell-navigation {
    align-items: center;
    gap: clamp(12px, 1vw, 18px);
    padding: 26px 0 38px;
}

.dashboard-top-navigation .logo-and-text-container,
.app-shell-navigation .logo-and-text-container {
    flex: 0 0 auto;
    gap: var(--space-16);
}

.dashboard-top-navigation .logo-img,
.app-shell-navigation .logo-img {
    height: 58px;
}

.dashboard-top-navigation .nav-text,
.app-shell-navigation .nav-text {
    font-size: var(--type-32);
    line-height: 1;
    white-space: nowrap;
}

.dashboard-identity-controls,
.dashboard-page .workspace-controls {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: var(--space-12);
}

.dashboard-page .workspace-control,
.app-shell-navigation .workspace-control {
    min-height: 62px;
    border: var(--border-width-control) solid var(--color-border-light);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-soft);
}

.dashboard-client-control {
    position: relative;
    grid-template-columns: auto minmax(86px, 1fr) auto;
    min-width: 178px;
    max-width: 260px;
    padding: 0 12px;
    flex: 0 0 auto;
}

.dashboard-client-control .workspace-client-select {
    min-width: 0;
    max-width: none;
    width: 100%;
}

.dashboard-client-control::after,
.dashboard-chevron {
    content: "";
    width: 8px;
    height: 8px;
    border-right: var(--border-width-control) solid currentColor;
    border-bottom: var(--border-width-control) solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}

.app-shell-menu-toggle {
    appearance: none;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--color-text-primary);
    cursor: pointer;
}

.app-shell-menu-toggle span {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: var(--radius-pill);
    background: currentColor;
    transform-origin: center;
}

.dashboard-nav-links {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: clamp(10px, 1vw, 18px);
    min-width: 0;
}

.dashboard-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 44px;
    border: none;
    background: transparent;
    color: var(--color-text-primary);
    font: inherit;
    font-size: var(--type-16);
    font-weight: 400;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
}

.dashboard-nav-link span {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.dashboard-nav-link:hover,
.dashboard-nav-link:focus-visible {
    color: var(--app-nav-active-color, var(--surface-accent));
}

.dashboard-nav-link.is-active {
    color: var(--app-nav-active-color, var(--surface-accent));
}

.dashboard-nav-link.is-active span {
    text-decoration: underline;
    text-decoration-color: currentColor;
    text-decoration-thickness: var(--border-width-control);
    text-underline-offset: 6px;
}

.dashboard-nav-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.dashboard-nav-icon-img {
    stroke: none;
}

#open-course-hub-btn .dashboard-nav-icon,
[data-app-nav-key="course"] .dashboard-nav-icon {
    width: 17px;
    height: 17px;
    transform: translateY(0.5px);
}

.dashboard-top-navigation .dashboard-logout-btn,
.app-shell-navigation .dashboard-logout-btn {
    flex: 0 0 auto;
    min-width: 104px;
    min-height: 44px;
    height: 44px;
    padding: 10px 16px;
    font-size: var(--type-14);
    line-height: 1;
}

.dashboard-center-column {
    width: auto;
    min-width: 0;
    align-self: stretch;
    justify-content: flex-start;
    gap: var(--space-24);
}

.dashboard-persona-stage {
    width: min(100%, 460px);
    height: 265px;
    min-height: 265px;
    margin: 28px auto 0;
    overflow: visible;
}

.dashboard-persona-portrait {
    position: absolute;
    width: 150px;
    height: 150px;
}

.dashboard-persona-portrait--primary {
    left: 6%;
    top: 28px;
}

.dashboard-persona-portrait--secondary {
    right: 4%;
    top: 64px;
}

.dashboard-persona-portrait .persona-img-md {
    width: 150px;
    height: 150px;
}

.dashboard-mini-card {
    gap: 8px;
}

.dashboard-mini-card.dashboard-mini-card--stretch {
    gap: 12px;
    align-items: stretch;
}

.course-shell {
    align-items: stretch;
    gap: var(--space-18);
    max-width: 1240px;
    margin: 0 auto;
}

.course-masthead {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-20);
    align-items: end;
}

.course-masthead__copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    max-width: 76ch;
}

.course-back-link {
    margin: 0 0 var(--space-8);
}

.course-masthead__copy .page-title,
.course-hero-card .section-title,
.course-week-card__title,
.course-detail-title,
.course-detail-panel .section-title {
    font-family: alga, serif;
}

.course-masthead__copy .page-title {
    font-size: clamp(42px, 4.8vw, 64px);
    line-height: 0.96;
    letter-spacing: -0.05em;
    max-width: 14ch;
}

.course-masthead__copy .page-intro {
    max-width: 56ch;
}

.course-masthead__action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.course-hero-card {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(160px, 1fr));
    gap: var(--space-14);
    align-items: stretch;
    padding: clamp(20px, 2.4vw, 28px);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 28px;
    background:
        radial-gradient(circle at top left, rgba(64, 118, 255, 0.12), transparent 48%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 249, 255, 0.96));
    box-shadow: 0 16px 44px rgba(13, 31, 74, 0.07);
}

.course-hero-card__copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-8);
    min-width: 0;
    max-width: 44ch;
}

.course-hero-card__copy .section-title {
    max-width: 14ch;
    font-size: clamp(30px, 3vw, 40px);
    line-height: 1;
}

.course-hero-card__copy .section-supporting-copy {
    max-width: 44ch;
    font-size: var(--type-16);
    line-height: 1.6;
}

.course-progress-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    gap: var(--space-12);
    align-self: stretch;
    grid-column: 2 / span 3;
}

.course-progress-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-16);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.9);
    min-width: 0;
}

.course-progress-card__label {
    font-size: var(--type-12);
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-secondary);
    font-weight: 700;
}

.course-progress-card strong {
    font-size: clamp(18px, 1.8vw, 26px);
    line-height: 1.08;
    letter-spacing: -0.03em;
}

.course-progress-card span:last-child {
    color: var(--color-text-secondary);
    font-size: var(--type-13);
    line-height: 1.55;
}

.course-browser-panel {
    width: 100%;
}

.course-browser-toggle {
    width: 100%;
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 14px 36px rgba(13, 31, 74, 0.05);
    overflow: hidden;
}

.course-browser-toggle__summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-20);
    padding: clamp(18px, 2.2vw, 24px);
    cursor: pointer;
}

.course-browser-toggle__summary::-webkit-details-marker {
    display: none;
}

.course-browser-toggle__summary::after {
    content: 'Open';
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    padding: 10px 12px;
    border-radius: 999px;
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.1);
    background: rgba(255, 255, 255, 0.92);
    color: var(--color-text-primary);
    font-size: var(--type-12);
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.course-browser-toggle[open] .course-browser-toggle__summary::after {
    content: 'Close';
}

.course-browser-toggle__copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    max-width: 64ch;
}

.course-browser-toggle__copy .section-title {
    font-family: alga, serif;
    font-size: clamp(24px, 2.4vw, 32px);
    line-height: 1.02;
}

.course-browser-toggle__meta {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 999px;
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.1);
    background: rgba(247, 249, 255, 0.9);
    color: var(--color-text-secondary);
    font-size: var(--type-12);
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.course-week-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-16);
    padding: 0 clamp(18px, 2.2vw, 24px) clamp(18px, 2.2vw, 24px);
}

.course-week-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    min-width: 0;
    padding: var(--space-18);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 22px;
    background: rgba(248, 250, 255, 0.8);
}

.course-week-card__header,
.course-week-card__copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.course-week-card__eyebrow-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
}

.course-week-card__progress {
    font-size: var(--type-12);
    line-height: 1.4;
    color: var(--color-text-secondary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.course-week-card__title {
    margin: 0;
    font-size: clamp(20px, 1.8vw, 26px);
    line-height: 1.12;
}

.course-week-card__summary {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.5;
}

.course-lesson-list {
    display: grid;
    gap: var(--space-8);
}

.course-lesson-row {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-12);
    padding: 11px 12px;
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.04);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    text-align: left;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.course-lesson-row:hover {
    border-color: rgba(14, 18, 36, 0.12);
    background: rgba(255, 255, 255, 0.96);
    transform: translateY(-1px);
}

.course-lesson-row__day {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(14, 18, 36, 0.06);
    font-size: var(--type-13);
    font-weight: 700;
    line-height: 1;
}

.course-lesson-row__copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.course-lesson-row__copy strong {
    font-size: var(--type-14);
    line-height: 1.25;
    max-width: 18ch;
}

.course-lesson-row__copy span {
    color: var(--color-text-secondary);
    font-size: var(--type-12);
    line-height: 1.45;
}

.course-lesson-row__state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.course-lesson-row__state--current {
    background: rgba(24, 99, 242, 0.12);
    color: var(--surface-info-tone);
}

.course-lesson-row__state--complete {
    background: rgba(18, 133, 74, 0.12);
    color: #11623a;
}

.course-lesson-row__state--selected {
    background: rgba(14, 18, 36, 0.08);
    color: var(--color-text-primary);
}

.course-lesson-row__state--open {
    background: rgba(14, 18, 36, 0.05);
    color: var(--color-text-secondary);
}

.course-lesson-row.is-selected {
    border-color: rgba(14, 18, 36, 0.16);
    background: rgba(255, 255, 255, 0.98);
}

.course-lesson-row.is-current {
    border-color: rgba(24, 99, 242, 0.28);
    background: rgba(244, 248, 255, 0.98);
}

.course-lesson-row.is-current .course-lesson-row__day {
    background: rgba(24, 99, 242, 0.14);
    color: var(--surface-info-tone);
}

.course-lesson-row.is-complete .course-lesson-row__day {
    background: rgba(18, 133, 74, 0.12);
    color: #11623a;
}

.course-detail-panel {
    min-width: 0;
}

.course-detail-empty,
.course-detail-article {
    display: flex;
    flex-direction: column;
    gap: clamp(24px, 3vw, 34px);
    width: 100%;
    max-width: none;
    padding: clamp(24px, 3.2vw, 40px);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 18px 48px rgba(13, 31, 74, 0.06);
}

.course-detail-empty__copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    max-width: 56ch;
}

.course-detail-header {
    display: flex;
    flex-direction: column;
    gap: var(--space-18);
}

.course-detail-header__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
    flex-wrap: wrap;
}

.course-detail-header__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.course-detail-header__status--current {
    background: rgba(24, 99, 242, 0.12);
    color: var(--surface-info-tone);
}

.course-detail-header__status--complete {
    background: rgba(18, 133, 74, 0.12);
    color: #11623a;
}

.course-detail-header__status--open {
    background: rgba(14, 18, 36, 0.06);
    color: var(--color-text-secondary);
}

.course-detail-header__copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    max-width: 58ch;
}

.course-detail-kicker {
    margin: 0;
    font-size: var(--type-13);
    line-height: 1.5;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-secondary);
    font-weight: 700;
}

.course-detail-title {
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 0.96;
    letter-spacing: -0.04em;
}

.course-detail-summary {
    margin: 0;
    max-width: 48ch;
    font-size: clamp(19px, 1.7vw, 22px);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.course-meta-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-12);
}

.course-meta-item {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-width: 0;
    padding: var(--space-16);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 18px;
    background: rgba(248, 250, 255, 0.78);
}

.course-meta-item__label {
    font-size: var(--type-12);
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-secondary);
    font-weight: 700;
}

.course-meta-item strong {
    font-size: var(--type-18);
    line-height: 1.3;
}

.course-meta-item span:last-child {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.55;
}

.course-reading-stack {
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 3vw, 40px);
}

.course-detail-section {
    display: flex;
    flex-direction: column;
    gap: var(--space-18);
}

.course-note-grid,
.course-callout-grid,
.course-input-grid,
.course-output-grid,
.course-guide-grid {
    display: grid;
    gap: var(--space-14);
}

.course-note-grid,
.course-callout-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.course-note-card,
.course-callout-card,
.course-input-card,
.course-guide-card,
.course-guide-section,
.course-output-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    min-width: 0;
    padding: clamp(18px, 2vw, 24px);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.86);
}

.course-note-card__label,
.course-callout-card__label,
.course-guide-card__label,
.course-output-card__label,
.course-resource-card__label {
    font-size: var(--type-12);
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-secondary);
    font-weight: 700;
}

.course-note-card strong,
.course-callout-card strong,
.course-guide-card strong {
    font-size: var(--type-18);
    line-height: 1.3;
}

.course-note-card span:last-child,
.course-callout-card span:last-child,
.course-guide-card span:last-child {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.6;
}

.course-instructions-block {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.course-step-list {
    margin: 0;
    padding-left: 1.2rem;
    display: grid;
    gap: var(--space-10);
}

.course-step-list li {
    font-size: var(--type-16);
    line-height: 1.7;
    max-width: 70ch;
}

.course-solve-list {
    display: grid;
    gap: var(--space-10);
    margin: 0;
    padding-left: 1.2rem;
}

.course-solve-list li {
    font-size: var(--type-16);
    line-height: 1.7;
    max-width: 70ch;
}

.course-exercise-form,
.course-output-panel,
.course-comparison-panel,
.course-guide-section,
.course-checklist-stack {
    display: flex;
    flex-direction: column;
    gap: var(--space-18);
}

.course-input-grid,
.course-output-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

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

.course-input-card,
.course-guide-section {
    background: rgba(248, 250, 255, 0.82);
}

.course-input-card__label {
    font-size: var(--type-16);
    line-height: 1.3;
    font-weight: 700;
}

.course-input-card__hint {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.6;
    max-width: 40ch;
}

.course-input-shell {
    display: flex;
    align-items: center;
    min-height: 56px;
    gap: var(--space-10);
    padding: 0 var(--space-14);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.1);
    border-radius: 18px;
    background: var(--color-white);
}

.course-input-shell .form-input {
    border: 0;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    background: transparent;
}

.course-input-shell .form-input:focus {
    outline: none;
    box-shadow: none;
}

.course-input-affix {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1;
    font-weight: 700;
}

.course-exercise-form .page-actions {
    justify-content: flex-start;
}

.course-output-panel {
    padding: clamp(20px, 2.4vw, 28px);
    border: var(--border-width-control) solid rgba(24, 99, 242, 0.12);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(255, 255, 255, 0.98));
}

.course-output-grid {
    align-items: stretch;
}

.course-output-card {
    gap: var(--space-8);
    background: rgba(255, 255, 255, 0.92);
    margin: 0;
    min-width: 0;
    min-height: 100%;
}

.course-output-card strong {
    font-size: clamp(24px, 2.2vw, 34px);
    line-height: 1.04;
    letter-spacing: -0.03em;
}

.course-output-card.is-primary {
    border-color: rgba(24, 99, 242, 0.2);
    background: linear-gradient(135deg, rgba(24, 99, 242, 0.07), rgba(255, 255, 255, 0.98));
}

.course-output-card span:last-child {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.6;
    max-width: 42ch;
}

.course-guide-section .course-solve-list {
    margin: 0;
}

.course-comparison-table {
    overflow-x: auto;
}

.course-comparison-table table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}

.course-comparison-table th,
.course-comparison-table td {
    padding: var(--space-12) var(--space-14);
    border-bottom: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    text-align: left;
    vertical-align: top;
    font-size: var(--type-14);
    line-height: 1.5;
}

.course-comparison-table thead th {
    background: rgba(248, 250, 255, 0.92);
    font-size: var(--type-12);
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-secondary);
}

.course-comparison-table tbody th {
    font-weight: 700;
    color: var(--color-text-primary);
}

.course-checklist-list,
.course-resource-list {
    display: grid;
    gap: var(--space-12);
}

.course-checklist-item,
.course-resource-card {
    display: flex;
    align-items: flex-start;
    gap: var(--space-12);
    min-width: 0;
    padding: clamp(16px, 1.8vw, 22px);
    border: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
    border-radius: 18px;
    background: rgba(248, 250, 255, 0.78);
    margin: 0;
}

.course-checklist-item input {
    margin-top: 4px;
    flex-shrink: 0;
}

.course-checklist-item__copy,
.course-resource-card__copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.course-checklist-item__copy strong,
.course-resource-card__copy strong {
    font-size: var(--type-17);
    line-height: 1.3;
}

.course-checklist-item__copy span:not(.badge),
.course-resource-card__copy span {
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.6;
}

.course-guide-card {
    margin: 0;
    min-width: 0;
    background: rgba(248, 250, 255, 0.82);
}

.course-resource-card {
    justify-content: space-between;
}

.course-lesson-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: var(--space-4);
    border-top: var(--border-width-control) solid rgba(14, 18, 36, 0.08);
}

.dashboard-empty-card {
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 120px;
}

@media (max-width: 1100px) {
    .course-masthead,
    .course-hero-card {
        grid-template-columns: 1fr;
    }

    .course-masthead__action {
        justify-content: flex-start;
    }

    .course-progress-grid {
        grid-column: auto;
    }
}

.page-section-block {
    margin-top: 28px;
}

.onboarding-shell {
    align-items: stretch;
    gap: 0;
}

.onboarding-start-header {
    align-items: stretch;
    gap: 16px;
}

.onboarding-hero-header {
    align-items: stretch;
    gap: 16px;
}

.onboarding-start-header .page-title-block {
    max-width: none;
    width: 100%;
    align-items: stretch;
    text-align: center;
}

.onboarding-hero-header .page-title-block {
    max-width: none;
    width: 100%;
    align-items: stretch;
    text-align: center;
}

.onboarding-start-header .gradient-header-container {
    justify-content: center;
    padding: 18px 32px;
    text-align: center;
}

.onboarding-hero-header .gradient-header-container {
    justify-content: center;
    padding: 18px 32px;
    text-align: center;
}

.onboarding-hero-header .page-intro {
    max-width: 960px;
    align-self: center;
    text-align: center;
}

.onboarding-start-header .page-intro {
    max-width: none;
    align-self: center;
    white-space: nowrap;
}

.onboarding-step-progress-row {
    width: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    align-self: flex-start;
}

.onboarding-step-progress {
    flex: 0 0 auto;
    width: 108px;
    min-width: 108px;
    height: 10px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-background);
    overflow: hidden;
}

.onboarding-step-progress__fill {
    display: block;
    height: 100%;
    border-radius: var(--radius-pill);
    background: var(--surface-header-gradient);
}

.onboarding-step-progress__fill--step-1 {
    width: 20%;
}

.onboarding-step-progress__fill--step-2 {
    width: 40%;
}

.onboarding-step-progress__fill--step-3 {
    width: 60%;
}

.onboarding-step-progress__fill--step-4 {
    width: 80%;
}

.onboarding-step-progress__fill--step-5 {
    width: 100%;
}

body[data-onboarding-step] .background-triangle {
    z-index: 0;
    clip-path: polygon(100% 24%, 100% 100%, 18% 100%);
}

body[data-onboarding-step] main {
    position: relative;
    z-index: 1;
}

.onboarding-layout {
    margin-top: 12px;
}

.onboarding-layout--single {
    width: 100%;
}

.onboarding-setup-hero {
    display: grid;
    grid-template-columns: minmax(320px, 440px) minmax(0, 1fr);
    gap: 20px;
    margin: 18px 0 24px;
    align-items: start;
}

.onboarding-setup-aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.onboarding-panel,
.onboarding-sidebar-card {
    align-items: stretch;
    gap: 24px;
}

.onboarding-form-stack {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.onboarding-goal-shell {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: clamp(20px, 3vw, 36px);
}

.onboarding-discovery-form {
    gap: 24px;
}

.onboarding-discovery-panel {
    overflow: hidden;
}

.onboarding-field {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.onboarding-field-note {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-text-secondary);
}

.onboarding-field__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px 12px;
    align-items: center;
}

.onboarding-legal-panel {
    margin-bottom: 24px;
}

.onboarding-legal-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    min-width: 0;
}

.onboarding-legal-label {
    color: var(--color-text-secondary);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.onboarding-legal-form .form-input {
    width: 100%;
    min-width: 0;
}

.onboarding-legal-readiness {
    grid-column: 1 / -1;
    display: none;
    min-width: 0;
    padding: 14px 16px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-md);
    background: rgba(255,255,255,0.92);
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.onboarding-legal-readiness.is-visible {
    display: block;
}

.onboarding-legal-readiness.is-ready {
    border-color: rgba(0,136,5,0.38);
    background: rgba(83,206,38,0.12);
    color: #124615;
}

.onboarding-legal-readiness.is-missing {
    border-color: rgba(181,6,0,0.36);
    background: rgba(227,63,42,0.10);
    color: #5b130f;
}

.onboarding-legal-actions {
    grid-column: 1 / -1;
}

.onboarding-textarea {
    min-height: 132px;
    resize: vertical;
}

.onboarding-textarea-lg {
    min-height: 220px;
}

.onboarding-discovery-stepper {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.onboarding-discovery-stepper__viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
    transition: height 220ms ease;
}

.onboarding-discovery-stepper__track {
    position: relative;
    width: 100%;
    min-height: 100%;
}

.onboarding-discovery-step {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(48px);
    transition:
        opacity 240ms ease,
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s linear 260ms;
    will-change: opacity, transform;
}

.onboarding-discovery-step.is-active {
    position: relative;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 0s;
}

.onboarding-discovery-step.is-before {
    transform: translateX(-48px);
}

.onboarding-discovery-step.is-after {
    transform: translateX(48px);
}

.onboarding-discovery-step__copy {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 56ch;
}

.onboarding-discovery-step__title {
    margin: 0;
    font-size: clamp(var(--type-24), 3.8vw, var(--type-32));
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.onboarding-discovery-step__support {
    max-width: 48ch;
}

.onboarding-discovery-step__field {
    width: 100%;
}

.onboarding-discovery-input {
    min-height: 220px;
    padding: 18px 20px;
    font-size: clamp(var(--type-20), 3vw, var(--type-32));
    line-height: 1.35;
    font-weight: 700;
}

.onboarding-discovery-input::placeholder {
    font-size: clamp(var(--type-16), 2.2vw, var(--type-20));
    font-weight: 500;
    color: var(--color-text-secondary);
}

.onboarding-discovery-input--single-line {
    min-height: 0;
}

.onboarding-discovery-stepper__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.onboarding-discovery-stepper__status {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1 1 180px;
}

.onboarding-discovery-stepper__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.onboarding-discovery-stepper__dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.onboarding-discovery-stepper__dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.14);
    transition: transform 180ms ease, background 180ms ease;
}

.onboarding-discovery-stepper__dot.is-complete {
    background: var(--surface-accent);
}

.onboarding-discovery-stepper__dot.is-active {
    background: var(--surface-accent-dark);
    transform: scale(1.2);
}

.onboarding-progress-list,
.onboarding-run-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0;
    padding: 0;
}

.onboarding-progress-item {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 10px 14px;
    border: none;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.72);
}

.onboarding-run-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 12px 14px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.9);
}

.onboarding-progress-item strong,
.onboarding-run-item strong {
    display: block;
    margin-bottom: 4px;
}

.onboarding-progress-item strong {
    margin-bottom: 0;
}

.onboarding-progress-item.is-active {
    background: var(--surface-info-tint);
}

.onboarding-progress-item__line {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-height: 24px;
}

.onboarding-progress-item__meta {
    font-size: 13px;
    line-height: 1.5;
    color: var(--color-text-secondary);
}

.onboarding-progress-item__meta.is-active {
    font-style: italic;
}

.onboarding-choice-group {
    display: flex;
    flex-direction: column;
    gap: 18px;
    border: 0;
    margin: 0;
    padding: 0;
}

.onboarding-option-grid,
.onboarding-setup-grid,
.onboarding-metric-grid {
    display: grid;
    gap: 16px;
}

.onboarding-option-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-top: 4px;
}

.onboarding-metric-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-top: 4px;
}

.onboarding-option-card {
    position: relative;
    cursor: pointer;
    align-items: stretch;
    gap: 4px;
    min-height: 136px;
}

.onboarding-option-card strong {
    font-size: 22px;
    line-height: 1.15;
}

.onboarding-option-card span {
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.onboarding-option-card.is-selected {
    border-color: var(--surface-accent-dark);
    box-shadow: var(--shadow-float);
    transform: translateY(-2px);
}

.onboarding-current-task {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px 20px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.9);
}

.onboarding-current-task strong {
    font-size: 22px;
}

.onboarding-current-task span {
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.onboarding-setup-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.onboarding-setup-placeholder {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.onboarding-setup-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 140px;
    text-decoration: none;
    color: inherit;
}

.onboarding-setup-card strong {
    font-size: 20px;
}

.onboarding-setup-card span {
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.onboarding-priority-card {
    justify-content: flex-start;
    align-self: start;
}

.onboarding-build-graph-panel {
    gap: 18px;
}

.onboarding-run-list {
    max-height: 332px;
    overflow-y: auto;
    border: 0;
    outline: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding-right: 8px;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(21, 20, 17, 0.32) rgba(21, 20, 17, 0.08);
}

.onboarding-run-list::-webkit-scrollbar {
    width: 8px;
}

.onboarding-run-list::-webkit-scrollbar-track {
    background: rgba(21, 20, 17, 0.08);
    border-radius: 999px;
}

.onboarding-run-list::-webkit-scrollbar-thumb {
    background: rgba(21, 20, 17, 0.32);
    border-radius: 999px;
}

.onboarding-start-panel {
    gap: 18px;
}

.onboarding-start-panel .section-header {
    justify-content: flex-start;
}

.onboarding-start-actions {
    justify-content: flex-start;
}

.onboarding-start-status {
    width: 100%;
}

.onboarding-page-status {
    width: 100%;
}

.onboarding-process-card {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.onboarding-review-callout {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.onboarding-review-callout p,
.onboarding-review-callout h2 {
    margin: 0;
}

.onboarding-review-stage {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.onboarding-goal-stage {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.onboarding-goal-stage__header {
    justify-content: flex-start;
}

.onboarding-goal-loading {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 16px;
    min-height: 260px;
}

.onboarding-goal-loading .section-header {
    justify-content: center;
    align-items: center;
}

.onboarding-goal-loading .section-header__copy {
    max-width: 54ch;
    align-items: center;
    text-align: center;
}

.onboarding-goal-loading .page-eyebrow {
    align-self: center;
}

.onboarding-thinking-dots {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 32px;
}

.onboarding-thinking-dots span {
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.22;
    animation: onboardingThinkingDot 1.35s infinite ease-in-out;
}

.onboarding-thinking-dots span:nth-child(2) {
    animation-delay: 0.18s;
}

.onboarding-thinking-dots span:nth-child(3) {
    animation-delay: 0.36s;
}

@keyframes onboardingThinkingDot {
    0%, 80%, 100% {
        opacity: 0.22;
        transform: translateY(0);
    }
    40% {
        opacity: 1;
        transform: translateY(-5px);
    }
}

.onboarding-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.onboarding-review-panel {
    gap: 22px;
}

.onboarding-review-panel .section-header {
    align-items: flex-start;
}

.onboarding-review-panel .section-header__copy {
    max-width: none;
    width: 100%;
}

.onboarding-review-choice-grid {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
}

.onboarding-review-card {
    min-height: 0;
    gap: 12px;
    height: 100%;
    flex: 1 1 auto;
    justify-content: flex-start;
}

.onboarding-review-card__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
    align-items: flex-start;
}

.onboarding-review-card__description {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    max-height: 300px;
    overflow-y: scroll;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(21, 20, 17, 0.34) rgba(21, 20, 17, 0.08);
    color: var(--color-text-secondary);
    line-height: 1.55;
    padding-right: 12px;
    width: calc(100% + 12px);
    background-image: linear-gradient(rgba(21, 20, 17, 0.16), rgba(21, 20, 17, 0.16));
    background-repeat: no-repeat;
    background-position: right 4px top;
    background-size: 2px 100%;
}

.onboarding-review-card__description::-webkit-scrollbar {
    width: 8px;
}

.onboarding-review-card__description::-webkit-scrollbar-track {
    background: rgba(21, 20, 17, 0.08);
    border-radius: 999px;
}

.onboarding-review-card__description::-webkit-scrollbar-thumb {
    background: rgba(21, 20, 17, 0.32);
    border-radius: 999px;
}

.onboarding-review-carousel {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1 1 auto;
}

.onboarding-review-carousel__viewport {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 280px;
}

.onboarding-review-carousel__item {
    display: none;
    width: 100%;
    min-height: 100%;
    flex: 1 1 auto;
    align-self: stretch;
}

.onboarding-review-carousel__item.is-active {
    display: flex;
}

.onboarding-review-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

.onboarding-review-carousel__controls.is-hidden {
    display: none;
}

.onboarding-review-carousel__dots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    flex: 1 1 auto;
}

.onboarding-review-carousel__dot {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 999px;
    background: rgba(21, 20, 17, 0.18);
    cursor: pointer;
    transition: transform 140ms ease, background 140ms ease;
}

.onboarding-review-carousel__dot.is-active {
    background: var(--surface-accent);
    transform: scale(1.08);
}

.onboarding-review-editor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.onboarding-review-editor-grid--metrics {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.onboarding-review-editor-grid--channel,
.onboarding-review-editor-grid--content-type {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.onboarding-review-editor-grid--activation {
    grid-template-columns: minmax(0, 1fr);
}

.onboarding-activation-panel {
    gap: 18px;
}

.onboarding-content-options {
    gap: 12px;
}

.onboarding-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.onboarding-checkbox-card,
.checkbox-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-height: 96px;
    padding: 14px 16px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-white);
}

.onboarding-checkbox-card input,
.checkbox-card input {
    margin-top: 4px;
    accent-color: var(--surface-accent);
}

.onboarding-checkbox-card span,
.checkbox-card span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.onboarding-checkbox-card strong,
.checkbox-card strong {
    font-size: var(--type-16);
    line-height: 1.2;
}

.onboarding-checkbox-card small,
.checkbox-card small {
    color: var(--color-text-secondary);
    font-size: var(--type-12);
    line-height: 1.4;
}

.onboarding-offer-panel {
    gap: 18px;
}

.onboarding-offer-textarea {
    min-height: 160px;
    width: 100%;
}

.onboarding-offer-suggestions {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.onboarding-offer-suggestions__header {
    justify-content: flex-start;
}

.onboarding-offer-suggestion-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 240px;
    overflow-y: auto;
    padding-right: 8px;
    scrollbar-gutter: stable;
}

.onboarding-offer-suggestion-empty {
    padding: 16px 18px;
    border: 1px dashed var(--color-border-light);
    border-radius: 18px;
    color: var(--color-text-secondary);
    line-height: 1.5;
    background: rgba(255, 255, 255, 0.6);
}

.onboarding-offer-suggestion-btn {
    width: 100%;
    border: 1px solid var(--color-border-light);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    padding: 14px 16px;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 8px;
    cursor: pointer;
    transition: transform 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.onboarding-offer-suggestion-btn:hover,
.onboarding-offer-suggestion-btn:focus-visible {
    border-color: var(--color-border-medium);
    box-shadow: 0 0 0 4px rgba(248, 220, 102, 0.18);
    transform: translateY(-1px);
}

.onboarding-offer-suggestion-btn__label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
}

.onboarding-offer-suggestion-btn__text {
    line-height: 1.55;
}

.onboarding-offer-suggestion-list::-webkit-scrollbar {
    width: 10px;
}

.onboarding-offer-suggestion-list::-webkit-scrollbar-track {
    background: rgba(21, 20, 17, 0.08);
    border-radius: 999px;
}

.onboarding-offer-suggestion-list::-webkit-scrollbar-thumb {
    background: rgba(21, 20, 17, 0.32);
    border-radius: 999px;
}

.onboarding-goal-actions {
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: clamp(16px, 3vw, 28px);
}

.onboarding-preview-card__header,
.onboarding-preview-stage__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.onboarding-priority-card__title-block,
.onboarding-priority-card__actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.onboarding-priority-card__actions {
    gap: 16px;
}

.onboarding-priority-card__content {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.onboarding-priority-card__title-block h3 {
    margin: 0;
    font-size: 32px;
    line-height: 1.08;
}

.onboarding-priority-card__title-block p {
    margin: 0;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.onboarding-priority-card__actions .btn {
    align-self: flex-start;
}

.onboarding-founder-help {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 28px;
}

.onboarding-founder-help__copy {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.onboarding-founder-help .section-title {
    font-size: 22px;
    line-height: 1.14;
}

.onboarding-founder-help .section-supporting-copy {
    margin: 0;
    line-height: 1.55;
}

.onboarding-founder-help .btn {
    align-self: flex-start;
}

.onboarding-priority-followups {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding-top: 4px;
}

.onboarding-priority-followups__item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 14px;
    border-top: 1px solid rgba(21, 20, 17, 0.12);
}

.onboarding-priority-followups__item strong {
    font-size: 16px;
    line-height: 1.2;
}

.onboarding-priority-followups__item span {
    color: var(--color-text-secondary);
    line-height: 1.55;
}

.onboarding-priority-card__queue {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.onboarding-priority-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.onboarding-priority-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px 14px;
    border: 2px solid #000;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.74);
    line-height: 1.25;
}

.onboarding-priority-list__item .chip {
    flex: 0 0 auto;
}

.onboarding-preview-stage {
    min-width: 0;
}

.onboarding-preview-nav {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
}

.onboarding-preview-stage__frame {
    min-height: 480px;
    overflow: hidden;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: var(--shadow-subtle);
}

.onboarding-preview-stage__iframe-shell {
    position: relative;
    min-height: 480px;
    background: white;
}

.onboarding-preview-stage__iframe {
    display: block;
    width: 100%;
    min-height: 480px;
    border: 0;
    background: white;
}

.onboarding-preview-stage__loader {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 32px;
    text-align: center;
    color: var(--color-text-primary);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.92) 100%);
    transition: opacity 180ms ease, visibility 180ms ease;
}

.onboarding-preview-stage__loader strong {
    font-size: 24px;
    line-height: 1.15;
}

.onboarding-preview-stage__loader span:not(.ai-progress-dots):not(.ai-progress-dot) {
    max-width: 40ch;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.onboarding-preview-stage__iframe-shell.is-loaded .onboarding-preview-stage__loader {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.onboarding-preview-stage__meta {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.onboarding-preview-stage__title-row {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}

.onboarding-preview-stage__title-row strong {
    display: block;
    font-size: 24px;
    margin-bottom: 4px;
}

.onboarding-preview-stage__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.onboarding-preview-empty {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 480px;
    padding: 32px;
    text-align: center;
    gap: 10px;
}

.onboarding-preview-empty--loading .ai-progress-dots,
.onboarding-preview-stage__loader .ai-progress-dots {
    margin-bottom: 2px;
    color: var(--surface-accent-dark);
}

.onboarding-preview-empty strong {
    font-size: 24px;
}

.onboarding-preview-empty span {
    max-width: 38ch;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.onboarding-preview-card {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 480px;
    padding: 24px;
}

.onboarding-preview-card--funnel {
    padding: 0;
    overflow: hidden;
}

.onboarding-funnel-preview {
    display: flex;
    flex-direction: column;
    min-height: 480px;
    max-height: min(74vh, 760px);
}

.onboarding-funnel-preview__header {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
    padding: 24px;
    border-bottom: var(--border-width-control) solid rgba(21, 20, 17, 0.12);
    background: rgba(255, 255, 255, 0.94);
}

.onboarding-funnel-preview__header h3 {
    margin: 4px 0 6px;
    font-size: 28px;
    line-height: 1.12;
}

.onboarding-funnel-preview__header p {
    margin: 0;
    color: var(--color-text-secondary);
    line-height: 1.55;
}

.onboarding-funnel-preview__sequence {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    padding: 20px;
    overflow-y: auto;
    background: rgba(248, 246, 239, 0.72);
}

.onboarding-funnel-email {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border: var(--border-width-control) solid rgba(21, 20, 17, 0.14);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: var(--shadow-subtle);
}

.onboarding-funnel-email__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.onboarding-funnel-email__meta span {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border: var(--border-width-control) solid rgba(21, 20, 17, 0.14);
    border-radius: 999px;
    color: var(--color-text-secondary);
    font-size: 12px;
    line-height: 1;
    background: rgba(255, 255, 255, 0.82);
}

.onboarding-funnel-email h4 {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
}

.onboarding-funnel-email__body {
    white-space: pre-wrap;
    color: var(--color-text-secondary);
    line-height: 1.58;
}

.onboarding-preview-card__image {
    display: block;
    width: 100%;
    max-height: 360px;
    object-fit: contain;
    object-position: center;
    border-radius: var(--radius-sm);
    border: var(--border-width-control) solid var(--color-border);
    background: rgba(255, 255, 255, 0.8);
}

.onboarding-preview-card__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.onboarding-preview-card__body h3 {
    margin: 0;
    font-size: 30px;
    line-height: 1.12;
}

.onboarding-preview-card__body p {
    margin: 0;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.onboarding-preview-step-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6px;
}

.onboarding-preview-step-list li {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.82);
}

.btn.is-disabled,
.record-card.is-disabled {
    opacity: 0.55;
    pointer-events: none;
}

.ai-activity-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: min(360px, calc(100vw - 32px));
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: 16px 18px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: var(--shadow-float);
    z-index: 60;
}

.ai-activity-toast.is-visible {
    display: flex;
}

.ai-activity-toast__eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
}

.ai-activity-toast__title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.ai-activity-toast__detail {
    color: var(--color-text-secondary);
    line-height: 1.45;
}

.ai-activity-toast.is-info {
    background: rgba(255, 255, 255, 0.96);
}

.ai-activity-toast.is-success {
    background: var(--color-success-light);
}

.ai-activity-toast.is-error {
    background: var(--color-error-light);
}

.ai-progress-shell {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.ai-progress-title-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}

.ai-progress-title {
    min-width: 0;
}

.ai-progress-dots {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transform: translateY(1px);
}

.ai-progress-dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.22;
    animation: ai-progress-dot-pulse 1.2s ease-in-out infinite;
}

.ai-progress-dot:nth-child(2) {
    animation-delay: 0.2s;
}

.ai-progress-dot:nth-child(3) {
    animation-delay: 0.4s;
}

.ai-progress-detail {
    font-size: 0.95em;
    line-height: 1.5;
    font-weight: 600;
    color: inherit;
    opacity: 0.82;
}

@keyframes ai-progress-dot-pulse {
    0%, 80%, 100% {
        opacity: 0.22;
        transform: translateY(0);
    }
    40% {
        opacity: 0.92;
        transform: translateY(-1px);
    }
}

@media (max-width: 900px) {
    .onboarding-setup-hero,
    .onboarding-layout,
    .onboarding-option-grid,
    .onboarding-review-grid,
    .onboarding-review-choice-grid,
    .onboarding-review-editor-grid,
    .onboarding-legal-form,
    .onboarding-setup-grid,
    .onboarding-metric-grid,
    .onboarding-setup-placeholder {
        grid-template-columns: 1fr;
    }

    .onboarding-preview-nav,
    .onboarding-preview-stage__title-row,
    .onboarding-funnel-preview__header,
    .onboarding-step-progress-row,
    .onboarding-discovery-stepper__footer,
    .onboarding-discovery-stepper__actions,
    .onboarding-review-carousel__controls,
    .onboarding-goal-actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .onboarding-start-header .page-intro {
        white-space: normal;
    }

    .onboarding-hero-header .page-intro {
        max-width: none;
    }

    .onboarding-discovery-stepper__status {
        width: 100%;
        justify-content: flex-start;
    }

    .onboarding-discovery-input {
        min-height: 180px;
    }

    .onboarding-preview-stage__frame,
    .onboarding-preview-stage__iframe-shell,
    .onboarding-preview-stage__iframe,
    .onboarding-preview-card,
    .onboarding-funnel-preview,
    .onboarding-preview-empty {
        min-height: 380px;
    }

    .onboarding-funnel-preview {
        max-height: min(78vh, 680px);
    }

    .onboarding-funnel-preview__header,
    .onboarding-funnel-preview__sequence {
        padding: 16px;
    }

    .ai-activity-toast {
        right: 16px;
        left: 16px;
        bottom: 16px;
        width: auto;
    }
}

.dashboard-title-accent {
    margin: 0;
    color: var(--surface-accent);
}

.dashboard-layout {
    display: grid;
    grid-template-columns: minmax(300px, 0.85fr) minmax(330px, 0.9fr) minmax(500px, 1.2fr);
    align-items: start;
    gap: clamp(36px, 5vw, 86px);
}

.app-legal-footer {
    position:relative;
    z-index:2;
    width:min(100%, 1240px);
    margin:var(--space-40) auto 0;
    padding:var(--space-20);
    border:1px solid var(--color-border-light);
    border-radius:var(--radius-sm);
    background:var(--color-background-elevated);
    box-shadow:var(--shadow-soft);
}

.app-legal-footer__inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--space-16);
    flex-wrap:wrap;
}

.app-legal-footer__title {
    margin:0;
    color:var(--color-text-secondary);
    font-size:12px;
    font-weight:800;
    letter-spacing:0.08em;
    line-height:1.2;
    text-transform:uppercase;
}

.app-legal-footer__links {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px 16px;
    width:auto;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    list-style:none;
    overflow:visible;
}

.app-legal-footer__links li {
    padding:0;
    border:0;
}

.app-legal-footer__links a {
    color:var(--surface-accent-dark);
    font-size:13px;
    font-weight:800;
    line-height:1.35;
    text-decoration:underline;
    text-decoration-color:var(--color-border-medium);
    text-underline-offset:0.18em;
}

.dashboard-column {
    width: auto;
    min-width: 0;
    align-items: stretch;
}

.dashboard-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--dashboard-section-gap);
}

.dashboard-section__header {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
}

.dashboard-section .gradient-header-container {
    margin-bottom: 0;
}

.dashboard-header-bar {
    justify-content: flex-start;
    min-height: 70px;
    padding: 0 var(--space-32);
    border-radius: var(--radius-sm);
}

.dashboard-header-bar--split {
    display: flex;
    justify-content: space-between;
    gap: var(--space-16);
}

.dashboard-header-title {
    margin: 0;
    color: inherit;
    font-size: var(--type-24);
    font-weight: 700;
    line-height: 1.1;
}

.dashboard-header-bar .dashboard-new-campaign-btn {
    min-height: 44px;
    height: 44px;
    padding: 0 var(--space-24);
    border-radius: var(--radius-sm);
    box-shadow: none;
    font-size: var(--type-14);
    line-height: 1;
    white-space: nowrap;
}

.dashboard-header-bar .dashboard-new-campaign-btn span {
    color: inherit;
}

.personas-header-bar {
    display: grid;
    grid-template-columns: minmax(150px, auto) minmax(0, 1fr) minmax(150px, auto);
    align-items: center;
    gap: var(--space-16);
    margin-bottom: 0;
}

.personas-header-title {
    margin: 0;
    color: inherit;
    font-size: var(--type-24);
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
}

.personas-header-action {
    justify-self: stretch;
}

.products-header-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
    align-items: center;
    gap: var(--space-16);
    margin-bottom: 0;
}

.products-header-title {
    margin: 0;
    color: inherit;
    font-size: var(--type-24);
    font-weight: 700;
    line-height: 1.1;
}

.products-header-action {
    justify-self: end;
    min-width: 150px;
}

.dashboard-section__body {
    display: flex;
    flex-direction: column;
    gap: var(--dashboard-section-gap);
}

.dashboard-section__footer {
    display: flex;
    justify-content: center;
    padding-top: var(--dashboard-footer-gap);
}

.dashboard-section__body .small-card-container,
.dashboard-section__body .campaign-list {
    margin: 0;
}

.dashboard-section__body .small-card-container {
    flex: 0 0 auto;
    overflow: auto;
    max-height: min(60vh, 560px);
}

.dashboard-section--tasks .small-card-container {
    padding-bottom: var(--space-24);
}

.dashboard-section__body .dashboard-empty-card,
.dashboard-section__body .campaign-card--empty {
    min-height: 160px;
}

.dashboard-section__body .dashboard-empty-card {
    align-items: center;
    justify-content: center;
    min-height: 124px;
    background-color: var(--color-white);
    text-align: center;
}

.dashboard-section__body .dashboard-empty-card .sub-header {
    margin-bottom: 0;
}

.dashboard-recommendation-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-16);
}

.dashboard-recommendation-card__copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    width: 100%;
}

.dashboard-recommendation-card__copy .sub-header {
    margin-bottom: 0;
}

.dashboard-recommendation-card__details {
    display: grid;
    gap: var(--space-8);
    margin: 0;
    width: 100%;
}

.dashboard-recommendation-card__details div {
    display: grid;
    gap: var(--space-4);
}

.dashboard-recommendation-card__details dt {
    color: var(--color-text-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.dashboard-recommendation-card__details dd {
    margin: 0;
    color: var(--color-text-main);
    font-size: 13px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.dashboard-recommendation-card__link {
    color: var(--surface-accent-dark);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.dashboard-recommendation-card__action {
    align-self: flex-start;
}

.dashboard-campaign-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    border: none;
    border-radius: 0;
    background: transparent;
    overflow: visible;
}

.dashboard-campaign-list li {
    border-bottom: none;
    list-style: none;
}

.dashboard-campaign-list .campaign-card {
    border-radius: 32px;
}

.dashboard-campaign-list .campaign-card__title {
    color: var(--surface-accent);
}

.dashboard-campaign-list .campaign-card__button,
.btn-card-li {
    min-height: 44px;
    min-width: 104px;
    padding: 10px 16px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-border);
    color: var(--color-white);
    font-size: var(--type-14);
    font-weight: 700;
    box-shadow: var(--shadow-control);
    line-height: 1;
}

/* Center the button in the span */
button {
    font-family: alga, serif;
    font-weight: 700;
}
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    color: #fff;
    background-color: #000;
    border: var(--border-width-strong) solid #000;
    border-radius: var(--radius-sm);
    padding: 12px 20px;
    font-size: var(--type-16);
    line-height: 1.1;
    font-weight: 700;
    text-align: center;
    text-decoration:none;
    cursor: pointer;
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.12);
}
.btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    color:#000;
    background:rgba(255, 255, 255, 0.96);
    border:var(--border-width-strong) solid #000;
    border-radius:var(--radius-sm);
    padding:12px 20px;
    font-size:var(--type-16);
    line-height: 1.1;
    font-weight:700;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.08);
}
.btn-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    color:#fff;
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    border:var(--border-width-strong) solid #000;
    border-radius:var(--radius-sm);
    padding:12px 20px;
    font-size:var(--type-16);
    line-height: 1.1;
    font-weight:700;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.08);
}
.btn.secondary,
.btn--secondary{
    color:#000;
    background:#FFF;
    border-color:#000;
    box-shadow:0 4px 0 rgba(0, 0, 0, 0.08);
}
.btn.success,
.btn--success{
    color:#FFF;
    background:linear-gradient(180deg, #53CE26 0%, #008805 100%);
    border-color:#000;
    box-shadow:0 4px 0 rgba(0, 0, 0, 0.08);
}

.btn[data-onboarding-primary-action] {
    color: #fff;
    background: radial-gradient(ellipse at 47.2% 5.2%, var(--color-primary-blue) 0%, var(--color-primary-blue-dark) 100%);
    border-color: #000;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.18), 0 18px 32px rgba(59, 87, 237, 0.28);
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18);
}

.btn[data-onboarding-primary-action]:hover,
.btn[data-onboarding-primary-action]:focus-visible {
    box-shadow: 0 6px 0 rgba(0, 0, 0, 0.18), 0 22px 36px rgba(59, 87, 237, 0.32);
}

.btn[data-onboarding-primary-action]:focus-visible {
    outline: 4px solid rgba(248, 220, 102, 0.76);
    outline-offset: 4px;
}

.btn[data-onboarding-primary-action][data-onboarding-action-ready="true"]:not(:disabled):not(.is-disabled):not([hidden]) {
    animation: onboardingReadyActionNudge 5.2s ease-in-out 0.8s infinite;
}

.btn[data-onboarding-primary-action][data-onboarding-action-ready="true"]:not(:disabled):not(.is-disabled):hover,
.btn[data-onboarding-primary-action][data-onboarding-action-ready="true"]:not(:disabled):not(.is-disabled):focus-visible {
    animation-play-state: paused;
}

@keyframes onboardingReadyActionNudge {
    0%, 82%, 100% {
        transform: translateX(0) rotate(0deg);
    }
    84% {
        transform: translateX(-1px) rotate(-0.35deg);
    }
    86% {
        transform: translateX(2px) rotate(0.35deg);
    }
    88% {
        transform: translateX(-1px) rotate(-0.2deg);
    }
    90% {
        transform: translateX(1px) rotate(0.2deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn[data-onboarding-primary-action][data-onboarding-action-ready="true"]:not(:disabled):not(.is-disabled):not([hidden]) {
        animation: none;
    }
}

.btn:hover,
.btn-outline:hover,
.btn-danger:hover {
    transform: translateY(-1px);
}

.btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 16px;
    border: var(--border-width-control) solid var(--color-border-light);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.72);
    color: var(--color-text-primary);
    font-size: var(--type-14);
    font-weight: 700;
    cursor: pointer;
    box-shadow: none;
}

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: var(--border-width-strong) solid #000;
    border-radius: var(--radius-pill);
    background: #fff;
    box-shadow: var(--shadow-soft);
    cursor: pointer;
}

.btn-link,
.text-link-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: none;
    background: none;
    color: var(--surface-accent-dark);
    font-size: var(--type-14);
    font-weight: 700;
    line-height: 1.4;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    cursor: pointer;
}

.btn-link:hover,
.text-link-action:hover {
    color: var(--surface-accent);
}

.inline-action-group {
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.inline-action-group--center {
    justify-content: center;
}
.section-intro {
    max-width:760px;
    margin:-8px auto 24px;
    text-align:center;
    font-size:16px;
    line-height:1.6;
    color: var(--color-text-secondary);
}

.page-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--space-24);
    flex-wrap: wrap;
    margin: 0 0 var(--space-24);
}

.page-header .gradient-header-container {
    margin-bottom: 0;
}

.page-title-block {
    min-width: 0;
    max-width: 72ch;
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
}

.page-eyebrow {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 12px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-white);
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.1;
}

.page-title {
    margin: 0;
    font-size: clamp(var(--type-32), 5vw, var(--type-56));
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.02em;
}

.page-intro {
    margin: 0;
    max-width: 68ch;
    font-size: var(--type-16);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.page-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-12);
    flex-wrap: wrap;
}

.section-shell {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.section-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--space-16);
    flex-wrap: wrap;
}

.section-header__copy,
.panel-toolbar__copy {
    min-width: 0;
    max-width: 62ch;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.section-title {
    margin: 0;
    font-size: var(--type-24);
    line-height: 1.1;
    font-weight: 700;
}

.section-supporting-copy {
    margin: 0;
    font-size: var(--type-14);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.panel-toolbar {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-16);
    flex-wrap: wrap;
}

.action-group {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    flex-wrap: wrap;
}

.action-group--primary {
    justify-content: flex-end;
}

.empty-state {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    align-items: flex-start;
}

.empty-state__eyebrow {
    margin: 0;
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
}

.empty-state__title {
    margin: 0;
    font-size: var(--type-24);
    line-height: 1.08;
    font-weight: 700;
}

.empty-state__copy {
    margin: 0;
    max-width: 60ch;
    font-size: var(--type-14);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.empty-state__actions {
    display: flex;
    align-items: center;
    gap: var(--space-12);
    flex-wrap: wrap;
}

.sticky-commit-bar {
    position: sticky;
    bottom: var(--space-24);
    z-index: 20;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-16);
    flex-wrap: wrap;
    padding: var(--space-16) var(--space-24);
    border: var(--border-width-panel) solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-background-elevated);
    box-shadow: var(--shadow-float);
}

.sticky-commit-bar__copy {
    min-width: 0;
    max-width: 54ch;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.sticky-commit-bar__title {
    margin: 0;
    font-size: var(--type-20);
    line-height: 1.15;
    font-weight: 700;
}

.sticky-commit-bar__status {
    margin: 0;
    font-size: var(--type-14);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.sticky-commit-bar__actions {
    display: flex;
    align-items: center;
    gap: var(--space-12);
    flex-wrap: wrap;
}

@media (max-width: 900px) {
    .page-header,
    .section-header,
    .panel-toolbar,
    .sticky-commit-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .page-actions,
    .action-group,
    .sticky-commit-bar__actions {
        width: 100%;
        justify-content: flex-start;
    }

    .sticky-commit-bar {
        bottom: 0;
        border-radius: var(--radius-md);
    }

    .course-masthead,
    .course-hero-card,
    .course-progress-grid,
    .course-meta-strip,
    .course-note-grid,
    .course-callout-grid,
    .course-input-grid,
    .course-output-grid,
    .course-guide-grid {
        grid-template-columns: 1fr;
    }

    .course-browser-toggle__summary {
        flex-direction: column;
        align-items: flex-start;
    }

    .course-masthead__action {
        justify-content: flex-start;
    }

    .course-progress-grid {
        grid-column: auto;
    }

    .course-week-list {
        grid-template-columns: 1fr;
    }

    .course-lesson-row {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: flex-start;
    }

    .course-lesson-row__state {
        grid-column: 2;
        justify-self: flex-start;
    }

    .course-resource-card {
        flex-direction: column;
    }

    .course-input-card,
    .course-guide-card,
    .course-guide-section,
    .course-note-card,
    .course-callout-card,
    .course-output-card,
    .course-meta-item,
    .course-detail-empty,
    .course-detail-article {
        padding: var(--space-16);
    }

    .course-detail-title {
        font-size: clamp(30px, 9vw, 42px);
    }

    .course-detail-summary {
        font-size: var(--type-18);
    }
}

.section-heading-reset{
    margin:0;
}

.section-heading-topless{
    margin-top:0;
}

.text-secondary{
    color:var(--color-text-secondary);
}
.library-form-card {
    width:100%;
    display:none;
    flex-direction:column;
    gap:20px;
    padding:28px;
    border:4px solid #000;
    border-radius:28px;
    background:rgba(255,255,255,0.96);
    box-shadow:var(--shadow-card);
}
.library-form-card.active {
    display:flex;
}
.library-form-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.library-form-grid > .full-width {
    grid-column:1 / -1;
}

.persona-form-grid {
    grid-template-columns:minmax(0, 1.25fr) minmax(280px, .75fr);
    gap:24px;
    align-items:start;
}

.persona-form-copy-column,
.persona-form-portrait-column {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.persona-description-input {
    min-height:220px;
    resize:vertical;
}

.persona-form-footer {
    justify-content:flex-start;
}

.product-form-grid {
    grid-template-columns:1fr;
}

.product-form-copy-column {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.product-description-input {
    min-height:220px;
    resize:vertical;
}

.product-form-footer {
    justify-content:flex-start;
}

.asset-preview-grid {
    display:grid;
    gap:16px;
}

.asset-preview-field {
    display:grid;
    grid-template-columns:minmax(0, 1.35fr) minmax(220px, 0.95fr);
    gap:16px;
    align-items:stretch;
}

.asset-preview-card {
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:18px;
    border:2px solid #000;
    border-radius:20px;
    background:#fff;
    box-shadow:var(--shadow-soft);
}

.asset-preview-card__header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.asset-preview-card__title {
    margin:0;
    font-size:14px;
    font-weight:700;
}

.asset-preview-swatch {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:128px;
    padding:20px;
    border:2px dashed rgba(0,0,0,0.18);
    border-radius:16px;
    overflow:hidden;
}

.asset-preview-swatch--light {
    background:linear-gradient(180deg, #fff 0%, #f5f1ff 100%);
}

.asset-preview-swatch--dark {
    background:linear-gradient(180deg, #121321 0%, #2d2f42 100%);
}

.asset-preview-swatch--dark .asset-preview-placeholder {
    color:rgba(255,255,255,0.82);
}

.asset-preview-image {
    display:none;
    max-width:100%;
    max-height:72px;
    object-fit:contain;
}

.asset-preview-image.is-visible {
    display:block;
}

.asset-preview-placeholder {
    margin:0;
    max-width:240px;
    font-size:13px;
    line-height:1.5;
    text-align:center;
    color:var(--color-text-secondary);
}

.asset-preview-card__hint {
    margin:0;
    font-size:12px;
    line-height:1.45;
    color:var(--color-text-secondary);
}

.asset-url-action-row {
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:var(--space-10);
    align-items:center;
}

.asset-upload-toolbar {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
}

.asset-upload-status {
    margin:0;
    font-size:12px;
    line-height:1.45;
    color:var(--color-text-secondary);
}

.asset-upload-status.is-success {
    color:var(--surface-success-tone);
}

.asset-upload-status.is-error {
    color:var(--color-primary-red-dark);
}

.asset-upload-status.is-info {
    color:var(--color-primary-blue-dark);
}

.business-brand-assets__intro {
    margin-bottom:0;
}

.brand-color-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap:var(--space-16);
}

.brand-color-field {
    display:flex;
    flex-direction:column;
    gap:var(--space-16);
    min-width:0;
}

.brand-color-input-row {
    display:flex;
    align-items:center;
    gap:var(--space-12);
}

.brand-color-input-row .form-input {
    flex:1 1 auto;
    min-width:0;
}

.brand-color-picker {
    width:var(--space-56);
    min-width:var(--space-56);
    height:var(--space-56);
    padding:6px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-sm);
    background:var(--color-white);
    box-shadow:var(--shadow-control);
    cursor:pointer;
}

.brand-color-card {
    display:flex;
    flex-direction:column;
    gap:var(--space-12);
    min-width:0;
    padding:18px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:var(--color-white);
    box-shadow:var(--shadow-soft);
}

.brand-color-card__header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--space-12);
}

.brand-color-card__title {
    margin:0;
    font-size:14px;
    font-weight:700;
}

.brand-color-swatch {
    display:flex;
    align-items:flex-end;
    min-width:0;
    min-height:132px;
    padding:18px;
    border:var(--border-width-control) solid var(--color-border-light);
    border-radius:var(--radius-sm);
    background:linear-gradient(180deg, var(--color-gray-50) 0%, var(--color-info-light) 100%);
    transition:background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.brand-color-swatch--empty {
    border-style:dashed;
    color:var(--color-text-secondary);
}

.brand-color-swatch__label {
    display:inline-flex;
    align-items:center;
    padding:8px 12px;
    border-radius:var(--radius-pill);
    background:var(--color-background-elevated);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.04em;
    text-transform:uppercase;
}

.brand-color-swatch--sample-primary {
    background:linear-gradient(135deg, var(--color-info-light) 0%, var(--color-primary-blue) 100%);
    color:var(--color-text-primary);
}

.brand-color-swatch--sample-secondary {
    background:linear-gradient(135deg, var(--color-warning-light) 0%, var(--color-primary-orange-dark) 100%);
    color:var(--color-white);
}

.brand-color-swatch--sample-canvas {
    background:linear-gradient(135deg, var(--color-background) 0%, var(--color-warning-light) 100%);
    color:var(--color-text-primary);
}

.brand-color-feedback {
    margin:0;
    font-size:12px;
    line-height:1.55;
    color:var(--color-text-secondary);
}

.persona-image-editor{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
}
.persona-image-editor__preview-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:16px;
    padding:18px;
    border:2px solid #000;
    border-radius:18px;
    background:#fff;
}
.persona-image-editor__preview{
    width:132px;
    height:132px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid #000;
    background:#f4f4f4;
}
.persona-image-editor__state{
    display:block;
    font-size:13px;
    line-height:1.45;
    text-align:center;
    color:#4d4d4d;
}
.persona-image-editor__state[hidden]{
    display:none;
}
.persona-image-editor__actions{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:12px;
}
.persona-image-editor .form-input{
    min-width:0;
    text-overflow:ellipsis;
}
.persona-auto-generate{
    display:inline-flex;
    align-items:flex-start;
    gap:8px;
    font-size:13px;
    line-height:1.4;
    color:#353535;
}
.persona-auto-generate.is-disabled{
    opacity:.55;
}
.persona-auto-generate input{
    margin-top:2px;
}
.card-action-row {
    width:100%;
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
.empty-state-card {
    width:100%;
    padding:32px;
    border:3px dashed #000;
    border-radius:24px;
    background:rgba(255,255,255,0.86);
    text-align:center;
    box-shadow: var(--shadow-soft);
}

.empty-state-card p {
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.form-status-text {
    margin-bottom: 0;
    color: var(--color-text-secondary);
}

body.business-page .section-intro {
    max-width: 840px;
}

.business-page-layout {
    grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.95fr);
    gap: var(--space-32);
}

.business-page-main {
    gap: var(--space-40);
}

.business-page-section {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
    min-width: 0;
}

.business-form-card {
    gap: var(--space-24);
    padding: var(--space-32);
}

.business-form-card--source textarea.form-input {
    min-height: 360px;
}

.business-form-toolbar {
    margin-top: 0;
    align-items: flex-start;
    gap: var(--space-16) var(--space-24);
}

.business-section-copy {
    display: flex;
    flex: 1 1 320px;
    flex-direction: column;
    gap: var(--space-8);
    min-width: 0;
}

.business-section-note {
    margin-bottom: 0;
    max-width: 62ch;
}

.business-profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-24);
}

.business-field {
    min-width: 0;
}

.business-field--feature textarea.form-input {
    min-height: 220px;
}

.business-field--compact textarea.form-input {
    min-height: 112px;
}

body.business-page .form-label,
body.business-page textarea.form-input,
body.business-page .panel-message,
body.business-page .muted-paragraph {
    overflow-wrap: anywhere;
}

.business-form-actions {
    justify-content: space-between;
    gap: var(--space-16);
}

.business-form-actions .form-status-text {
    display: inline-flex;
    flex: 1 1 240px;
    align-items: center;
    min-height: 24px;
}

.business-page-sidebar {
    gap: var(--space-24);
}

.business-sidebar-panel {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.business-sidebar-card {
    gap: var(--space-16);
    padding: var(--space-24);
}

.business-meta-card {
    display: grid;
    gap: var(--space-12);
}

.business-meta-row {
    display: grid;
    gap: var(--space-8);
    min-width: 0;
    padding: 14px 16px;
    border: var(--border-width-control) solid var(--color-border-light);
    border-radius: var(--radius-sm);
    background: var(--color-white);
}

.business-meta-row strong {
    color: var(--color-text-secondary);
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.business-meta-row span {
    color: var(--color-text-primary);
    font-size: var(--type-14);
    font-weight: 700;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.business-meta-item {
    display: grid;
    gap: var(--space-8);
    min-width: 0;
    padding: 14px 16px;
    border: var(--border-width-control) solid var(--color-border-light);
    border-radius: var(--radius-sm);
    background: var(--color-white);
}

.business-meta-label {
    color: var(--color-text-secondary);
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.business-meta-value {
    color: var(--color-text-primary);
    font-size: var(--type-14);
    font-weight: 700;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.business-meta-value--code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: var(--type-12);
}

.business-chip-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.business-flow-step {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: var(--space-12);
    align-items: flex-start;
}

.business-flow-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--surface-info-tint);
    color: var(--surface-info-tone);
    font-size: var(--type-14);
    font-weight: 700;
}

.business-flow-copy {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--type-14);
    line-height: 1.6;
}

.business-analysis-status {
    margin: 0;
    padding: 14px 16px;
    border: var(--border-width-control) solid var(--color-border-light);
    border-radius: var(--radius-sm);
    background: var(--surface-info-tint);
    color: var(--color-text-primary);
}

@media (min-width: 901px) {
    .business-page-sidebar {
        position: sticky;
        top: var(--space-24);
    }
}

.card-action-row .btn,
.card-action-row .btn-outline,
.card-action-row .btn-danger {
    min-height: 44px;
    font-size: 14px;
    padding: 10px 16px;
}

.avatar--icon {
    background: #fff;
    padding: 10px;
    border-radius: 50%;
}

.campaign-meta-inline {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.icon-inline-sm {
    width: 16px;
    height: 16px;
}

.campaign-status-text {
    color: #E33F2A;
    font-weight: 700;
}

.btn-space {
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-space--push {
    margin-top: auto;
}

.plus-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--color-border);
    border: var(--border-width-strong) solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    padding: 0;
    box-shadow: var(--shadow-control);
}

.plus-btn .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.plus-btn-icon {
    display: block;
    pointer-events: none;
}

/* PERSONA IMAGE STYLEs */
.persona-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.img-sm-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 72px;
    height: 72px;
}
@keyframes personaShadowFloat {
    0% {
        box-shadow: 4px 4px 0 0 #0D0DCC, 8px 6px 0 0 #3B57ED;
    }
    25% {
        box-shadow: -2px 6px 0 0 #0D0DCC, 10px 10px 0 0 #3B57ED;
    }
    50% {
        box-shadow: 2px 8px 0 0 #0D0DCC, 12px 14px 0 0 #3B57ED;
    }
    75% {
        box-shadow: 8px 6px 0 0 #0D0DCC, 8px 12px 0 0 #3B57ED;
    }
    100% {
        box-shadow: 4px 4px 0 0 #0D0DCC, 8px 6px 0 0 #3B57ED;
    }
}

.persona-img-sm-shadow-blue {
    box-shadow: 4px 4px 0 0 #0D0DCC, 8px 6px 0 0 #3B57ED;
    animation: personaShadowFloat 3.5s ease-in-out infinite;
}

@keyframes personaShadowFloatRed {
    0% {
        box-shadow: 4px 4px 0 0 #B50600, 8px 6px 0 0 #E33F2A;
    }
    25% {
        box-shadow: -2px 6px 0 0 #B50600, 10px 10px 0 0 #E33F2A;
    }
    50% {
        box-shadow: 2px 8px 0 0 #B50600, 12px 14px 0 0 #E33F2A;
    }
    75% {
        box-shadow: 8px 6px 0 0 #B50600, 8px 12px 0 0 #E33F2A;
    }
    100% {
        box-shadow: 4px 4px 0 0 #B50600, 8px 6px 0 0 #E33F2A;
    }
}

.persona-img-sm-shadow-red {
    box-shadow: 4px 4px 0 0 #B50600, 8px 6px 0 0 #E33F2A;
    animation: personaShadowFloatRed 3.5s ease-in-out infinite reverse;
    animation-delay: 0.7s;
}

@keyframes personaShadowFloatPurple {
    0% {
        box-shadow: 4px 4px 0 0 #AA00AA, 8px 6px 0 0 #ED52C9;
    }
    25% {
        box-shadow: -2px 6px 0 0 #AA00AA, 10px 10px 0 0 #ED52C9;
    }
    50% {
        box-shadow: 2px 8px 0 0 #AA00AA, 12px 14px 0 0 #ED52C9;
    }
    75% {
        box-shadow: 8px 6px 0 0 #AA00AA, 8px 12px 0 0 #ED52C9;
    }
    100% {
        box-shadow: 4px 4px 0 0 #AA00AA, 8px 6px 0 0 #ED52C9;
    }
}

.persona-img-sm-shadow-purple {
    box-shadow: 4px 4px 0 0 #AA00AA, 8px 6px 0 0 #ED52C9;
    animation: personaShadowFloatPurple 3.5s ease-in-out infinite;
    animation-delay: 1.2s;
}

/* MEDIUM PERSONA IMAGE */
.img-md-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 140px;
    height: 140px;
}
.persona-img-md {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
@keyframes personaShadowFloatMdBlue {
    0% { box-shadow: 8px 8px 0 0 #0D0DCC, 18px 12px 0 0 #3B57ED; }
    25% { box-shadow: -4px 12px 0 0 #0D0DCC, 22px 20px 0 0 #3B57ED; }
    50% { box-shadow: 8px 16px 0 0 #0D0DCC, 28px 28px 0 0 #3B57ED; }
    75% { box-shadow: 20px 12px 0 0 #0D0DCC, 18px 24px 0 0 #3B57ED; }
    100% { box-shadow: 8px 8px 0 0 #0D0DCC, 18px 12px 0 0 #3B57ED; }
}
.persona-img-md-shadow-blue {
    box-shadow: 8px 8px 0 0 #0D0DCC, 18px 12px 0 0 #3B57ED;
    animation: personaShadowFloatMdBlue 3.5s ease-in-out infinite;
}
@keyframes personaShadowFloatMdRed {
    0% { box-shadow: 8px 8px 0 0 #B50600, 18px 12px 0 0 #E33F2A; }
    25% { box-shadow: -4px 12px 0 0 #B50600, 22px 20px 0 0 #E33F2A; }
    50% { box-shadow: 8px 16px 0 0 #B50600, 28px 28px 0 0 #E33F2A; }
    75% { box-shadow: 20px 12px 0 0 #B50600, 18px 24px 0 0 #E33F2A; }
    100% { box-shadow: 8px 8px 0 0 #B50600, 18px 12px 0 0 #E33F2A; }
}
.persona-img-md-shadow-red {
    box-shadow: 8px 8px 0 0 #B50600, 18px 12px 0 0 #E33F2A;
    animation: personaShadowFloatMdRed 3.5s ease-in-out infinite reverse;
    animation-delay: 0.7s;
}
@keyframes personaShadowFloatMdPurple {
    0% { box-shadow: 8px 8px 0 0 #AA00AA, 18px 12px 0 0 #ED52C9; }
    25% { box-shadow: -4px 12px 0 0 #AA00AA, 22px 20px 0 0 #ED52C9; }
    50% { box-shadow: 8px 16px 0 0 #AA00AA, 28px 28px 0 0 #ED52C9; }
    75% { box-shadow: 20px 12px 0 0 #AA00AA, 18px 24px 0 0 #ED52C9; }
    100% { box-shadow: 8px 8px 0 0 #AA00AA, 18px 12px 0 0 #ED52C9; }
}
.persona-img-md-shadow-purple {
    box-shadow: 8px 8px 0 0 #AA00AA, 18px 12px 0 0 #ED52C9;
    animation: personaShadowFloatMdPurple 3.5s ease-in-out infinite;
    animation-delay: 1.2s;
}

/* LARGE PERSONA IMAGE */
.img-lg-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 224px;
    height: 224px;
}
.persona-img-lg {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
@keyframes personaShadowFloatLgBlue {
    0% { box-shadow: 14px 14px 0 0 #0D0DCC, 32px 20px 0 0 #3B57ED; }
    25% { box-shadow: -8px 22px 0 0 #0D0DCC, 40px 36px 0 0 #3B57ED; }
    50% { box-shadow: 14px 28px 0 0 #0D0DCC, 52px 50px 0 0 #3B57ED; }
    75% { box-shadow: 36px 20px 0 0 #0D0DCC, 32px 42px 0 0 #3B57ED; }
    100% { box-shadow: 14px 14px 0 0 #0D0DCC, 32px 20px 0 0 #3B57ED; }
}
.persona-img-lg-shadow-blue {
    box-shadow: 14px 14px 0 0 #0D0DCC, 32px 20px 0 0 #3B57ED;
    animation: personaShadowFloatLgBlue 3.5s ease-in-out infinite;
}
@keyframes personaShadowFloatLgRed {
    0% { box-shadow: 14px 14px 0 0 #B50600, 32px 20px 0 0 #E33F2A; }
    25% { box-shadow: -8px 22px 0 0 #B50600, 40px 36px 0 0 #E33F2A; }
    50% { box-shadow: 14px 28px 0 0 #B50600, 52px 50px 0 0 #E33F2A; }
    75% { box-shadow: 36px 20px 0 0 #B50600, 32px 42px 0 0 #E33F2A; }
    100% { box-shadow: 14px 14px 0 0 #B50600, 32px 20px 0 0 #E33F2A; }
}
.persona-img-lg-shadow-red {
    box-shadow: 14px 14px 0 0 #B50600, 32px 20px 0 0 #E33F2A;
    animation: personaShadowFloatLgRed 3.5s ease-in-out infinite reverse;
    animation-delay: 0.7s;
}
@keyframes personaShadowFloatLgPurple {
    0% { box-shadow: 14px 14px 0 0 #AA00AA, 32px 20px 0 0 #ED52C9; }
    25% { box-shadow: -8px 22px 0 0 #AA00AA, 40px 36px 0 0 #ED52C9; }
    50% { box-shadow: 14px 28px 0 0 #AA00AA, 52px 50px 0 0 #ED52C9; }
    75% { box-shadow: 36px 20px 0 0 #AA00AA, 32px 42px 0 0 #ED52C9; }
    100% { box-shadow: 14px 14px 0 0 #AA00AA, 32px 20px 0 0 #ED52C9; }
}
.persona-img-lg-shadow-purple {
    box-shadow: 14px 14px 0 0 #AA00AA, 32px 20px 0 0 #ED52C9;
    animation: personaShadowFloatLgPurple 3.5s ease-in-out infinite;
    animation-delay: 1.2s;
}

.persona-grid-demo {
    position: relative;
    width: 100%;
    min-height: 340px;
    height: 340px;
    margin: 32px 0;
    background: none;
}

.dashboard-center-column .persona-grid-demo {
    margin: 8px 0 0;
}

.persona-grid-persona {
    position: absolute;
    transition: left 2.2s cubic-bezier(0.77,0,0.175,1), top 2.2s cubic-bezier(0.77,0,0.175,1);
    will-change: left, top;
    z-index: 1;
}

@media (max-width: 900px) {
    .persona-grid-demo {
        min-height: 220px;
        height: 220px;
    }

    .business-form-card {
        gap: var(--space-20);
        padding: var(--space-24);
    }

    .business-form-card--source textarea.form-input {
        min-height: 240px;
    }

    .business-form-toolbar,
    .business-form-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .business-section-copy {
        flex: 0 1 auto;
        max-width: none;
    }

    .business-form-toolbar .action-group {
        width: 100%;
        justify-content: flex-start;
    }

    .business-form-toolbar .btn,
    .business-form-toolbar .btn-outline {
        flex: 1 1 100%;
        width: 100%;
    }

    .business-profile-grid {
        grid-template-columns: 1fr;
        gap: var(--space-16);
    }

    .brand-color-grid {
        grid-template-columns: 1fr;
    }

    .business-sidebar-card {
        padding: var(--space-16);
    }

    .business-meta-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .business-meta-row span {
        text-align: left;
    }
}
@media (max-width: 600px) {
    .persona-grid-demo {
        min-height: 120px;
        height: 120px;
    }

    .business-page-main,
    .business-page-section {
        gap: var(--space-16);
    }

    .business-form-card {
        gap: var(--space-16);
        padding: var(--space-20);
    }

    .business-form-card--source textarea.form-input {
        min-height: 220px;
    }

    .business-field--feature textarea.form-input {
        min-height: 180px;
    }

    body.business-page textarea.form-input {
        font-size: var(--type-16);
    }

    body.business-page .asset-preview-card,
    body.business-page .brand-color-card {
        gap: var(--space-10);
        padding: 14px;
    }

    body.business-page .asset-preview-swatch {
        min-height: 96px;
        padding: 14px;
    }

    body.business-page .brand-color-swatch {
        min-height: 108px;
        padding: 14px;
    }

    .brand-color-input-row {
        align-items:stretch;
        flex-direction:column;
    }

    .brand-color-picker {
        width:100%;
        min-width:0;
    }

    .business-flow-step {
        grid-template-columns: 32px minmax(0, 1fr);
    }

    .business-flow-index {
        width: 32px;
        height: 32px;
    }
}

/* LIST STYLES */

ul {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 24px;
    border: 4px solid #000;
    border-radius: 20px;
    background: #fff;
    list-style: none;
    padding: 0;
    overflow: hidden;
}
ul li {
    border-bottom: 4px solid #000;
    padding: 0;
}
ul li:last-child {
    border-bottom: none;
}
.card-li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: var(--color-white);
    border-radius: 0;
    box-shadow: var(--shadow-soft);
    padding: 20px 28px;
    border: none;
    min-height: 120px;
    gap: 20px;
    margin-bottom: 0;
}

.btn-card-li {
    cursor: pointer;
    transition: background 0.2s;
    margin-left: auto;
}

ul .card-icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-right: 2px;
}

ul .card-content {
    align-items: flex-start;
}

.campaign-card {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-24);
    min-height: 150px;
    padding: var(--space-24) var(--space-32);
    border: var(--border-width-panel) solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-white);
    box-shadow: var(--shadow-soft);
}

.campaign-card__avatar {
    width: 82px;
    min-width: 82px;
    height: 82px;
}

.campaign-card__content {
    min-width: 0;
    align-items: flex-start;
    gap: var(--space-4);
}

.campaign-card__title {
    margin: 0;
    max-width: 320px;
    font-size: var(--type-20);
    line-height: 1.15;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-wrap: balance;
}

.campaign-card__goal {
    margin: 0;
    font-size: var(--type-16);
    font-weight: 500;
    line-height: 1.25;
}

.campaign-card__meta,
.campaign-card__meta-row {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: var(--space-12);
    flex-wrap: wrap;
    line-height: 1.35;
}

.campaign-card__meta-row {
    font-size: var(--type-12);
    color: var(--color-text-secondary);
}

.campaign-card__meta-row span {
    color: inherit;
}

.campaign-card__meta-row span + span::before {
    content: "•";
    margin-right: var(--space-12);
    color: var(--color-text-primary);
}

.campaign-card__meta--secondary,
.campaign-card__meta-row--assets {
    font-size: var(--type-12);
    opacity: 0.86;
}

.campaign-card__side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-self: end;
    gap: var(--space-16);
}

.campaign-card__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 70px;
    padding: 7px 13px;
    border: var(--border-width-control) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-white);
    font-size: var(--type-12);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
}

.campaign-card__status--draft {
    background: linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}

.campaign-card__button {
    margin-left: 0;
    min-width: 92px;
    min-height: 42px;
}

.campaign-card--empty {
    min-height: 132px;
    justify-content: center;
}

.campaign-card--empty .card-content {
    align-items: center;
    text-align: center;
}


.simple-ul {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 24px 48px;
    margin-top: 0;
    border: none;
    border-radius: 0px;
    background: none;
    list-style: unset;
    padding: 0;
    overflow: visible;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding-left: 1.6rem;
}

.simple-li {
    border-bottom: none;
    font-size: 24px;
}

.simple-ul li::marker {
    font-size: 1.2em;
    color: #EDB212;
}

.campaign-tour-active{
    overflow:hidden;
}

.campaign-tour{
    position:fixed;
    inset:0;
    z-index:10000;
    --tour-hole-top:0px;
    --tour-hole-left:0px;
    --tour-hole-width:0px;
    --tour-hole-height:0px;
    --tour-card-top:50%;
    --tour-card-left:50%;
}

.campaign-tour--preparing{
    opacity:0;
    pointer-events:none;
}

.campaign-tour__shade{
    position:fixed;
    background:rgba(0, 0, 0, 0.72);
}

.campaign-tour__shade--top{
    top:0;
    left:0;
    width:100vw;
    height:var(--tour-hole-top);
}

.campaign-tour__shade--left{
    top:var(--tour-hole-top);
    left:0;
    width:var(--tour-hole-left);
    height:var(--tour-hole-height);
}

.campaign-tour__shade--right{
    top:var(--tour-hole-top);
    left:calc(var(--tour-hole-left) + var(--tour-hole-width));
    width:calc(100vw - var(--tour-hole-left) - var(--tour-hole-width));
    height:var(--tour-hole-height);
}

.campaign-tour__shade--bottom{
    top:calc(var(--tour-hole-top) + var(--tour-hole-height));
    left:0;
    width:100vw;
    height:calc(100vh - var(--tour-hole-top) - var(--tour-hole-height));
}

.campaign-tour--centered .campaign-tour__shade--top{
    height:100vh;
}

.campaign-tour__spotlight{
    position:fixed;
    top:var(--tour-hole-top);
    left:var(--tour-hole-left);
    width:var(--tour-hole-width);
    height:var(--tour-hole-height);
    border:4px solid var(--color-primary-yellow);
    border-radius:22px;
    box-shadow:0 0 0 2px var(--color-border), 0 0 0 8px rgba(248, 220, 102, 0.24);
    pointer-events:none;
}

.campaign-tour__card{
    position:fixed;
    top:var(--tour-card-top);
    left:var(--tour-card-left);
    width:min(470px, calc(100vw - 32px));
    max-height:calc(100vh - 32px);
    overflow:auto;
    border:4px solid var(--color-border);
    border-radius:28px;
    background:linear-gradient(180deg, var(--color-primary-yellow) 0 14px, var(--color-white) 14px);
    box-shadow:12px 12px 0 rgba(0, 0, 0, 0.2), var(--shadow-float);
}

.campaign-tour__card--welcome{
    width:min(1040px, calc(100vw - 48px));
    background:
        linear-gradient(180deg, var(--color-primary-yellow) 0 14px, transparent 14px),
        linear-gradient(135deg, rgba(248, 220, 102, 0.24), rgba(227, 63, 42, 0.08) 48%, rgba(59, 87, 237, 0.1));
    background-color:var(--color-white);
}

.campaign-tour__inner{
    padding:28px;
}

.campaign-tour__card--welcome .campaign-tour__inner{
    padding:36px;
}

.campaign-tour__card-top,
.campaign-tour__actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.campaign-tour__card h2{
    margin:16px 0 12px;
    color:var(--color-text-primary);
    font-family:alga, serif;
    font-size:34px;
    line-height:0.95;
    letter-spacing:0;
}

.campaign-tour__card--welcome h2{
    max-width:560px;
    font-size:56px;
}

.campaign-tour__body{
    max-width:54ch;
}

.campaign-tour__card--welcome .campaign-tour__body{
    max-width:58ch;
    color:var(--color-text-primary);
    font-size:18px;
    line-height:1.55;
}

.campaign-tour__card p{
    margin:0;
    color:var(--color-text-secondary);
    font-size:16px;
    line-height:1.5;
}

.campaign-tour__eyebrow{
    color:var(--color-primary-red-dark);
    font-size:12px;
    font-weight:900;
    letter-spacing:0;
    text-transform:uppercase;
}

.campaign-tour__step-label{
    margin-top:3px;
    color:var(--color-text-primary);
    font-size:13px;
    font-weight:900;
}

.campaign-tour__skip{
    min-height:34px;
    padding:7px 12px;
    border:2px solid var(--color-border-light);
    border-radius:999px;
    background:var(--color-white);
    font-size:13px;
}

.campaign-tour__content{
    display:grid;
    gap:22px;
}

.campaign-tour__card--welcome .campaign-tour__content{
    grid-template-columns:minmax(0, 0.9fr) minmax(460px, 1.1fr);
    align-items:center;
    gap:34px;
}

.campaign-tour__welcome-points{
    display:grid;
    gap:12px;
    margin-top:24px;
}

.campaign-tour__welcome-points div{
    display:grid;
    gap:2px;
    padding:13px 14px;
    border:2px solid var(--color-border);
    border-radius:16px;
    background:rgba(255, 255, 255, 0.72);
}

.campaign-tour__welcome-points strong{
    color:var(--color-text-primary);
    font-size:15px;
}

.campaign-tour__welcome-points span{
    color:var(--color-text-secondary);
    font-size:14px;
    line-height:1.35;
}

.campaign-tour__actions{
    margin-top:22px;
}

.campaign-tour__actions .btn-small{
    min-height:42px;
    min-width:92px;
    border-width:3px;
    border-radius:14px;
}

.campaign-tour__diagram{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    align-items:stretch;
    gap:14px;
    padding:18px;
    border:4px solid var(--color-border);
    border-radius:24px;
    background:rgba(255, 255, 255, 0.84);
    box-shadow:inset 0 0 0 2px rgba(0, 0, 0, 0.04);
}

.campaign-tour__card--welcome .campaign-tour__diagram{
    gap:16px;
    padding:22px;
}

.campaign-tour__node{
    position:relative;
    display:flex;
    min-width:0;
    min-height:132px;
    flex-direction:column;
    justify-content:center;
    gap:8px;
    padding:14px 10px 12px;
    border:3px solid var(--color-border);
    border-radius:18px;
    background:var(--color-white);
    box-shadow:0 6px 0 rgba(0, 0, 0, 0.1);
    text-align:center;
}

.campaign-tour__card--welcome .campaign-tour__node{
    min-height:178px;
    padding:18px 12px 16px;
}

.campaign-tour__node:not(:last-child)::after{
    content:"";
    position:absolute;
    top:50%;
    right:-17px;
    width:18px;
    height:3px;
    background:var(--color-border);
}

.campaign-tour__node:not(:last-child)::before{
    content:"";
    position:absolute;
    top:calc(50% - 5px);
    right:-19px;
    width:0;
    height:0;
    border-top:6px solid transparent;
    border-bottom:6px solid transparent;
    border-left:8px solid var(--color-border);
}

.campaign-tour__node-index{
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    align-self:center;
    border:2px solid var(--color-border);
    border-radius:999px;
    background:var(--color-primary-yellow);
    color:var(--color-text-primary);
    font-size:13px;
    font-weight:900;
}

.campaign-tour__card--welcome .campaign-tour__node-index{
    width:38px;
    height:38px;
    font-size:15px;
}

.campaign-tour__node:nth-child(2) .campaign-tour__node-index{
    background:var(--color-primary-red);
    color:var(--color-white);
}

.campaign-tour__node:nth-child(3) .campaign-tour__node-index{
    background:var(--color-primary-blue);
    color:var(--color-white);
}

.campaign-tour__node:nth-child(4) .campaign-tour__node-index{
    background:var(--color-primary-green);
}

.campaign-tour__node strong{
    color:var(--color-text-primary);
    font-size:17px;
}

.campaign-tour__card--welcome .campaign-tour__node strong{
    font-size:20px;
}

.campaign-tour__node span{
    color:var(--color-text-secondary);
    font-size:13px;
    line-height:1.25;
}

.campaign-tour__card--welcome .campaign-tour__node span{
    font-size:14px;
}

.campaign-tour__progress{
    display:grid;
    grid-template-columns:repeat(11, minmax(0, 1fr));
    gap:6px;
    margin-top:22px;
}

.campaign-tour__pip{
    display:block;
    height:7px;
    border:2px solid var(--color-border);
    border-radius:999px;
    background:var(--color-white);
}

.campaign-tour__pip.is-complete{
    background:var(--color-primary-yellow);
}

.campaign-tour__pip.is-active{
    background:var(--color-primary-red);
}

.campaign-tour-preview{
    display:grid;
    min-height:440px;
    place-items:center;
    padding:28px;
    border:3px solid var(--color-border);
    border-radius:24px;
    background:linear-gradient(135deg, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0.58));
}

.campaign-tour-preview .campaign-tour__card{
    position:static;
    width:min(100%, 1040px);
    max-height:none;
}

@media (max-width:700px){
    .campaign-tour__card{
        right:16px;
        bottom:16px;
        top:auto;
        left:16px;
        width:auto;
        max-height:min(70vh, 520px);
    }

    .campaign-tour__inner{
        padding:20px;
    }

    .campaign-tour__card--welcome{
        width:auto;
    }

    .campaign-tour__card h2{
        font-size:28px;
    }

    .campaign-tour__card--welcome h2{
        font-size:34px;
    }

    .campaign-tour__card--welcome .campaign-tour__body{
        font-size:16px;
    }

    .campaign-tour__card--welcome .campaign-tour__content{
        grid-template-columns:1fr;
        gap:20px;
    }

    .campaign-tour__welcome-points{
        margin-top:18px;
    }

    .campaign-tour__diagram{
        grid-template-columns:1fr;
        gap:10px;
        padding:14px;
    }

    .campaign-tour__node{
        min-height:74px;
    }

    .campaign-tour__card--welcome .campaign-tour__node{
        min-height:86px;
    }

    .campaign-tour__node::before,
    .campaign-tour__node::after{
        display:none;
    }
}

@media (max-width:900px){
    :root {
        --type-20: 19px;
        --type-24: 22px;
        --type-32: 30px;
        --type-40: 35px;
        --type-56: 40px;
    }

    h2 {
        font-size: clamp(32px, 9vw, 42px);
        line-height: 1.04;
    }

    .text-lg {
        font-size: 21px;
        line-height: 1.35;
    }

    .bold {
        font-size: 20px;
        line-height: 1.25;
    }

    .gradient-header-container {
        min-height: 56px;
        margin-bottom: var(--space-24);
        padding: 14px 20px;
        font-size: var(--type-20);
    }

    .gradient-header-container-card {
        min-height: 50px;
        padding: 12px 18px;
        font-size: 18px;
    }

    .large-card {
        padding: 20px;
        gap: 16px;
    }

    .onboarding-founder-help {
        padding: 20px;
        gap: 16px;
    }

    .page-title {
        font-size: clamp(28px, 8.5vw, 38px);
        line-height: 1.04;
        letter-spacing: 0;
    }

    .page-intro,
    .section-intro {
        font-size: 15px;
        line-height: 1.55;
    }

    .section-title {
        font-size: 21px;
        line-height: 1.16;
    }

    .simple-li {
        font-size: 18px;
        line-height: 1.35;
    }
}

@media (max-width:640px){
    :root {
        --type-24: 21px;
        --type-32: 28px;
        --type-40: 32px;
        --type-56: 36px;
    }

    h2 {
        font-size: clamp(30px, 9vw, 38px);
    }

    .page-title {
        font-size: clamp(27px, 8.2vw, 34px);
    }

    .large-card {
        padding: 18px;
    }

    .onboarding-founder-help {
        padding: 18px;
    }

    .simple-li {
        font-size: 17px;
    }
}
  

/*FLOATING COMPONENTS*/
.offset-cta{
    position: absolute;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.top-right{
    top: 136px;
    right: 0px;
    align-items: flex-end;
}
.bottom-right{
    bottom: 12px;
    right: 7vw;
    align-items: flex-start;
}

.campaign-type-main{
    position: relative;
}

.campaign-goal-main{
    position: relative;
}

.campaign-schedule-main{
    position: relative;
}

.campaign-schedule-main .top-navigation-container{
    padding:22px 0 14px;
}

.campaign-schedule-main .logo-and-text-container{
    gap:24px;
}

.campaign-schedule-main .nav-text{
    font-size:28px;
}

.campaign-schedule-main .logo-img{
    height:34px;
}

.campaign-schedule-main .workspace-pill,
.campaign-schedule-main .workspace-select-wrap,
.campaign-schedule-main .workspace-nav-btn{
    min-height:42px;
}

.campaign-schedule-main .workspace-pill{
    padding:0 14px;
}

.campaign-schedule-main .workspace-user strong,
.campaign-schedule-main .workspace-client-select{
    font-size:14px;
}

.campaign-schedule-main .workspace-nav-btn{
    padding:0 16px;
    font-size:14px;
}

.campaign-schedule-main .workspace-banner{
    gap:10px;
    padding:10px 16px;
    margin:-4px 0 16px;
    border-radius:var(--radius-sm);
}

.campaign-schedule-main .workspace-banner strong{
    font-size:18px;
}

.campaign-schedule-main .workspace-banner-meta{
    font-size:12px;
}

.campaign-goal-page{
    gap: 18px;
    padding-bottom: clamp(24px, 4vw, 52px);
}

.campaign-schedule-page{
    gap: 14px;
    padding-bottom: clamp(18px, 3vw, 40px);
}

.campaign-goal-header{
    width:min(100%, 1220px);
    display:flex;
    flex-direction:column;
    gap:14px;
}

.campaign-schedule-header{
    width:min(100%, 1220px);
    display:flex;
    flex-direction:column;
    gap:10px;
}

.campaign-goal-header-bar{
    width:100%;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.campaign-schedule-header-bar{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.campaign-goal-header-bar .gradient-header-container{
    flex:1 1 auto;
    margin-bottom:0;
}

.campaign-schedule-header-bar .gradient-header-container{
    flex:1 1 auto;
    margin-bottom:0;
    padding:12px 0;
    font-size:22px;
}

.campaign-goal-custom{
    position:relative;
    flex:0 0 auto;
}

.campaign-schedule-autofill-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 16px;
    border-radius:999px;
    white-space:nowrap;
    font-size:16px;
}

.campaign-goal-custom summary{
    list-style:none;
}

.campaign-goal-custom summary::-webkit-details-marker{
    display:none;
}

.campaign-goal-custom-summary{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:0 18px;
    border-radius:999px;
    white-space:nowrap;
    cursor:pointer;
}

.campaign-goal-custom-popover{
    position:absolute;
    top:calc(100% + 12px);
    right:0;
    width:min(360px, calc(100vw - 48px));
    padding:18px;
    border-radius:24px;
    background:#fff;
    box-shadow:0 10px 24px rgba(0,0,0,0.12);
    z-index:20;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.campaign-goal-custom-input{
    text-align:left;
    font-size:18px;
    min-height:110px;
}

.campaign-goal-custom-popover .btn{
    align-self:flex-end;
}

.campaign-goal-grid{
    width:min(100%, 1220px);
    align-self:stretch;
}

.campaign-goal-footer{
    width:min(100%, 1220px);
    position:relative;
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
    min-height:108px;
    padding:6px 12px 0 0;
}

.campaign-goal-tip{
    width:min(100%, 420px);
    z-index:2;
}

.campaign-goal-sparkles{
    position:absolute;
    right:0;
    bottom:0;
    width:88px;
    opacity:0.88;
    pointer-events:none;
    z-index:1;
    filter:drop-shadow(0 10px 14px rgba(0,0,0,0.08));
}

.campaign-type-page{
    gap: 18px;
    padding-bottom: clamp(24px, 4vw, 48px);
}

.campaign-type-header{
    width: min(100%, 1220px);
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.campaign-type-page-eyebrow{
    align-self: center;
}

.campaign-type-header-bar{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.campaign-type-header-bar .gradient-header-container{
    flex:1 1 auto;
    margin-bottom:0;
}

.campaign-type-custom-trigger{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:0 18px;
    border-radius:999px;
    white-space:nowrap;
}

.campaign-type-custom-trigger-icon{
    width:22px;
    height:22px;
    display: flex;
    align-items:center;
    justify-content:center;
    border:2px solid #000;
    border-radius:999px;
    font-size:13px;
    font-weight:700;
    line-height:1;
}

.campaign-type-stage{
    position: relative;
    width: 100%;
    min-height: clamp(340px, 37vw, 500px);
}

.campaign-type-stage-shell{
    width: min(100%, 1260px);
    display:flex;
    flex-direction:column;
    gap:16px;
    padding: clamp(4px, 1vw, 12px) 0 0;
    overflow: visible;
    position: relative;
}

.campaign-type-stage-body{
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.campaign-schedule-card{
    width:min(100%, 1220px);
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:clamp(20px, 2.2vw, 28px);
}

.campaign-schedule-card-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px 18px;
    flex-wrap:wrap;
}

.campaign-schedule-card-copy{
    flex:1 1 380px;
    display:flex;
    flex-direction:column;
    gap:6px;
    max-width:54ch;
}

.campaign-schedule-card-eyebrow{
    margin:0;
    font-size:13px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#7c5b09;
}

.campaign-schedule-card-title{
    margin:0;
    font-size:clamp(1.5rem, 2vw, 1.9rem);
    line-height:1;
}

.campaign-schedule-card-description{
    margin:0;
    max-width:52ch;
    font-size:0.95rem;
    line-height:1.42;
}

.campaign-schedule-card-side{
    flex:0 1 auto;
    display:flex;
    flex-direction:row;
    gap:10px;
    align-items:stretch;
    justify-content:flex-end;
}

.campaign-schedule-recommendation{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:210px;
    padding:12px 14px;
    border:2px solid #000;
    border-radius:18px;
    background:rgba(255,255,255,0.88);
}

.campaign-schedule-recommendation-label{
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#7c5b09;
}

.campaign-schedule-recommendation strong{
    font-size:0.96rem;
    line-height:1.3;
}

.campaign-schedule-interval{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:170px;
    padding:12px 14px;
    border:2px solid #000;
    border-radius:18px;
    background:rgba(255,255,255,0.88);
}

.campaign-schedule-interval-label{
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#7c5b09;
}

.campaign-schedule-interval-row{
    display:flex;
    align-items:center;
    gap:8px;
}

.campaign-schedule-interval-row .form-input-num{
    width:76px;
}

.campaign-schedule-interval-suffix{
    font-size:14px;
    font-weight:600;
}

.campaign-schedule-visualizer-shell{
    width:100%;
    padding:10px clamp(8px, 1.4vw, 14px) 0;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(248,220,102,0.18) 0%, rgba(255,255,255,0.62) 100%);
}

.campaign-schedule-visualizer{
    width:min(100%, 800px);
    max-width:100%;
    margin:0 auto;
}

.campaign-schedule-visualizer > div{
    font-size:12px !important;
    top:calc(100% + 6px) !important;
}

.campaign-schedule-date-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}

.campaign-schedule-date-field{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px;
    border:2px solid #000;
    border-radius:18px;
    background:rgba(255,255,255,0.92);
    box-shadow:0 8px 20px rgba(0,0,0,0.06);
}

.campaign-schedule-date-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
}

.campaign-schedule-date-caption{
    font-size:13px;
    line-height:1.35;
    color:#3c3c3c;
    min-height:2.5em;
}

.campaign-schedule-date-field .form-input-date{
    width:100%;
    min-width:0;
    font-size:15px;
}

.campaign-schedule-card-actions{
    display:flex;
    justify-content:flex-end;
}

.campaign-schedule-card-actions .btn{
    min-width:168px;
    padding:11px 18px;
    font-size:18px;
}

.campaign-schedule-footer{
    width:min(100%, 1220px);
    position:relative;
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
    min-height:108px;
    padding:6px 12px 0 0;
}

.campaign-schedule-tip{
    width:min(100%, 440px);
    z-index:2;
}

.campaign-schedule-sparkles{
    position:absolute;
    right:0;
    bottom:0;
    width:88px;
    opacity:0.88;
    pointer-events:none;
    z-index:1;
    filter:drop-shadow(0 10px 14px rgba(0,0,0,0.08));
}

.campaign-customers-main{
    position:relative;
}

.campaign-customers-page{
    gap:16px;
    padding-bottom:clamp(24px, 4vw, 44px);
}

.campaign-customers-layout{
    width:min(100%, 1220px);
    display:grid;
    grid-template-columns:minmax(280px, 0.92fr) minmax(420px, 1.35fr);
    gap:28px;
    align-items:start;
}

.campaign-customers-preview-column{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:24px;
}

.campaign-customers-preview-stage{
    position:relative;
    width:100%;
    min-height:340px;
    overflow:visible;
}

.campaign-customers-grid{
    margin:0;
}

.campaign-customers-grid-empty{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    text-align:center;
    font-size:18px;
    font-weight:700;
    line-height:1.35;
    color:#4b4b4b;
    pointer-events:none;
    z-index:0;
}

.campaign-customers-grid-empty.is-hidden{
    display:none;
}

.campaign-customers-continue-btn{
    align-self:center;
    width:160px;
}

.campaign-customers-tip{
    align-self:flex-start;
    width:min(100%, 340px);
}

.campaign-customers-list{
    overflow:hidden;
}

.campaign-customers-list-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding-inline:18px;
}

.campaign-customers-manage-btn{
    position:static;
    transform:none;
    flex:0 0 auto;
}

.campaign-customers-persona-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:0;
}

.campaign-customers-persona-copy h3{
    margin:0;
    font-size:18px;
    line-height:1.25;
}

/* CAROUSEL STYLES */
.carousel-container{
    display:grid;
    justify-items:start;
    align-items:start;
    position:relative;
    width:100%;
    min-height:clamp(390px, 41vw, 540px);
    margin-inline:0;
    padding:10px 0 clamp(76px, 9vw, 94px) clamp(14px, 1.4vw, 20px);
    overflow:visible;
    isolation:isolate;
}
  
.carousel-item{
    grid-area:1 / 1;
    width:min(100%, clamp(480px, 56vw, 640px));
    max-width:100%;
    transform-origin:left center;
    transition: transform .44s cubic-bezier(.2,.8,.2,1), opacity .28s ease, filter .28s ease;
    will-change:transform;
    overflow: visible;
}

.carousel-item:not(.active){
    pointer-events:none;
}

.carousel-card {
    position: relative;
    min-height: clamp(340px, 37vw, 460px);
    padding-bottom: clamp(70px, 7vw, 86px);
    overflow: visible;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFFDF5 100%);
    box-shadow: 0 10px 22px 0 rgba(0,0,0,0.12);
}

.carousel-card.large-card{
    padding: clamp(20px, 2.4vw, 28px);
}

.carousel-item.active .carousel-card{
    box-shadow: 0 14px 28px 0 rgba(0,0,0,0.14), 0 0 0 7px rgba(248, 220, 102, 0.16);
}

.carousel-item:not(.active) .carousel-card{
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF9DA 100%);
}

.carousel-select-btn {
    color: #fff;
    background-color: #000;
    border-radius: 12px;
    padding: 14px clamp(34px, 5vw, 56px);
    font-size: clamp(18px, 1.7vw, 24px);
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 50%) scale(0);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.35s ease, opacity 0.35s ease;
}

.carousel-item.active .carousel-select-btn {
    transform: translate(-50%, 50%) scale(1);
    opacity: 1;
    pointer-events: auto;
}

.carousel-card-content {
    display: flex;
    flex-direction: column;
    gap: clamp(12px, 1.5vw, 18px);
    align-items: center;
    justify-content: flex-start;
}

.carousel-card-content h2{
    text-align:center;
    font-size: clamp(2rem, 3.2vw, 3rem);
    line-height: 1;
}

.campaign-type-intro{
    text-align:center;
    max-width:34ch;
    margin:0 auto;
    font-size: clamp(0.98rem, 1.25vw, 1.2rem);
    line-height:1.35;
}

.campaign-type-visualizer{
    width:min(100%, 800px);
    max-width:100%;
    align-self:stretch;
}

.campaign-type-visualizer > div{
    font-size: 13px !important;
    top: calc(100% + 8px) !important;
}

.campaign-type-benefits{
    width:100%;
    max-width:620px;
    justify-content:center;
    gap:8px 20px;
    padding-left:1.1rem;
}

.campaign-type-benefits .simple-li{
    font-size: clamp(0.95rem, 1.05vw, 1.05rem);
    line-height: 1.35;
}

.campaign-type-footer{
    width:100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    z-index: 6;
}

.campaign-type-stage-sparkles{
    position:absolute;
    right:clamp(36px, 8vw, 120px);
    bottom:clamp(14px, 2vw, 28px);
    width:clamp(72px, 9vw, 116px);
    opacity:0.9;
    pointer-events:none;
    z-index:1;
    filter:drop-shadow(0 10px 14px rgba(0,0,0,0.08));
}

.campaign-type-tip{
    width:min(100%, 440px);
    border:2px solid #000;
    border-radius:18px;
    background:rgba(255,255,255,0.94);
    box-shadow:0 6px 16px rgba(0,0,0,0.08);
}

.campaign-type-tip summary{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 14px;
    cursor:pointer;
    list-style:none;
    font-weight:700;
    font-size:14px;
}

.campaign-type-tip summary::-webkit-details-marker{
    display:none;
}

.campaign-type-tip[open] summary{
    border-bottom:1px solid rgba(0,0,0,0.12);
}

.campaign-type-tip-icon{
    width:20px;
    height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#000;
    color:#fff;
    font-size:12px;
    line-height:1;
}

.campaign-type-tip p{
    margin:0;
    padding:0 14px 14px;
    font-size:14px;
    line-height:1.5;
    color:#1f1f1f;
}

.carousel-control{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:48px;
    height:48px;
    padding:0;
    background:#fff;
    border:3px solid #000;
    border-radius:999px;
    box-shadow:0 4px 8px 0 #0002;
    cursor:pointer;
    z-index:5;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.carousel-control.prev{
    left: -8px;
}

.carousel-control.next{
    right: -8px;
}
  
.carousel-control img{
    width:20px;
    height:20px;
    object-fit:contain;
    filter: brightness(0);
    transform:none;
    pointer-events:none;
}

.carousel-control.prev img{ transform:scaleX(-1); }
  
.carousel-control:focus-visible{ outline:2px solid #000; }
.carousel-control{ opacity:.94; transition:opacity .18s, transform .18s ease; }
.carousel-control:hover{ opacity:1; transform:translateY(calc(-50% - 2px)); }
 
.carousel-btn{
    color:#fff;
    background:#000;
    border-radius:999px;
    padding:10px 28px;
    font-size:14px;
    font-weight:700;
    text-align:center;
    cursor:pointer;
    border:none;
    box-shadow: 0 2px 8px 0 #0002;
    display:inline-flex;
    align-items:center;
    gap:10px;
}

.carousel-btns-wrapper{
    position:static;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center;
    z-index:4;
}
   
 
@media (max-width:1180px){
    .campaign-offer-layout{
        grid-template-columns:1fr;
    }
    .campaign-offer-page .offer-card__header.campaign-offer-card-header{
        grid-template-columns:1fr;
        align-items:flex-start;
    }
    .campaign-customers-layout{
        grid-template-columns:1fr;
    }
    .campaign-schedule-header-bar{
        flex-direction:column;
        align-items:stretch;
    }
    .campaign-schedule-autofill-btn{
        align-self:flex-end;
    }
    .campaign-schedule-card-head{
        flex-direction:column;
        align-items:stretch;
    }
    .campaign-schedule-card-side{
        flex-basis:auto;
        width:100%;
    }
    .campaign-schedule-footer{
        min-height:96px;
    }
    .campaign-goal-header-bar{
        flex-direction:column;
        align-items:stretch;
    }
    .campaign-goal-custom{
        align-self:flex-end;
    }
    .campaign-goal-footer{
        min-height:96px;
    }
    .campaign-type-stage-shell{
        min-height: auto;
        gap: 16px;
    }
    .campaign-type-stage{
        min-height: auto;
    }
    .campaign-type-footer{
        gap:14px;
    }
    .campaign-type-stage-sparkles{
        right:24px;
        bottom:8px;
        width:84px;
    }
}

@media (max-width:900px){
    .campaign-offer-tip{
        width:100%;
    }
    .campaign-offer-page .recommendations-list{
        grid-template-columns:1fr;
    }
    .campaign-offer-recommendations-head{
        flex-direction:column;
        align-items:stretch;
    }
    .campaign-offer-ai-btn,
    .campaign-offer-product-select{
        width:100%;
    }
    .campaign-customers-preview-stage{
        min-height:260px;
    }
    .campaign-customers-list-header{
        flex-direction:column;
        align-items:flex-start;
    }
    .campaign-schedule-page{
        gap:18px;
    }
    .campaign-schedule-autofill-btn{
        width:100%;
        justify-content:center;
    }
    .campaign-schedule-date-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
    .campaign-schedule-card-actions{
        justify-content:center;
    }
    .campaign-schedule-footer{
        justify-content:center;
        padding-right:0;
    }
    .campaign-schedule-sparkles{
        right:8px;
        width:72px;
        opacity:0.72;
    }
    .campaign-goal-custom{
        width:100%;
    }
    .campaign-goal-custom-popover{
        position:static;
        width:100%;
        margin-top:12px;
    }
    .campaign-goal-footer{
        justify-content:center;
        padding-right:0;
    }
    .campaign-goal-sparkles{
        right:8px;
        width:72px;
        opacity:0.72;
    }
    .campaign-type-page{
        gap:18px;
    }
    .campaign-type-header-bar{
        flex-direction:column;
        align-items:stretch;
    }
    .campaign-type-custom-trigger{
        align-self:flex-end;
    }
    .carousel-container{
        min-height:auto;
        padding:8px 0 68px;
        justify-items:center;
    }
    .carousel-item{
        width:min(100%, 620px);
        transform-origin:center center;
    }
    .carousel-card{
        min-height:auto;
    }
    .campaign-type-benefits{
        justify-content:flex-start;
        gap:10px 18px;
    }
    .campaign-type-benefits .simple-li{
        width:100%;
    }
    .campaign-type-footer{
        align-items:stretch;
    }
}

@media (max-width:640px){
    .campaign-offer-page .offer-card__header.campaign-offer-card-header{
        padding:22px 20px !important;
    }
    .campaign-offer-page .offer-card__body.campaign-offer-card-body{
        padding:20px !important;
    }
    .campaign-offer-page .offer-card__footer.campaign-offer-card-footer{
        padding:0 20px 20px;
    }
    .campaign-offer-page .offer-card__footer .campaign-offer-continue-btn{
        width:100%;
    }
    .campaign-customers-preview-stage{
        min-height:220px;
    }
    .campaign-customers-grid-empty{
        font-size:16px;
    }
    .campaign-customers-tip{
        width:100%;
    }
    .campaign-customers-continue-btn{
        width:100%;
    }
    .persona-list li{
        padding:14px 18px;
        gap:12px;
    }
    .persona-list img.avatar{
        margin-right:0;
    }
    .campaign-schedule-card{
        padding:20px 18px;
    }
    .campaign-schedule-date-grid{
        grid-template-columns:1fr;
    }
    .campaign-schedule-date-caption{
        min-height:0;
    }
    .campaign-schedule-tip{
        width:100%;
    }
    .campaign-schedule-sparkles{
        width:60px;
    }
    .campaign-goal-custom{
        align-self:stretch;
    }
    .campaign-goal-custom-summary{
        width:100%;
        justify-content:center;
    }
    .campaign-goal-tip{
        width:100%;
    }
    .campaign-goal-sparkles{
        width:60px;
    }
    .campaign-type-custom-trigger{
        width:100%;
        justify-content:center;
    }
    .carousel-card.large-card{
        padding:18px 16px 78px;
        border-radius:32px;
    }
    .carousel-select-btn{
        width:calc(100% - 40px);
        padding:14px 18px;
    }
    .carousel-btns-wrapper{
        width:100%;
    }
    .carousel-btn{
        flex:1 1 0;
        justify-content:center;
    }
    .campaign-type-tip{
        width:100%;
    }
    .campaign-type-stage-sparkles{
        right:12px;
        bottom:4px;
        width:64px;
        opacity:0.72;
    }
}

/* GLOBAL ACCESSIBILITY UTILITIES */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

/* INPUT STYLES */
.form-input {
    width: 100%;
    min-height: 56px;
    padding: 14px 16px;
    font-size: 18px;
    line-height: 1.35;
    font-family: alga, serif;
    font-weight: 500;
    text-align: left;
    border: 3px solid #000;
    border-radius: 16px;
    background: #fff;
    color: #000;
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.06);
}
.form-label {
    display:block;
    font-weight:700;
    margin-bottom:8px;
    font-size:12px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:#000;
}
.form-input::placeholder {
    color: #8a8790;
}
.form-input:focus-visible {
    outline: 3px solid #3B57ED;
    outline-offset: 2px;
}

.onboarding-discovery-page .onboarding-discovery-input:focus-visible {
    outline: none;
    outline-offset: 0;
    border-color: var(--surface-accent-dark);
    box-shadow:
        inset 0 0 0 3px var(--surface-info-tint),
        inset 0 2px 0 rgba(0, 0, 0, 0.06);
}

/* Textarea variant of form-input */
textarea.form-input {
    min-height: 140px;
    resize: vertical;
}

/* SELECT & DATE INPUTS */
.form-select,
.form-input-date {
    width: 100%;
    min-height: 52px;
    padding: 10px 14px;
    font-size: 16px;
    font-family: alga, serif;
    font-weight: 500;
    border: 3px solid #000;
    border-radius: 14px;
    background: #fff;
    color: #000;
}
.form-select:focus-visible,
.form-input-date:focus-visible{
    outline: 3px solid #3B57ED;
    outline-offset: 2px;
}

.date-picker-group{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
}

/* Small numeric input */
.form-input-num{
    width:80px;
    min-height:48px;
    padding:8px 12px;
    font-size:16px;
    font-family: alga, serif;
    font-weight:500;
    border:3px solid #000;
    border-radius:14px;
    background:#fff;
    color:#000;
    text-align:center;
}
.form-input-num:focus-visible{
    outline:3px solid #3B57ED;
    outline-offset:2px;
}

.legal-check {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 14px 0;
    color: #41485a;
    font-size: 0.92rem;
    line-height: 1.45;
}

.legal-check input {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
}

.legal-check a {
    color: #123f9e;
    font-weight: 700;
}

/* TOGGLE SWITCH */
.toggle-wrapper{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
}
.toggle-label{
    font-size:24px;
    font-weight:700;
    cursor:pointer;
}
.toggle-active{ color:#000; }
.toggle-inactive{ color:#666; }
.toggle-switch{ position:relative; width:64px; height:32px; }
.toggle-switch input{ opacity:0; width:0; height:0; }
.toggle-slider{ cursor: pointer;position:absolute; top:0; left:0; right:0; bottom:0; background:#000; border-radius:999px; transition:0.2s; }
.toggle-slider::before{ content:""; position:absolute; height:24px; width:24px; left:4px; top:4px; background:#fff; border-radius:50%; transition:0.2s; }
.toggle-switch input:checked + .toggle-slider{ background:#F8DC66; }
.toggle-switch input:checked + .toggle-slider::before{ transform:translateX(32px); }

/* SELECTED PERSONAS */
.selected-personas{ display:flex; justify-content:center; align-items:center; gap:40px; flex-wrap:wrap; margin:32px 0; }
.selected-persona{ position:relative; }
.selected-persona-remove{ position:absolute; top:-12px; right:-12px; background:#000; border:none; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.selected-persona-remove img{ width:16px; height:16px; transform:rotate(45deg); pointer-events:none; }

/* PERSONA LIST */
.persona-list-wrapper{ width:100%; }
.persona-list-header{ background:#000; color:#fff; text-align:center; font-size:20px; font-weight:700; padding:12px 0; }
/* Override generic ul styles for persona list */
.persona-list{
    width:100%;
    margin:0;            /* remove extra top gap */
    border:none;         /* let wrapper handle border */
    border-radius:0;     /* avoid double rounded corners */
    background:none;     /* inherit wrapper background */
    overflow:visible;    /* allow content to respect wrapper clipping */
}
.persona-list li{
    display:flex;
    align-items:center;
    padding:16px 28px;
    background:#fff;          /* default white row */
    color:#000;
    border-bottom:1px solid #ddd;
}
.persona-list li:last-child{ border-bottom:none; }
.persona-list img.avatar{ width:48px; height:48px; border-radius:50%; margin-right:16px; }
.persona-desc{ font-size:14px; }
.persona-toggle-btn{
    margin-left:auto;
    background:#000;
    color:#fff;
    border:2px solid #000;
    cursor:pointer;
    width:38px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    transition:background-color .18s ease, color .18s ease, transform .18s ease;
}
.persona-toggle-btn:hover{
    transform:translateY(-1px);
}
.persona-toggle-btn__glyph{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    color:inherit;
    font-family:"Helvetica Neue", Arial, sans-serif;
    font-size:26px;
    font-weight:700;
    line-height:1;
    transform:translateY(-1px);
}
/* selected row styles */
.persona-selected{
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.34) 0%, rgba(237, 178, 18, 0.18) 100%) !important;
    color:#000 !important;
}
.persona-selected h3,
.persona-selected .persona-desc{
    color:#000 !important;
}
.persona-selected .persona-toggle-btn{
    background:#fff !important;
    color:#000 !important;
}

/* OFFER CARD STYLES (refactored) */
.offer-card{
    padding:0;
    display:flex;
    flex-direction:column;
    overflow:visible;
}
.offer-card__header{
    background:linear-gradient(180deg,#F8DC66 0%,#EDB212 100%);
    padding:24px 32px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    border-radius:44px 44px 0 0; /* larger rounded corners top */
}
.offer-card__body{
    padding:24px 0;
    width:80%;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:24px;
}
.offer-card__footer {
    display:flex;
    justify-content:center;
    padding:40px 0 24px;
    margin-top:auto;
}
.recommendations{
    padding-top:24px;
    border-top:4px solid #000;
    width:100%;
    text-align:center;
}
.recommendations-list{
    list-style:none;
    margin:16px auto 0;
    max-height:180px;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
    gap:12px;
    padding-right:8px;
}
.recommendations-list li{
    cursor:pointer;
    position:relative;
    padding-left:18px;
}
.recommendations-list li::before{
    content:"\2022"; /* bullet */
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    color:#EDB212;
    font-size:20px;
}
/* Custom Scrollbar for Recommendations */
.recommendations-list::-webkit-scrollbar {
    width: 8px;
}
.recommendations-list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}
.recommendations-list::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}
.recommendations-list::-webkit-scrollbar-thumb:hover {
    background: #555;
}
.offer-card__footer .btn{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

/* OFFER CARD FINAL OVERRIDES */
.offer-card__body{width:100%!important;}
.recommendations-list{display:block!important;text-align:center!important;padding-right:0!important;}
.recommendations-list li{padding-left:0!important;list-style-position:inside;}

/* OFFER PAGE FINAL CLEANUP OVERRIDES */
.offer-card__header{
    position:static!important;
    top:auto!important;
    left:auto!important;
    transform:none!important;
}
.offer-card__body{
    width:80%!important;
    padding:0!important;
    margin:0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:24px!important;
}
.offer-card__body textarea{
    width:100%!important;
}
.recommendations-list li{
    border:none!important;
    margin-bottom:12px!important;
}
.offer-card__footer .btn{
    position:static!important;
    transform:none!important;
    left:auto!important;
}

/* -------------------------------------------------- */
/* OFFER CARD – page-specific final overrides         */
/* These rules refine only the Offer page styles and  */
/* intentionally use high specificity / !important    */
/* where necessary so they do NOT impact components   */
/* reused elsewhere.                                  */
/* -------------------------------------------------- */

/* 1. Ensure the yellow header spans full width */
.offer-card__header{
    width:100%;
}

/* 2. Center textarea content (horizontal & multi-line) */
.offer-card__body textarea{
    align-content:center; /* vertical flex alignment safeguard */
    text-align:center;    /* horizontal text centering fallback */
}

/* 3. Recommendation list – occupy full width & remove borders / bullets */
.offer-card .recommendations .recommendations-list{
    width:100%;
    border:none !important; /* override generic <ul> border */
}
.offer-card .recommendations .recommendations-list li::before{
    display:none !important; /* remove custom bullet */
    content:none !important; /* fallback */
}

/* 4. Re-enable absolute centering for the footer button */
.offer-card__footer .btn{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
}

/* ---- Offer page update: body/textarea width + footer btn centering removal ---- */
.offer-card__body{
    width:100% !important;
}
.offer-card__body textarea{
    width:80% !important;
}
.offer-card__footer .btn{
    left:auto !important;
    transform:none !important;
    /* position can remain static or absolute based on earlier rules */
}

/* ---- Offer page: fade-out bottom of recommendations list ---- */
.offer-card .recommendations .recommendations-list{
    /* gentle bottom gradient fade */
    --fade: 20px;
    -webkit-mask-image: linear-gradient(to bottom, black calc(100% - var(--fade)), transparent 100%);
    mask-image: linear-gradient(to bottom, black calc(100% - var(--fade)), transparent 100%);
}

/* -------------------------------------------------- */
/* OFFER PAGE – refreshed layout                      */
/* -------------------------------------------------- */

.campaign-offer-main{
    position:relative;
}

.campaign-offer-page{
    gap:16px;
    padding-bottom:clamp(24px, 4vw, 44px);
}

.campaign-offer-layout{
    width:min(100%, 1220px);
    display:grid;
    grid-template-columns:minmax(280px, 0.92fr) minmax(420px, 1.35fr);
    gap:28px;
    align-items:start;
}

.campaign-offer-left{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:24px;
}

.campaign-offer-grid{
    width:100%;
    min-height:340px;
    margin:0;
}

.campaign-offer-tip{
    align-self:flex-start;
    width:min(100%, 340px);
}

.campaign-offer-card{
    padding:0;
    gap:0;
    overflow:hidden;
}

.campaign-offer-page .offer-card__header.campaign-offer-card-header{
    width:100%;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:end;
    gap:20px;
    padding:26px 28px !important;
    background:linear-gradient(180deg,#F8DC66 0%,#EDB212 100%);
    border-radius:44px 44px 0 0;
}

.campaign-offer-card-copy{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
}

.campaign-offer-eyebrow{
    margin:0;
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#7c5b09;
}

.campaign-offer-title{
    margin:0;
    font-size:clamp(1.8rem, 2.4vw, 2.3rem);
    line-height:1;
}

.campaign-offer-goal{
    margin:0;
    font-size:14px;
    line-height:1.4;
}

.campaign-offer-product-tools{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
}

.campaign-offer-product-select{
    width:220px;
    margin:0;
}

.campaign-offer-manage-btn{
    padding:10px 16px;
    font-size:14px;
}

.campaign-offer-page .offer-card__body.campaign-offer-card-body{
    width:100% !important;
    margin:0 !important;
    padding:24px 28px 28px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:20px !important;
    background:#fff;
}

.campaign-offer-input-panel{
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:18px;
    border:2px solid #000;
    border-radius:24px;
    background:rgba(255,255,255,0.92);
}

.campaign-offer-section-label{
    margin:0;
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
}

.campaign-offer-textarea{
    width:100% !important;
    min-height:128px;
    text-align:left;
    font-size:18px;
}

.campaign-offer-recommendations{
    width:100%;
    padding:20px;
    border:2px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(248,220,102,0.08) 0%, rgba(255,255,255,0.96) 100%);
    text-align:left;
}

.campaign-offer-recommendations-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    margin-bottom:14px;
}

.campaign-offer-recommendations-copy{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.campaign-offer-section-help{
    margin:0;
    font-size:14px;
    line-height:1.45;
    color:#494949;
}

.campaign-offer-ai-btn{
    flex:0 0 auto;
    padding:10px 14px;
    font-size:14px;
}

.campaign-offer-page .recommendations-list{
    width:100%;
    margin:0;
    max-height:252px;
    padding-right:6px !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
    overflow-y:auto;
    text-align:left !important;
    border:none !important;
    background:none !important;
    -webkit-mask-image:none;
    mask-image:none;
}

.campaign-offer-page .recommendations-list li{
    margin:0 !important;
    padding:12px 14px !important;
    border:2px solid #000;
    border-radius:16px;
    background:#fff;
    cursor:pointer;
    line-height:1.4;
    transition:transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.campaign-offer-page .recommendations-list li:hover{
    transform:translateY(-1px);
    background:rgba(248,220,102,0.18);
    box-shadow:0 6px 14px rgba(0,0,0,0.08);
}

.campaign-offer-page .recommendations-list li::before{
    display:none !important;
    content:none !important;
}

.campaign-offer-page .offer-card__footer.campaign-offer-card-footer{
    position:static;
    display:flex;
    justify-content:flex-end;
    padding:0 28px 28px;
}

.campaign-offer-page .offer-card__footer .campaign-offer-continue-btn{
    position:static !important;
    left:auto !important;
    transform:none !important;
    min-width:168px;
}

/* -------------------------------------------------- */
/* INTENSITY PAGE – custom styles                     */
/* -------------------------------------------------- */

.campaign-intensity-main{
    position:relative;
    min-height:100svh;
}

.campaign-intensity-page{
    min-height:100%;
    padding-bottom:clamp(32px, 5vw, 56px);
}

.campaign-intensity-header{
    width:min(100%, 1220px);
    margin-bottom:64px !important;
}

.campaign-intensity-grid{
    width:min(100%, 1220px);
    margin-bottom:96px;
    gap:40px;
    align-items:flex-start;
    justify-content:center;
}

.campaign-intensity-grid .column{
    width:min(31%, 340px);
    flex:1 1 0;
}

.circle-card{
    border:4px solid #000;
    border-radius:50%;
    width:100%;
    aspect-ratio : 1 / 1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:40px;
    gap:64px;
    background:#fff;
}

/* Yellow gradient select button variant */
.btn-yellow-select{
    background:linear-gradient(180deg,#F8DC66 0%,#EDB212 100%);
    color:#000;
}

@media (prefers-reduced-motion:reduce){
    .circle-card{transition:none;}
}

@media(max-width:1100px){
    .campaign-intensity-header{
        margin-bottom:40px !important;
    }
    .campaign-intensity-grid{
        margin-bottom:56px;
        gap:28px;
    }
    .campaign-intensity-grid .column{
        width:min(31%, 280px);
    }
    .campaign-intensity-tip{
        right:24px;
        bottom:16px;
    }
}

@media(max-width:900px){
    .campaign-intensity-main{
        min-height:auto;
    }
    .campaign-intensity-page{
        height:auto;
    }
    .campaign-intensity-grid{
        flex-direction:column;
        align-items:center;
        gap:36px;
        margin-bottom:40px;
    }
    .campaign-intensity-grid .column{
        width:min(100%, 420px);
    }
    .campaign-intensity-grid .circle-card{
        width:100%;
        padding:32px;
        gap:20px;
    }
    .campaign-intensity-tip{
        position:static;
        align-self:flex-start;
        width:min(100%, 360px);
        margin-top:8px;
    }
}
@media(max-width:600px){
    .campaign-intensity-header{
        margin-bottom:32px !important;
    }
    .campaign-intensity-grid{
        gap:28px;
    }
    .campaign-intensity-grid .column{
        width:min(100%, 320px);
    }
    .campaign-intensity-grid .circle-card{
        padding:24px;
        gap:16px;
    }
    .campaign-intensity-tip{
        width:100%;
    }
}

/* -------------------------------------------------- */
/* CHANNELS PAGE – custom styles                      */
/* -------------------------------------------------- */

.campaign-channels-main{
    position:relative;
}

.campaign-channels-page{
    gap:16px;
    padding-bottom:clamp(24px, 4vw, 44px);
}

.campaign-channels-layout{
    width:min(100%, 1220px);
    display:grid;
    grid-template-columns:minmax(280px, 0.92fr) minmax(420px, 1.35fr);
    gap:28px;
    align-items:start;
}

.campaign-channels-preview-column{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:24px;
}

.campaign-channels-preview-stage{
    position:relative;
    width:100%;
    min-height:340px;
    overflow:visible;
}

.campaign-channels-grid{
    margin:0;
}

.campaign-channels-grid-empty{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    text-align:center;
    font-size:18px;
    font-weight:700;
    line-height:1.35;
    color:#4b4b4b;
    pointer-events:none;
    z-index:0;
}

.campaign-channels-grid-empty.is-hidden{
    display:none;
}

.campaign-channels-tip{
    align-self:flex-start;
    width:min(100%, 340px);
}

.campaign-channels-continue-btn{
    align-self:center;
    width:160px;
}

.campaign-channels-right{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:24px;
}

.budget-card{
    width:100%;
    border:4px solid #000;
    border-radius:20px;
    background:#fff;
    display:flex;
    align-items:center;
    gap:16px;
    padding:24px 32px;
    font-size:20px;
    font-weight:700;
    position:sticky;
    top:0;
    z-index:3;
}
.budget-card__prompt{flex:1 1 auto;}
.budget-card__dollar{font-size:24px; font-weight:700; margin-right:8px;}

/* Wrapper scroll area */
.channel-list-wrapper{
    max-height:60vh;
    overflow-y:auto;
    overflow-x:hidden;
    padding-right:8px;
}

.campaign-channels-table{
    width:100%;
}

.campaign-channels-list-header{
    text-align:left;
    padding-inline:18px;
}

.channel-list{
    width:100%;
    margin:0;
    border:none;
    border-radius:0;
    background:none;
    overflow:visible;
}

.channel-list li{
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px 24px;
    background:#fff;
    color:#000;
    border-bottom:1px solid #ddd;
}

.channel-list li:last-child{
    border-bottom:none;
}

.campaign-channels-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.campaign-channels-copy h3{
    margin:0;
    font-size:18px;
    line-height:1.1;
}

.channel-desc{
    margin:0;
    font-size:13px;
    line-height:1.4;
    color:#555;
}

.channel-toggle-btn{
    margin-left:auto;
    flex:0 0 auto;
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:#000;
    display:flex;
    justify-content:center;
    align-items:center;
    cursor:pointer;
    transition:transform .18s ease, background-color .18s ease;
}

.channel-toggle-btn:hover{
    transform:translateY(-1px);
}

.channel-toggle-btn img{
    width:18px;
    height:18px;
    pointer-events:none;
}

/* Channel list pill tag */
.channel-tag{
    flex:0 0 88px;
    padding:4px 12px;
    border:2px solid #000;
    border-radius:999px;
    background:linear-gradient(180deg,#F8DC66 0%,#EDB212 100%);
    font-size:12px;
    font-weight:700;
    color:#000;
    white-space:nowrap;
    text-align:center;
    margin-right:4px;
}

/* Channel selected row styles */
.channel-selected{
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.34) 0%, rgba(237, 178, 18, 0.18) 100%) !important;
    color:#000 !important;
}
.channel-selected h3,
.channel-selected .channel-desc{color:#000 !important;}
.channel-selected .channel-toggle-btn{background:#fff !important;}

@media(max-width:900px){
    .budget-card{flex-direction:column; align-items:flex-start; gap:12px;}
    .campaign-channels-layout{
        grid-template-columns:1fr;
    }
    .campaign-channels-preview-stage{
        min-height:280px;
    }
    .campaign-channels-tip{
        width:100%;
    }
    .channel-list li{
        align-items:flex-start;
        flex-wrap:wrap;
    }
    .channel-toggle-btn{
        margin-left:0;
    }
}

@media (max-width: 1180px) {
    .campaign-card {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .campaign-card__side {
        grid-column: 2;
        justify-self: start;
        align-items: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
    }
}

/* -------------------------------------------------- */
/* PERSONAS DASHBOARD PAGE – custom styles            */
/* -------------------------------------------------- */

.section-bar{
    border:4px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg,#ED52C9 0%,#AA00AA 100%);
    color:#fff;
    font-size:24px;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 32px;
}
.section-bar .btn-add{
    background:#fff;
    color:#AA00AA;
    border:none;
    border-radius:12px;
    padding:8px 24px;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 2px 4px #0002;
}

/* Gradient header variant with button */
.header-with-btn{
    position:relative;
    justify-content:center !important;
    padding:16px 32px !important;
    text-align:center;
}
.header-with-btn .btn-add{ position:absolute; right:32px; top:50%; transform:translateY(-50%); }

/* Update add button style (pill) */
.btn-add{
    border-radius:999px !important;
    padding:6px 24px !important;
    border:none !important;
}

/* Card primary button padding */
.card-btn{ padding:12px 0; width:100%; }

/* Audio button margin */
.btn-audio{ margin-left:12px; }

/* Audio waveform button */
.btn-audio{
    background:#000;
    border:none;
    border-radius:12px;
    width:48px; height:48px;
    display:flex; justify-content:center; align-items:center;
    cursor:pointer;
    padding: 0 12px
}
.btn-audio.active{
    background:#fff;
    border:4px solid #AA00AA;
}
.btn-audio.active img{ filter:invert(19%) sepia(64%) saturate(5271%) hue-rotate(294deg) brightness(82%) contrast(107%); }

/* Persona card */
.persona-card{
    border:4px solid #000;
    border-radius:20px;
    background:#fff;
    width:300px;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:24px;
    gap:12px;
    cursor:pointer;
    transition:transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
.persona-card:hover,
.persona-card:focus-visible,
.persona-card.is-selected{
    border-color:#AA00AA;
    box-shadow:0 10px 24px rgba(170, 0, 170, 0.16);
}
.persona-card:focus-visible{
    outline:3px solid rgba(170, 0, 170, 0.32);
    outline-offset:4px;
}
.persona-card .avatar{ width:72px; height:72px; border-radius:50%; }
.persona-card-name{ font-size:20px; font-weight:700; text-align:center; }
.persona-card-status{
    display:inline-flex;
    align-items:center;
    padding:6px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    background:#f3f3f3;
    color:#333;
}
.persona-card-status.is-pending{
    background:#ebf1ff;
    color:#244db8;
}
.persona-card-body{ max-height:160px; overflow-y:auto; font-size:12px; text-align:left; width:100%; }
.persona-card-body::-webkit-scrollbar{ width:4px; }
.persona-card-body::-webkit-scrollbar-thumb{ background:#888; border-radius:4px; }
.persona-card-btns{ width:100%; display:flex; justify-content:space-between; align-items:center; margin-top:auto; }
.persona-card .card-action-row{
    margin-top:auto;
    align-items:center;
}
.persona-card .card-btn{
    flex:1 1 92px;
    width:auto;
    min-height:48px;
    padding:10px 14px;
}
.persona-card [data-archive-persona].is-armed,
.persona-card [data-archive-product].is-armed{
    color:#fff;
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
}
.persona-card .btn-audio{
    flex:0 0 48px;
    margin-left:0;
}

/* Campaigns sidebar */
.campaigns-card{ border:4px solid #000; border-radius:28px; background:rgba(255,255,255,0.96); width:100%; display:flex; flex-direction:column; box-shadow:var(--shadow-card); overflow:hidden; }
.campaigns-list-wrapper{ flex:1 1 auto; overflow-y:auto; min-height:120px; }
.campaign-li{ display:flex; align-items:center; gap:16px; padding:18px 24px; border-bottom:2px solid var(--color-border-light); }
.campaign-li:last-child{ border-bottom:none; }
.campaign-li .avatar{ width:48px; height:48px; border-radius:50%; }
.campaign-li .campaign-meta{ display:flex; flex-direction:column; gap:4px; font-size:13px; line-height:1.45; }
.campaign-li .btn-view{ margin-left:auto; background:#000; color:#fff; border:2px solid #000; border-radius:12px; padding:10px 18px; font-size:14px; font-weight:700; cursor:pointer; box-shadow:0 3px 0 rgba(0, 0, 0, 0.1); }

/* Dashboard grid */
.persona-grid-dashboard{ display:flex; flex-wrap:wrap; gap:32px; }
.segment-dashboard-summary{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:var(--space-12);
    margin:var(--space-16) 0;
}

.segment-dashboard-summary .record-card{
    margin-top:0;
}

.segment-dashboard-modal-shell{
    width:min(1360px, calc(100vw - 32px));
    max-height:calc(100vh - 32px);
}

.performance-dashboard-modal-shell{
    display:flex;
    flex-direction:column;
    gap:var(--space-16);
}

.performance-segment-list{
    display:grid;
    gap:var(--space-14);
}

.performance-segment-card{
    display:flex;
    flex-direction:column;
    gap:var(--space-16);
    margin-top:0;
}

.performance-segment-card__header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:var(--space-16);
}

.performance-segment-card__title{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-8);
}

.performance-segment-card__title h3{
    margin:0;
    font-size:var(--type-20);
    line-height:1.2;
}

.performance-segment-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
    gap:var(--space-12);
}

.performance-segment-metrics div{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-4);
    padding:var(--space-12);
    border:1px solid var(--color-border-light);
    border-radius:var(--radius-sm);
    background:var(--color-background-secondary);
}

.performance-segment-metrics strong,
.performance-segment-metrics .btn-link{
    font-size:var(--type-20);
    line-height:1.2;
}

.performance-segment-metrics .btn-link{
    width:max-content;
    max-width:100%;
    padding:0;
}

.performance-segment-metrics small{
    color:var(--color-text-secondary);
    font-size:var(--type-12);
    line-height:1.4;
}

.performance-segment-card__footer{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-12);
    flex-wrap:wrap;
    padding-top:var(--space-12);
    border-top:1px solid var(--color-border-light);
}

.page-sidebar-column > .plus-btn{ align-self:center; }

@media(max-width:900px){
    .segment-dashboard-summary{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media(max-width:640px){
    .segment-dashboard-summary{
        grid-template-columns:1fr;
    }

    .performance-segment-card__header{
        flex-direction:column;
    }

    .performance-segment-card__header .btn-small{
        width:100%;
    }
}

.nurture-sequence-list,
.nurture-step-list{
    display:flex;
    flex-direction:column;
    gap:var(--space-12);
}

.nurture-sequence-card h3,
.nurture-step-card h3{
    margin:var(--space-4) 0;
    font-size:var(--font-size-lg);
}

.nurture-step-body{
    margin-top:var(--space-12);
    padding:var(--space-12);
    border:1px solid var(--color-border-light);
    border-radius:var(--radius-sm);
    background:var(--color-background-secondary);
    color:var(--color-text);
    font-size:var(--font-size-sm);
    line-height:1.6;
}

.btn-small{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:40px;
    padding:10px 14px;
    border:2px solid #000;
    border-radius:12px;
    font-size:13px;
    font-weight:700;
    line-height:1.15;
    cursor:pointer;
    text-decoration:none;
    background:#fff;
    color:#000;
    box-shadow:0 2px 0 rgba(0, 0, 0, 0.08);
}

.btn-small.primary{
    background:#000;
    color:#fff;
}

.btn-small.neutral{
    background:rgba(255,255,255,0.96);
    color:#000;
}

.btn-small.danger{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#fff;
}

.btn-small.success{
    background:linear-gradient(180deg, #53CE26 0%, #008805 100%);
    color:#fff;
}

.btn[hidden],
.btn-small[hidden],
.btn.is-hidden,
.btn-small.is-hidden {
    display:none !important;
}

.data-table{
    width:100%;
    border-collapse:collapse;
    border:4px solid #000;
    border-radius:18px;
    overflow:hidden;
    background:#fff;
}

.data-table-wrap{
    width:100%;
    overflow-x:auto;
}

.data-table th,
.data-table td{
    padding:12px 14px;
    text-align:left;
    vertical-align:top;
    border-bottom:1px solid var(--color-border-light);
}

.data-table thead th{
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.06em;
    background:var(--color-background-secondary);
}

.data-table tbody td{
    font-size:14px;
}

.data-table tbody tr:last-child td{
    border-bottom:none;
}

.data-table tbody tr:hover{
    background:var(--color-background-hover);
}

.badge,
.chip {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:32px;
    padding:6px 12px;
    border:var(--border-width-control) solid #000;
    border-radius:var(--radius-pill);
    background:#fff;
    font-size:12px;
    font-weight:700;
    line-height:1.1;
}

.badge.unstarted,
.chip.unstarted {
    background:#eef2ff;
    color:#3730a3;
}

.badge.pending,
.chip.pending,
.badge.pending_dns,
.chip.pending_dns,
.badge.pending_cert,
.chip.pending_cert {
    background:#fff7ed;
    color:#9a4c12;
}

.badge.verified,
.chip.verified,
.badge.active,
.chip.active {
    background:#ecfdf5;
    color:#166534;
}

.badge.failed,
.chip.failed,
.badge.blocked,
.chip.blocked,
.badge.error,
.chip.error {
    background:#fef2f2;
    color:#b91c1c;
}

.status-banner,
.settings-banner,
.usage-admin-banner,
.admin-prompts-banner,
.workflow-status {
    display:none;
    width:100%;
    padding:14px 18px;
    border:var(--border-width-strong) solid #000;
    border-radius:var(--radius-md);
    background:#fff;
    box-shadow:var(--shadow-soft);
    font-weight:700;
    line-height:1.45;
}

.status-banner.is-visible,
.settings-banner.is-visible,
.usage-admin-banner.is-visible,
.admin-prompts-banner.is-visible,
.workflow-status.is-visible {
    display:block;
}

.status-banner.is-info,
.workflow-status.is-info {
    background:linear-gradient(180deg, var(--surface-info-tint) 0%, rgba(255,255,255,0.88) 100%);
    color:var(--surface-info-tone);
}

.status-banner.is-success,
.settings-banner.is-success,
.usage-admin-banner.is-success,
.admin-prompts-banner.is-success,
.workflow-status.is-success {
    background:linear-gradient(180deg, var(--surface-success-tint) 0%, rgba(255,255,255,0.92) 100%);
    color:var(--surface-success-tone);
}

.status-banner.is-error,
.settings-banner.is-error,
.usage-admin-banner.is-error,
.admin-prompts-banner.is-error,
.workflow-status.is-error {
    background:linear-gradient(180deg, var(--surface-error-tint) 0%, rgba(255,255,255,0.92) 100%);
    color:var(--surface-error-tone);
}

.status-banner .ai-progress-shell,
.workflow-status .ai-progress-shell,
.ai-status .ai-progress-shell,
.campaign-editor-ai-status .ai-progress-shell {
    gap: 4px;
}

body[data-page-load-state="pending"] {
    overflow: hidden;
}

body[data-page-load-state="pending"] > *:not(.background-triangle):not(.page-loading-gate) {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.page-loading-gate {
    position: fixed;
    inset: 0;
    z-index: 9500;
    display: grid;
    place-items: center;
    padding: clamp(24px, 5vw, 56px);
    pointer-events: none;
}

.page-loading-gate--demo {
    position: relative;
    inset: auto;
    padding: 0;
}

.page-loading-gate__card {
    width: min(560px, 100%);
    display: grid;
    gap: 12px;
    padding: clamp(24px, 4vw, 36px);
    border: var(--border-width-panel) solid var(--color-border);
    border-radius: var(--radius-lg);
    background: linear-gradient(180deg, rgba(255,255,255,0.97) 0%, rgba(255,255,255,0.92) 100%);
    box-shadow: var(--shadow-float);
    backdrop-filter: blur(10px);
}

.page-loading-gate__eyebrow {
    margin: 0;
    font-size: var(--type-12);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--surface-accent-dark);
}

.page-loading-gate__title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.page-loading-gate__title {
    margin: 0;
    font-size: clamp(28px, 4.2vw, 40px);
    line-height: 1.02;
    color: var(--color-text-primary);
}

.page-loading-gate__detail {
    margin: 0;
    max-width: 42ch;
    font-size: var(--type-16);
    line-height: 1.55;
    color: var(--color-text-secondary);
}

@media (max-width: 720px) {
    .page-loading-gate__card {
        gap: 10px;
        padding: 24px 22px;
    }

    .page-loading-gate__title {
        font-size: clamp(24px, 8vw, 32px);
    }

    .page-loading-gate__detail {
        font-size: var(--type-14);
    }
}

.modal-shell,
.edit-modal-content {
    border:var(--border-width-panel) solid #000;
    border-radius:var(--radius-lg);
    background:#fff;
    box-shadow:var(--shadow-float);
}

.modal-shell {
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:28px;
}

.modal-shell > :first-child {
    margin-top:0;
}

.modal-shell > :where(h1, h2, h3, h4, p) {
    margin:0;
}

.modal-shell > :last-child {
    margin-bottom:0;
}

.edit-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.72);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:10000;
    padding:24px;
}

.edit-modal.is-open{
    display:flex;
}

.promotion-link-form{
    display:grid;
    gap:16px;
}

.edit-modal-content{
    width:min(720px, 100%);
    max-height:85vh;
    overflow-y:auto;
    padding:28px;
    border:4px solid #000;
    border-radius:28px;
    background:#FFF;
    box-shadow:var(--shadow-float);
}

.edit-modal-content h3{
    margin:0 0 20px 0;
    font-size:28px;
}

.edit-form-group{
    margin-bottom:18px;
}

.edit-form-group label{
    display:block;
    margin-bottom:8px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.edit-form-group input,
.edit-form-group select,
.edit-form-group textarea{
    width:100%;
    padding:12px 14px;
    border:3px solid #000;
    border-radius:16px;
    background:#FFF;
    font-size:16px;
    font-family:alga, serif;
}

.edit-form-group textarea{
    resize:vertical;
    min-height:120px;
}

.edit-modal-buttons{
    display:flex;
    gap:8px;
    justify-content:flex-end;
    flex-wrap:wrap;
    margin-top:24px;
}

.settings-grid,
.usage-admin-grid{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0, 360px) minmax(0, 1fr);
    gap:28px;
    align-items:start;
}

.settings-panel,
.settings-table-card,
.usage-admin-list,
.usage-admin-detail,
.usage-admin-table-card{
    border:4px solid #000;
    border-radius:28px;
    background:rgba(255,255,255,0.96);
    box-shadow:var(--shadow-card);
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.settings-form{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.usage-admin-form-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.usage-admin-account-heading{
    display:flex;
    justify-content:space-between;
    gap:var(--space-16);
    flex-wrap:wrap;
    align-items:flex-start;
}

.usage-admin-account-title{
    margin:0 0 6px 0;
}

.usage-admin-account-email{
    margin:0;
}

.usage-admin-field-label{
    display:block;
    margin-bottom:8px;
    font-size:13px;
    font-weight:700;
}

.usage-admin-inline-note{
    color:var(--color-text-secondary);
    font-size:13px;
}

.usage-admin-section-title{
    margin:0 0 var(--space-12) 0;
}

.settings-label{
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:14px;
    font-weight:700;
}

.settings-checkbox,
.usage-admin-checkbox{
    display:flex;
    gap:12px;
    align-items:flex-start;
    font-size:15px;
    line-height:1.45;
}

.settings-input,
.usage-admin-input,
.admin-prompts-filter,
.admin-prompts-input,
.admin-prompts-textarea{
    width:100%;
    border:3px solid #000;
    border-radius:18px;
    background:#fff;
    padding:14px 16px;
    font-family:inherit;
    font-size:16px;
    box-shadow:var(--shadow-soft);
}

.settings-note{
    margin:0;
    font-size:13px;
    color:var(--color-text-secondary);
    line-height:1.5;
}

.settings-banner,
.usage-admin-banner,
.admin-prompts-banner{
    display:none;
    width:100%;
    padding:14px 18px;
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    box-shadow:var(--shadow-soft);
}

.settings-banner.is-visible,
.usage-admin-banner.is-visible,
.admin-prompts-banner.is-visible{
    display:block;
}

.settings-banner.is-success,
.usage-admin-banner.is-success,
.admin-prompts-banner.is-success{
    background:linear-gradient(180deg, rgba(125, 222, 64, 0.24) 0%, rgba(0, 136, 5, 0.06) 100%);
}

.settings-banner.is-error,
.usage-admin-banner.is-error,
.admin-prompts-banner.is-error{
    background:linear-gradient(180deg, rgba(227, 63, 42, 0.18) 0%, rgba(181, 6, 0, 0.06) 100%);
}

.settings-summary-grid,
.usage-admin-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px;
}

.settings-summary-card,
.usage-admin-summary-card{
    border:4px solid #000;
    border-radius:24px;
    background:rgba(255,255,255,0.96);
    box-shadow:var(--shadow-card);
    padding:18px 20px;
}

.settings-summary-card p{
    margin:0;
}

.settings-summary-label,
.usage-admin-summary-label{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:0.08em;
    font-weight:700;
    color:#5c5333;
    margin-bottom:10px;
}

.settings-summary-value,
.usage-admin-summary-value{
    font-size:28px;
    line-height:1.05;
    font-weight:700;
    margin-bottom:8px;
}

.settings-summary-meta,
.usage-admin-summary-meta{
    font-size:13px;
    color:var(--color-text-secondary);
    line-height:1.5;
}

.settings-table,
.usage-admin-table{
    width:100%;
    border-collapse:collapse;
}

.settings-table th,
.settings-table td,
.usage-admin-table th,
.usage-admin-table td{
    padding:12px 10px;
    border-bottom:1px solid var(--color-border-light);
    text-align:left;
    vertical-align:top;
    font-size:14px;
}

.settings-table th,
.usage-admin-table th{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.06em;
}

.settings-table tr:last-child td,
.usage-admin-table tr:last-child td{
    border-bottom:none;
}

.settings-empty,
.usage-admin-empty{
    padding:28px;
    text-align:center;
    border:3px dashed #000;
    border-radius:20px;
    background:rgba(255,255,255,0.82);
}

.settings-page .settings-shell{
    position:relative;
    z-index:2;
    align-items:stretch;
    gap:var(--space-32);
    max-width:1240px;
    margin:0 auto;
}

.settings-page .top-navigation-container{
    position:relative;
    z-index:2;
}

.settings-page-heading{
    display:grid;
    gap:var(--space-12);
}

.settings-page .settings-page-title{
    margin-bottom:0;
}

.settings-page-intro{
    max-width:68ch;
    margin:0;
}

.settings-page .settings-banner{
    margin:0;
}

.settings-page .settings-overview-grid{
    grid-template-columns:minmax(0, 1.35fr) minmax(320px, 0.75fr);
    gap:var(--space-32);
}

.settings-page .settings-panel,
.settings-page .settings-table-card{
    min-width:0;
    overflow:hidden;
    gap:var(--space-28);
    padding:28px;
    background:#fff;
}

.settings-page .settings-section-card{
    margin-top:0;
}

.settings-page .settings-summary-grid{
    min-width:0;
    gap:var(--space-20);
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}

.settings-page .settings-summary-grid--account{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.settings-page .settings-summary-grid--plans{
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

.settings-page .settings-summary-grid--usage{
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 210px), 1fr));
}

.settings-page .settings-summary-card{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-12);
    overflow:hidden;
    padding:22px;
    background:#fff;
}

.settings-page .settings-summary-value,
.settings-page .settings-summary-meta,
.settings-page .settings-note{
    overflow-wrap:anywhere;
}

.settings-page .settings-summary-value{
    font-size:clamp(22px, 2.4vw, 28px);
}

.settings-page .settings-plan-card{
    min-height:242px;
}

.settings-plan-card__topline{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-12);
}

.settings-plan-card__topline .settings-summary-label{
    margin:0;
}

.settings-page .settings-plan-card--current{
    background:linear-gradient(180deg, rgba(244,248,255,0.98) 0%, rgba(255,255,255,0.96) 100%);
}

.settings-page .settings-action-row{
    margin-top:auto;
    display:flex;
    align-items:center;
    gap:var(--space-12);
    flex-wrap:wrap;
}

.settings-page .settings-action-row .btn,
.settings-page .settings-action-row .btn.secondary{
    min-height:44px;
    padding:10px 16px;
    font-size:14px;
}

.settings-status-card{
    display:grid;
    gap:var(--space-20);
    padding:22px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:linear-gradient(180deg, #fff 0%, #f7faff 100%);
    box-shadow:var(--shadow-soft);
}

.settings-status-shell{
    min-width:0;
}

.settings-status-card__header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-12);
    flex-wrap:wrap;
}

.settings-status-card__header p{
    flex:1 1 220px;
    margin:0;
    color:var(--color-text-secondary);
    font-size:13px;
    line-height:1.5;
}

.settings-detail-list{
    display:grid;
    gap:12px;
    margin:0;
}

.settings-detail-row{
    display:grid;
    grid-template-columns:minmax(120px, 0.52fr) minmax(0, 1fr);
    gap:var(--space-16);
    align-items:start;
    padding:12px 0;
    border-top:1px solid var(--color-border-light);
}

.settings-detail-row dt,
.settings-detail-row dd{
    min-width:0;
    margin:0;
    overflow-wrap:anywhere;
    line-height:1.4;
}

.settings-detail-row dt{
    color:var(--color-text-secondary);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.06em;
    text-transform:uppercase;
}

.settings-detail-row dd{
    font-size:14px;
    font-weight:700;
}

.settings-page .settings-form{
    min-width:0;
    gap:var(--space-20);
}

.settings-legal-form{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.settings-field-group{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--color-text-secondary);
}

.settings-field-group .form-input{
    width:100%;
    min-width:0;
    letter-spacing:0;
    text-transform:none;
}

.settings-legal-readiness{
    grid-column:1 / -1;
    display:none;
    min-width:0;
    padding:14px 16px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:rgba(255,255,255,0.92);
    color:var(--color-text-secondary);
    font-size:14px;
    font-weight:700;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.settings-legal-readiness.is-visible{
    display:block;
}

.settings-legal-readiness.is-ready{
    border-color:rgba(0,136,5,0.38);
    background:rgba(83,206,38,0.12);
    color:#124615;
}

.settings-legal-readiness.is-missing{
    border-color:rgba(181,6,0,0.36);
    background:rgba(227,63,42,0.10);
    color:#5b130f;
}

.settings-page .settings-checkbox{
    min-width:0;
    padding:16px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:rgba(255,255,255,0.9);
    box-shadow:var(--shadow-soft);
}

.settings-page .settings-checkbox span{
    min-width:0;
    overflow-wrap:anywhere;
}

.settings-page .settings-input{
    min-width:0;
}

.settings-table-wrap{
    width:100%;
    min-width:0;
    overflow-x:auto;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:rgba(255,255,255,0.94);
    box-shadow:var(--shadow-soft);
}

.settings-page .settings-table{
    min-width:680px;
}

.settings-page .settings-table th,
.settings-page .settings-table td{
    overflow-wrap:anywhere;
}

.settings-page .settings-table th{
    white-space:nowrap;
}

.settings-page .settings-table th:first-child,
.settings-page .settings-table td:first-child{
    width:38%;
}

.settings-page .settings-empty{
    min-width:0;
    text-align:left;
    overflow-wrap:anywhere;
}

.settings-page .settings-section-note{
    margin-top:0;
}

.settings-panel--legal{
    grid-column:1 / -1;
}

.settings-panel--company-legal{
    grid-column:1 / -1;
}

.legal-resource-list{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:var(--space-16);
    min-width:0;
    margin:0;
    padding:0;
    list-style:none;
}

.legal-resource-list__item{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-8);
    padding:18px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:var(--color-white);
    box-shadow:var(--shadow-soft);
}

.legal-resource-list__link{
    color:var(--surface-accent-dark);
    font-size:16px;
    font-weight:800;
    line-height:1.25;
    text-decoration:underline;
    text-decoration-color:var(--color-border-medium);
    text-underline-offset:0.18em;
}

.legal-resource-list__item span{
    min-width:0;
    color:var(--color-text-secondary);
    font-size:13px;
    font-weight:700;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.settings-value-grid,
.settings-modal-value-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:var(--space-20);
    min-width:0;
}

.settings-value-card{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-12);
    padding:22px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:#fff;
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}

.settings-value-card p{
    margin:0;
}

.settings-value-card--hero{
    background:linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.settings-value-story{
    display:grid;
    gap:var(--space-16);
    min-width:0;
    padding:22px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:#fff;
    box-shadow:var(--shadow-soft);
}

.settings-value-story:empty{
    display:none;
}

.settings-value-story__row{
    display:grid;
    grid-template-columns:minmax(120px, 0.45fr) minmax(0, 1fr);
    gap:var(--space-16);
    align-items:start;
}

.settings-value-story__row + .settings-value-story__row{
    padding-top:var(--space-16);
    border-top:1px solid var(--color-border-light);
}

.settings-value-story__row strong,
.settings-value-story__row span{
    min-width:0;
    overflow-wrap:anywhere;
    line-height:1.5;
}

.settings-value-story__row strong{
    font-size:13px;
}

.settings-value-story__row span{
    color:var(--color-text-secondary);
    font-size:14px;
}

.settings-plan-modal{
    position:fixed;
    inset:0;
    z-index:10000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(8, 14, 28, 0.68);
}

.settings-plan-modal[hidden]{
    display:none;
}

.settings-plan-modal__shell{
    width:min(760px, 100%);
    max-height:min(760px, 90vh);
    display:flex;
    flex-direction:column;
    gap:var(--space-24);
    padding:28px;
    overflow-y:auto;
}

.settings-plan-modal__header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-16);
}

.settings-plan-modal__header h2{
    margin:0;
    font-size:clamp(24px, 3vw, 34px);
    line-height:1.05;
}

.settings-plan-modal__actions{
    margin-top:0;
}

.settings-plan-modal-open{
    overflow:hidden;
}

.usage-admin-list-items,
.admin-prompts-list,
.admin-chain-list{
    display:flex;
    flex-direction:column;
    gap:12px;
    overflow:auto;
}

.usage-admin-list-items{
    max-height:72vh;
}

.usage-admin-account,
.admin-prompts-list-item,
.admin-chain-list-item{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:16px 18px;
    box-shadow:var(--shadow-soft);
    cursor:pointer;
    display:flex;
    flex-direction:column;
    gap:10px;
}

.usage-admin-account.is-active,
.admin-prompts-list-item.is-active,
.admin-chain-list-item.is-active{
    transform:translateY(-2px);
    box-shadow:0 8px 16px rgba(59,87,237,0.18);
    border-color:#3B57ED;
}

.usage-admin-chip-row,
.admin-prompts-chip-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.usage-admin-chip,
.admin-prompts-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 10px;
    border:2px solid #000;
    border-radius:999px;
    background:#fff;
    font-size:12px;
    font-weight:700;
}

.usage-admin-chip.is-red,
.admin-prompts-chip.is-red{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#fff;
}

.usage-admin-chip.is-green,
.admin-prompts-chip.is-green{
    background:linear-gradient(180deg, #7DDE40 0%, #008805 100%);
    color:#fff;
}

.usage-admin-chip.is-yellow,
.admin-prompts-chip.is-yellow{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}

.admin-prompts-chip.is-blue{
    background:linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    color:#fff;
}

.admin-hidden{
    display:none !important;
}

.admin-prompts-grid{
    display:grid;
    grid-template-columns:360px minmax(0, 1fr);
    gap:32px;
    width:100%;
    align-items:flex-start;
}

.admin-prompts-panel{
    gap:20px;
    align-items:stretch;
}

.admin-prompts-toolbar{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.admin-library-controls{
    display:flex;
    gap:16px;
    align-items:flex-end;
    justify-content:space-between;
    flex-wrap:wrap;
}

.admin-library-tabs{
    display:inline-flex;
    gap:8px;
    padding:8px;
    border:3px solid #000;
    border-radius:999px;
    background:#fff;
    box-shadow:var(--shadow-soft);
}

.admin-library-tab{
    border:2px solid transparent;
    border-radius:999px;
    background:transparent;
    padding:10px 16px;
    font-weight:700;
    cursor:pointer;
    font-size:14px;
}

.admin-library-tab.is-active{
    background:linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    color:#fff;
    border-color:#000;
    box-shadow:0 4px 8px 0 #0002;
}

.admin-library-search{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:min(320px, 100%);
    flex:1 1 280px;
}

.admin-prompts-textarea{
    min-height:180px;
    resize:vertical;
    line-height:1.5;
}

.admin-prompts-list{
    max-height:42vh;
    padding-right:6px;
}

.admin-prompts-library-stack{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.admin-prompts-library-block{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
}

.admin-prompts-subtitle{
    font-size:12px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:#555;
    font-weight:700;
}

.admin-prompts-group{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.admin-prompts-group-title{
    font-size:18px;
    font-weight:700;
}

.admin-chain-list{
    max-height:26vh;
    padding-right:6px;
}

.admin-prompts-list-item{
    text-align:left;
}

.admin-prompts-list-item:hover{
    transform:translateY(-2px);
}

.admin-prompts-row{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
}

.admin-prompts-key{
    font-size:13px;
    color:#666;
    word-break:break-all;
}

.admin-prompts-meta{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.admin-prompts-meta-card,
.admin-prompts-section{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:18px 20px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:10px;
}

.admin-prompts-section h3{
    font-size:24px;
    font-weight:700;
}

.admin-prompts-section label{
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:14px;
    font-weight:700;
}

.admin-prompts-param-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.admin-prompts-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.admin-chain-node{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:18px 20px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:14px;
}

.admin-chain-node.is-disabled{
    opacity:0.72;
    background:linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(240,240,240,0.92) 100%);
}

.admin-chain-node.is-processor{
    background:linear-gradient(180deg, rgba(248,220,102,0.22) 0%, rgba(237,178,18,0.08) 100%);
}

.admin-chain-node.is-loop{
    background:linear-gradient(180deg, rgba(59,87,237,0.1) 0%, rgba(13,13,204,0.04) 100%);
}

.admin-chain-node-toolbar,
.admin-chain-row{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
}

.admin-chain-node-fields,
.admin-chain-binding-list,
.admin-chain-loop-children{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.admin-chain-node-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.admin-chain-node-grid label,
.admin-chain-binding-row label{
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:14px;
    font-weight:700;
}

.admin-chain-binding-row{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(140px, 180px) minmax(0, 1fr) auto;
    gap:10px;
    align-items:flex-end;
}

.admin-chain-mini-button{
    border:2px solid #000;
    border-radius:16px;
    background:#fff;
    padding:10px 14px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 4px 8px 0 #0002;
}

.admin-chain-mini-button.is-danger{
    background:linear-gradient(180deg, rgba(227,63,42,0.16) 0%, rgba(181,6,0,0.06) 100%);
}

.admin-chain-loop-shell{
    border-left:4px solid #3B57ED;
    padding-left:16px;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.admin-chain-inline-link{
    background:none;
    border:none;
    padding:0;
    color:#0D0DCC;
    font-weight:700;
    cursor:pointer;
    text-align:left;
    text-decoration:underline;
}

.admin-prompts-textarea.is-small{
    min-height:96px;
}

.admin-prompts-empty{
    border:3px dashed #000;
    border-radius:24px;
    padding:40px 28px;
    text-align:center;
    background:rgba(255,255,255,0.88);
}

.admin-prompts-empty__title,
.admin-prompts-note__title{
    margin:0 0 10px;
    font-size:24px;
    line-height:1.08;
}

.admin-prompts-empty__copy,
.admin-prompts-note__copy{
    margin:0;
}

.admin-prompts-meta-label,
.admin-prompts-section-copy,
.admin-chain-step-kicker{
    display:block;
    margin:0;
    font-size:12px;
    font-weight:700;
    letter-spacing:0.06em;
    line-height:1.35;
    text-transform:uppercase;
    color:var(--color-text-secondary);
}

.admin-prompts-section-copy{
    text-transform:none;
    letter-spacing:0;
    font-size:14px;
    font-weight:600;
}

.admin-chain-step-kicker{
    margin-bottom:6px;
}

.admin-prompts-note{
    border:3px dashed #000;
    border-radius:24px;
    padding:20px 24px;
    background:linear-gradient(180deg, rgba(59, 87, 237, 0.12) 0%, rgba(13, 13, 204, 0.04) 100%);
    text-align:center;
}

.admin-prompts-note__title{
    font-size:20px;
    margin-bottom:8px;
}

.admin-prompts-filter-label{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.admin-prompts-filter-label .sub-header{
    margin-bottom:0;
}

.admin-prompts-chain-list{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.admin-prompts-chain-card{
    border:3px solid #000;
    border-radius:20px;
    padding:18px 20px;
    background:linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248, 249, 255, 0.96) 100%);
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:14px;
}

.admin-prompts-chain-header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    align-items:flex-start;
}

.admin-prompts-chain-header strong{
    font-size:18px;
}

.admin-prompts-chain-subtitle{
    font-size:13px;
    color:#555;
    line-height:1.5;
}

.admin-prompts-chain-entrypoints{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.admin-prompts-chain-flow{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.admin-prompts-chain-step{
    border:2px solid #000;
    border-radius:18px;
    padding:12px 14px;
    background:#fff;
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    gap:12px;
    align-items:flex-start;
}

.admin-prompts-chain-step.is-selected{
    border-color:#3B57ED;
    box-shadow:0 8px 18px rgba(59, 87, 237, 0.18);
    background:linear-gradient(180deg, rgba(59, 87, 237, 0.08) 0%, rgba(13, 13, 204, 0.04) 100%);
}

.admin-prompts-chain-step-marker{
    min-width:34px;
    height:34px;
    padding:0 10px;
    border:2px solid #000;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    background:#fff;
}

.admin-prompts-chain-step-meta{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
}

.admin-prompts-chain-step-title{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
}

.admin-prompts-chain-step-key{
    font-size:12px;
    color:#666;
    word-break:break-all;
}

.admin-prompts-chain-step-note{
    font-size:13px;
    color:#444;
    line-height:1.5;
}

.admin-chain-summary-card{
    border:3px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,249,255,0.96) 100%);
    padding:22px 24px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:16px;
}

.admin-chain-summary-top{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    flex-wrap:wrap;
}

.admin-chain-summary-copy{
    display:flex;
    flex-direction:column;
    gap:8px;
    max-width:720px;
}

.admin-chain-summary-copy h3{
    font-size:32px;
    font-weight:700;
    margin:0;
}

.admin-chain-summary-copy p{
    margin:0;
    color:#555;
    line-height:1.5;
}

.admin-chain-action-bar{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    align-items:center;
}

.admin-chain-workspace{
    display:grid;
    grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
    gap:20px;
    align-items:flex-start;
}

.admin-chain-outline,
.admin-chain-inspector{
    border:3px solid #000;
    border-radius:24px;
    background:#fff;
    padding:20px 22px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:16px;
}

.admin-chain-outline-list,
.admin-chain-outline-children{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.admin-chain-outline-children{
    margin-left:18px;
    padding-left:14px;
    border-left:3px solid rgba(13, 13, 204, 0.16);
}

.admin-chain-step-card{
    width:100%;
    border:2px solid #000;
    border-radius:18px;
    background:#fff;
    padding:14px 16px;
    box-shadow:0 4px 8px 0 #0002;
    display:flex;
    flex-direction:column;
    gap:10px;
    cursor:pointer;
    text-align:left;
}

.admin-chain-step-card.is-selected{
    border-color:#3B57ED;
    box-shadow:0 8px 18px rgba(59, 87, 237, 0.18);
    background:linear-gradient(180deg, rgba(59, 87, 237, 0.08) 0%, rgba(13, 13, 204, 0.04) 100%);
}

.admin-chain-step-card.is-disabled{
    opacity:0.72;
}

.admin-chain-step-card.is-processor{
    background:linear-gradient(180deg, rgba(248,220,102,0.16) 0%, rgba(237,178,18,0.06) 100%);
}

.admin-chain-step-card.is-loop{
    background:linear-gradient(180deg, rgba(59,87,237,0.08) 0%, rgba(13,13,204,0.03) 100%);
}

.admin-chain-step-main{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
}

.admin-chain-step-subtitle{
    font-size:13px;
    color:#666;
    line-height:1.5;
    word-break:break-word;
}

.admin-chain-step-meta-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.admin-chain-inspector-header{
    display:flex;
    gap:16px;
    justify-content:space-between;
    align-items:flex-start;
    flex-wrap:wrap;
}

.admin-chain-inspector-header h3{
    font-size:28px;
    font-weight:700;
    margin:0;
}

.admin-chain-help-copy{
    color:#555;
    line-height:1.5;
    margin:0;
}

.admin-chain-advanced{
    border:2px solid #000;
    border-radius:18px;
    background:#fff;
    padding:0 16px 16px;
    box-shadow:0 4px 8px 0 #0002;
}

.admin-chain-advanced summary{
    cursor:pointer;
    font-weight:700;
    padding:14px 0;
}

@media(max-width:1280px){
    .dashboard-layout {
        grid-template-columns: minmax(260px, 0.9fr) minmax(280px, 0.8fr);
    }
    .dashboard-center-column {
        order: 3;
        grid-column: 1 / -1;
    }
    .dashboard-persona-stage {
        margin-top: 0;
    }
}

@media(max-width:1120px){
    .dashboard-top-navigation,
    .app-shell-navigation {
        flex-wrap: wrap;
    }
    .dashboard-nav-links {
        order: 3;
        flex-basis: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    .dashboard-logout-btn {
        margin-left: auto;
    }
}

@media(max-width:900px){
    .persona-card{ width:100%; }
    .persona-grid-dashboard{ flex-direction:column; align-items:center; }
    .dashboard-identity-controls {
        flex-wrap: wrap;
    }
    .dashboard-nav-links {
        order: 2;
    }
    .dashboard-logout-btn {
        order: 3;
        margin-left: 0;
    }
    .dashboard-layout {
        grid-template-columns: 1fr;
        gap: var(--space-32);
    }
    .dashboard-center-column {
        order: 0;
        grid-column: auto;
    }
    .dashboard-header-bar,
    .dashboard-header-bar--split {
        min-height: auto;
        flex-direction: column;
        align-items: stretch;
        padding: var(--space-16);
    }
    .dashboard-new-campaign-btn {
        width: 100%;
    }
    .dashboard-persona-stage {
        width: min(100%, 360px);
        height: 220px;
        min-height: 220px;
    }
    .dashboard-persona-portrait,
    .dashboard-persona-portrait .persona-img-md {
        width: 132px;
        height: 132px;
    }
    .campaign-card {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 20px;
    }
    .campaign-card__avatar {
        justify-content: flex-start;
    }
    .campaign-card__side {
        flex-direction: row;
        grid-column: auto;
        width: 100%;
        justify-self: stretch;
        justify-content: space-between;
        align-items: center;
    }
    .settings-container,
    .workspace-controls {
        width:100%;
        justify-content:flex-start;
    }
    .top-navigation-container {
        flex-direction:column;
        align-items:flex-start;
        gap:20px;
    }
    .dashboard-top-navigation,
    .app-shell-navigation {
        display:grid;
        grid-template-columns:minmax(0, 1fr) auto;
        align-items:center;
        gap:12px;
        padding:18px 0 24px;
    }
    .dashboard-top-navigation .logo-and-text-container,
    .app-shell-navigation .logo-and-text-container {
        min-width:0;
        gap:10px;
    }
    .dashboard-top-navigation .logo-img,
    .app-shell-navigation .logo-img {
        height:40px;
    }
    .dashboard-top-navigation .nav-text,
    .app-shell-navigation .nav-text {
        font-size:clamp(19px, 5.8vw, 24px);
        line-height:1.05;
        white-space:normal;
        overflow-wrap:anywhere;
    }
    .app-shell-menu-toggle {
        display:inline-flex;
        justify-self:end;
        grid-column:2;
        grid-row:1;
    }
    .app-shell-navigation.is-mobile-menu-open .app-shell-menu-toggle span:nth-child(1) {
        transform:translateY(7px) rotate(45deg);
    }
    .app-shell-navigation.is-mobile-menu-open .app-shell-menu-toggle span:nth-child(2) {
        opacity:0;
    }
    .app-shell-navigation.is-mobile-menu-open .app-shell-menu-toggle span:nth-child(3) {
        transform:translateY(-7px) rotate(-45deg);
    }
    .app-shell-navigation .settings-container,
    .app-shell-navigation .dashboard-nav-links,
    .app-shell-navigation .dashboard-logout-btn {
        display:none;
    }
    .app-shell-navigation.is-mobile-menu-open .settings-container,
    .app-shell-navigation.is-mobile-menu-open .dashboard-nav-links,
    .app-shell-navigation.is-mobile-menu-open .dashboard-logout-btn {
        grid-column:1 / -1;
        width:min(100%, 360px);
        justify-self:center;
    }
    .app-shell-navigation.is-mobile-menu-open .settings-container {
        display:flex;
        justify-content:center;
        margin-top:8px;
    }
    .app-shell-navigation.is-mobile-menu-open .dashboard-nav-links {
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        flex-basis:auto;
        gap:8px;
        padding:12px 0 4px;
        order:initial;
    }
    .app-shell-navigation.is-mobile-menu-open .dashboard-nav-link {
        justify-content:center;
        width:100%;
        min-height:42px;
        font-size:15px;
    }
    .app-shell-navigation.is-mobile-menu-open .dashboard-logout-btn {
        display:inline-flex;
        justify-content:center;
        margin:0;
    }
    .app-shell-navigation .dashboard-client-control {
        width:100%;
        max-width:none;
    }
    .workspace-select-wrap,
    .workspace-pill,
    .workspace-nav-btn {
        width:100%;
    }
    .workspace-client-select {
        min-width:0;
        width:100%;
    }
    .launch-momentum-strip {
        margin:0 0 20px;
    }
    .launch-momentum-strip__content {
        grid-template-columns:1fr;
        align-items:stretch;
        gap:12px;
        padding:14px;
    }
    .launch-momentum-strip__reward {
        justify-content:space-between;
        white-space:normal;
    }
    .launch-momentum-strip__reward span {
        flex:1;
        justify-content:center;
        text-align:center;
    }
    .personas-header-bar {
        grid-template-columns:1fr;
        justify-items:stretch;
        text-align:center;
    }
    .personas-header-title {
        order:-1;
    }
    .products-header-bar {
        grid-template-columns:1fr;
        justify-items:stretch;
        text-align:center;
    }
    .products-header-title {
        text-align:center;
    }
    .products-header-action {
        justify-self:stretch;
        min-width:0;
    }
    .library-form-grid {
        grid-template-columns:1fr;
    }
    .persona-form-grid {
        grid-template-columns:1fr;
    }
    .asset-preview-field {
        grid-template-columns:1fr;
    }
    .page-split-layout,
    .settings-grid,
    .usage-admin-grid,
    .admin-prompts-grid,
    .admin-chain-workspace,
    .usage-admin-form-grid,
    .settings-summary-grid,
    .usage-admin-summary-grid{
        grid-template-columns:1fr;
    }

    .settings-page .settings-overview-grid,
    .settings-page .settings-summary-grid--account,
    .settings-page .settings-summary-grid--plans,
    .settings-page .settings-summary-grid--usage,
    .settings-legal-form,
    .legal-resource-list,
    .settings-value-grid,
    .settings-modal-value-grid,
    .settings-value-story__row{
        grid-template-columns:1fr;
    }

    .settings-page .settings-action-row .btn,
    .settings-page .settings-action-row .btn.secondary,
    .settings-page .settings-form > .btn{
        width:100%;
    }

    .admin-prompts-meta,
    .admin-prompts-param-grid,
    .admin-prompts-toolbar{
        grid-template-columns:1fr;
    }
}

@media (max-width: 620px) {
    .settings-page .settings-detail-row{
        grid-template-columns:1fr;
        gap:4px;
    }

    .settings-page .settings-panel,
    .settings-page .settings-table-card{
        padding:18px;
        border-radius:22px;
    }

    .settings-page .settings-table{
        min-width:620px;
    }

    .settings-plan-modal{
        padding:16px;
        align-items:flex-start;
    }

    .settings-plan-modal__shell{
        padding:22px;
        gap:var(--space-20);
    }

    .settings-plan-modal__header{
        flex-direction:column;
    }
}

/* -------------------------------------------------- */
/* CAMPAIGN EDITOR – refinements                      */
/* -------------------------------------------------- */

.campaign-editor h1,.campaign-editor h2,.campaign-editor h3{ letter-spacing:0.2px; }
.campaign-editor .card-style{ border-radius:32px; }
.campaign-editor-back-link{
    font-size:14px;
    display:inline-block;
    align-self:flex-start;
    margin-bottom:24px;
    margin-top:-12px;
}
.campaign-editor-ai-status{
    display:none;
    width:100%;
    margin:0 0 18px;
    padding:14px 18px;
    border:3px solid #000;
    border-radius:18px;
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.45) 0%, rgba(237, 178, 18, 0.18) 100%);
    box-shadow:0 4px 8px 0 #0003;
    font-weight:700;
    line-height:1.4;
}
.campaign-editor-ai-status.active{ display:block; }
.campaign-editor-layout{
    width:100%;
    display:grid;
    grid-template-columns:minmax(320px, 0.9fr) minmax(0, 1.45fr);
    gap:32px;
    align-items:start;
}
.campaign-editor-layout--setup{
    grid-template-columns:minmax(0, 1fr);
}
.campaign-editor-layout--setup .campaign-editor-sidebar{
    width:100%;
}
.campaign-editor-page-header{
    margin-bottom: var(--space-32);
}
.campaign-editor-page-header .page-title{
    max-width: 14ch;
}
.campaign-editor-page-actions{
    align-self:center;
}
.campaign-editor-manage-content-btn{
    min-width:260px;
    min-height:64px;
    padding-inline:28px;
    border-radius:18px;
    font-size:20px;
}
.campaign-editor-sidebar,
.campaign-editor-workbench{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:20px;
}
.campaign-editor-section-title{
    margin-bottom:0;
    padding:14px 18px;
    font-size:22px;
    text-align:center;
}
.campaign-editor-details-card,
.campaign-editor-workbench-card{
    position:relative;
    z-index:1;
    padding:28px;
    gap:22px;
    background-color:#FFF;
    background-image:none;
}
.campaign-editor-card-intro{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.campaign-editor-card-eyebrow{
    align-self:flex-start;
    padding:7px 13px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}
.campaign-editor-card-copy{
    margin:0;
    font-size:14px;
    line-height:1.6;
    color:#2B2B2B;
}
.campaign-editor #campaign-details-form{ gap:20px; }
.campaign-editor #campaign-details-form > div,
.campaign-editor #campaign-details-form > section{ width:100%; }
.campaign-editor #campaign-details-form .form-label{ font-size:12px; margin-bottom:8px; text-transform:uppercase; letter-spacing:0.08em; }
.campaign-editor #campaign-details-form .form-input,
.campaign-editor #campaign-details-form .form-select{
    width:100%;
    min-width:0;
    font-size:18px;
    padding:12px 14px;
}
.campaign-editor #campaign-details-form .form-input{
    text-align:left;
    border-width:3px;
}
.campaign-editor #campaign-details-form textarea.form-input{
    min-height:120px;
}
.campaign-editor-two-col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.campaign-editor-field-group{
    width:100%;
}
.campaign-editor-management-card{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(227, 63, 42, 0.05) 100%);
}
.campaign-editor-management-card__header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
}
.campaign-editor-management-card__title{
    margin:0;
    font-size:22px;
    line-height:1.1;
}
.campaign-editor-management-card__copy{
    margin:8px 0 0 0;
    font-size:13px;
    line-height:1.5;
    color:#2B2B2B;
}
.campaign-editor-chip-list{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.campaign-editor-chip{
    display:inline-flex;
    align-items:center;
    padding:8px 12px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF;
    font-size:13px;
    font-weight:700;
    line-height:1.2;
}
.campaign-editor-empty-copy{
    margin:0;
    font-size:13px;
    color:#555;
}
.campaign-editor-inline-editor{
    display:none;
    margin-top:4px;
    padding:16px;
    border:2px dashed #000;
    border-radius:18px;
    background:#FFF;
}
.campaign-editor-checkbox-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:10px;
}
.campaign-editor-checkbox-grid--personas{
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}
.campaign-editor-checkbox{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border:2px solid #000;
    border-radius:16px;
    background:#FFF;
    font-size:13px;
    font-weight:700;
}
.campaign-editor-checkbox input{
    width:16px;
    height:16px;
    accent-color:#B50600;
}
.campaign-editor-checkbox__avatar{
    width:32px;
    height:32px;
    border-radius:50%;
    object-fit:cover;
}
.campaign-editor-inline-editor__actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:14px;
}
.campaign-editor-inline-editor__actions.action-group{
    margin-top:14px;
}
.campaign-editor-sales-card{
    gap:18px;
}
.campaign-editor-sales-summary{
    margin:0;
}
.campaign-editor-sales-route-summary{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:12px;
}
.campaign-editor-sales-route-summary__item{
    display:flex;
    min-width:0;
    flex-direction:column;
    gap:7px;
    padding:14px 16px;
    border:2px solid #000;
    border-radius:20px;
    background:#FFF;
}
.campaign-editor-sales-route-summary__item span{
    font-size:10px;
    font-weight:700;
    letter-spacing:0.08em;
    line-height:1.1;
    text-transform:uppercase;
}
.campaign-editor-sales-route-summary__item strong{
    font-size:18px;
    line-height:1.15;
}
.campaign-editor-sales-route-summary__item p{
    margin:0;
    color:#2B2B2B;
    font-size:12px;
    line-height:1.45;
}
.campaign-editor-sales-editor{
    display:none;
    flex-direction:column;
    gap:16px;
    padding:18px;
    border:2px dashed #000;
    border-radius:24px;
    background:#FFF;
}
.campaign-editor-sales-card.is-editing .campaign-editor-sales-editor{
    display:flex;
}
.campaign-editor-sales-editor__intro{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.campaign-editor-sales-setup-hero{
    display:none;
    grid-template-columns:minmax(0, 1fr) minmax(220px, 0.72fr);
    gap:18px;
    align-items:stretch;
    padding:22px;
    border:3px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.32) 0%, rgba(227, 63, 42, 0.08) 100%);
    box-shadow:0 6px 0 #000;
}
.campaign-editor-sales-setup-hero__copy{
    display:flex;
    min-width:0;
    flex-direction:column;
    gap:10px;
}
.campaign-editor-sales-setup-hero__copy h4{
    margin:0;
    font-size:30px;
    line-height:1.05;
}
.campaign-editor-sales-setup-hero__copy p{
    max-width:58ch;
    margin:0;
    color:#2B2B2B;
    font-size:16px;
    line-height:1.55;
}
.campaign-editor-sales-setup-hero__steps{
    display:flex;
    flex-direction:column;
    gap:10px;
    justify-content:center;
}
.campaign-editor-sales-setup-hero__steps span{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border:2px solid #000;
    border-radius:16px;
    background:#FFF;
    font-size:13px;
    font-weight:700;
    line-height:1.25;
}
.campaign-editor-sales-setup-hero__steps strong{
    display:inline-flex;
    flex:0 0 28px;
    width:28px;
    height:28px;
    align-items:center;
    justify-content:center;
    border:2px solid #000;
    border-radius:999px;
    background:#F8DC66;
    line-height:1;
}
.campaign-editor-page--sales-setup .campaign-editor-page-actions,
.campaign-editor-page--sales-setup .campaign-editor-card-intro,
.campaign-editor-page--sales-setup .campaign-editor-field-group,
.campaign-editor-page--sales-setup .campaign-editor-two-col,
.campaign-editor-page--sales-setup .campaign-editor-management-card:not(.campaign-editor-sales-card),
.campaign-editor-page--sales-setup .campaign-editor-sales-route-summary,
.campaign-editor-page--sales-setup .campaign-editor-sales-summary,
.campaign-editor-page--sales-setup .campaign-editor-sales-settings--advanced,
.campaign-editor-page--sales-setup .campaign-editor-sales-field--advanced,
.campaign-editor-page--sales-setup .campaign-editor-sales-rules-panel--advanced,
.campaign-editor-page--sales-setup #edit-sales-handoff-btn{
    display:none;
}
.campaign-editor-page--sales-setup .campaign-editor-details-card{
    max-width:1040px;
    margin-inline:auto;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-card{
    gap:22px;
    padding:26px;
    border-width:4px;
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(227, 63, 42, 0.07) 100%);
}
.campaign-editor-page--sales-setup .campaign-editor-sales-card .campaign-editor-management-card__header{
    padding-bottom:4px;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-card .campaign-editor-management-card__title{
    font-size:30px;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-card .campaign-editor-management-card__copy{
    max-width:62ch;
    font-size:16px;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-editor{
    display:flex;
    padding:0;
    border:0;
    background:transparent;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-editor__intro{
    display:none;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-setup-hero{
    display:grid;
}
.campaign-editor-sales-setup-hero--visible{
    display:grid;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-destination-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}
.campaign-editor-page--sales-setup .campaign-editor-sales-destination{
    border-width:3px;
    box-shadow:0 5px 0 #000;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-fields{
    grid-template-columns:1fr;
}
.campaign-editor-page--sales-setup .campaign-editor-sales-field-span{
    grid-column:auto;
}
.campaign-editor-advanced-panel{
    width:100%;
    border:2px solid #000;
    border-radius:24px;
    background:#FFF;
    overflow:hidden;
}
.campaign-editor-advanced-panel__summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:16px 18px;
    cursor:pointer;
    list-style:none;
}
.campaign-editor-advanced-panel__summary::-webkit-details-marker{
    display:none;
}
.campaign-editor-advanced-panel__summary::after{
    content:"+";
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF;
    font-size:20px;
    font-weight:700;
    line-height:1;
}
.campaign-editor-advanced-panel[open] .campaign-editor-advanced-panel__summary::after{
    content:"-";
}
.campaign-editor-advanced-panel__title{
    font-size:18px;
    font-weight:700;
    line-height:1.2;
}
.campaign-editor-advanced-panel__copy{
    flex:1 1 auto;
    color:#2B2B2B;
    font-size:13px;
    line-height:1.45;
}
.campaign-editor-advanced-panel__body{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:0 18px 18px;
}
.campaign-editor-sales-settings{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}
.campaign-editor-sales-destination-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
}
.campaign-editor-sales-destination{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:2px solid #000;
    border-radius:24px;
    background:#FFF;
}
.campaign-editor-sales-fields{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}
.campaign-editor-sales-field-span{
    grid-column:1 / -1;
}
.campaign-editor-sales-rules-panel{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:2px dashed #000;
    border-radius:24px;
    background:rgba(255, 255, 255, 0.85);
}
.campaign-editor-sales-rules-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.campaign-editor-sales-rule{
    display:grid;
    grid-template-columns:1.2fr 1fr 1.4fr auto;
    gap:12px;
    align-items:end;
    padding:16px;
    border:2px solid rgba(0, 0, 0, 0.12);
    border-radius:20px;
    background:#FFF;
}
.campaign-editor-sales-rule__action{
    display:flex;
    align-items:flex-end;
}
.campaign-editor-save-row{
    display:flex;
    justify-content:center;
    padding-top:8px;
}
.campaign-editor-save-row .btn{
    min-width:220px;
}
.campaign-editor-workbench-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
}
.campaign-editor-workbench-header__copy{
    display:flex;
    flex-direction:column;
    gap:10px;
    max-width:60ch;
}
.campaign-editor-workbench-title{
    margin:0;
    font-size:36px;
    line-height:1.02;
}
.campaign-editor-workbench-text{
    margin:0;
    font-size:15px;
    line-height:1.6;
    color:#2B2B2B;
}
.campaign-editor-ai-btn{
    background:linear-gradient(180deg, #53CE26 0%, #008805 100%);
    color:#FFF;
    min-width:200px;
    align-self:flex-start;
}
.campaign-lead-magnets-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
}
.campaign-lead-magnets-actions .btn{
    min-height:44px;
    white-space:nowrap;
}
.campaign-editor-portfolio-overview-card{
    align-self:start;
}
.campaign-editor-portfolio-next-step{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:24px;
    border:3px dashed #000;
    border-radius:24px;
    background:rgba(255,255,255,0.82);
}
.campaign-lead-magnets{
    width:100%;
    max-width:none;
    align-items:stretch;
    padding-inline:clamp(24px, 4vw, 72px);
}
.campaign-lead-magnets .campaign-editor-page-header .page-title-block,
.campaign-lead-magnets .campaign-editor-page-header .page-intro,
.campaign-lead-magnets .campaign-editor-page-header .page-title{
    width:100%;
    max-width:none;
}
.campaign-lead-magnets .top-navigation-container,
.campaign-lead-magnets .campaign-editor-page-header,
.campaign-lead-magnets .campaign-editor-workbench-card{
    width:100%;
}
.campaign-lead-magnets-workbench{
    width:100%;
}
.campaign-editor-summary-strip{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}
.campaign-editor-summary-stat{
    min-width:110px;
    padding:12px 14px;
    border:3px solid #000;
    border-radius:18px;
    background:#FFF;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.campaign-editor-summary-stat__label{
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}
.campaign-editor-summary-stat strong{
    font-size:28px;
    line-height:1;
}
.campaign-editor-filter-bar{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    padding:16px;
    border:3px solid #000;
    border-radius:24px;
    background:#FFF;
}
.campaign-editor-filter-group{
    display:flex;
    align-items:stretch;
    gap:8px;
    flex-wrap:wrap;
}
.campaign-editor-filter-group .btn-small{
    min-height:44px;
}
.campaign-editor-filter-group .btn-small span{
    margin-left:6px;
}
.campaign-editor-filter-select{
    display:block;
    min-width:220px;
    position:relative;
}
.campaign-editor-filter-select::after{
    content:"";
    position:absolute;
    right:18px;
    top:50%;
    width:0;
    height:0;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:6px solid #000;
    pointer-events:none;
    transform:translateY(-35%);
}
.campaign-editor-filter-select .form-select{
    width:100%;
    min-height:44px;
    padding:10px 46px 10px 14px;
    border-width:3px;
    font-size:16px;
    appearance:none;
}
.campaign-editor-loading{
    display:none;
    padding:28px;
    border:3px dashed #000;
    border-radius:24px;
    background:rgba(255,255,255,0.85);
}
.campaign-editor-loading.active{
    display:block;
}
.campaign-editor-loading__title{
    margin:0 0 8px 0;
    font-size:20px;
    font-weight:700;
}
.campaign-editor-loading__copy{
    margin:0;
    font-size:14px;
    line-height:1.5;
}
.campaign-editor-magnet-list.is-hidden{
    display:none;
}
.campaign-editor-empty-state{
    padding:28px;
    border:3px dashed #000;
    border-radius:24px;
    background:rgba(255,255,255,0.82);
    display:flex;
    flex-direction:column;
    gap:12px;
    align-items:flex-start;
}
.campaign-editor-empty-state__title{
    margin:0;
    font-size:28px;
    line-height:1.05;
}
.campaign-editor-empty-state__copy{
    margin:0;
    font-size:14px;
    line-height:1.55;
    color:#2B2B2B;
    max-width:56ch;
}
.campaign-editor-magnet-list{
    display:flex;
    flex-direction:column;
    gap:16px;
}
.campaign-editor-portfolio-block{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:20px;
    border:3px solid #000;
    border-radius:24px;
    background:rgba(255,255,255,0.88);
}
.campaign-editor-portfolio-block--library{
    background:#FFF;
}
.campaign-editor-magnet-list-grid,
.campaign-editor-selected-grid,
.campaign-editor-built-grid,
.campaign-editor-strategy-grid,
.campaign-editor-role-strip{
    display:grid;
    gap:16px;
}
.campaign-editor-magnet-list-grid{
    grid-template-columns:1fr;
}
.campaign-editor-strategy-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}
.campaign-editor-role-strip,
.campaign-editor-selected-grid,
.campaign-editor-built-grid{
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}
.campaign-editor-strategy-card,
.campaign-editor-role-card,
.campaign-editor-selected-card,
.campaign-editor-built-card{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:16px;
    border:3px solid #000;
    border-radius:20px;
    background:#FFF;
}
.campaign-editor-strategy-card strong,
.campaign-editor-selected-card h4,
.campaign-editor-built-card h4{
    font-size:18px;
    line-height:1.15;
}
.campaign-editor-strategy-card__label,
.campaign-editor-role-card__title{
    font-size:11px;
    font-weight:700;
    line-height:1.1;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#5E2400;
}
.campaign-editor-role-card p,
.campaign-editor-selected-card p,
.campaign-editor-built-card p,
.campaign-editor-strategy-card p{
    margin:0;
    font-size:13px;
    line-height:1.5;
    color:#2B2B2B;
}
.campaign-editor-selected-card__topline{
    display:flex;
    justify-content:space-between;
    gap:8px;
    flex-wrap:wrap;
}
.campaign-editor-role-card__meta,
.campaign-editor-selected-card__meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    font-size:12px;
    font-weight:700;
}
.campaign-editor-batch-meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
.campaign-editor-portfolio-status{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:18px 20px;
    border:3px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.72) 0%, rgba(255,255,255,0.96) 100%);
}
.campaign-editor-portfolio-status.is-active{
    background:linear-gradient(180deg, rgba(83, 206, 38, 0.26) 0%, rgba(255,255,255,0.96) 100%);
}
.campaign-editor-portfolio-status__count{
    font-size:28px;
    line-height:1;
}
.campaign-editor-portfolio-status__detail{
    margin:6px 0 0 0;
    font-size:13px;
    line-height:1.5;
}
.campaign-editor-magnet-card{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:20px;
    border:3px solid #000;
    border-radius:24px;
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(227, 63, 42, 0.05) 100%);
}
.campaign-lead-magnets .campaign-editor-magnet-card{
    background:#FFF;
}
.campaign-editor-magnet-card__body{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(280px, 38%);
    gap:20px;
    align-items:stretch;
}
.campaign-editor-magnet-card__main{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:12px;
}
.campaign-editor-magnet-card__topline{
    display:flex;
    align-items:center;
    gap:10px;
}
.campaign-editor-status-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
    justify-content:flex-start;
}
.campaign-editor-type-pill,
.campaign-editor-status-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 10px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF;
    font-size:11px;
    font-weight:700;
    line-height:1.1;
    white-space:nowrap;
}
.campaign-editor-type-pill{
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.95) 0%, rgba(237, 178, 18, 0.9) 100%);
}
.campaign-editor-status-pill.is-confirmed,
.campaign-editor .btn-small.success{
    background:linear-gradient(180deg, #53CE26 0%, #008805 100%);
    color:#FFF;
}
.campaign-editor-status-pill.is-built{
    background:#FFF;
}
.campaign-editor-status-pill.is-selected{
    background:linear-gradient(180deg, rgba(17, 24, 39, 0.92) 0%, rgba(55, 65, 81, 0.96) 100%);
    color:#FFF;
}
.campaign-editor-status-pill.is-draft{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}
.campaign-editor-status-pill.is-missing{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#FFF;
}
.campaign-editor-status-pill.is-pages{
    background:#FFF;
}
.campaign-editor-magnet-card__title{
    margin:0;
    font-size:26px;
    line-height:1.08;
}
.campaign-editor-magnet-card__headline{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
}
.campaign-editor-weighted-score{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 12px;
    border:3px solid #000;
    border-radius:999px;
    background:linear-gradient(180deg, rgba(248, 220, 102, 0.95) 0%, rgba(237, 178, 18, 0.9) 100%);
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}
.campaign-editor-status-row .campaign-editor-weighted-score{
    padding:6px 10px;
    border-width:2px;
    font-size:11px;
    line-height:1.1;
}
.campaign-editor-magnet-card__description{
    margin:0;
    font-size:14px;
    line-height:1.55;
    color:#2B2B2B;
    max-width:64ch;
}
.campaign-editor-magnet-preview{
    min-width:0;
    min-height:260px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    border:2px solid #000;
    border-radius:20px;
    background:#FFF;
}
.campaign-editor-magnet-preview__header{
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 14px;
    border-bottom:2px solid #000;
    background:linear-gradient(180deg, rgba(227, 63, 42, 0.08) 0%, rgba(255,255,255,0.96) 100%);
}
.campaign-editor-magnet-preview__header span{
    font-size:11px;
    font-weight:700;
    line-height:1.1;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#5E2400;
}
.campaign-editor-magnet-preview__iframe{
    width:100%;
    min-height:216px;
    flex:1 1 auto;
    border:0;
    background:#FFF;
}
.campaign-editor-magnet-preview__empty{
    min-height:216px;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:8px;
    padding:24px;
    background:rgba(255,255,255,0.88);
    color:#2B2B2B;
}
.campaign-editor-magnet-preview__empty strong{
    font-size:20px;
    line-height:1.15;
}
.campaign-editor-magnet-preview__empty span{
    font-size:13px;
    line-height:1.5;
}
.campaign-editor-magnet-details{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
    gap:12px;
}
.campaign-editor-magnet-detail{
    min-width:0;
    padding:12px 14px;
    border:2px solid rgba(0,0,0,0.16);
    border-radius:16px;
    background:#FFF;
}
.campaign-editor-magnet-detail span{
    display:block;
    margin-bottom:6px;
    font-size:10px;
    font-weight:700;
    letter-spacing:0.08em;
    line-height:1.1;
    text-transform:uppercase;
    color:#5E2400;
}
.campaign-editor-magnet-detail p{
    margin:0;
    font-size:13px;
    line-height:1.45;
    color:#2B2B2B;
}
.campaign-editor-magnet-score-grid{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
.campaign-editor-score-chip{
    display:inline-flex;
    align-items:center;
    padding:6px 10px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF7D7;
    font-size:11px;
    font-weight:700;
    line-height:1.1;
}
.campaign-editor-magnet-insights{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.campaign-editor-magnet-insights p,
.campaign-editor-magnet-card__meta{
    margin:0;
    font-size:13px;
    line-height:1.5;
    color:#2B2B2B;
}
.campaign-editor-magnet-card__actions{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
    padding-top:4px;
}
.campaign-editor-magnet-empty-filter{
    padding:28px;
    border:3px dashed #000;
    border-radius:24px;
    background:#FFF;
    display:flex;
    flex-direction:column;
    gap:12px;
    align-items:flex-start;
}
.campaign-editor .btn-small{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border:2px solid #000;
    border-radius:12px;
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    cursor:pointer;
    background:#FFF;
    color:#000;
    box-shadow:0 2px 0 0 #00000010;
}
.campaign-editor .btn-small:disabled{
    cursor:progress;
    opacity:1;
}
.campaign-editor .btn-small.is-working{
    position:relative;
    padding-left:34px;
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
    color:#000;
}
.campaign-editor .btn-small.is-working::before{
    content:"";
    position:absolute;
    left:12px;
    width:12px;
    height:12px;
    border:2px solid rgba(0, 0, 0, 0.28);
    border-top-color:#000;
    border-radius:50%;
    animation:campaign-editor-spin .8s linear infinite;
}
.campaign-editor .btn-small.primary{
    background:#000;
    color:#FFF;
}
.campaign-editor .btn-small.neutral{
    background:#FFF;
    color:#000;
}
.campaign-editor .btn-small.danger{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#FFF;
}
.campaign-editor .btn-small.danger.is-confirming{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
    color:#000;
}
.campaign-editor .campaign-editor-filter-group .btn-small.neutral.is-active{
    background:#000;
    color:#FFF;
}

.campaign-editor-commit-bar{
    display:none;
    margin-top: var(--space-24);
}
.campaign-editor-commit-bar.is-visible{
    display:flex;
}

.lp-editor-attestation-modal{
    position:fixed;
    inset:0;
    z-index:10000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(0,0,0,0.72);
}

.lp-editor-attestation-modal[hidden]{
    display:none;
}

.lp-editor-attestation-modal__shell{
    width:min(760px, 100%);
    max-height:min(820px, 90vh);
    display:flex;
    flex-direction:column;
    gap:var(--space-20);
    padding:28px;
    overflow-y:auto;
}

.lp-editor-attestation-modal__header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-16);
}

.lp-editor-attestation-modal__header h2{
    margin:0;
    font-size:clamp(24px, 3vw, 34px);
    line-height:1.05;
}

.lp-editor-attestation-status,
.lp-editor-attestation-warnings{
    min-width:0;
    padding:16px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:rgba(255,255,255,0.94);
    color:var(--color-text-secondary);
    font-size:14px;
    font-weight:700;
    line-height:1.5;
}

.lp-editor-attestation-status.is-ready{
    border-color:rgba(0,136,5,0.38);
    background:rgba(83,206,38,0.12);
    color:#124615;
}

.lp-editor-attestation-status.is-blocked,
.lp-editor-attestation-warnings.has-warnings{
    border-color:rgba(181,6,0,0.36);
    background:rgba(227,63,42,0.10);
    color:#5b130f;
}

.lp-editor-attestation-warnings ul{
    margin:8px 0 0;
    padding-left:20px;
}

.lp-editor-attestation-warnings li + li{
    margin-top:6px;
}

.lp-editor-attestation-checks{
    display:grid;
    gap:12px;
}

.lp-editor-attestation-modal__actions{
    margin-top:0;
}

.lp-editor-attestation-modal-open{
    overflow:hidden;
}

@keyframes campaign-editor-spin{
    to{ transform:rotate(360deg); }
}
.edit-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.72);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:10000;
    padding:24px;
}
.edit-modal-content{
    width:min(560px, 100%);
    max-height:85vh;
    overflow-y:auto;
    padding:28px;
    border:4px solid #000;
    border-radius:28px;
    background:#FFF;
    box-shadow:0 12px 30px 0 #00000025;
}
.edit-modal-content h3{
    margin:0 0 20px 0;
    font-size:28px;
}
.campaign-editor-confirm-modal{
    display:flex;
    flex-direction:column;
    gap:14px;
}
.campaign-editor-confirm-modal h3,
.campaign-editor-custom-modal h3{
    margin-bottom:0;
}
.campaign-editor-custom-modal form{
    display:flex;
    flex-direction:column;
    gap:4px;
}
.edit-form-group{
    margin-bottom:18px;
}
.edit-form-group label{
    display:block;
    margin-bottom:8px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}
.edit-form-group input,
.edit-form-group select,
.edit-form-group textarea{
    width:100%;
    padding:12px 14px;
    border:3px solid #000;
    border-radius:16px;
    background:#FFF;
    font-size:16px;
    font-family:alga, serif;
}
.edit-form-group textarea{
    resize:vertical;
    min-height:100px;
}
.edit-modal-buttons{
    display:flex;
    gap:8px;
    justify-content:flex-end;
    flex-wrap:wrap;
    margin-top:24px;
}

@media (max-width: 1180px){
    .campaign-editor-layout{
        grid-template-columns:1fr;
    }

    .campaign-editor-workbench-header{
        flex-direction:column;
    }

    .campaign-editor-ai-btn{
        width:100%;
    }

    .campaign-lead-magnets-actions{
        width:100%;
        align-items:stretch;
        flex-direction:column;
    }

    .campaign-lead-magnets-actions .btn{
        width:100%;
    }
}

@media (max-width: 900px){
    .campaign-lead-magnets{
        padding-inline:18px;
    }

    .campaign-editor-details-card,
    .campaign-editor-workbench-card{
        padding:22px;
    }

    .campaign-editor-two-col{
        grid-template-columns:1fr;
    }

    .campaign-editor-sales-settings,
    .campaign-editor-sales-destination-grid,
    .campaign-editor-sales-fields,
    .campaign-editor-sales-rule{
        grid-template-columns:1fr;
    }

    .campaign-editor-sales-setup-hero{
        grid-template-columns:1fr;
        padding:18px;
    }

    .campaign-editor-sales-setup-hero__copy h4{
        font-size:25px;
    }

    .campaign-editor-page--sales-setup .campaign-editor-sales-card{
        padding:20px;
    }

    .campaign-editor-sales-rule__action{
        width:100%;
    }

    .lp-editor-attestation-modal{
        align-items:flex-start;
        padding:16px;
    }

    .lp-editor-attestation-modal__shell{
        padding:22px;
    }

    .lp-editor-attestation-modal__header{
        flex-direction:column;
    }

    .campaign-editor-sales-rule__action .btn-small{
        width:100%;
    }

    .campaign-editor-filter-bar{
        align-items:stretch;
    }

    .campaign-editor-filter-select{
        width:100%;
        min-width:0;
    }

    .campaign-editor-filter-group .btn-small{
        flex:0 1 auto;
    }

    .campaign-editor-strategy-grid{
        grid-template-columns:1fr;
    }

    .campaign-editor-management-card__header,
    .campaign-editor-page-actions,
    .campaign-editor-advanced-panel__summary,
    .campaign-editor-magnet-card__topline,
    .campaign-editor-magnet-card__headline,
    .campaign-editor-portfolio-status{
        flex-direction:column;
        align-items:flex-start;
    }

    .campaign-editor-magnet-card__body{
        display:flex;
        flex-direction:column;
        align-items:stretch;
    }

    .campaign-editor-page-actions{
        width:100%;
    }

    .campaign-editor-manage-content-btn{
        width:100%;
    }

    .campaign-editor-magnet-card__actions{
        min-width:0;
        width:100%;
        align-items:stretch;
        flex-direction:column;
    }

    .campaign-editor-status-row{
        justify-content:flex-start;
    }

    .campaign-editor-commit-bar{
        position:static;
        bottom:auto;
    }
}

@media (max-width: 620px){
    .campaign-editor-filter-group .btn-small{
        flex:1 1 120px;
    }
}

/* -------------------------------------------------- */
/* LEAD MAGNET EDITOR – refinements                   */
/* -------------------------------------------------- */

.lead-magnet-editor h1,.lead-magnet-editor h2,.lead-magnet-editor h3{ letter-spacing:0.2px; }
.lead-magnet-editor .card-style{ border-radius:24px; }
.lead-magnet-editor .section-header__copy,
.lead-magnet-editor .panel-toolbar__copy{
  max-width:none;
  width:100%;
}

.lead-magnet-editor .data-table{ width:100%; border-radius:16px; border:4px solid #000; }
.lead-magnet-editor .data-table th,
.lead-magnet-editor .data-table td{ padding:10px 14px; vertical-align:middle; }
.lead-magnet-editor .data-table thead th{ font-size:14px; text-transform:uppercase; letter-spacing:.5px; }
.lead-magnet-editor .data-table tbody td{ font-size:14px; }
.lead-magnet-editor .data-table td:nth-child(1){ width:42%; }
.lead-magnet-editor .data-table td:nth-child(2){ width:10%; }
.lead-magnet-editor .data-table td:nth-child(3){ width:12%; white-space:nowrap; }
.lead-magnet-editor .data-table td:nth-child(4){ width:36%; }
.lead-magnet-editor .data-table tbody tr:hover{ background:#fafafa; }

.lead-magnet-editor .btn-group{ display:flex; gap:8px; flex-wrap:wrap; }
.lead-magnet-editor .btn-small{ padding:8px 12px; border-radius:10px; font-size:12px; }
.lead-magnet-editor .btn-small.primary{ background:#000; color:#fff; }
.lead-magnet-editor .btn-small.neutral{ background:#EEE; color:#000; }
.lead-magnet-editor .btn-small.danger{ background:#dc3545; color:#fff; }

.lead-magnet-editor .workspace-family-title-row,
.lead-magnet-editor .workspace-chip-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.lead-magnet-editor .workspace-chip-row{
  row-gap:8px;
}

.lead-magnet-editor .workspace-chip-row .tag,
.lead-magnet-editor .workspace-family-title-row .tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  padding:6px 10px;
  border:2px solid #000;
  border-radius:999px;
  background:#fff;
  font-size:11px;
  font-weight:700;
  line-height:1;
  vertical-align:middle;
  white-space:nowrap;
}

.lead-magnet-editor .workspace-chip-row .tag-text,
.lead-magnet-editor .workspace-family-title-row .tag-text{
  background:linear-gradient(180deg, rgba(248, 220, 102, 0.92) 0%, rgba(237, 178, 18, 0.86) 100%);
}

.lead-magnet-editor .workspace-chip-row .tag-html,
.lead-magnet-editor .workspace-family-title-row .tag-html{
  background:linear-gradient(180deg, rgba(59, 87, 237, 0.16) 0%, rgba(13, 13, 204, 0.08) 100%);
}

.lead-magnet-editor .workspace-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border:2px solid #000;
  border-radius:999px;
  background:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}

.lead-magnet-editor #lead-magnet-details .tag{
  align-self:flex-start;
  border:2px solid #000;
  border-radius:999px;
  padding:4px 10px;
  display:inline-block;
  background:linear-gradient(180deg, var(--color-primary-blue) 0%, var(--color-primary-blue-dark) 100%);
  color:var(--color-white);
  box-shadow:var(--shadow-control);
}

.lead-magnet-editor-page-type{
  color:var(--color-text-secondary);
}

.lead-magnet-editor-tag--success{
  background:#28a745;
  color:#fff;
}
.lead-magnet-debug-panel{
  margin-top:16px;
  padding:16px;
  border:2px dashed rgba(181, 6, 0, 0.35);
  border-radius:16px;
  background:rgba(255, 247, 245, 0.96);
}
.lead-magnet-debug-panel summary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-weight:700;
  color:var(--color-text-primary);
  line-height:1;
}
.lead-magnet-editor button[data-action="toggle-family-expand"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.lead-magnet-debug-panel pre{
  margin:12px 0 0 0;
  max-height:320px;
  overflow:auto;
  padding:12px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(0, 0, 0, 0.08);
  font-size:12px;
  line-height:1.45;
  white-space:pre-wrap;
}
.edit-modal-buttons button{
  padding:12px 24px;
  border:none;
  border-radius:var(--radius-md);
  font-weight:600;
  cursor:pointer;
}
.btn-cancel{
  background:var(--color-border-medium);
  color:var(--color-text-primary);
}
.btn-save{
  background:var(--color-primary-blue);
  color:#fff;
}
.btn-cancel:hover,
.btn-save:hover{
  opacity:0.8;
}

.lead-magnet-editor{
  display:flex;
  flex-direction:column;
  gap:24px;
  width:100%;
}

.lead-magnet-workspace{
  display:flex;
  flex-direction:column;
  gap:24px;
  width:100%;
}

.lead-magnet-workspace-back-link{
  align-self:flex-start;
  margin-top:-12px;
}

.lead-magnet-editor .tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border:2px solid #000;
  border-radius:999px;
  background:#fff;
  font-size:11px;
  font-weight:700;
  line-height:1;
  vertical-align:middle;
  white-space:nowrap;
}

.lead-magnet-editor .tag-type{
  background:linear-gradient(180deg, var(--color-primary-blue) 0%, var(--color-primary-blue-dark) 100%);
  color:#fff;
  box-shadow:var(--shadow-control);
}

.lead-magnet-editor .workspace-header-card,
.lead-magnet-editor .workspace-card{
  align-items:stretch;
  gap:18px;
  padding:28px;
  border-radius:36px;
  width:100%;
}

.workspace-header-topline{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  flex-wrap:wrap;
  width:100%;
}

.workspace-header-copy{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:280px;
  flex:1 1 520px;
}

.workspace-title-meta{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.workspace-header-copy .campaign-editor-card-eyebrow{
  margin:0;
}

.workspace-header-title{
  margin:0;
  font-size:clamp(30px, 3.2vw, 40px);
  line-height:1.02;
}

.workspace-header-description{
  margin:0;
  font-size:15px;
  line-height:1.68;
  color:#2b2b2b;
  max-width:72ch;
}

.workspace-header-actions,
.workspace-family-actions,
.workspace-nested-actions,
.workspace-item-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.workspace-chip-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  row-gap:8px;
}

.lead-magnet-editor .workspace-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border:2px solid #000;
  border-radius:999px;
  background:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}

.lead-magnet-editor .workspace-chip strong,
.lead-magnet-editor .metric-chip strong{
  font-size:11px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#6b7280;
}

.workspace-context-panel{
  border:2px solid rgba(0,0,0,.08);
  border-radius:28px;
  background:rgba(255,255,255,.82);
  overflow:hidden;
}

.workspace-context-panel summary{
  list-style:none;
  cursor:pointer;
  padding:18px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-weight:700;
}

.workspace-context-panel summary::-webkit-details-marker,
.workspace-more-menu summary::-webkit-details-marker{
  display:none;
}

.workspace-context-summary-label{
  min-width:0;
}

.workspace-context-toggle{
  width:28px;
  height:28px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#172033;
  flex:0 0 auto;
  position:relative;
}

.workspace-context-toggle::before,
.workspace-context-toggle::after{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:2px;
  border-radius:999px;
  background:#fff;
  transform:translate(-50%, -50%);
}

.workspace-context-toggle::after{
  transform:translate(-50%, -50%) rotate(90deg);
}

.workspace-context-panel[open] .workspace-context-toggle::after{
  opacity:0;
}

.workspace-context-body{
  padding:0 22px 22px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.workspace-context-section{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.workspace-context-section h3{
  margin:0;
  font-size:16px;
}

.workspace-context-copy{
  margin:0;
  font-size:14px;
  line-height:1.65;
  color:#2b2b2b;
}

.lead-magnet-sidebar-persona-list,
.lead-magnet-bonus-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.lead-magnet-sidebar-persona{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:2px solid #000;
  border-radius:18px;
  background:#fff;
}

.lead-magnet-sidebar-persona img{
  width:42px;
  height:42px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid #000;
  flex:0 0 auto;
}

.lead-magnet-sidebar-persona__copy{
  min-width:0;
}

.lead-magnet-sidebar-persona__copy strong,
.lead-magnet-bonus-card strong{
  display:block;
  font-size:15px;
  line-height:1.3;
}

.lead-magnet-bonus-card{
  padding:10px 12px;
  border:2px solid #000;
  border-radius:18px;
  background:#fff;
}

.lead-magnet-bonus-card span{
  display:block;
  margin-top:4px;
  font-size:12px;
  color:#4e4e4e;
}

.workspace-section-topline{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  flex-wrap:wrap;
}

.lead-magnet-section-heading{
  margin-bottom:12px;
}

.workspace-section-copy{
  margin:8px 0 0;
  color:var(--color-text-secondary);
  line-height:1.6;
  max-width:72ch;
}

.workspace-family-list{
  display:flex;
  flex-direction:column;
  gap:18px;
  margin-top:18px;
}

.workspace-family-card{
  border:2px solid rgba(0,0,0,.08);
  border-radius:30px;
  background:#fff;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.workspace-family-header{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.workspace-family-copy{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:260px;
  flex:1 1 520px;
}

.lead-magnet-editor .workspace-family-title-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.workspace-family-title-row strong{
  font-size:20px;
  line-height:1.25;
}

.workspace-family-note{
  font-size:14px;
  line-height:1.6;
  color:var(--color-text-secondary);
  max-width:84ch;
}

.workspace-family-body{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.workspace-nested-section{
  border:1px solid rgba(0,0,0,.08);
  border-radius:24px;
  background:#fff;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.workspace-nested-header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.workspace-nested-header h4{
  margin:0;
  font-size:16px;
}

.workspace-nested-copy{
  margin:6px 0 0;
  font-size:13px;
  line-height:1.55;
  color:var(--color-text-secondary);
}

.workspace-empty{
  padding:18px;
  border:1px dashed rgba(0,0,0,.14);
  border-radius:18px;
  background:#fafafa;
  font-size:14px;
  color:var(--color-text-secondary);
}

.workspace-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.workspace-variant-card,
.workspace-ad-card,
.workspace-organic-card,
.workspace-funnel-step{
  border:1px solid rgba(0,0,0,.08);
  border-radius:20px;
  background:#fcfcfc;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.workspace-funnel-readiness{
  border:1px solid rgba(0,0,0,.08);
  border-radius:20px;
  background:#fff;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

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

.workspace-funnel-readiness-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}

.workspace-funnel-cta-card{
  min-width:0;
  padding:14px;
  border:1px solid rgba(0,0,0,.1);
  border-radius:18px;
  background:#f8fafc;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.workspace-funnel-cta-card span{
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#667085;
}

.workspace-funnel-cta-card strong{
  font-size:15px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

.workspace-funnel-cta-card p{
  margin:0;
  font-size:13px;
  line-height:1.45;
  color:var(--color-text-secondary);
}

.workspace-funnel-asset-list{
  display:grid;
  gap:10px;
}

.workspace-funnel-settings-editor{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:14px;
  border:1px solid rgba(0,0,0,.1);
  border-radius:16px;
  background:#f8fafc;
}

.workspace-funnel-settings-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.workspace-funnel-settings-destination-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.workspace-funnel-settings-destination{
  min-width:0;
  padding:14px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  background:#fff;
}

.workspace-funnel-settings-fields{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  margin-top:12px;
}

.workspace-funnel-settings-field-wide{
  grid-column:1 / -1;
}

.workspace-funnel-settings-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.workspace-funnel-handoff-process{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
}

.workspace-funnel-handoff-item{
  min-width:0;
  padding:12px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  background:#fff;
}

.workspace-funnel-handoff-item span{
  display:block;
  margin-bottom:5px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#667085;
}

.workspace-funnel-handoff-item strong{
  display:block;
  font-size:13px;
  line-height:1.3;
  overflow-wrap:anywhere;
}

.workspace-funnel-handoff-item p{
  margin:5px 0 0;
  color:var(--color-text-secondary);
  font-size:12px;
  line-height:1.35;
}

.workspace-funnel-asset-card{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:12px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  background:#fcfcfc;
}

.workspace-funnel-asset-card.is-missing{
  background:#fffdf5;
}

.workspace-funnel-asset-card strong{
  display:block;
  font-size:14px;
  line-height:1.3;
}

.workspace-funnel-asset-card span:not(.tag){
  display:block;
  margin-top:4px;
  font-size:12px;
  color:var(--color-text-secondary);
}

.workspace-funnel-asset-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.workspace-variant-topline,
.workspace-ad-topline,
.workspace-organic-topline,
.workspace-funnel-topline,
.workspace-variant-detail-row,
.workspace-ad-preview-row{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.workspace-item-copy{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:220px;
  flex:1 1 320px;
}

.workspace-item-copy strong{
  font-size:15px;
  line-height:1.35;
}

.workspace-item-subcopy{
  font-size:13px;
  line-height:1.55;
  color:var(--color-text-secondary);
}

.workspace-ad-preview-image{
  width:96px;
  height:96px;
  object-fit:cover;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.08);
  background:#f6f6f6;
}

.workspace-ad-preview-copy{
  gap:8px;
}

.workspace-ad-overview{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.workspace-ad-platform-list{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.workspace-ad-platform-block{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.workspace-ad-platform-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  font-size:13px;
  color:var(--color-text-secondary);
}

.workspace-ad-platform-header strong{
  min-width:0;
  overflow-wrap:anywhere;
  color:var(--color-text-primary);
  font-size:16px;
}

.workspace-ad-platform-header span{
  min-width:0;
  overflow-wrap:anywhere;
}

.workspace-ad-card--visual .workspace-ad-topline{
  min-width:0;
}

.workspace-ad-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:14px;
}

.workspace-ad-card--visual{
  display:grid;
  grid-template-columns:minmax(132px, 168px) minmax(0, 1fr);
  gap:14px;
  align-items:stretch;
}

.workspace-ad-card-media{
  min-width:0;
}

.workspace-ad-card-body{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.workspace-ad-card--visual .workspace-item-copy{
  min-width:0;
}

.workspace-ad-card--visual .workspace-item-copy strong{
  overflow-wrap:anywhere;
}

.workspace-ad-card--visual .workspace-ad-preview-image,
.workspace-ad-preview-placeholder{
  width:100%;
  height:156px;
  object-fit:cover;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.08);
  background:#f6f6f6;
}

.workspace-ad-image-button{
  display:block;
  width:100%;
  height:156px;
  padding:0;
  border:0;
  border-radius:18px;
  background:transparent;
  cursor:zoom-in;
  overflow:hidden;
}

.workspace-ad-image-button .workspace-ad-preview-image{
  display:block;
  border-radius:0;
}

.workspace-ad-preview-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:16px;
  font-size:13px;
  font-weight:700;
  color:var(--color-text-secondary);
}

.workspace-ad-actions{
  justify-content:space-between;
  align-items:center;
  margin-top:auto;
}

.workspace-ad-more-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  min-height:156px;
  padding:16px;
  border:1px dashed rgba(0,0,0,.16);
  border-radius:20px;
  background:#fff;
  color:var(--color-text-primary);
  font-family:alga, serif;
  text-align:left;
  cursor:pointer;
}

.workspace-ad-more-card span{
  color:var(--color-text-secondary);
  font-size:13px;
  line-height:1.45;
}

.workspace-image-preview-modal.is-open{
  display:flex;
}

.workspace-image-preview-modal__content{
  width:min(980px, 100%);
  display:flex;
  flex-direction:column;
  gap:18px;
}

.workspace-image-preview-modal__header{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
}

.workspace-image-preview-modal__header h2{
  margin:0;
  font-size:28px;
  line-height:1.1;
}

.workspace-image-preview-modal__img{
  width:100%;
  max-height:72vh;
  object-fit:contain;
  border:3px solid #000;
  border-radius:20px;
  background:#f3f4f6;
}

.format-stack,
.split-toggle-stack,
.metric-stack{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:160px;
}

.split-toggle-stack{
  min-width:180px;
}

.split-toggle-label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  font-weight:700;
  color:#172033;
}

.split-toggle-label input{
  width:16px;
  height:16px;
  margin:0;
}

.format-note,
.split-toggle-note,
.metric-note{
  font-size:12px;
  line-height:1.5;
  color:var(--color-text-secondary);
}

.split-toggle-note.is-enabled{
  color:#166534;
}

.metric-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.metric-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  font-size:12px;
  line-height:1.2;
  color:#172033;
}

.lead-magnet-primary-action{
  background:linear-gradient(180deg, #53ce26 0%, #008805 100%);
  color:#fff;
}

.global-ai-status{
  margin-top:-8px;
}

.ai-status-title{
  margin-top:0;
}

.edit-modal-content--compact{
  width:min(760px, 92vw);
}

.edit-form-textarea--short{
  min-height:220px;
  font-family:inherit;
}

.lead-magnet-table-placeholder{
  text-align:center;
  padding:40px;
  color:var(--color-text-secondary);
}

.workspace-more-menu{
  position:relative;
  display:inline-flex;
  align-items:flex-start;
}

.workspace-more-menu summary{
  list-style:none;
  cursor:pointer;
}

.workspace-more-menu[open] summary{
  opacity:.88;
}

.workspace-more-menu__content{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:20;
  min-width:220px;
  padding:10px;
  border:2px solid #000;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 24px rgba(0,0,0,.14);
  display:flex;
  flex-direction:column;
  gap:8px;
}

.workspace-more-menu__content .btn-small{
  width:100%;
  justify-content:center;
}

.workspace-more-menu__group{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:8px;
  border-top:1px solid rgba(0,0,0,.1);
}

.workspace-more-menu__group span{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-text-secondary);
}

@media (max-width:900px){
  .workspace-context-body{
    grid-template-columns:1fr;
  }

  .workspace-funnel-readiness-grid{
    grid-template-columns:1fr;
  }

  .workspace-funnel-handoff-process{
    grid-template-columns:1fr;
  }

  .workspace-funnel-settings-grid,
  .workspace-funnel-settings-destination-grid,
  .workspace-funnel-settings-fields{
    grid-template-columns:1fr;
  }

  .workspace-header-actions,
  .workspace-family-actions,
  .workspace-nested-actions,
  .workspace-item-actions{
    justify-content:flex-start;
  }

  .workspace-more-menu__content{
    left:0;
    right:auto;
  }
}

/* Workflow status + internal page notes */
.workflow-status{
  margin:0 0 18px;
}

@media (prefers-reduced-motion: reduce) {
    .ai-progress-dot {
        animation: none;
        opacity: 0.65;
        transform: none;
    }
}

.internal-page-note{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border:3px solid #000;
  border-radius:999px;
  background:#fff;
  box-shadow:0 4px 8px 0 #0003;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
}

/* -------------------------------------------------- */
/* CAMPAIGN OVERVIEW – hierarchy and summary rail     */
/* -------------------------------------------------- */

.campaign-overview-back-link{
    font-size:14px;
    display:inline-block;
    align-self:flex-start;
    margin-bottom:24px;
    margin-top:-12px;
}

.campaign-overview-layout{
    width:100%;
    display:grid;
    grid-template-columns:minmax(250px, 0.9fr) minmax(420px, 1.55fr);
    gap:32px;
    align-items:start;
}

.campaign-overview-rail,
.campaign-overview-main{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:20px;
}

.campaign-overview-section-title{
    margin-bottom:0;
    padding:14px 18px;
    font-size:22px;
    text-align:center;
}

.campaign-overview-panel{
    padding:24px;
    border-radius:32px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:stretch;
}

.campaign-overview-panel--tasks{
    min-height:300px;
}

.campaign-overview-panel--experiments{
    min-height:420px;
}

.campaign-overview-panel__body{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.campaign-overview-panel__eyebrow,
.campaign-overview-hero__eyebrow{
    align-self:flex-start;
    padding:7px 13px;
    border:2px solid #000;
    border-radius:999px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.campaign-overview-panel__eyebrow{
    background:#fff;
}

.campaign-overview-panel__title{
    margin:0;
    font-size:24px;
    line-height:1.06;
}

.campaign-overview-panel__copy{
    margin:0;
    font-size:14px;
    line-height:1.55;
    color:#2B2B2B;
}

.campaign-overview-panel__button{
    align-self:flex-start;
}

.campaign-overview-main{
    gap:24px;
}

.campaign-overview-empty-state{
    min-height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    gap:12px;
}

.campaign-overview-empty-state--panel{
    min-height:260px;
}

.campaign-overview-hero{
    align-items:stretch;
    gap:18px;
    padding:28px 30px 30px;
    border-radius:40px;
    background:#FFF;
}

.campaign-overview-hero__eyebrow{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#FFF;
    box-shadow:0 3px 0 0 #00000015;
    margin:0;
}

.campaign-overview-hero__eyebrow-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
}

.campaign-overview-hero__title-block{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.campaign-overview-hero__actions{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    gap:10px;
}

.campaign-overview-hero__title{
    margin:0;
    font-size:clamp(28px, 3.3vw, 44px);
    line-height:1.02;
    letter-spacing:0;
    max-width:18ch;
}

.campaign-overview-hero__subtitle{
    margin:0;
    font-size:15px;
    line-height:1.35;
    color:#2B2B2B;
}

.campaign-overview-hero__intro{
    margin:0;
    max-width:56ch;
    font-size:14px;
    line-height:1.55;
    color:#1F1F1F;
}

.campaign-overview-summary-strip{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:16px 18px;
    border:3px solid #000;
    border-radius:24px;
    background:#FFF;
}

.campaign-overview-performance-strip{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:10px;
    align-items:stretch;
    padding:0;
    border:0;
    border-radius:0;
    background:#FFF;
}

.campaign-overview-performance-card{
    min-width:0;
    min-height:88px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:7px;
    padding:13px 14px;
    border:2px solid #000;
    border-radius:16px;
    background:#FFF;
}

.campaign-overview-summary-strip__label{
    margin:0 0 6px 0;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.campaign-overview-summary-strip__value{
    margin:0;
    font-size:15px;
    font-weight:700;
    line-height:1.25;
}

.campaign-overview-performance-card__value{
    margin:0;
    font-size:clamp(28px, 3vw, 40px);
    font-weight:800;
    line-height:0.95;
}

.campaign-overview-performance-card__meta{
    margin:0;
    font-size:12px;
    line-height:1.35;
    color:#2B2B2B;
}

.campaign-overview-editor-cta{
    min-width:158px;
    min-height:50px;
    padding:13px 22px;
    font-size:16px;
    flex:0 0 auto;
    color:#FFF;
    border-color:#000;
    background:linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    box-shadow:0 4px 0 0 #000;
}

.campaign-overview-editor-cta:disabled{
    opacity:0.55;
    cursor:not-allowed;
}

.campaign-overview-stats{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.campaign-overview-setup{
    border-top:2px solid #000;
    padding-top:14px;
    background:#FFF;
}

.campaign-overview-setup__header{
    display:flex;
    align-items:center;
    font-size:17px;
    font-weight:800;
}

.campaign-overview-setup-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px 18px;
    margin-top:12px;
}

.campaign-overview-stat{
    padding:0;
    border:0;
    border-radius:0;
    background:#FFF;
    min-height:auto;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    gap:5px;
}

.campaign-overview-stat__label{
    margin:0;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.campaign-overview-stat__value{
    margin:0;
    font-size:15px;
    line-height:1.3;
    font-weight:700;
}

.campaign-status-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 14px;
    border:2px solid #000;
    border-radius:999px;
    background:#FFF;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
    white-space:nowrap;
}

.campaign-status-badge.is-active{
    background:linear-gradient(180deg, #7DDE40 0%, #008805 100%);
    color:#FFF;
}

.campaign-status-badge.is-draft{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}

.campaign-status-badge.is-paused{
    background:linear-gradient(180deg, #F5B43A 0%, #ED8812 100%);
}

.campaign-status-badge.is-error{
    background:linear-gradient(180deg, #E33F2A 0%, #B50600 100%);
    color:#FFF;
}

.campaign-status-badge.is-neutral{
    background:#FFF;
}

.campaign-status-badge--small{
    padding:6px 10px;
    font-size:10px;
}

.campaign-overview-experiment-card{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:22px;
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(227, 63, 42, 0.06) 100%);
}

.campaign-overview-experiment-card__topline{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
}

.campaign-overview-experiment-card__name{
    margin:0;
    font-size:20px;
    font-weight:700;
    line-height:1.15;
}

.campaign-overview-experiment-card__meta{
    margin:6px 0 0 0;
    font-size:13px;
    line-height:1.45;
    color:#2B2B2B;
}

.campaign-overview-experiment-card__stats{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}

.campaign-overview-experiment-card__stat{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:12px;
    border:2px solid #000;
    border-radius:14px;
    background:#FFF;
}

.campaign-overview-experiment-card__stat-label{
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.campaign-overview-experiment-card__stat strong{
    font-size:20px;
    line-height:1.1;
}

.campaign-overview-experiment-card__link{
    margin:0;
    font-size:13px;
    line-height:1.45;
}

.campaign-overview-experiment-card__link a{
    color:#B50600;
    text-decoration-thickness:2px;
    text-underline-offset:2px;
}

.campaign-overview-variant-stack{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.campaign-overview-variant-card{
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:12px 14px;
    border:2px solid #000;
    border-radius:14px;
    background:#FFF;
}

.campaign-overview-variant-card__header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
}

.campaign-overview-variant-card__name{
    margin:0;
    font-size:15px;
    font-weight:700;
    line-height:1.25;
}

.campaign-overview-variant-card__weight{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:4px 8px;
    border:1px solid #000;
    border-radius:999px;
    font-size:10px;
    font-weight:700;
    white-space:nowrap;
}

.campaign-overview-variant-card__metrics{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.campaign-overview-variant-card__metrics span{
    display:inline-flex;
    align-items:center;
    padding:4px 8px;
    border:1px solid #000;
    border-radius:999px;
    font-size:11px;
    line-height:1.2;
}

.campaign-optimization-section{
    gap:16px;
}

.campaign-optimization-console{
    gap:24px;
    padding:28px 32px;
    border-radius:40px;
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(227, 63, 42, 0.09) 100%);
}

.campaign-optimization-console .section-header{
    align-items:flex-start;
}

.campaign-optimization-console__toolbar{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.campaign-optimization-console__controls{
    display:grid;
    grid-template-columns:minmax(240px, 340px) minmax(0, 1fr);
    gap:16px;
    align-items:end;
}

.campaign-optimization-console__scenario{
    min-width:0;
}

.campaign-optimization-console .btn:disabled,
.campaign-optimization-console .btn-outline:disabled,
.campaign-optimization-console .btn-ghost:disabled{
    opacity:0.55;
    cursor:not-allowed;
    transform:none;
}

.campaign-optimization-chip-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.campaign-optimization-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:12px;
}

.campaign-optimization-summary-card{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:24px;
    background:#FFF;
}

.campaign-optimization-summary-card__eyebrow{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
}

.campaign-optimization-summary-card__stats{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
}

.campaign-optimization-summary-card__stats div{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:12px;
    border:2px solid #000;
    border-radius:16px;
    background:rgba(255,255,255,0.92);
}

.campaign-optimization-summary-card__stats strong{
    font-size:20px;
    line-height:1.08;
}

.campaign-optimization-summary-card__stats span{
    font-size:11px;
    font-weight:700;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:#2B2B2B;
}

.campaign-optimization-summary-card__detail{
    margin:0;
    font-size:14px;
    line-height:1.55;
    color:#2B2B2B;
}

.campaign-optimization-progress-dots{
    display:grid;
    grid-template-columns:repeat(8, minmax(0, 1fr));
    gap:8px;
}

.campaign-optimization-progress-dot{
    height:12px;
    border:2px solid #000;
    border-radius:999px;
    background:rgba(0, 0, 0, 0.08);
}

.campaign-optimization-progress-dot.is-complete{
    background:linear-gradient(180deg, #7DDE40 0%, #008805 100%);
}

.campaign-optimization-progress-dot.is-current{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}

.campaign-optimization-surface{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.campaign-optimization-scoreboard,
.campaign-optimization-preview-grid,
.campaign-optimization-history-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.campaign-optimization-score-card,
.campaign-optimization-history-card{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:24px;
    background:#FFF;
}

.campaign-optimization-score-card.is-champion{
    background:linear-gradient(180deg, #FFFFFF 0%, rgba(125, 222, 64, 0.16) 100%);
}

.campaign-optimization-score-card__top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

.campaign-optimization-score-card__title{
    margin:0;
    font-size:20px;
    line-height:1.12;
}

.campaign-optimization-score-card__subtitle{
    margin:6px 0 0 0;
    font-size:13px;
    line-height:1.45;
    color:#2B2B2B;
}

.campaign-optimization-score-card__metrics{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
}

.campaign-optimization-score-metric{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:12px;
    border:2px solid #000;
    border-radius:16px;
    background:rgba(255,255,255,0.92);
}

.campaign-optimization-score-metric span{
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.08em;
}

.campaign-optimization-score-metric strong{
    font-size:18px;
    line-height:1.08;
}

.campaign-optimization-score-card__details{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.campaign-optimization-score-card__details p,
.campaign-optimization-record-card__body p,
.campaign-optimization-history-item p{
    margin:0;
    font-size:14px;
    line-height:1.5;
    color:#2B2B2B;
}

.campaign-optimization-record-card{
    margin-top:0;
    border:3px solid #000;
    border-radius:22px;
    padding:18px;
}

.campaign-optimization-record-card__body{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.campaign-optimization-record-card__body strong{
    font-size:18px;
    line-height:1.2;
}

.campaign-optimization-history-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.campaign-optimization-history-item{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px;
    border:2px solid #000;
    border-radius:18px;
    background:rgba(255,255,255,0.92);
}

.campaign-optimization-history-item strong{
    font-size:16px;
    line-height:1.2;
}

.campaign-optimization-history-item span{
    font-size:12px;
    font-weight:700;
    line-height:1.4;
    color:#545454;
}

.campaign-optimization-links{
    display:flex;
    flex-direction:column;
    gap:12px;
}

@media (max-width: 1200px){
    .campaign-overview-layout{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .campaign-overview-main{
        order:-1;
        grid-column:1 / -1;
    }

    .campaign-optimization-summary-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px){
    .campaign-overview-layout{
        grid-template-columns:1fr;
    }

    .campaign-overview-hero{
        padding:22px 18px;
        gap:16px;
    }

    .campaign-overview-hero__eyebrow-row,
    .campaign-overview-summary-strip{
        flex-direction:column;
        align-items:flex-start;
    }

    .campaign-overview-hero__eyebrow-row,
    .campaign-overview-setup__header{
        width:100%;
    }

    .campaign-overview-hero__title-block,
    .campaign-overview-hero__actions{
        width:100%;
    }

    .campaign-overview-hero__actions{
        align-items:flex-start;
        flex-direction:column;
    }

    .campaign-overview-performance-strip,
    .campaign-overview-setup-grid{
        grid-template-columns:1fr;
    }

    .campaign-overview-hero__title{
        max-width:none;
        font-size:clamp(26px, 7.2vw, 32px);
        line-height:1.05;
    }

    .campaign-overview-hero__subtitle,
    .campaign-overview-hero__intro,
    .campaign-overview-panel__copy,
    .campaign-optimization-summary-card__detail,
    .campaign-optimization-score-card__details p,
    .campaign-optimization-record-card__body p,
    .campaign-optimization-history-item p{
        font-size:14px;
        line-height:1.5;
    }

    .campaign-overview-section-title{
        font-size:18px;
    }

    .campaign-overview-performance-card__value{
        font-size:clamp(24px, 7vw, 30px);
    }

    .campaign-overview-setup__header,
    .campaign-optimization-record-card__body strong,
    .campaign-optimization-score-card__title,
    .campaign-overview-experiment-card__name{
        font-size:18px;
        line-height:1.18;
    }

    .campaign-overview-editor-cta{
        width:100%;
        min-height:50px;
        font-size:15px;
    }

    .campaign-overview-stats,
    .campaign-overview-experiment-card__stats{
        grid-template-columns:1fr;
    }

    .campaign-overview-setup__header{
        align-items:flex-start;
    }

    .campaign-overview-panel__title{
        font-size:20px;
        line-height:1.18;
    }

    .campaign-optimization-console{
        padding:22px 18px;
        gap:18px;
    }

    .campaign-optimization-console__controls,
    .campaign-optimization-summary-grid,
    .campaign-optimization-scoreboard,
    .campaign-optimization-preview-grid,
    .campaign-optimization-history-grid,
    .campaign-optimization-score-card__metrics{
        grid-template-columns:1fr;
    }

    .campaign-optimization-progress-dots{
        grid-template-columns:repeat(4, minmax(0, 1fr));
    }

    .campaign-task-card__title{
        font-size:17px;
        line-height:1.22;
    }

    .campaign-task-card__copy,
    .campaign-task-card__meta{
        font-size:14px;
        line-height:1.5;
    }
}

.campaign-playbook-shell{
    width:min(1180px, 100%);
    margin:32px auto 0;
}

.campaign-playbook-groups{
    display:grid;
    gap:28px;
}

.campaign-playbook-group{
    display:grid;
    gap:18px;
}

.campaign-playbook-group__eyebrow{
    margin:0;
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:var(--color-text-secondary);
}

.campaign-playbook-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:24px;
}

.campaign-playbook-card{
    align-items:flex-start;
    min-height:100%;
    justify-content:space-between;
}

.campaign-playbook-card--selected,
.campaign-goal-card--selected{
    border:2px solid var(--color-primary-yellow);
    box-shadow:0 18px 36px rgba(237,178,18,.18);
}

.campaign-playbook-card__copy,
.campaign-playbook-card__meta{
    display:grid;
    gap:12px;
}

.campaign-playbook-card__eyebrow{
    margin:0;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.1em;
    color:var(--color-text-secondary);
}

.campaign-playbook-card__meta p{
    margin:0;
    color:var(--color-text-secondary);
}

.campaign-playbook-card__button{
    margin-top:16px;
    width:100%;
    justify-content:center;
}

.campaign-goal-badge{
    font-size:14px;
    padding:6px 16px;
    border-radius:999px;
    position:absolute;
    top:-18px;
    left:50%;
    transform:translateX(-50%);
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
    color:#000;
    box-shadow:0 4px 0 0 #F8DC66;
}

.campaign-task-bucket{
    display:grid;
    gap:12px;
    padding-bottom:8px;
}

.campaign-task-bucket__title{
    margin:0;
}

.campaign-task-card{
    display:grid;
    gap:12px;
    padding:14px 16px;
    border:1px solid var(--color-border, rgba(0,0,0,.08));
    border-radius:20px;
    background:rgba(255,255,255,.9);
}

.campaign-task-card__eyebrow{
    margin:0 0 6px;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--color-text-secondary);
}

.campaign-task-card__title{
    margin:0 0 6px;
    font-size:18px;
    color:var(--color-text-primary);
}

.campaign-task-card__copy,
.campaign-task-card__meta{
    margin:0;
    color:var(--color-text-secondary);
}

.campaign-task-card__actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.campaign-overview-panel__copy--flush{
    margin:0;
}

/* -------------------------------------------------- */
/* SURFACE COMPOSITIONS                               */
/* -------------------------------------------------- */

.wizard-section-intro{
    max-width:760px;
    text-align:center;
}

.wizard-text-320{
    max-width:320px;
}

.wizard-text-280{
    max-width:280px;
}

.wizard-footer-actions{
    width:100%;
    margin-top:auto;
}

.campaign-goal-intro{
    max-width:760px;
    text-align:center;
}

.campaign-goal-grid{
    margin-top:40px;
    gap:40px;
}

.campaign-goal-grid .column{
    position:relative;
}

.campaign-goal-card{
    gap:20px;
    align-items:center;
    text-align:center;
}

.campaign-goal-card__description{
    max-width:280px;
    text-align:center;
}

.campaign-goal-card__footer{
    margin-top:auto;
    width:100%;
}

.campaign-goal-card .goal-select-btn{
    width:160px;
}

.campaign-offer-header{
    margin-bottom:16px;
}

.campaign-offer-side-title{
    text-align:center;
}

.campaign-intensity-copy{
    text-align:center;
}

.campaign-intensity-sparkles{
    width:96px;
}

.campaign-intensity-tip-copy{
    max-width:320px;
}

.campaign-intensity-tip-note{
    margin-bottom:0;
}

.campaign-channels-heading{
    margin-bottom:64px;
    flex-direction:column;
    gap:8px;
}

.campaign-channels-heading-note{
    margin-bottom:0;
}

.campaign-success-page,
.campaign-success-page main,
.checkout-success-page,
.checkout-success-page main{
    min-height:100vh;
}

.success-wrapper{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    min-height:100vh;
    text-align:center;
    gap:40px;
    padding:0 7vw;
}

.success-wrapper h1{
    font-size:clamp(32px, 4vw, 64px);
    font-weight:700;
    line-height:1.02;
}

.success-wrapper p{
    font-size:clamp(16px, 1.5vw, 24px);
    font-weight:500;
    line-height:1.4;
}

.success-logo{
    width:min(40vw, 480px);
    height:auto;
}

.checkout-success-wrapper{
    gap:clamp(24px, 5vh, 40px);
}

.checkout-success-wrapper .success-logo{
    width:min(34vw, 360px);
}

.login-shell{
    width:min(100%, 960px);
}

.login-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:32px;
    min-width:0;
}

.login-card{
    align-items:stretch;
    gap:20px;
    min-width:0;
}

.login-card form,
.login-card .form-input{
    min-width:0;
    max-width:100%;
}

.login-card__title{
    margin:0;
    font-size:32px;
    line-height:1.04;
}

.signup-page main{
    min-height:100svh;
    padding-top:clamp(18px, 3vh, 28px);
    padding-bottom:clamp(24px, 5vh, 56px);
}

.signup-top-navigation{
    align-items:center;
}

.signup-login-link{
    margin-left:auto;
}

.signup-shell{
    width:100%;
    flex:0 0 auto;
    align-items:stretch;
    gap:0;
}

.signup-hero{
    width:min(100%, 960px);
    align-self:center;
    align-items:stretch;
    text-align:center;
    margin-bottom:clamp(14px, 2.4vh, 24px);
}

.signup-hero .page-title-block{
    align-items:stretch;
    max-width:none;
    width:100%;
    margin:0 auto;
}

.signup-title{
    justify-content:center;
    width:100%;
    padding:18px 32px;
    color:#101010;
    text-align:center;
    min-height:64px;
}

.signup-layout{
    width:100%;
    flex:0 0 auto;
    display:grid;
    place-items:start center;
    padding-top:max(clamp(24px, 4vh, 44px), calc(50svh - 390px));
    padding-bottom:clamp(32px, 6vh, 72px);
    min-height:0;
}

.signup-layout:has(.signup-step--plan:not([hidden])){
    padding-top:clamp(12px, 2vh, 24px);
}

.signup-card{
    width:min(100%, 760px);
    min-height:0;
    gap:clamp(22px, 3vh, 30px);
    align-items:stretch;
    justify-self:center;
    padding:clamp(32px, 4vw, 48px);
}

.signup-message{
    min-height:0;
}

.signup-form,
.signup-step{
    min-width:0;
}

.signup-step{
    display:flex;
    flex-direction:column;
    gap:clamp(20px, 3vh, 28px);
    text-align:center;
}

.signup-step:not(.signup-step--plan){
    width:100%;
    max-width:620px;
    margin:0 auto;
}

.signup-step .section-header,
.signup-step .section-header__copy{
    align-items:center;
    text-align:center;
}

.signup-step[data-step-panel="legal"],
.signup-step[data-step-panel="legal"] .section-header,
.signup-step[data-step-panel="legal"] .section-header__copy{
    align-items:flex-start;
    text-align:left;
}

.signup-legal-check{
    width:100%;
    margin:0;
    color:#101010;
    font-size:18px;
    font-weight:700;
    line-height:1.45;
    text-align:left;
    cursor:pointer;
}

.signup-legal-check input{
    cursor:pointer;
}

.signup-step[data-step-panel="legal"] .signup-actions{
    justify-content:flex-start;
}

.signup-step[hidden]{
    display:none;
}

.signup-field{
    display:flex;
    flex-direction:column;
    gap:8px;
    font-weight:800;
    color:#101010;
}

.signup-field .form-input{
    width:100%;
    min-height:58px;
    font-size:22px;
}

.signup-actions{
    width:100%;
    justify-content:flex-end;
    align-items:center;
    margin:0;
}

.signup-actions .btn{
    min-width:210px;
}

.signup-email-actions{
    align-items:center;
    justify-content:flex-end;
    width:100%;
    gap:18px;
}

.signup-inline-login{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 4px;
    color:#101010;
    font-weight:900;
    text-decoration:none;
    cursor:pointer;
}

.signup-inline-login:hover,
.signup-inline-login:focus-visible{
    text-decoration:underline;
    text-underline-offset:4px;
}

.signup-card:has(.signup-step--plan:not([hidden])){
    width:min(100%, 1080px);
    padding:clamp(24px, 3vw, 36px);
    background:
        linear-gradient(180deg, rgba(255,249,226,0.98) 0%, rgba(255,255,255,0.98) 42%, #ffffff 100%),
        #ffffff;
}

.signup-step--plan{
    text-align:center;
    gap:0;
}

.signup-pricing-section{
    position:relative;
    width:100%;
    text-align:center;
    padding:0 0 4px;
}

.signup-pricing-section > :not(.pricing-sparkle){
    position:relative;
    z-index:1;
}

.signup-plan-decision{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:min(100%, 520px);
    margin:0 auto;
}

.signup-step--plan .pricing-toggle-shell{
    position:relative;
    z-index:2;
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0;
    width:100%;
    margin:8px 0 0;
}

.signup-step--plan .pricing-toggle{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:auto;
    max-width:100%;
    min-height:40px;
    padding:0;
}

.signup-step--plan .pricing-toggle__mini-switch{
    position:relative;
    display:block;
    flex:0 0 auto;
    width:52px;
    height:28px;
    border:2px solid #111111;
    border-radius:999px;
    background:#111111;
    box-shadow:4px 4px 0 rgba(17,17,17,0.1);
    cursor:pointer;
}

.signup-step--plan .pricing-toggle__mini-switch::after{
    content:"";
    position:absolute;
    top:50%;
    left:4px;
    width:16px;
    height:16px;
    border-radius:999px;
    background:#FFE15D;
    transform:translateY(-50%);
    transition:transform 0.24s ease;
}

.signup-step--plan .pricing-toggle.is-annual .pricing-toggle__mini-switch::after{
    transform:translate(24px, -50%);
}

.signup-step--plan .pricing-toggle__option{
    position:relative;
    z-index:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-direction:row;
    gap:8px;
    flex:0 0 auto;
    min-width:0;
    min-height:34px;
    padding:0;
    border:0;
    background:transparent;
    color:rgba(17,17,17,0.72);
    font-family:inherit;
    font-size:16px;
    line-height:1;
    font-weight:900;
    cursor:pointer;
    transition:color 0.2s ease, transform 0.2s ease;
}

.signup-step--plan .pricing-toggle__option:hover,
.signup-step--plan .pricing-toggle__option:focus-visible{
    transform:translateY(-1px);
}

.signup-step--plan .pricing-toggle__option.is-active{
    color:#111111;
}

.signup-step--plan .pricing-toggle__option.is-active span{
    color:#111111;
}

.signup-step--plan .pricing-toggle__option.is-disabled{
    cursor:not-allowed;
    opacity:0.48;
}

.signup-step--plan .pricing-toggle__option strong{
    display:inline-flex;
    align-items:center;
    min-height:20px;
    padding:0 8px;
    border-radius:999px;
    background:#FFE15D;
    color:#111111;
    font-size:10px;
    font-weight:800;
    letter-spacing:0.08em;
    line-height:1;
    text-transform:uppercase;
    white-space:nowrap;
}

.signup-step--plan .pricing-toggle__option--annual{
    flex-wrap:wrap;
}

.signup-pricing-sparkle{
    position:absolute;
    width:82px;
    height:auto;
    opacity:0.24;
    pointer-events:none;
}

.signup-pricing-sparkle.pricing-sparkle--left{
    top:32px;
    left:clamp(-18px, 2vw, 28px);
    transform:rotate(-12deg);
}

.signup-pricing-sparkle.pricing-sparkle--right{
    top:120px;
    right:clamp(-18px, 2vw, 30px);
    transform:rotate(16deg);
}

.signup-checkout-panel{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    gap:8px;
    width:100%;
    min-width:0;
    padding:24px;
    border:4px solid #111111;
    border-radius:28px;
    background:#ffffff;
    box-shadow:10px 10px 0 rgba(17,17,17,0.1);
    text-align:center;
}

.signup-checkout-panel__eyebrow{
    margin:0;
    color:rgba(17,17,17,0.54);
    font-size:11px;
    font-weight:900;
    letter-spacing:0.12em;
    line-height:1;
    text-transform:uppercase;
}

.signup-checkout-panel strong{
    color:#111111;
    font-size:clamp(22px, 3vw, 32px);
    font-weight:900;
    line-height:1;
}

.signup-checkout-panel__price{
    margin:0;
    color:rgba(17,17,17,0.62);
    font-size:clamp(15px, 1.7vw, 18px);
    font-weight:500;
    letter-spacing:0;
    line-height:1.3;
    text-transform:none;
}

.signup-step--plan .marketing-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:100%;
    min-height:60px;
    margin-top:12px;
    padding:0 26px;
    border:3px solid #000000;
    border-radius:18px;
    background:#000000;
    color:#ffffff;
    font:inherit;
    font-size:18px;
    font-weight:900;
    line-height:1;
    text-decoration:none;
    box-shadow:0 6px 0 rgba(17,17,17,0.12);
    cursor:pointer;
    transition:transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.signup-step--plan .marketing-button:hover,
.signup-step--plan .marketing-button:focus-visible{
    transform:translateY(-2px);
    box-shadow:0 10px 0 rgba(17,17,17,0.14);
}

.signup-step--plan .marketing-button:disabled,
.signup-step--plan .marketing-button.is-disabled{
    opacity:0.48;
    cursor:not-allowed;
    transform:none;
    box-shadow:0 8px 20px rgba(17,17,17,0.16);
}

.signup-step--plan .pricing-plan-grid{
    display:grid;
    grid-template-columns:minmax(0, 1fr);
    gap:clamp(22px, 4vw, 36px);
    width:min(100%, 880px);
    margin:28px auto 0;
    align-items:start;
}

.signup-step--plan .pricing-plan{
    padding:28px;
    border:3px solid rgba(17,17,17,0.88);
    border-radius:28px;
    background:rgba(255,255,255,0.94);
    box-shadow:10px 10px 0 rgba(17,17,17,0.1);
    text-align:left;
}

.signup-step--plan .pricing-plan--featured{
    background:linear-gradient(180deg, rgba(255,249,226,0.98) 0%, rgba(255,255,255,0.96) 100%);
    border:1px solid rgba(237,191,39,0.34);
}

.signup-step--plan .pricing-plan__kicker{
    margin:0 0 14px;
    color:rgba(17,17,17,0.54);
    font-size:13px;
    letter-spacing:0.12em;
    line-height:1;
    text-transform:uppercase;
}

.signup-step--plan .pricing-plan h3{
    margin:0;
    color:#111111;
    font-size:clamp(30px, 3.8vw, 44px);
    font-weight:900;
    letter-spacing:0;
    line-height:0.96;
}

.signup-step--plan .pricing-plan__price{
    margin:14px 0 0;
    color:#111111;
    font-size:clamp(36px, 4.8vw, 52px);
    font-weight:900;
    letter-spacing:0;
    line-height:0.96;
}

.signup-step--plan .pricing-plan__meta{
    margin:12px 0 0;
    color:rgba(17,17,17,0.48);
    font-size:13px;
    font-weight:900;
    letter-spacing:0.12em;
    line-height:1.4;
    text-transform:uppercase;
}

.signup-step--plan .pricing-plan__description{
    margin:18px 0 0;
    max-width:68ch;
    color:rgba(17,17,17,0.72);
    font-size:17px;
    font-weight:700;
    line-height:1.56;
}

.signup-step--plan .pricing-plan__note{
    margin:18px 0 0;
    color:rgba(17,17,17,0.58);
    font-size:15px;
    font-weight:700;
    line-height:1.5;
}

.signup-plan-card-footer{
    margin-top:24px;
    padding-top:22px;
    border-top:2px solid rgba(17,17,17,0.14);
}

.signup-step--plan .signup-pricing-cta--wide{
    width:100%;
    margin-top:0;
}

.signup-step--plan .pricing-note{
    max-width:680px;
    margin:32px auto 0;
    color:rgba(17,17,17,0.58);
    font-size:15px;
    font-weight:700;
    line-height:1.5;
}

.signup-step--plan .pricing-note a{
    color:#123f9e;
    font-weight:800;
}

.signup-page .btn:disabled,
.signup-page .btn.is-disabled{
    opacity:0.48;
    cursor:not-allowed;
}

.persona-create-intro{
    text-align:center;
    margin-bottom:32px;
    color:var(--color-text-secondary);
}

.form-section{
    margin-bottom:32px;
}

.form-hint{
    font-size:14px;
    color:var(--color-text-secondary);
    margin-bottom:8px;
    font-style:italic;
}

.persona-create-submit-row{
    margin-top:40px;
}

.persona-create-submit{
    min-width:250px;
    padding:16px 40px;
    font-size:20px;
}

.loading-overlay{
    position:fixed;
    inset:0;
    background:rgba(0, 0, 0, 0.8);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:9999;
    padding:24px;
}

.loading-content{
    background:#fff;
    padding:40px;
    border-radius:var(--radius-lg);
    text-align:center;
    max-width:400px;
    box-shadow:var(--shadow-float);
}

.loading-content__title{
    margin-top:0;
}

.progress-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:20px;
}

.progress-dot{
    width:12px;
    height:12px;
    border-radius:50%;
    background:var(--color-border-light);
    animation:pulse 1.5s infinite;
}

.progress-dot:nth-child(1){ animation-delay:0s; }
.progress-dot:nth-child(2){ animation-delay:0.2s; }
.progress-dot:nth-child(3){ animation-delay:0.4s; }

.loading-status{
    margin-top:20px;
    font-size:14px;
    color:var(--color-text-secondary);
}

@keyframes pulse{
    0%, 100% { opacity:0.3; }
    50% { opacity:1; }
}

.style-test-layout{
    display:flex;
    width:100%;
    gap:40px;
    align-items:flex-start;
}

.style-test-main{
    flex:0 0 67%;
    display:flex;
    flex-direction:column;
    gap:32px;
}

.style-test-sidebar{
    flex:0 0 33%;
    display:flex;
    flex-direction:column;
    gap:32px;
}

.style-test-card{
    align-items:stretch;
    gap:24px;
}

.style-test-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    justify-content:center;
}

.style-test-stat-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:16px;
}

.style-test-stat{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:20px;
    text-align:center;
    box-shadow:var(--shadow-soft);
}

.style-test-stat-number{
    display:block;
    font-size:40px;
    font-weight:700;
    margin-bottom:8px;
}

.style-test-note{
    border:3px dashed #000;
    border-radius:20px;
    padding:20px 24px;
    background:linear-gradient(180deg, rgba(59, 87, 237, 0.12) 0%, rgba(13, 13, 204, 0.04) 100%);
    text-align:center;
}

.style-test-sidebar-card{
    align-items:center;
    text-align:center;
}

.style-test-sidebar-card .persona-card-body{
    max-height:none;
    text-align:center;
}

.style-test-mini-list{
    margin-top:0;
}

.style-test-mini-list li{
    font-size:16px;
    padding:18px 24px;
}

.style-test-label{
    display:inline-block;
    align-self:center;
    padding:8px 18px;
    border-radius:999px;
    border:2px solid #000;
    background:linear-gradient(180deg, #3B57ED 0%, #0D0DCC 100%);
    color:#fff;
    font-size:14px;
    font-weight:700;
    letter-spacing:0.02em;
}

.style-test-callout{
    border:4px solid #000;
    border-radius:24px;
    background:#fff;
    padding:24px;
    box-shadow:var(--shadow-soft);
}

.style-test-callout h3{
    margin-bottom:12px;
    text-align:center;
}

.style-test-callout p{
    text-align:center;
}

.style-test-heading{
    text-align:center;
}

.style-test-stat .bold,
.style-test-note .bold{
    font-size:20px;
    margin-bottom:8px;
}

.style-test-copy{
    margin-bottom:0;
}

.style-test-icon{
    width:96px;
}

.style-test-copy-wrap{
    max-width:320px;
}

.style-test-gallery{
    display:flex;
    flex-direction:column;
    gap:32px;
    width:100%;
}

.style-test-component-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
}

.style-test-theme-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px;
}

.style-test-theme-card{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:18px 20px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:12px;
}

.style-test-theme-card .gradient-header-container-card{
    margin:0;
    width:100%;
}

.style-test-stack{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.style-test-button-grid{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.style-test-form-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
}

.style-test-table{
    overflow:auto;
}

.style-test-shell-grid,
.style-test-dashboard-preview{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
}

.style-test-shell-preview{
    border:3px solid #000;
    border-radius:20px;
    background:#fff;
    padding:20px;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:16px;
}

.style-test-shell-row{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.style-test-shell-row .workspace-select-wrap{
    min-width:200px;
}

.style-test-shell-row .workspace-client-select{
    pointer-events:none;
}

body[data-workspace-context="compact"] .style-test-shell-preview .workspace-banner{
    display:flex;
}

.style-test-dashboard-card{
    padding:20px;
}

body.embedded-editor-frame .background-triangle,
body.embedded-editor-frame .top-navigation-container,
body.embedded-editor-frame .app-back-link,
body.embedded-editor-frame .gradient-header-container{
    display:none;
}

body.embedded-editor-frame .page{
    max-width:none;
    width:100%;
    padding:var(--space-24);
}

body.campaign-ads-page .page,
body.organic-cadence-page .page,
body.campaign-funnel-page .page{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:24px;
    padding:0 7vw 48px;
}

body.embedded-editor-frame.campaign-funnel-page .page{
    padding:var(--space-24);
}

body.campaign-ads-page .card,
body.organic-cadence-page .card,
body.campaign-funnel-page .card{
    border:4px solid #000;
    border-radius:28px;
    background:#fff;
    box-shadow:var(--shadow-card);
    padding:24px;
}

body.campaign-ads-page label,
body.organic-cadence-page label,
body.campaign-funnel-page label{
    display:block;
    font-weight:700;
    margin:12px 0 6px;
}

body.campaign-ads-page input,
body.campaign-ads-page textarea,
body.campaign-ads-page select,
body.organic-cadence-page input,
body.organic-cadence-page textarea,
body.organic-cadence-page select,
body.campaign-funnel-page input,
body.campaign-funnel-page textarea,
body.campaign-funnel-page select{
    width:100%;
    padding:12px;
    border:2px solid #000;
    border-radius:12px;
    font-family:alga, serif;
}

.top-navigation-container .workspace-select-wrap.workspace-control{
    display:grid;
    font-weight:700;
    margin:0;
}

.top-navigation-container .workspace-client-select{
    width:100%;
    min-width:0;
    height:100%;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:inherit;
    appearance:none;
}

body.campaign-ads-page #headline{
    font-size:18px;
    font-weight:700;
    line-height:1.25;
}

body.campaign-ads-page textarea,
body.organic-cadence-page textarea,
body.campaign-funnel-page textarea{
    min-height:120px;
}

body.campaign-ads-page .row,
body.organic-cadence-page .row,
body.campaign-funnel-page .row{
    display:flex;
    gap:12px;
    align-items:center;
}

body.campaign-funnel-page .row > *{
    min-width:0;
}

body.campaign-ads-page .toolbar,
body.organic-cadence-page .toolbar,
body.campaign-funnel-page .toolbar{
    display:flex;
    gap:8px;
    justify-content:flex-end;
}

body.campaign-ads-page .ai-status,
body.campaign-funnel-page .ai-status,
.lead-magnet-editor .ai-status,
.ai-status{
    display:none;
    background:#fff7d6;
    border:2px solid #000;
    border-radius:12px;
    padding:10px 14px;
    font-weight:700;
}

body.campaign-ads-page .ai-status.active,
body.campaign-funnel-page .ai-status.active,
.lead-magnet-editor .ai-status.active,
.ai-status.active{
    display:block;
}

body.campaign-ads-page .section-copy,
body.organic-cadence-page .section-copy{
    margin:12px 0 0;
    color:#667085;
    line-height:1.6;
}

body.campaign-ads-page .grid,
body.organic-cadence-page .grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    width:100%;
}

body.campaign-ads-page .campaign-ads-workbench-grid{
    display:flex;
    flex-direction:column;
    gap:24px;
    width:100%;
}

.campaign-ads-builder-card{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.campaign-ads-editor-grid{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(320px, 420px);
    gap:22px;
    align-items:start;
}

.campaign-ads-editor-fields{
    min-width:0;
}

.campaign-ads-selected-preview{
    display:flex;
    flex-direction:column;
    gap:14px;
    min-width:0;
    padding:16px;
    border:2px solid #000;
    border-radius:22px;
    background:#fff;
}

.campaign-ads-selected-preview__media{
    width:100%;
    aspect-ratio:1 / 1;
    min-height:220px;
    border:2px solid #000;
    border-radius:18px;
    overflow:hidden;
    background:#f3f4f6;
}

.campaign-ads-selected-preview__placeholder{
    width:100%;
    height:100%;
    min-height:220px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    color:#475467;
    font-weight:700;
    text-align:center;
}

.campaign-ads-selected-preview__copy{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.campaign-ads-selected-preview__copy strong{
    font-size:18px;
    line-height:1.2;
}

.campaign-ads-selected-preview__copy span{
    color:#475467;
    font-size:13px;
    line-height:1.45;
}

.campaign-ads-image-preview-button{
    display:block;
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.campaign-ads-image-preview-button img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.campaign-ads-image-url-field{
    min-width:0;
}

.campaign-ads-image-options-panel{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
    padding-top:14px;
    border-top:2px solid #000;
}

.campaign-ads-image-options-panel .section-header{
    margin:0;
}

.campaign-ads-image-options-panel .section-title{
    font-size:18px;
}

.campaign-ads-image-options-panel .section-supporting-copy{
    font-size:13px;
    line-height:1.45;
}

.campaign-ads-image-tool-stack{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.campaign-ads-image-tool-section{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px;
    border:1px solid #d0d5dd;
    border-radius:16px;
    background:#f8fafc;
}

.campaign-ads-image-tool-copy{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
}

.campaign-ads-image-tool-copy strong{
    font-size:14px;
    line-height:1.2;
}

.campaign-ads-image-tool-copy span{
    font-size:12px;
    line-height:1.4;
    color:#667085;
}

.campaign-ads-unsplash-row{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:220px;
    flex:0 1 320px;
}

body.campaign-ads-page .campaign-ads-unsplash-row input{
    min-width:0;
    flex:1 1 auto;
}

body.campaign-ads-page .campaign-ads-unsplash-row button{
    flex:0 0 auto;
}

body.campaign-funnel-page .grid{
    display:grid;
    grid-template-columns:minmax(280px, 1fr) minmax(0, 2fr);
    gap:24px;
    align-items:start;
    width:100%;
}

body.campaign-funnel-page .grid > .card{
    width:100%;
    min-width:0;
}

body.campaign-funnel-page .funnel-review-stage-card,
body.campaign-funnel-page .funnel-step-editor-card,
body.campaign-funnel-page .funnel-settings-card,
body.campaign-funnel-page .funnel-strategy-review-card{
    display:flex;
    flex-direction:column;
    gap:18px;
}

body.campaign-funnel-page .funnel-review-stage-card > .section-header{
    position:relative;
    z-index:2;
}

body.campaign-funnel-page .funnel-step-editor-card[hidden]{
    display:none;
}

body.campaign-funnel-page .funnel-strategy-review-card .funnel-strategy-card{
    margin:0;
    padding:0;
    border:0;
    background:transparent;
}

body.campaign-funnel-page .funnel-review-nav,
body.campaign-funnel-page .funnel-review-meta__actions{
    position:relative;
    z-index:3;
    display:flex;
    gap:10px;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
}

body.campaign-funnel-page .funnel-review-stage{
    min-height:620px;
    overflow:hidden;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-md);
    background:rgba(255, 255, 255, 0.94);
    box-shadow:var(--shadow-soft);
}

body.campaign-funnel-page .funnel-email-preview-frame{
    width:100%;
    min-height:620px;
    border:0;
    background:var(--color-white);
}

body.campaign-funnel-page .funnel-review-empty{
    min-height:620px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:32px;
    text-align:center;
}

body.campaign-funnel-page .funnel-review-empty strong{
    font-size:24px;
    line-height:1.2;
}

body.campaign-funnel-page .funnel-review-empty span{
    max-width:42ch;
    color:var(--color-text-secondary);
    line-height:1.55;
}

body.campaign-funnel-page .funnel-review-meta{
    display:flex;
    flex-direction:column;
    gap:16px;
}

body.campaign-funnel-page .funnel-review-meta__top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
}

body.campaign-funnel-page .funnel-review-meta__top strong{
    display:block;
    font-size:24px;
    line-height:1.15;
}

body.campaign-funnel-page .funnel-review-meta__top span{
    color:var(--color-text-secondary);
    line-height:1.5;
}

body.campaign-funnel-page .funnel-review-meta__chips,
body.campaign-funnel-page .funnel-sequence-rail{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

body.campaign-funnel-page .funnel-sequence-chip{
    flex:1 1 180px;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:12px 14px;
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-sm);
    background:var(--color-white);
    color:var(--color-text-primary);
    font-family:alga, serif;
    text-align:left;
    cursor:pointer;
}

body.campaign-funnel-page .funnel-sequence-chip.is-active{
    border-color:var(--surface-accent-dark);
    box-shadow:0 0 0 3px var(--app-nav-active-tint);
}

body.campaign-funnel-page .funnel-sequence-chip strong{
    font-size:15px;
    line-height:1.2;
}

body.campaign-funnel-page .funnel-sequence-chip span{
    color:var(--color-text-secondary);
    font-size:13px;
    line-height:1.35;
}

body.campaign-funnel-page .funnel-review-secondary-grid{
    display:grid;
    grid-template-columns:minmax(280px, 0.9fr) minmax(0, 1.35fr);
    gap:24px;
    align-items:start;
}

body.campaign-funnel-page .funnel-collapsible{
    display:flex;
    flex-direction:column;
    gap:16px;
    min-width:0;
}

body.campaign-funnel-page .funnel-collapsible summary{
    display:flex;
    flex-direction:column;
    gap:6px;
    cursor:pointer;
    list-style:none;
}

body.campaign-funnel-page .funnel-collapsible summary::-webkit-details-marker{
    display:none;
}

body.campaign-funnel-page .funnel-collapsible summary strong{
    font-size:19px;
    line-height:1.2;
}

body.campaign-funnel-page .funnel-settings-body,
body.campaign-funnel-page .funnel-strategy-details{
    padding-top:16px;
    border-top:var(--border-width-control) solid var(--color-border);
}

body.campaign-funnel-page .funnel-settings-body{
    display:flex;
    flex-direction:column;
    gap:16px;
}

body.campaign-funnel-page .funnel-settings-compact-grid{
    display:grid;
    grid-template-columns:minmax(120px, 0.45fr) minmax(0, 1fr);
    gap:10px 14px;
    align-items:center;
}

body.campaign-funnel-page .funnel-settings-compact-grid label{
    margin:0;
}

body.campaign-funnel-page .funnel-cta-snapshot{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

body.campaign-funnel-page .funnel-cta-snapshot > div{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
    padding:14px 16px;
    border:1px solid var(--color-border-light);
    border-radius:var(--radius-sm);
    background:var(--color-white);
}

body.campaign-funnel-page .funnel-cta-snapshot span{
    color:var(--color-text-secondary);
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
}

body.campaign-funnel-page .funnel-cta-snapshot strong{
    font-size:17px;
    line-height:1.25;
    overflow-wrap:anywhere;
}

body.campaign-funnel-page .funnel-cta-snapshot p{
    margin:0;
    color:var(--color-text-secondary);
    line-height:1.45;
}

body.campaign-ads-page .ads,
body.organic-cadence-page .stack{
    display:grid;
    gap:12px;
}

body.campaign-ads-page .ad,
body.organic-cadence-page .item,
body.campaign-funnel-page .step{
    border:4px solid #000;
    border-radius:20px;
    background:#fff;
    padding:16px;
    min-width:0;
}

body.campaign-ads-page .ad{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:12px;
}

body.campaign-ads-page .ad img{
    width:120px;
    height:120px;
    object-fit:cover;
    border-radius:12px;
    background:#f3f4f6;
    border:2px solid #000;
}

body.campaign-ads-page .campaign-ads-image-placeholder{
    width:120px;
    min-height:120px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:12px;
    border-radius:12px;
    background:#f3f4f6;
    border:2px solid #000;
    font-size:13px;
    font-weight:700;
    color:#475467;
}

body.campaign-ads-page .ad-body{
    display:grid;
    gap:10px;
}

body.campaign-ads-page .ad-topline,
body.organic-cadence-page .item-topline{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
}

body.campaign-ads-page .ad-copy,
body.organic-cadence-page .item-copy,
body.organic-cadence-page .helper-copy{
    color:#344054;
    line-height:1.5;
}

body.campaign-ads-page .ad-metrics,
body.organic-cadence-page .meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

body.campaign-ads-page .metric-pill,
body.organic-cadence-page .pill{
    display:inline-flex;
    gap:6px;
    align-items:center;
    padding:8px 10px;
    border-radius:999px;
    border:1px solid #d0d5dd;
    background:#f8fafc;
    font-size:12px;
    color:#101828;
}

body.campaign-ads-page .metric-pill strong,
body.organic-cadence-page .pill strong{
    font-size:11px;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#667085;
}

body.campaign-ads-page .ad-meta-note{
    font-size:12px;
    color:#667085;
}

body.campaign-ads-page .campaign-ads-builder-state{
    display:grid;
    gap:10px;
    margin:6px 0 18px;
    padding:18px 20px;
    border:2px solid #000;
    border-radius:20px;
    background:linear-gradient(180deg, #fff7df 0%, #fff 100%);
}

body.campaign-ads-page .campaign-ads-builder-state__copy{
    display:grid;
    gap:8px;
}

body.campaign-ads-page .campaign-ads-builder-state__copy strong{
    font-size:20px;
    line-height:1.1;
}

body.campaign-ads-page .campaign-ads-builder-state__note,
body.campaign-ads-page .campaign-ads-builder-state__meta{
    margin:0;
    color:#475467;
    line-height:1.55;
}

body.campaign-ads-page .campaign-ads-builder-state__meta{
    font-size:13px;
    font-weight:700;
    color:#101828;
}

body.campaign-ads-page .campaign-ads-search-assets{
    display:grid;
    gap:10px;
    margin-top:8px;
}

body.campaign-ads-page .split-toggle-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

body.campaign-ads-page .split-toggle-row label{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin:0;
    font-size:13px;
    font-weight:700;
}

body.campaign-ads-page .split-toggle-row input[type="checkbox"],
body.campaign-funnel-page .asset-toggle input[type="checkbox"]{
    width:16px;
    height:16px;
    margin:0;
}

body.campaign-ads-page .variants{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
}

.campaign-ads-action-row,
.campaign-ads-results{
    margin-top:8px;
}

.campaign-ads-existing-card{
    margin-top:16px;
}

.campaign-ads-portfolio-toolbar{
    display:grid;
    grid-template-columns:minmax(180px, 240px) minmax(180px, 260px) minmax(240px, 1fr);
    gap:12px;
    align-items:end;
    margin-bottom:18px;
}

.campaign-ads-filter-field{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin:0;
}

body.campaign-ads-page .campaign-ads-filter-field{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin:0;
}

body.campaign-ads-page .campaign-ads-filter-field span{
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#475467;
}

.campaign-ads-filter-field--search{
    min-width:0;
}

.campaign-ads-portfolio-summary{
    display:grid;
    gap:14px;
    margin-bottom:18px;
}

.campaign-ads-summary-strip{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:12px;
}

.campaign-ads-summary-stat{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:14px 16px;
    border:2px solid #000;
    border-radius:16px;
    background:#fff;
}

.campaign-ads-summary-stat strong{
    font-size:24px;
    line-height:1;
}

.campaign-ads-summary-stat span{
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#475467;
}

.campaign-ads-summary-card{
    display:grid;
    gap:14px;
    padding:18px;
    border:2px solid #000;
    border-radius:20px;
    background:linear-gradient(180deg, #fff7df 0%, #fff 100%);
}

details.campaign-ads-summary-card{
    cursor:default;
}

details.campaign-ads-summary-card[open]{
    padding-bottom:18px;
}

.campaign-ads-summary-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
    font-size:13px;
    color:#475467;
    cursor:pointer;
    list-style:none;
}

.campaign-ads-summary-head::-webkit-details-marker{
    display:none;
}

.campaign-ads-summary-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
    gap:12px;
}

.campaign-ads-summary-item{
    display:grid;
    gap:6px;
    padding:14px;
    border:2px solid #000;
    border-radius:16px;
    background:#fff;
}

.campaign-ads-summary-item p{
    margin:0;
    color:#475467;
    line-height:1.5;
    font-size:13px;
}

.campaign-ads-platform-group{
    display:grid;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:24px;
    background:#fff;
}

.campaign-ads-platform-header{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    flex-wrap:wrap;
    cursor:pointer;
    list-style:none;
}

.campaign-ads-platform-header::-webkit-details-marker{
    display:none;
}

.campaign-ads-platform-header h3{
    margin:0;
    font-size:22px;
}

.campaign-ads-platform-header p{
    margin:6px 0 0;
    color:#475467;
    line-height:1.55;
    max-width:72ch;
}

.campaign-ads-platform-badges,
.campaign-ads-card-badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.campaign-ads-platform-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
    gap:16px;
}

.campaign-ads-empty{
    color:var(--color-text-secondary);
}

.campaign-ads-card-actions{
    margin-top:4px;
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

body.campaign-ads-page .thumb{
    border:4px solid #000;
    border-radius:12px;
    padding:6px;
    text-align:center;
    cursor:pointer;
    background:#fff;
}

body.campaign-ads-page .thumb.is-selected{
    background:#FFF7DF;
    box-shadow:0 0 0 4px rgba(237,178,18,.25);
}

body.campaign-ads-page .thumb img{
    width:100%;
    height:120px;
    object-fit:cover;
    border-radius:6px;
}

body.campaign-ads-page .ad.is-selected{
    background:linear-gradient(180deg, rgba(248,220,102,.22) 0%, #fff 100%);
    box-shadow:0 0 0 4px rgba(237,178,18,.2);
}

body.campaign-ads-page .ad{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:14px;
    padding:16px;
    border-width:2px;
}

body.campaign-ads-page .campaign-ads-card-media{
    width:100%;
    min-width:0;
}

body.campaign-ads-page .campaign-ads-card-media .campaign-ads-image-preview-button,
body.campaign-ads-page .campaign-ads-card-media .campaign-ads-image-placeholder{
    width:100%;
    min-height:0;
    height:auto;
    aspect-ratio:1 / 1;
    border-radius:16px;
    background:#f3f4f6;
}

body.campaign-ads-page .campaign-ads-card-media .campaign-ads-image-preview-button{
    border:2px solid #000;
    overflow:hidden;
}

body.campaign-ads-page .campaign-ads-card-media .campaign-ads-image-preview-button img{
    width:100%;
    height:100%;
    min-height:0;
    object-fit:contain;
    border:0;
    border-radius:0;
}

body.campaign-ads-page .campaign-ads-card-media .campaign-ads-image-placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
}

body.campaign-ads-page .ad-topline span{
    display:block;
    margin-bottom:4px;
    color:#667085;
    font-size:12px;
    font-weight:700;
    letter-spacing:.02em;
}

body.campaign-ads-page .ad-topline strong{
    display:block;
    font-size:16px;
    line-height:1.22;
    overflow-wrap:anywhere;
}

.campaign-ads-card-detail{
    display:grid;
    gap:8px;
    padding:10px 12px;
    border:1px solid #d0d5dd;
    border-radius:14px;
    background:#f8fafc;
}

.campaign-ads-card-detail summary{
    cursor:pointer;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#475467;
}

.campaign-ads-card-detail p{
    margin:0;
    color:#344054;
    font-size:13px;
    line-height:1.55;
}

body.campaign-ads-page .campaign-ads-slate-toggle{
    min-height:34px;
    padding:7px 10px;
    border:1px solid #d0d5dd;
    border-radius:999px;
    background:#fff;
    font-size:12px;
    font-weight:700;
}

.campaign-ads-image-modal__content{
    width:min(980px, 100%);
    display:flex;
    flex-direction:column;
    gap:18px;
}

.campaign-ads-image-modal__header{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
}

.campaign-ads-image-modal__header h2{
    margin:0;
    font-size:28px;
    line-height:1.1;
}

.campaign-ads-image-modal__img{
    width:100%;
    max-height:72vh;
    object-fit:contain;
    border:3px solid #000;
    border-radius:20px;
    background:#f3f4f6;
}

body.organic-cadence-page .item-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

body.organic-cadence-page .status-badge{
    display:inline-flex;
    padding:6px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    border:2px solid #000;
}

body.organic-cadence-page .status-badge.active{
    background:#D1FADF;
    color:#065F46;
}

body.organic-cadence-page .status-badge.paused{
    background:#FEE4E2;
    color:#912018;
}

body.organic-cadence-page .page-meta{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

body.organic-cadence-page .hidden{
    display:none;
}

body.organic-cadence-page .organic-workspace{
    display:flex;
    flex-direction:column;
    gap:20px;
}

body.organic-cadence-page .organic-workspace-grid{
    display:grid;
    grid-template-columns:minmax(0, 1.45fr) minmax(320px, 0.95fr);
    gap:20px;
}

body.organic-cadence-page .organic-secondary-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:20px;
}

body.organic-cadence-page .organic-builder-fields{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px 16px;
}

body.organic-cadence-page .organic-builder-fields > label,
body.organic-cadence-page .organic-builder-fields > input,
body.organic-cadence-page .organic-builder-fields > textarea,
body.organic-cadence-page .organic-builder-fields > select{
    min-width:0;
}

body.organic-cadence-page .organic-builder-fields > textarea,
body.organic-cadence-page .organic-builder-fields > input[disabled]{
    grid-column:1 / -1;
}

body.organic-cadence-page .organic-builder-actions,
body.organic-cadence-page .organic-mode-actions{
    margin-top:16px;
    flex-wrap:wrap;
}

body.organic-cadence-page .organic-cadence-form{
    display:flex;
    flex-direction:column;
    gap:12px;
}

body.organic-cadence-page .organic-strategy-summary,
body.organic-cadence-page .organic-platform-summary{
    display:grid;
    gap:16px;
}

body.organic-cadence-page .organic-strategy-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

body.organic-cadence-page .organic-platform-summary{
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    margin-top:16px;
}

body.organic-cadence-page .organic-platform-card__topline{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:8px;
}

body.organic-cadence-page .organic-platform-card p{
    margin:0;
    font-size:13px;
    line-height:1.5;
}

body.organic-cadence-page .organic-calendar-board{
    display:flex;
    flex-direction:column;
    gap:18px;
}

body.organic-cadence-page .organic-platform-group{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:3px solid #000;
    border-radius:24px;
    background:rgba(255,255,255,0.88);
}

body.organic-cadence-page .organic-platform-group__header h3{
    margin:0;
    font-size:22px;
    line-height:1.1;
}

body.organic-cadence-page .organic-platform-group__header p{
    margin:6px 0 0 0;
    font-size:13px;
    line-height:1.45;
    color:#2B2B2B;
}

body.organic-cadence-page .organic-week-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:14px;
}

body.organic-cadence-page .organic-post-stack{
    display:flex;
    flex-direction:column;
    gap:12px;
}

body.organic-cadence-page .organic-post-card.is-selected{
    border-color:#0D0DCC;
    box-shadow:0 0 0 3px rgba(13, 13, 204, 0.12);
}

body.organic-cadence-page .organic-post-card .item-copy{
    white-space:pre-wrap;
}

body.campaign-funnel-page .step .row{
    margin-bottom:10px;
    flex-wrap:wrap;
}

body.campaign-funnel-page .step .row:last-child{
    margin-bottom:0;
}

body.campaign-funnel-page .steps{
    display:grid;
    gap:16px;
    padding:8px 4px;
}

body.campaign-funnel-page .funnel-strategy-card{
    display:grid;
    gap:16px;
    margin:8px 4px 0;
    padding:18px 20px;
    border:2px solid #000;
    border-radius:20px;
    background:linear-gradient(180deg, #fff7df 0%, #fff 100%);
    min-width:0;
}

body.campaign-funnel-page .funnel-strategy-card--empty{
    background:#fff;
}

body.campaign-funnel-page .funnel-strategy-card__header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
}

body.campaign-funnel-page .funnel-strategy-card__title{
    font-size:18px;
    font-weight:700;
    line-height:1.15;
}

body.campaign-funnel-page .funnel-strategy-card__note{
    color:#475467;
    line-height:1.55;
}

body.campaign-funnel-page .funnel-strategy-card__meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

body.campaign-funnel-page .funnel-strategy-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

body.campaign-funnel-page .funnel-strategy-item{
    display:grid;
    gap:6px;
    padding:14px 16px;
    border:1px solid #d0d5dd;
    border-radius:16px;
    background:rgba(255,255,255,.92);
    min-width:0;
}

body.campaign-funnel-page .funnel-strategy-item strong,
body.campaign-funnel-page .funnel-strategy-list strong{
    font-size:12px;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#667085;
}

body.campaign-funnel-page .funnel-strategy-item p{
    margin:0;
    color:#101828;
    line-height:1.55;
    overflow-wrap:anywhere;
}

body.campaign-funnel-page .funnel-strategy-list{
    display:grid;
    gap:10px;
}

body.campaign-funnel-page .funnel-strategy-chip-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

body.campaign-funnel-page .funnel-strategy-supporting-assets{
    display:grid;
    gap:10px;
}

body.campaign-funnel-page .funnel-strategy-supporting-asset{
    display:grid;
    gap:4px;
    padding:14px 16px;
    border:1px solid #d0d5dd;
    border-radius:16px;
    background:#fff;
    min-width:0;
}

body.campaign-funnel-page .funnel-strategy-supporting-asset__title{
    font-weight:700;
    color:#101828;
}

body.campaign-funnel-page .funnel-strategy-supporting-asset__meta,
body.campaign-funnel-page .funnel-strategy-supporting-asset__reason,
body.campaign-funnel-page .funnel-strategy-empty{
    color:#475467;
    line-height:1.5;
    overflow-wrap:anywhere;
}

body.campaign-funnel-page .left-card .toolbar{
    justify-content:space-between;
}

body.campaign-funnel-page .left-card .toolbar .btn{
    padding:10px 16px;
}

body.campaign-funnel-page .left-card .panel-toolbar .action-group{
    justify-content:flex-end;
}

body.campaign-funnel-page .left-card input{
    font-size:16px;
}

body.campaign-funnel-page .step .row:first-child select,
body.campaign-funnel-page .step .row:first-child input{
    width:auto;
}

body.campaign-funnel-page .step .row:first-child select{
    min-width:110px;
}

body.campaign-funnel-page .step .row:first-child input[type=number]{
    width:100px;
}

body.campaign-funnel-page .funnel-step-heading{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
    margin-bottom:14px;
}

body.campaign-funnel-page .funnel-step-heading__copy{
    display:grid;
    gap:4px;
    min-width:0;
}

body.campaign-funnel-page .funnel-step-heading__copy strong{
    font-size:18px;
    line-height:1.1;
}

body.campaign-funnel-page .funnel-step-heading__copy span{
    color:#475467;
    line-height:1.4;
    overflow-wrap:anywhere;
}

body.campaign-funnel-page .funnel-step-ai-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    min-width:0;
}

body.campaign-funnel-page .funnel-step-meta-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
    margin-bottom:12px;
}

body.campaign-funnel-page .funnel-step-field{
    display:grid;
    gap:6px;
    margin:0;
    min-width:0;
}

body.campaign-funnel-page .funnel-step-field span{
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#667085;
}

body.campaign-funnel-page .funnel-step-field--full{
    width:100%;
}

body.campaign-funnel-page .funnel-step-timing-row{
    align-items:flex-end;
    flex-wrap:wrap;
}

body.campaign-funnel-page .funnel-step-regeneration{
    display:grid;
    gap:8px;
    margin-top:12px;
}

body.campaign-funnel-page .funnel-step-instructions{
    min-height:92px;
}

body.campaign-funnel-page .asset-note{
    font-size:12px;
    color:#667085;
    line-height:1.5;
    overflow-wrap:anywhere;
}

body.campaign-funnel-page .asset-toggle{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    font-weight:700;
}

.campaign-funnel-add-step{
    margin-top:0;
}

.funnel-step-wait-input{
    width:120px;
}

.funnel-step-assets{
    margin-top:8px;
    display:grid;
    gap:8px;
}

.funnel-step-assets-header{
    justify-content:space-between;
}

.funnel-add-asset{
    padding:10px 14px;
}

.funnel-assets-empty{
    font-size:13px;
    color:#667085;
}

.funnel-asset-card{
    border-top:1px solid #ddd;
    padding-top:10px;
    display:grid;
    gap:10px;
    min-width:0;
}

.funnel-asset-source{
    font-size:12px;
    color:#475467;
    line-height:1.5;
    overflow-wrap:anywhere;
}

.funnel-asset-controls{
    align-items:flex-start;
    flex-wrap:wrap;
}

.funnel-asset-remove{
    padding:10px 12px;
}

.funnel-asset-footer{
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
}

body.experiments-hub-page .exp-hub-page{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:24px;
    padding:0 7vw 48px;
}

body.experiments-hub-page .exp-hub-layout{
    display:grid;
    grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
    gap:24px;
    align-items:start;
}

body.experiments-hub-page .exp-hub-card{
    border:4px solid #000;
    border-radius:28px;
    background:#fff;
    box-shadow:0 8px 18px rgba(0,0,0,.08);
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:18px;
}

body.experiments-hub-page .exp-hub-card--optimization{
    gap:20px;
}

body.experiments-hub-page .exp-hub-card--nested{
    border-width:3px;
    border-radius:24px;
    box-shadow:none;
    padding:20px;
    background:#fcfcfc;
}

body.experiments-hub-page .exp-hub-card h2,
body.experiments-hub-page .exp-hub-card h3,
body.experiments-hub-page .exp-hub-card h4,
body.experiments-hub-page .exp-hub-card p{
    margin:0;
}

body.experiments-hub-page .exp-hub-hero{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:16px;
    align-items:end;
}

body.experiments-hub-page .exp-hub-hero__copy{
    display:flex;
    flex-direction:column;
    gap:10px;
}

body.experiments-hub-page .exp-hub-hero__eyebrow{
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#B50600;
}

body.experiments-hub-page .exp-hub-hero__title{
    font-size:clamp(28px, 3vw, 42px);
    line-height:1.02;
}

body.experiments-hub-page .exp-hub-hero__summary,
body.experiments-hub-page .exp-hub-actions,
body.experiments-hub-page .exp-hub-filter-row,
body.experiments-hub-page .exp-hub-chip-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

body.experiments-hub-page .exp-hub-pill,
body.experiments-hub-page .exp-hub-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:10px 14px;
    border:2px solid #000;
    border-radius:999px;
    background:#fff7df;
    font-size:13px;
    font-weight:700;
}

body.experiments-hub-page .exp-hub-badge{
    padding:6px 10px;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    background:#fff;
}

body.experiments-hub-page .exp-hub-badge.is-control{
    background:linear-gradient(180deg, #F8DC66 0%, #EDB212 100%);
}

body.experiments-hub-page .exp-hub-form,
body.experiments-hub-page .exp-hub-detail-controls,
body.experiments-hub-page .exp-hub-list,
body.experiments-hub-page .exp-hub-detail-shell,
body.experiments-hub-page .exp-hub-variant-list{
    display:grid;
    gap:14px;
}

body.experiments-hub-page .exp-hub-form label{
    display:block;
    margin-bottom:6px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
}

body.experiments-hub-page .exp-hub-form input,
body.experiments-hub-page .exp-hub-form select,
body.experiments-hub-page .exp-hub-detail-controls input,
body.experiments-hub-page .exp-hub-detail-controls select{
    width:100%;
    border:2px solid #000;
    border-radius:14px;
    padding:12px 14px;
    font:inherit;
    background:#fff;
}

body.experiments-hub-page .exp-hub-btn{
    appearance:none;
    border:none;
    border-radius:14px;
    padding:12px 18px;
    font:inherit;
    font-weight:700;
    cursor:pointer;
}

body.experiments-hub-page .exp-hub-btn:disabled{
    opacity:.5;
    cursor:not-allowed;
}

body.experiments-hub-page .exp-hub-btn--primary{
    background:linear-gradient(180deg, #53CE26 0%, #008805 100%);
    color:#fff;
}

body.experiments-hub-page .exp-hub-btn--secondary{
    background:#101828;
    color:#fff;
}

body.experiments-hub-page .exp-hub-btn--ghost{
    background:#F4F4F5;
    color:#101828;
}

body.experiments-hub-page .exp-hub-toolbar{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:end;
    gap:12px;
}

body.experiments-hub-page .exp-hub-filter{
    min-width:180px;
}

body.experiments-hub-page .exp-hub-experiment-card,
body.experiments-hub-page .exp-hub-variant-card{
    border:3px solid #000;
    border-radius:22px;
    padding:18px;
    background:#fff;
    display:grid;
    gap:12px;
    cursor:pointer;
}

body.experiments-hub-page .exp-hub-experiment-card{
    background:linear-gradient(180deg, #fff 0%, rgba(227,63,42,.08) 100%);
}

body.experiments-hub-page .exp-hub-experiment-card.is-active{
    outline:4px solid rgba(181,6,0,.22);
}

body.experiments-hub-page .exp-hub-experiment-card__top,
body.experiments-hub-page .exp-hub-variant-top{
    display:flex;
    justify-content:space-between;
    align-items:start;
    gap:12px;
}

body.experiments-hub-page .exp-hub-experiment-card__meta{
    font-size:13px;
    color:#2B2B2B;
}

body.experiments-hub-page .exp-hub-experiment-card__subject{
    font-size:14px;
    font-weight:700;
    color:#101828;
}

body.experiments-hub-page .exp-hub-experiment-card__stats{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}

body.experiments-hub-page .exp-hub-stat{
    border:2px solid #000;
    border-radius:14px;
    padding:10px 12px;
    background:#fff;
}

body.experiments-hub-page .exp-hub-stat__label{
    display:block;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:4px;
}

body.experiments-hub-page .exp-hub-stat strong{
    font-size:18px;
}

body.experiments-hub-page .exp-hub-stat__subnote{
    margin:6px 0 0;
    font-size:12px;
    color:#52525B;
}

body.experiments-hub-page .exp-hub-empty,
body.experiments-hub-page .exp-hub-placeholder-metrics{
    border:3px dashed #000;
    border-radius:24px;
    padding:24px;
    background:#fff;
    color:#3F3F46;
}

body.experiments-hub-page .exp-hub-empty__copy{
    margin-top:10px;
}

body.experiments-hub-page .exp-hub-banner,
body.experiments-hub-page .exp-hub-status{
    border-radius:18px;
    padding:14px 16px;
    border:2px solid #000;
    background:#fff;
}

body.experiments-hub-page .exp-hub-banner{
    background:#FFF7DF;
    color:#5A4300;
}

body.experiments-hub-page .exp-hub-banner--verdict{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

body.experiments-hub-page .exp-hub-banner--verdict.is-winner{
    background:#ECFDF3;
    color:#166534;
}

body.experiments-hub-page .exp-hub-banner--verdict.is-flat{
    background:#EFF6FF;
    color:#1D4ED8;
}

body.experiments-hub-page .exp-hub-banner--verdict.is-reset{
    background:#FEF2F2;
    color:#B91C1C;
}

body.experiments-hub-page .exp-hub-variant-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

body.experiments-hub-page .exp-hub-bundle-grid,
body.experiments-hub-page .exp-hub-policy-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

body.experiments-hub-page .exp-hub-bundle-card,
body.experiments-hub-page .exp-hub-policy-card,
body.experiments-hub-page .exp-hub-note-card{
    border:2px solid #000;
    border-radius:20px;
    background:#fff;
    padding:16px;
    display:grid;
    gap:12px;
}

body.experiments-hub-page .exp-hub-bundle-card.is-champion{
    background:linear-gradient(180deg, #fff 0%, rgba(83,206,38,.12) 100%);
}

body.experiments-hub-page .exp-hub-bundle-card__top,
body.experiments-hub-page .exp-hub-policy-card__top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

body.experiments-hub-page .exp-hub-metric-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
}

body.experiments-hub-page .exp-hub-bundle-card__copy{
    display:grid;
    gap:6px;
    font-size:14px;
    color:#27272A;
}

body.experiments-hub-page .exp-hub-bundle-card__copy p,
body.experiments-hub-page .exp-hub-note-card p{
    margin:0;
}

body.experiments-hub-page .exp-hub-preview-grid,
body.experiments-hub-page .exp-hub-prompt-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

body.experiments-hub-page .exp-hub-ad-list{
    display:grid;
    gap:10px;
}

body.experiments-hub-page .exp-hub-ad-card{
    border:2px solid #000;
    border-radius:16px;
    background:#fff;
    padding:12px 14px;
    display:grid;
    gap:10px;
}

body.experiments-hub-page .exp-hub-ad-card.is-top-ad{
    background:linear-gradient(180deg, #fff 0%, rgba(83,206,38,.12) 100%);
}

body.experiments-hub-page .exp-hub-ad-card__top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

body.experiments-hub-page .exp-hub-ad-card__metrics{
    display:flex;
    flex-wrap:wrap;
    gap:8px 12px;
    font-size:13px;
    color:#27272A;
}

body.experiments-hub-page .exp-hub-asset-card{
    border:2px solid #000;
    border-radius:20px;
    background:#fff;
    padding:16px;
    display:grid;
    gap:12px;
}

body.experiments-hub-page .exp-hub-asset-card__top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}

body.experiments-hub-page .exp-hub-asset-card__body{
    display:grid;
    gap:6px;
    font-size:14px;
    color:#27272A;
}

body.experiments-hub-page .exp-hub-asset-card__body p{
    margin:0;
}

body.experiments-hub-page .exp-hub-prompt-list{
    display:grid;
    gap:12px;
}

body.experiments-hub-page .exp-hub-prompt-details{
    border:2px solid #000;
    border-radius:18px;
    background:#fff;
    padding:14px 16px;
}

body.experiments-hub-page .exp-hub-prompt-summary{
    cursor:pointer;
    font-weight:700;
    list-style:none;
}

body.experiments-hub-page .exp-hub-prompt-summary::-webkit-details-marker{
    display:none;
}

body.experiments-hub-page .exp-hub-prompt-details[open]{
    background:#F8FAFC;
}

body.experiments-hub-page .exp-hub-prompt-details[open] .exp-hub-prompt-summary{
    margin-bottom:14px;
}

body.experiments-hub-page .exp-hub-code-block{
    margin:0;
    padding:12px;
    border-radius:14px;
    border:2px solid #000;
    background:#101828;
    color:#F8FAFC;
    font:12px/1.55 "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    overflow:auto;
    white-space:pre-wrap;
    word-break:break-word;
}

body.experiments-hub-page .exp-hub-optimization-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:end;
    gap:12px;
}

body.experiments-hub-page .exp-hub-step-row{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}

body.experiments-hub-page .exp-hub-step-card{
    border:2px solid rgba(0, 0, 0, 0.12);
    border-radius:18px;
    padding:14px 16px;
    background:#fff;
    display:grid;
    gap:6px;
}

body.experiments-hub-page .exp-hub-step-card strong{
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

body.experiments-hub-page .exp-hub-step-card p{
    margin:0;
    font-size:14px;
    color:#3F3F46;
}

body.experiments-hub-page .exp-hub-step-card.is-active{
    border-color:#000;
    background:#FFF7DF;
}

body.experiments-hub-page .exp-hub-step-card.is-complete{
    border-color:#166534;
    background:#ECFDF3;
}

body.experiments-hub-page .exp-hub-step-card.is-pending{
    opacity:.8;
}

body.experiments-hub-page .exp-hub-action-note{
    margin:0;
    font-size:14px;
    color:#27272A;
}

body.experiments-hub-page .exp-hub-variant-preview{
    border:2px solid #000;
    border-radius:18px;
    padding:14px;
    background:#F8FAFC;
    display:grid;
    gap:10px;
}

body.experiments-hub-page .exp-hub-variant-preview img{
    width:100%;
    max-height:180px;
    object-fit:cover;
    border-radius:12px;
    border:2px solid #000;
    background:#fff;
}

body.experiments-hub-page .exp-hub-variant-preview__copy,
body.experiments-hub-page .exp-hub-inline-note{
    font-size:14px;
    color:#27272A;
    line-height:1.5;
}

body.experiments-hub-page .exp-hub-variant-placeholder{
    padding:12px;
    border-radius:14px;
    border:2px dashed #000;
    background:#fff;
    font-size:13px;
    color:#3F3F46;
}

body.experiments-hub-page .exp-hub-status{
    display:none;
}

body.experiments-hub-page .exp-hub-status.is-visible{
    display:block;
}

body.experiments-hub-page .exp-hub-status.is-info{
    background:#EFF6FF;
    color:#1D4ED8;
}

body.experiments-hub-page .exp-hub-status.is-success{
    background:#ECFDF3;
    color:#166534;
}

body.experiments-hub-page .exp-hub-status.is-error{
    background:#FEF2F2;
    color:#B91C1C;
}

.email-auth-shell,
.domain-setup-shell{
    width:min(100%, 960px);
    display:flex;
    flex-direction:column;
    gap:24px;
}

.setup-field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.setup-action-row{
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
    margin-top:12px;
}

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

.status-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:12px;
    margin:16px 0;
}

.status-card{
    padding:14px 16px;
    border:2px solid rgba(0,0,0,0.12);
    border-radius:18px;
    background:#fff;
}

.status-card strong{
    display:block;
    margin-bottom:8px;
}

.dns-table{
    width:100%;
    border-collapse:collapse;
    margin-top:12px;
}

.dns-table th,
.dns-table td{
    border:1px solid #e5e7eb;
    padding:8px;
    font-size:14px;
}

.dns-note,
.status-copy{
    margin-top:12px;
    color:#4b5563;
    font-size:14px;
    line-height:1.5;
}

.record-card{
    margin-top:16px;
    padding:14px 16px;
    border:2px solid rgba(0,0,0,0.12);
    border-radius:18px;
    background:#fff;
}

.record-card-title{
    font-size:12px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#4b5563;
}

.record-grid{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}

.record-grid code{
    display:block;
    overflow-wrap:anywhere;
}

.record-grid--spaced{
    margin-top:12px;
}

.setup-inline-note{
    margin-top:14px;
    color:#4b5563;
    font-size:13px;
}

.setup-error{
    margin-top:16px;
    color:#b00020;
}

.domain-setup-status{
    display:none;
}

.domain-dns-guide{
    margin-top:0;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.domain-dns-guide__header{
    margin-bottom:0;
}

.domain-dns-safety-note{
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:12px 14px;
    border:2px solid rgba(0,0,0,0.14);
    border-radius:16px;
    background:var(--color-warning-light);
    color:var(--color-text-primary);
    font-size:14px;
    line-height:1.45;
}

.domain-dns-safety-note strong{
    flex:0 0 auto;
}

.domain-dns-provider-picker{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.domain-dns-provider-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.domain-dns-provider-tab{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:38px;
    padding:8px 12px;
    border:2px solid #000;
    border-radius:999px;
    background:#fff;
    color:#000;
    font-size:13px;
    font-weight:700;
    line-height:1.1;
    cursor:pointer;
    box-shadow:0 2px 0 rgba(0,0,0,0.08);
}

.domain-dns-provider-tab::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:999px;
    background:var(--surface-accent);
    box-shadow:0 0 0 1px rgba(0,0,0,0.16);
}

.domain-dns-provider-tab[data-provider-tab="wix"]::before{ background:#116DFF; }
.domain-dns-provider-tab[data-provider-tab="squarespace"]::before{ background:#000; }
.domain-dns-provider-tab[data-provider-tab="godaddy"]::before{ background:#00A4A6; }
.domain-dns-provider-tab[data-provider-tab="cloudflare"]::before{ background:#F38020; }
.domain-dns-provider-tab[data-provider-tab="namecheap"]::before{ background:#DE3723; }
.domain-dns-provider-tab[data-provider-tab="shopify"]::before{ background:#95BF47; }
.domain-dns-provider-tab[data-provider-tab="wordpress"]::before{ background:#21759B; }

.domain-dns-provider-tab.is-active{
    background:#000;
    color:#fff;
}

.domain-dns-provider-tab.is-active::before{
    box-shadow:0 0 0 2px #fff;
}

.domain-dns-guide-grid{
    display:grid;
    grid-template-columns:minmax(0, 1.08fr) minmax(300px, .92fr);
    gap:18px;
    align-items:start;
}

.domain-dns-provider-panel,
.domain-dns-record-panel{
    border:2px solid rgba(0,0,0,0.14);
    border-radius:16px;
    background:#fff;
}

.domain-dns-provider-panel{
    padding:16px;
}

.domain-dns-provider-panel__heading{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin-bottom:14px;
}

.domain-dns-steps{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:12px;
}

.domain-dns-step{
    display:grid;
    grid-template-columns:30px minmax(0, 1fr);
    gap:10px;
    align-items:start;
}

.domain-dns-step__number{
    display:inline-flex;
    width:30px;
    height:30px;
    align-items:center;
    justify-content:center;
    border:2px solid #000;
    border-radius:999px;
    background:var(--color-primary-yellow);
    font-size:13px;
    font-weight:800;
    line-height:1;
}

.domain-dns-step__body{
    display:grid;
    gap:3px;
    min-width:0;
}

.domain-dns-step__body strong{
    font-size:15px;
}

.domain-dns-step__body span{
    color:#4b5563;
    font-size:14px;
    line-height:1.45;
}

.domain-dns-source-link{
    align-self:flex-start;
    margin-top:14px;
}

.domain-dns-record-panel{
    padding:16px;
    border-color:#000;
    border-width:3px;
    box-shadow:0 5px 0 rgba(0,0,0,0.08);
}

.domain-dns-record-panel__header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    margin-bottom:10px;
}

.domain-dns-record-list{
    display:grid;
    gap:0;
}

.domain-dns-record-row{
    display:grid;
    grid-template-columns:minmax(104px, .58fr) minmax(0, 1fr) auto;
    gap:10px;
    align-items:center;
    padding:10px 0;
    border-top:1px solid rgba(0,0,0,0.12);
}

.domain-dns-record-row--primary{
    margin:var(--space-8) 0;
    padding:var(--space-12);
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-xs);
    background:var(--color-warning-light);
}

.domain-dns-record-row:first-child{
    border-top:0;
}

.domain-dns-record-label{
    color:#4b5563;
    font-size:12px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.domain-dns-record-row code{
    display:block;
    min-width:0;
    padding:8px 10px;
    border:1px solid rgba(0,0,0,0.12);
    border-radius:10px;
    background:#f8f6f1;
    overflow-wrap:anywhere;
    font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size:13px;
}

.domain-dns-record-hint{
    grid-column:2 / -1;
    color:#5f5f67;
    font-size:12px;
    line-height:1.35;
}

.domain-dns-record-callout{
    grid-column:1 / -1;
    color:var(--color-text-primary);
    font-size:var(--type-12);
    font-weight:700;
    line-height:1.35;
}

.domain-dns-record-type{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:var(--space-4) var(--space-8);
    border:var(--border-width-control) solid var(--color-border);
    border-radius:var(--radius-pill);
    background:var(--color-white);
    color:var(--color-text-primary);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    line-height:1;
}

.domain-dns-record-spacer{
    min-width:0;
}

.email-dns-record-stack{
    display:grid;
    gap:12px;
}

.email-dns-record-card{
    padding:12px;
    border:1px solid rgba(0,0,0,0.12);
    border-radius:14px;
    background:#fff;
}

.email-dns-record-card__header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    margin-bottom:8px;
}

.email-dns-record-card__title{
    margin:2px 0 0;
    font-size:15px;
    line-height:1.25;
}

.domain-dns-followup-step{
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    gap:12px;
    align-items:start;
    margin-top:14px;
    padding:14px;
    border:2px solid rgba(0,0,0,0.14);
    border-radius:14px;
    background:var(--color-warning-light);
}

.domain-dns-followup-step__marker{
    display:inline-flex;
    align-items:center;
    min-height:26px;
    padding:4px 9px;
    border:2px solid #000;
    border-radius:999px;
    background:#fff;
    color:#000;
    font-size:11px;
    font-weight:800;
    letter-spacing:.06em;
    line-height:1;
    text-transform:uppercase;
}

.domain-dns-followup-step__body{
    display:grid;
    gap:4px;
    min-width:0;
}

.domain-dns-followup-step__body strong{
    font-size:14px;
}

.domain-dns-followup-step__body span{
    color:#4b5563;
    font-size:13px;
    line-height:1.45;
}

.domain-dns-copy{
    min-height:34px;
    padding:7px 10px;
    border-radius:10px;
    font-size:12px;
}

.domain-dns-copy.is-copied{
    background:var(--color-success-light);
    color:var(--color-success-dark);
}

@media (max-width: 900px){
    .domain-dns-guide-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .asset-url-action-row{
        grid-template-columns:1fr;
    }

    .domain-dns-safety-note{
        flex-direction:column;
        gap:4px;
    }

    .domain-dns-provider-tabs{
        align-items:stretch;
    }

    .domain-dns-provider-tab{
        flex:1 1 calc(50% - 8px);
        justify-content:center;
        text-align:center;
    }

    .domain-dns-record-panel__header{
        flex-direction:column;
    }

    .email-dns-record-card__header{
        flex-direction:column;
    }

    .domain-dns-record-row{
        grid-template-columns:minmax(0, 1fr) auto;
    }

    .domain-dns-record-label{
        grid-column:1 / -1;
    }

    .domain-dns-record-hint{
        grid-column:1 / -1;
    }

    .domain-dns-followup-step{
        grid-template-columns:1fr;
    }
}

main.lead-magnet-editor{
    width:100%;
    max-width:none;
    margin:0 auto;
    padding:0 clamp(20px, 4vw, 56px) 48px;
    display:flex;
    flex-direction:column;
    gap:24px;
}

.lead-magnet-editor-stack{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:32px;
}

.lead-magnet-editor-panel{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.lead-magnet-editor-back-link{
    align-self:flex-start;
    margin:-12px 0 8px;
}

.lead-magnet-editor-workspace-card,
.lead-magnet-editor-preview-card,
.lead-magnet-editor-landing-pages-card{
    width:100%;
    padding:28px;
    display:flex;
    flex-direction:column;
    gap:24px;
}

.lead-magnet-editor-workspace-grid{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0, 1.2fr) minmax(360px, 0.9fr);
    gap:32px;
    align-items:start;
}

.lead-magnet-editor-workspace-copy,
.lead-magnet-editor-workspace-preview-column{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:24px;
}

.lead-magnet-editor-workspace-preview-column{
    align-self:stretch;
}

.lead-magnet-editor-section{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding-top:24px;
    border-top:1px solid var(--color-border-light);
}

.lead-magnet-editor-summary-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.lead-magnet-editor-summary-stack{
    display:grid;
    gap:12px;
}

.lead-magnet-editor-summary-item{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    padding:16px 18px;
    border:2px solid var(--color-border-light);
    border-radius:18px;
    background:var(--color-white);
}

.lead-magnet-editor-summary-item--wide{
    grid-column:1 / -1;
}

.lead-magnet-editor-summary-label{
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--color-text-secondary);
}

.lead-magnet-editor-summary-value{
    width:100%;
    margin:0;
    font-size:15px;
    line-height:1.65;
    color:var(--color-text-primary);
    overflow-wrap:anywhere;
}

.lead-magnet-editor-summary-value--title{
    font-size:26px;
    line-height:1.15;
    font-weight:700;
}

.lead-magnet-editor-subhead{
    margin:0;
}

.lead-magnet-editor-subcopy{
    margin:0;
}

.lead-magnet-editor-muted{
    color:var(--color-text-secondary);
}

.lead-magnet-editor-heading-row,
.lead-magnet-editor-card-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    width:100%;
    gap:16px;
    flex-wrap:wrap;
}

.lead-magnet-editor-button-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.lead-magnet-editor-preview{
    width:100%;
    min-height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:16px;
    border:2px solid var(--color-border-light);
    border-radius:20px;
    background:linear-gradient(180deg, #FFFFFF 0%, #F8F4EF 100%);
    overflow:hidden;
}

.lead-magnet-editor-preview--main{
    min-height:760px;
    padding:20px;
}

.lead-magnet-editor-preview--mini{
    min-height:420px;
    padding:14px;
}

.lead-magnet-editor .lead-magnet-preview-frame{
    display:block;
    width:100%;
    border:0;
    background:#fff;
    border-radius:18px;
    box-shadow:var(--shadow-card);
}

.lead-magnet-editor .lead-magnet-preview-frame--main{
    min-height:760px;
}

.lead-magnet-editor .lead-magnet-preview-frame--mini{
    min-height:420px;
}

.lead-magnet-editor-preview-state,
.lead-magnet-editor-preview-code,
.lead-magnet-editor-preview-text{
    width:100%;
    height:100%;
    min-height:240px;
    margin:0;
    padding:20px;
    border-radius:16px;
    background:#fff;
    font-size:14px;
    line-height:1.7;
    overflow:auto;
}

.lead-magnet-editor-preview-state{
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--color-text-secondary);
}

.lead-magnet-editor-preview-state--muted{
    color:var(--color-text-secondary);
}

.lead-magnet-editor-preview-state--warning{
    color:var(--color-warning-dark);
    background:var(--color-warning-light);
}

.lead-magnet-editor-preview-code,
.lead-magnet-editor-preview-text{
    white-space:pre-wrap;
    color:var(--color-text-primary);
}

.lead-magnet-editor-global-status{
    margin-top:-8px;
}

.lead-magnet-editor-empty-cell{
    text-align:center;
    padding:40px;
    color:var(--color-text-secondary);
}

.lead-magnet-copy-preview{
    width:min(100%, 960px);
}

.lead-magnet-copy-preview__content{
    white-space:pre-wrap;
    line-height:1.6;
}

.lead-magnet-editor-persona-list{
    display:grid;
    gap:12px;
}

.lead-magnet-editor #target-personas-display .persona-tag{
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:flex-start;
    gap:12px;
    margin:0;
    padding:12px 14px;
    border:2px solid var(--color-border-light);
    border-radius:18px;
    background:var(--color-background-secondary);
}

.lead-magnet-editor #target-personas-display .persona-tag img{
    width:40px;
    height:40px;
    border-radius:50%;
    object-fit:cover;
}

.lead-magnet-editor-persona-name{
    font-weight:700;
    line-height:1.25;
}

.lead-magnet-editor-persona-description{
    margin-top:4px;
    font-size:13px;
    line-height:1.5;
    color:var(--color-text-secondary);
}

.lead-magnet-editor-modal-shell{
    width:min(1080px, 100%);
}

.lead-magnet-editor-modal-shell .panel-toolbar{
    margin-bottom:24px;
}

.lead-magnet-editor-modal-shell h3{
    margin:0;
}

.lead-magnet-editor-modal-shell #edit-page-content{
    min-height:360px;
    line-height:1.65;
}

.campaign-customers-empty-state{
    display:block;
    padding:32px;
    text-align:center;
}

.campaign-customers-empty-title{
    margin-bottom:12px;
}

.campaign-customers-empty-copy{
    margin-bottom:20px;
}

.lead-magnet-editor-persona-empty{
    color:var(--color-text-secondary);
}

.lead-magnet-editor .ai-step{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:8px;
}

.lead-magnet-editor .ai-step .step-number{
    background:var(--color-primary-blue);
    color:#000;
    width:24px;
    height:24px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:12px;
}

.lead-magnet-editor .ai-step.completed .step-number{
    background:#28a745;
    color:#fff;
}

.lead-magnet-editor .ai-step.active .step-number{
    background:var(--color-accent-orange);
    color:#fff;
}

.lead-magnet-editor .table-container{
    overflow-x:auto;
}

@media (max-width: 1180px){
    .lead-magnet-editor-workspace-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 900px){
    main.lead-magnet-editor{
        padding:0 20px 36px;
    }

    .lead-magnet-editor-preview-card,
    .lead-magnet-editor-workspace-card,
    .lead-magnet-editor-landing-pages-card{
        padding:22px;
    }

    .lead-magnet-editor-summary-grid{
        grid-template-columns:1fr;
    }

    .lead-magnet-editor-summary-item--wide{
        grid-column:auto;
    }

    .lead-magnet-editor-preview--main{
        min-height:560px;
        padding:14px;
    }

    .lead-magnet-editor .lead-magnet-preview-frame--main{
        min-height:560px;
    }

    .lead-magnet-editor-preview--mini{
        min-height:320px;
    }
}

@media (max-width: 1080px){
    body.experiments-hub-page .exp-hub-layout{
        grid-template-columns:1fr;
    }

    body.experiments-hub-page .exp-hub-hero{
        grid-template-columns:1fr;
    }
}

@media (max-width: 960px){
    .login-grid,
    .setup-form-grid,
    .style-test-layout,
    .style-test-component-grid,
    .style-test-shell-grid,
    .style-test-dashboard-preview,
    body.campaign-ads-page .campaign-ads-workbench-grid,
    .campaign-ads-editor-grid,
    .campaign-ads-portfolio-toolbar,
    body.campaign-ads-page .grid,
    body.organic-cadence-page .grid,
    body.campaign-funnel-page .grid,
    body.campaign-funnel-page .funnel-review-secondary-grid{
        grid-template-columns:1fr;
    }

    .style-test-layout{
        flex-direction:column;
    }

    .style-test-main,
    .style-test-sidebar{
        flex:1 1 auto;
        width:100%;
    }

    .style-test-stat-grid{
        grid-template-columns:1fr;
    }

    .style-test-theme-grid,
    .style-test-form-grid{
        grid-template-columns:1fr;
    }

    body.campaign-funnel-page .funnel-strategy-grid,
    body.campaign-funnel-page .funnel-cta-snapshot,
    body.campaign-funnel-page .funnel-step-meta-grid{
        grid-template-columns:1fr;
    }

    .campaign-ads-summary-strip,
    .campaign-ads-platform-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    body.campaign-ads-page .ad,
    .workspace-ad-card--visual{
        grid-template-columns:1fr;
    }

    body.organic-cadence-page .organic-workspace-grid,
    body.organic-cadence-page .organic-secondary-grid,
    body.organic-cadence-page .organic-strategy-grid,
    body.organic-cadence-page .organic-builder-fields{
        grid-template-columns:1fr;
    }

    body.organic-cadence-page .organic-builder-fields > textarea,
    body.organic-cadence-page .organic-builder-fields > input[disabled]{
        grid-column:auto;
    }
}

@media (max-width: 720px){
    body.experiments-hub-page .exp-hub-page{
        padding:0 20px 36px;
    }

    body.experiments-hub-page .exp-hub-variant-grid,
    body.experiments-hub-page .exp-hub-experiment-card__stats,
    body.experiments-hub-page .exp-hub-bundle-grid,
    body.experiments-hub-page .exp-hub-policy-grid,
    body.experiments-hub-page .exp-hub-metric-grid,
    body.experiments-hub-page .exp-hub-step-row,
    body.experiments-hub-page .exp-hub-preview-grid,
    body.experiments-hub-page .exp-hub-prompt-grid{
        grid-template-columns:1fr;
    }

    body.experiments-hub-page .exp-hub-toolbar,
    body.experiments-hub-page .exp-hub-filter-row,
    body.experiments-hub-page .exp-hub-optimization-actions,
    body.experiments-hub-page .exp-hub-bundle-card__top,
    body.experiments-hub-page .exp-hub-policy-card__top{
        flex-direction:column;
        align-items:stretch;
    }

    body.experiments-hub-page .exp-hub-filter{
        min-width:0;
    }

    body.campaign-ads-page .variants{
        grid-template-columns:1fr;
    }

    .campaign-ads-summary-strip,
    .campaign-ads-platform-grid,
    .workspace-ad-grid{
        grid-template-columns:1fr;
    }

    .campaign-ads-image-modal__header,
    .workspace-image-preview-modal__header,
    .campaign-ads-card-actions,
    .workspace-ad-actions,
    .campaign-ads-image-tool-section{
        flex-direction:column;
        align-items:stretch;
    }

    .campaign-ads-unsplash-row{
        min-width:0;
        flex-basis:auto;
    }

    body.campaign-funnel-page .page{
        padding:0 20px 36px;
    }

    body.campaign-funnel-page .funnel-step-heading,
    body.campaign-funnel-page .funnel-step-ai-actions,
    body.campaign-funnel-page .funnel-step-assets-header,
    body.campaign-funnel-page .funnel-review-meta__top,
    body.campaign-funnel-page .funnel-review-nav,
    body.campaign-funnel-page .funnel-asset-controls,
    body.campaign-funnel-page .funnel-asset-footer{
        flex-direction:column;
        align-items:stretch;
    }

    body.campaign-funnel-page .funnel-review-stage,
    body.campaign-funnel-page .funnel-email-preview-frame,
    body.campaign-funnel-page .funnel-review-empty{
        min-height:520px;
    }

    body.campaign-funnel-page .funnel-settings-compact-grid{
        grid-template-columns:1fr;
    }
}

/* ==================================================
   Optimization Walkthrough Review
   ================================================== */

body.optimization-review-page main{
    padding:0 5vw 56px;
}

body.optimization-review-page .workflow-status{
    width:min(1460px, 100%);
    margin:8px auto 0;
}

.optimization-review-shell{
    width:min(1460px, 100%);
    display:flex;
    flex-direction:column;
    gap:24px;
    padding:16px 0 12px;
}

.optimization-review-hero{
    display:grid;
    grid-template-columns:minmax(0, 1.8fr) minmax(280px, 0.9fr);
    gap:24px;
    align-items:start;
    padding:28px;
    border:4px solid rgba(0, 0, 0, 0.9);
    border-radius:32px;
    box-shadow:var(--shadow-card);
    background:
        radial-gradient(circle at top right, rgba(227, 63, 42, 0.12), transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 242, 236, 0.94) 100%);
}

.optimization-review-hero__content{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.optimization-review-hero__eyebrow,
.optimization-review-sidebar__eyebrow,
.optimization-review-empty__eyebrow,
.optimization-review-summary__eyebrow,
.optimization-review-run__eyebrow,
.optimization-review-snapshot__eyebrow,
.optimization-review-panel__eyebrow,
.optimization-review-policy-card__eyebrow{
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--color-text-secondary);
}

.optimization-review-hero__title{
    font-size:clamp(32px, 4.1vw, 52px);
    line-height:1;
}

.optimization-review-hero__subtitle{
    max-width:72ch;
    color:var(--color-text-secondary);
    line-height:1.65;
    font-size:15px;
}

.optimization-review-hero__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:flex-end;
    align-items:flex-start;
}

.optimization-review-summary{
    grid-column:1 / -1;
    display:flex;
    flex-direction:column;
    gap:20px;
    padding-top:4px;
}

.optimization-review-summary__meta{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
}

.optimization-review-summary__headline{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.optimization-review-summary__title{
    font-size:clamp(22px, 2.6vw, 34px);
    line-height:1.05;
}

.optimization-review-summary__chips,
.optimization-review-chip-row,
.optimization-review-panel__fact-row,
.optimization-review-ad-group__chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.optimization-review-summary__grid,
.optimization-review-run__stats,
.optimization-review-snapshot__stats{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
    gap:14px;
}

.optimization-review-summary-stat{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
    padding:14px 16px;
    border:2px solid var(--color-border-light);
    border-radius:20px;
    background:rgba(255, 255, 255, 0.82);
}

.optimization-review-summary-stat__label{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.08em;
    color:var(--color-text-secondary);
}

.optimization-review-summary-stat__value{
    font-size:18px;
    line-height:1.2;
    overflow-wrap:anywhere;
}

.optimization-review-layout{
    display:grid;
    grid-template-columns:minmax(250px, 300px) minmax(0, 1fr);
    gap:24px;
    align-items:start;
}

.optimization-review-sidebar{
    position:sticky;
    top:96px;
    display:flex;
    flex-direction:column;
    gap:20px;
    padding:22px;
    border:3px solid rgba(0, 0, 0, 0.92);
    border-radius:30px;
    box-shadow:var(--shadow-card);
}

.optimization-review-sidebar__header{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.optimization-review-sidebar__title{
    font-size:24px;
    line-height:1.05;
}

.optimization-review-sidebar__content,
.optimization-review-content,
.optimization-review-run__snapshots,
.optimization-review-ad-groups{
    display:flex;
    flex-direction:column;
    gap:18px;
    min-width:0;
}

.optimization-review-nav{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.optimization-review-nav__item{
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:16px;
    border:2px solid rgba(0, 0, 0, 0.12);
    border-radius:22px;
    background:rgba(255, 255, 255, 0.78);
    text-decoration:none;
    box-shadow:0 10px 24px rgba(17, 24, 39, 0.08);
}

.optimization-review-nav__item:hover{
    transform:translateY(-1px);
    border-color:rgba(0, 0, 0, 0.26);
    box-shadow:0 16px 30px rgba(17, 24, 39, 0.12);
}

.optimization-review-nav__topline{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
}

.optimization-review-nav__index,
.optimization-review-nav__meta,
.optimization-review-run__subtitle,
.optimization-review-snapshot__subtitle,
.optimization-review-ad-group__subtitle,
.optimization-review-prepared-card__meta,
.optimization-review-empty-copy,
.optimization-review-panel__body-copy,
.optimization-review-policy-card__copy,
.optimization-review-prepared-card__subject-meta{
    color:var(--color-text-secondary);
    line-height:1.6;
}

.optimization-review-nav__title,
.optimization-review-run__title,
.optimization-review-snapshot__title{
    font-size:22px;
    line-height:1.06;
}

.optimization-review-content{
    gap:24px;
}

.optimization-review-run,
.optimization-review-empty{
    display:flex;
    flex-direction:column;
    gap:22px;
    padding:26px;
    border:3px solid rgba(0, 0, 0, 0.92);
    border-radius:32px;
    box-shadow:var(--shadow-card);
    background:
        radial-gradient(circle at top right, rgba(59, 87, 237, 0.08), transparent 36%),
        rgba(255, 255, 255, 0.98);
    min-width:0;
}

.optimization-review-run,
.optimization-review-snapshot{
    scroll-margin-top:110px;
}

.optimization-review-run__header,
.optimization-review-snapshot__header,
.optimization-review-ad-group__header,
.optimization-review-policy-card__header{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-start;
}

.optimization-review-run__header-copy,
.optimization-review-panel,
.optimization-review-snapshot,
.optimization-review-policy-card,
.optimization-review-prepared-card,
.optimization-review-ad-group,
.optimization-review-empty-state{
    min-width:0;
}

.optimization-review-run__status-group,
.optimization-review-snapshot__status-group{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:flex-end;
}

.optimization-review-run__divider{
    display:inline-block;
    margin:0 8px;
    color:rgba(0, 0, 0, 0.28);
}

.optimization-review-run__snapshot-nav{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.optimization-review-run__snapshot-link{
    padding:10px 14px;
    border:2px solid rgba(0, 0, 0, 0.1);
    border-radius:999px;
    background:rgba(246, 242, 236, 0.9);
    text-decoration:none;
}

.optimization-review-run__snapshot-link:hover{
    border-color:rgba(0, 0, 0, 0.24);
    transform:translateY(-1px);
}

.optimization-review-callout{
    padding:16px 18px;
    border-radius:22px;
    border:2px solid rgba(0, 0, 0, 0.12);
    background:var(--color-info-light);
    color:var(--color-info-dark);
    line-height:1.6;
}

.optimization-review-callout--error{
    background:var(--color-error-light);
    color:var(--color-error-dark);
}

.optimization-review-callout--info{
    background:var(--color-background-secondary);
    color:var(--color-text-primary);
}

.optimization-review-snapshot{
    display:flex;
    flex-direction:column;
    gap:18px;
    padding:24px;
    border:2px solid rgba(0, 0, 0, 0.12);
    border-radius:28px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 242, 236, 0.92) 100%);
    box-shadow:0 16px 32px rgba(17, 24, 39, 0.08);
}

.optimization-review-cluster,
.optimization-review-prepared-grid,
.optimization-review-policy-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
}

.optimization-review-panel,
.optimization-review-prepared-card,
.optimization-review-policy-card,
.optimization-review-ad-group{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    border:2px solid rgba(0, 0, 0, 0.08);
    border-radius:24px;
    background:rgba(255, 255, 255, 0.84);
}

.optimization-review-panel__header{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.optimization-review-panel__title,
.optimization-review-ad-group__title{
    font-size:20px;
    line-height:1.08;
}

.optimization-review-panel__metric-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
}

.optimization-review-panel__metric{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid rgba(0, 0, 0, 0.08);
    background:rgba(246, 242, 236, 0.82);
}

.optimization-review-panel__metric-label{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.08em;
    color:var(--color-text-secondary);
}

.optimization-review-panel__metric-value{
    font-size:22px;
    line-height:1;
}

.optimization-review-table-wrap{
    width:100%;
    overflow-x:auto;
    border:1px solid rgba(0, 0, 0, 0.08);
    border-radius:18px;
    background:rgba(255, 255, 255, 0.96);
}

.optimization-review-table-wrap--compact{
    max-width:100%;
}

.optimization-review-table{
    width:100%;
    min-width:760px;
    border-collapse:collapse;
    font-size:14px;
}

.optimization-review-table--compact{
    min-width:560px;
}

.optimization-review-table th,
.optimization-review-table td{
    padding:12px 14px;
    border-bottom:1px solid rgba(0, 0, 0, 0.08);
    vertical-align:top;
    text-align:left;
}

.optimization-review-table thead th{
    position:sticky;
    top:0;
    z-index:1;
    background:rgba(246, 242, 236, 0.98);
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
}

.optimization-review-table tbody tr:last-child td{
    border-bottom:none;
}

.optimization-review-table__row--muted{
    background:rgba(253, 231, 227, 0.38);
}

.optimization-review-cell-title{
    font-weight:700;
    line-height:1.35;
}

.optimization-review-cell-subtitle{
    margin-top:4px;
    font-size:12px;
    color:var(--color-text-secondary);
    overflow-wrap:anywhere;
}

.optimization-review-list{
    padding-left:18px;
    display:flex;
    flex-direction:column;
    gap:10px;
    line-height:1.6;
}

.optimization-review-list--tight{
    gap:8px;
}

.optimization-review-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:32px;
    padding:6px 12px;
    border-radius:999px;
    border:1px solid rgba(0, 0, 0, 0.12);
    background:rgba(246, 242, 236, 0.96);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.02em;
}

.optimization-review-chip--completed,
.optimization-review-chip--success{
    background:var(--color-success-light);
    color:var(--color-success-dark);
}

.optimization-review-chip--running{
    background:var(--color-info-light);
    color:var(--color-info-dark);
}

.optimization-review-chip--queued,
.optimization-review-chip--phase,
.optimization-review-chip--decision{
    background:rgba(255, 244, 207, 0.92);
    color:var(--color-warning-dark);
}

.optimization-review-chip--failed,
.optimization-review-chip--error{
    background:var(--color-error-light);
    color:var(--color-error-dark);
}

.optimization-review-chip--info,
.optimization-review-chip--steady{
    background:rgba(232, 237, 255, 0.92);
    color:var(--color-info-dark);
}

.optimization-review-prepared-card__title,
.optimization-review-policy-card__title{
    font-size:18px;
    line-height:1.12;
}

.optimization-review-prepared-card__subject{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:14px 16px;
    border-radius:18px;
    background:rgba(246, 242, 236, 0.9);
    border:1px solid rgba(0, 0, 0, 0.08);
}

.optimization-review-prepared-card__subject-label{
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--color-text-secondary);
}

.optimization-review-prepared-card__subject-title{
    line-height:1.35;
}

.optimization-review-policy-card__detail{
    display:flex;
    flex-direction:column;
    gap:8px;
    line-height:1.6;
}

.optimization-review-traffic-policy{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.optimization-review-debug{
    border-top:1px solid rgba(0, 0, 0, 0.08);
    padding-top:16px;
}

.optimization-review-debug summary{
    cursor:pointer;
    font-weight:700;
}

.optimization-review-debug pre{
    margin-top:12px;
    padding:16px;
    border-radius:18px;
    background:#111827;
    color:#f7f5f2;
    font-size:12px;
    line-height:1.65;
    overflow:auto;
    white-space:pre-wrap;
    word-break:break-word;
}

@media (max-width: 1180px){
    .optimization-review-layout,
    .optimization-review-hero{
        grid-template-columns:1fr;
    }

    .optimization-review-sidebar{
        position:static;
    }

    .optimization-review-summary__meta,
    .optimization-review-run__header,
    .optimization-review-snapshot__header,
    .optimization-review-ad-group__header,
    .optimization-review-policy-card__header{
        flex-direction:column;
    }

    .optimization-review-run__status-group,
    .optimization-review-snapshot__status-group{
        justify-content:flex-start;
    }
}

@media (max-width: 900px){
    body.optimization-review-page main{
        padding:0 20px 40px;
    }

    .optimization-review-hero,
    .optimization-review-run,
    .optimization-review-empty,
    .optimization-review-sidebar{
        padding:22px;
        border-radius:26px;
    }

    .optimization-review-snapshot{
        padding:20px;
        border-radius:24px;
    }

    .optimization-review-cluster,
    .optimization-review-prepared-grid,
    .optimization-review-policy-grid,
    .optimization-review-panel__metric-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 720px){
    .optimization-review-shell{
        gap:18px;
    }

    .optimization-review-hero__actions,
    .optimization-review-summary__chips,
    .optimization-review-chip-row,
    .optimization-review-panel__fact-row,
    .optimization-review-run__snapshot-nav{
        flex-direction:column;
        align-items:stretch;
    }

    .optimization-review-summary__grid,
    .optimization-review-run__stats,
    .optimization-review-snapshot__stats{
        grid-template-columns:1fr;
    }

    .optimization-review-nav__topline{
        flex-direction:column;
        align-items:flex-start;
    }
}

/* Landing page editor */
body.landing-page-editor-page{
    min-height:100vh;
}

.landing-page-editor-page main,
.lp-editor-page{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.lp-editor-error-page{
    min-height:100vh;
    margin:0;
}

.lp-editor-error-shell{
    width:min(760px, calc(100% - 40px));
    margin:0 auto;
    padding:48px 0;
}

.lp-editor-error-card{
    gap:16px;
}

.lp-editor-back-link{
    align-self:flex-start;
    color:#172033;
    font-weight:700;
    text-decoration:none;
}

.lp-editor-card{
    display:flex;
    flex-direction:column;
    gap:16px;
    align-items:stretch;
}

.lp-editor-hero{
    gap:20px;
}

.lp-editor-hero-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
}

.lp-editor-title-stack{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
    max-width:780px;
}

.lp-editor-title{
    margin:0;
    font-size:clamp(28px, 3vw, 38px);
    line-height:1.04;
    overflow-wrap:anywhere;
}

.lp-editor-title-meta{
    margin:0;
    color:var(--color-text-secondary);
    font-size:14px;
    line-height:1.5;
}

.lp-editor-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    justify-content:flex-end;
    position:relative;
}

.lp-editor-actions .btn-small,
.lp-editor-actions .btn-outline{
    min-height:44px;
}

.lp-editor-status-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    max-width:100%;
    border-radius:999px;
    padding:8px 12px;
    background:#fff7d6;
    border:2px solid rgba(0,0,0,.08);
    color:#473b12;
    font-size:13px;
    line-height:1.25;
}

.lp-editor-status-badge.is-live{
    background:#ecf8ef;
    color:#155d27;
    border-color:#bfe3c7;
}

.lp-editor-status-badge.is-dirty{
    background:#fff7d6;
    color:#7a5c00;
    border-color:#f0d076;
}

.lp-editor-status-badge.is-draft{
    background:#eef5ff;
    color:#1f3d73;
    border-color:#bfd6ff;
}

.lp-editor-status-badge strong,
.lp-editor-status-badge span{
    min-width:0;
    overflow-wrap:anywhere;
}

.lp-editor-page-settings{
    display:inline-flex;
    position:relative;
    flex:0 0 auto;
}

.lp-editor-page-settings summary{
    align-self:auto;
    list-style:none;
    user-select:none;
}

.lp-editor-page-settings summary::-webkit-details-marker{
    display:none;
}

.lp-editor-page-settings summary::after{
    content:"";
    width:9px;
    height:9px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg) translateY(-2px);
}

.lp-editor-page-settings[open] summary::after{
    transform:rotate(225deg) translateY(-1px);
}

.lp-editor-page-settings[open] .lp-editor-setup-grid{
    padding:16px;
}

.lp-editor-setup-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.lp-editor-page-settings .lp-editor-setup-grid{
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    z-index:40;
    width:min(560px, calc(100vw - 48px));
    padding:16px;
    border:2px solid rgba(0,0,0,.12);
    border-radius:20px;
    background:#fff;
    box-shadow:0 20px 48px rgba(23,32,51,.16);
}

.lp-editor-form-group{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
}

.lp-editor-form-group label,
.lp-editor-form-group > span,
.lp-editor-form-label{
    font-weight:700;
    color:var(--color-text-primary);
}

.lp-editor-form-group input,
.lp-editor-form-group textarea{
    width:100%;
    border:2px solid var(--color-border-light);
    border-radius:14px;
    padding:12px 14px;
    font:inherit;
    background:#fff;
    color:var(--color-text-primary);
}

.lp-editor-form-group textarea{
    min-height:112px;
    resize:vertical;
    line-height:1.5;
}

.lp-editor-field-note{
    margin:6px 0 0;
    color:#5b6478;
    font-size:12px;
    line-height:1.5;
}

.lp-editor-status-row{
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    gap:12px;
    align-items:start;
}

.lp-editor-status{
    display:none;
    padding:12px 14px;
    border-radius:14px;
    border:1px solid transparent;
    font-size:14px;
    line-height:1.5;
    min-width:0;
}

.lp-editor-status.is-visible{
    display:block;
}

.lp-editor-status.is-info{
    background:#eef5ff;
    border-color:#bfd6ff;
    color:#1f3d73;
}

.lp-editor-status.is-success{
    background:#ecf8ef;
    border-color:#bfe3c7;
    color:#155d27;
}

.lp-editor-status.is-error{
    background:#fff0f0;
    border-color:#f2c5c5;
    color:#7a1f1f;
}

.lp-editor-dirty{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    font-size:13px;
    font-weight:700;
    color:#7a5c00;
}

.lp-editor-dirty::before{
    content:"";
    width:10px;
    height:10px;
    border-radius:999px;
    background:currentColor;
}

.lp-editor-dirty.is-clean{
    color:#406e4f;
}

.lp-editor-workbench{
    display:grid;
    grid-template-columns:minmax(360px, 520px) minmax(0, 1fr);
    gap:24px;
    align-items:start;
    width:100%;
}

.lp-editor-toolbar{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.lp-editor-toolbar-copy{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
}

.lp-editor-toolbar-copy .campaign-editor-card-eyebrow,
.lp-editor-active-section .campaign-editor-card-eyebrow{
    margin:0;
}

.lp-editor-section-title{
    margin:0;
    font-size:20px;
    line-height:1.2;
}

.lp-editor-section-copy{
    margin:0;
    color:var(--color-text-secondary);
    font-size:14px;
    line-height:1.6;
}

.lp-editor-toolbar-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
}

.lp-editor-search-row{
    display:flex;
    flex-direction:column;
    gap:8px;
    flex:1 1 280px;
    max-width:420px;
    min-width:min(100%, 260px);
}

.lp-editor-search{
    width:100%;
    border:2px solid rgba(0,0,0,.08);
    border-radius:999px;
    padding:10px 14px;
    font:inherit;
    background:#fff;
}

.lp-editor-results-summary{
    font-size:12px;
    color:#5b6478;
}

.lp-editor-controls-layout{
    display:grid;
    grid-template-columns:160px minmax(0, 1fr);
    gap:16px;
    min-width:0;
}

.lp-editor-section-rail{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
}

.lp-editor-rail-label{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#6b7280;
}

.lp-editor-section-nav{
    display:grid;
    gap:10px;
    max-height:min(68vh, 760px);
    overflow-y:auto;
    padding-right:6px;
}

.lp-editor-section-chip{
    appearance:none;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
    width:100%;
    padding:12px 14px;
    border-radius:18px;
    border:1px solid rgba(0,0,0,.08);
    background:#fff;
    text-align:left;
    cursor:pointer;
    transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.lp-editor-section-chip:hover{
    transform:translateY(-1px);
    border-color:rgba(23,32,51,.18);
    box-shadow:0 8px 22px rgba(23,32,51,.08);
}

.lp-editor-section-chip.is-active{
    border-color:rgba(181,6,0,.4);
    box-shadow:0 10px 26px rgba(181,6,0,.12);
}

.lp-editor-section-chip-label{
    font-weight:700;
    color:#172033;
}

.lp-editor-section-chip-meta{
    font-size:12px;
    color:#5b6478;
}

.lp-editor-controls-main{
    display:flex;
    flex-direction:column;
    gap:16px;
    min-width:0;
}

.lp-editor-active-section{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    padding:16px 18px;
    border-radius:20px;
    background:linear-gradient(135deg, rgba(255,247,214,.95), rgba(255,255,255,.95));
    border:1px solid rgba(0,0,0,.08);
}

.lp-editor-kind-tabs{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:8px;
    padding:6px;
    border-radius:18px;
    background:#edf2ff;
}

.lp-editor-kind-tab{
    appearance:none;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    width:100%;
    min-height:42px;
    border:0;
    border-radius:14px;
    padding:8px 10px;
    background:transparent;
    color:#44506a;
    font:inherit;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}

.lp-editor-kind-tab.is-active{
    background:#fff;
    color:#172033;
    box-shadow:0 4px 12px rgba(23,32,51,.08);
}

.lp-editor-kind-tab:disabled{
    cursor:not-allowed;
    opacity:.48;
}

.lp-editor-kind-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:24px;
    min-height:24px;
    border-radius:999px;
    background:rgba(0,0,0,.08);
    font-size:12px;
}

.lp-editor-field-panel[hidden]{
    display:none;
}

.lp-editor-sections,
.lp-editor-field-panel{
    display:flex;
    flex-direction:column;
    gap:14px;
    min-width:0;
}

.lp-editor-field-panel-copy{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.lp-editor-section{
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:14px;
    border-radius:18px;
    background:#fff8e8;
    border:1px solid rgba(0,0,0,.08);
}

.lp-editor-warning-title{
    margin:0;
    font-size:18px;
    line-height:1.2;
}

.lp-editor-field-list{
    display:grid;
    gap:14px;
}

.lp-editor-field-card{
    padding:14px;
    border-radius:18px;
    background:#fff;
    border:2px solid rgba(0,0,0,.08);
    transition:border-color .14s ease, box-shadow .14s ease;
}

.lp-editor-field-card.is-active{
    border-color:rgba(181,6,0,.36);
    box-shadow:0 10px 26px rgba(181,6,0,.12);
}

.lp-editor-field-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}

.lp-editor-field-title{
    margin:0;
    font-size:15px;
    line-height:1.35;
    color:#172033;
}

.lp-editor-inline-btn{
    appearance:none;
    border:none;
    border-radius:999px;
    padding:8px 12px;
    font:inherit;
    font-size:12px;
    font-weight:700;
    background:#eef3ff;
    color:#172033;
    cursor:pointer;
}

.lp-editor-warning-list{
    margin:0;
    padding-left:18px;
    display:grid;
    gap:8px;
    color:#7a4d00;
}

.lp-editor-empty{
    padding:16px;
    border-radius:18px;
    background:#fbfcff;
    border:2px dashed rgba(0,0,0,.1);
    color:var(--color-text-secondary);
}

.lp-editor-preview-card{
    min-width:0;
    position:sticky;
    top:24px;
    align-self:start;
}

.lp-editor-preview-stage{
    width:100%;
    display:block;
    padding:22px;
    min-height:720px;
    overflow:auto;
    border-radius:26px;
    background:linear-gradient(135deg, rgba(187,218,255,0.55), rgba(255,246,220,0.72));
    border:2px solid rgba(0,0,0,.06);
}

.lp-editor-preview-viewport{
    width:100%;
    min-height:640px;
    margin:0 auto;
    border-radius:28px;
    overflow:hidden;
    border:1px solid rgba(0,0,0,.12);
    background:#fff;
    box-shadow:0 24px 60px rgba(23,32,51,.18);
    transition:width .2s ease, box-shadow .2s ease;
}

.lp-editor-preview-viewport[data-preview-mode="desktop"]{
    width:100%;
}

.lp-editor-preview-viewport[data-preview-mode="tablet"]{
    width:min(100%, 900px);
}

.lp-editor-preview-viewport[data-preview-mode="mobile"]{
    width:min(100%, 420px);
    box-shadow:0 22px 50px rgba(23,32,51,.22);
}

.lp-editor-preview-frame{
    display:block;
    width:100%;
    min-height:720px;
    border:0;
    background:#fff;
}

.lp-editor-mode-switch{
    display:inline-flex;
    align-items:center;
    padding:4px;
    border-radius:999px;
    background:#edf2ff;
    gap:4px;
}

.lp-editor-mode-btn{
    appearance:none;
    border:none;
    border-radius:999px;
    padding:9px 12px;
    font:inherit;
    font-size:13px;
    font-weight:700;
    background:transparent;
    color:#44506a;
    cursor:pointer;
}

.lp-editor-mode-btn.is-active{
    background:#fff;
    color:#172033;
    box-shadow:0 4px 12px rgba(23,32,51,.08);
}

@media (max-width: 1240px){
    .lp-editor-workbench{
        grid-template-columns:1fr;
    }

    .lp-editor-preview-card{
        position:static;
        top:auto;
    }

    .lp-editor-preview-stage{
        min-height:620px;
    }
}

@media (max-width: 960px){
    .lp-editor-setup-grid,
    .lp-editor-controls-layout,
    .lp-editor-status-row{
        grid-template-columns:1fr;
    }

    .lp-editor-preview-stage{
        padding:14px;
        min-height:540px;
    }

    .lp-editor-preview-frame{
        min-height:620px;
    }

    .lp-editor-actions{
        width:100%;
        justify-content:flex-start;
    }

    .lp-editor-page-settings{
        width:100%;
    }

    .lp-editor-page-settings summary{
        width:100%;
    }

    .lp-editor-page-settings .lp-editor-setup-grid{
        position:static;
        width:100%;
        margin-top:10px;
    }
}

@media (max-width: 640px){
    .lp-editor-kind-tabs{
        grid-template-columns:1fr;
    }

    .lp-editor-preview-stage{
        padding:12px;
    }

    .lp-editor-preview-viewport[data-preview-mode="mobile"]{
        width:100%;
    }
}

@media (max-width:900px){
    main,
    body.dashboard-page main,
    main.lead-magnet-editor,
    body.optimization-review-page main,
    body.campaign-success-page main{
        padding-left:4vw;
        padding-right:4vw;
    }

    body.campaign-ads-page .page,
    body.organic-cadence-page .page,
    body.campaign-funnel-page .page,
    body.experiments-hub-page .exp-hub-page,
    .success-wrapper{
        padding-left:4vw;
        padding-right:4vw;
    }
}

@media (max-width:900px){
    .campaign-lead-magnets .campaign-editor-filter-bar,
    .campaign-lead-magnets .campaign-editor-loading,
    .campaign-lead-magnets .campaign-editor-empty-state,
    .campaign-lead-magnets .campaign-editor-portfolio-block,
    .campaign-lead-magnets .campaign-editor-portfolio-status,
    .campaign-lead-magnets .campaign-editor-strategy-card,
    .campaign-lead-magnets .campaign-editor-role-card,
    .campaign-lead-magnets .campaign-editor-selected-card,
    .campaign-lead-magnets .campaign-editor-built-card,
    .campaign-lead-magnets .campaign-editor-magnet-card,
    .campaign-lead-magnets .campaign-editor-magnet-preview,
    .campaign-lead-magnets .campaign-editor-magnet-detail,
    .campaign-lead-magnets .campaign-editor-magnet-empty-filter,
    .lead-magnet-editor .lead-magnet-editor-summary-item,
    .lead-magnet-editor #target-personas-display .persona-tag,
    .lead-magnet-editor .workspace-family-card,
    .lead-magnet-editor .workspace-nested-section,
    .lead-magnet-editor .workspace-variant-card,
    .lead-magnet-editor .workspace-ad-card,
    .lead-magnet-editor .workspace-organic-card,
    .lead-magnet-editor .workspace-funnel-step,
    .lead-magnet-editor .workspace-funnel-readiness,
    .lead-magnet-editor .workspace-funnel-cta-card,
    .lead-magnet-editor .workspace-funnel-settings-editor,
    .lead-magnet-editor .workspace-funnel-settings-destination,
    .lead-magnet-editor .workspace-funnel-handoff-item,
    .lead-magnet-editor .workspace-funnel-asset-card,
    body.campaign-ads-page .campaign-ads-selected-preview,
    body.campaign-ads-page .campaign-ads-image-tool-section,
    body.campaign-ads-page .campaign-ads-summary-card,
    body.campaign-ads-page .campaign-ads-summary-item,
    body.campaign-ads-page .campaign-ads-platform-group,
    body.campaign-ads-page .ad,
    body.campaign-ads-page .campaign-ads-card-detail,
    body.organic-cadence-page .item,
    body.campaign-funnel-page .step,
    body.campaign-funnel-page .funnel-strategy-card,
    body.campaign-funnel-page .funnel-strategy-item,
    body.campaign-funnel-page .funnel-strategy-supporting-asset,
    body.campaign-funnel-page .funnel-cta-snapshot > div,
    body.experiments-hub-page .exp-hub-card--nested{
        padding:0;
        border:0;
        border-radius:0;
        background:transparent;
        box-shadow:none;
    }

    .campaign-lead-magnets .campaign-editor-portfolio-block,
    .campaign-lead-magnets .campaign-editor-magnet-list-grid,
    .campaign-lead-magnets .campaign-editor-selected-grid,
    .campaign-lead-magnets .campaign-editor-built-grid,
    .campaign-lead-magnets .campaign-editor-strategy-grid,
    .campaign-lead-magnets .campaign-editor-role-strip,
    .lead-magnet-editor .workspace-family-list,
    .lead-magnet-editor .workspace-family-body,
    .lead-magnet-editor .workspace-list,
    body.campaign-ads-page .campaign-ads-portfolio-summary,
    body.campaign-ads-page .campaign-ads-platform-grid,
    body.organic-cadence-page .stack,
    body.campaign-funnel-page .steps{
        gap:20px;
    }

    .campaign-lead-magnets .campaign-editor-magnet-card,
    .campaign-lead-magnets .campaign-editor-strategy-card,
    .campaign-lead-magnets .campaign-editor-role-card,
    .campaign-lead-magnets .campaign-editor-selected-card,
    .campaign-lead-magnets .campaign-editor-built-card,
    .lead-magnet-editor .workspace-family-card,
    .lead-magnet-editor .workspace-nested-section,
    .lead-magnet-editor .workspace-variant-card,
    .lead-magnet-editor .workspace-ad-card,
    .lead-magnet-editor .workspace-organic-card,
    .lead-magnet-editor .workspace-funnel-step,
    .lead-magnet-editor .workspace-funnel-readiness,
    .lead-magnet-editor .workspace-funnel-asset-card,
    body.campaign-ads-page .campaign-ads-platform-group,
    body.campaign-ads-page .ad,
    body.organic-cadence-page .item,
    body.campaign-funnel-page .step,
    body.experiments-hub-page .exp-hub-card--nested{
        padding-top:18px;
        border-top:1px solid rgba(0,0,0,0.14);
    }

    .campaign-lead-magnets .campaign-editor-magnet-card:first-child,
    .campaign-lead-magnets .campaign-editor-strategy-card:first-child,
    .campaign-lead-magnets .campaign-editor-role-card:first-child,
    .campaign-lead-magnets .campaign-editor-selected-card:first-child,
    .campaign-lead-magnets .campaign-editor-built-card:first-child,
    .lead-magnet-editor .workspace-family-card:first-child,
    .lead-magnet-editor .workspace-list > :first-child,
    body.campaign-ads-page .campaign-ads-platform-group:first-child,
    body.campaign-ads-page .ad:first-child,
    body.organic-cadence-page .item:first-child,
    body.campaign-funnel-page .step:first-child{
        padding-top:0;
        border-top:0;
    }

    .campaign-lead-magnets .campaign-editor-magnet-card__body{
        gap:16px;
    }

    .campaign-lead-magnets .campaign-editor-magnet-preview{
        min-height:0;
    }

    .campaign-lead-magnets .campaign-editor-magnet-preview__header{
        min-height:0;
        padding:0 0 8px;
        border-bottom:0;
        background:transparent;
    }

    .campaign-lead-magnets .campaign-editor-magnet-preview__iframe{
        min-height:340px;
        border-radius:14px;
    }

    .campaign-lead-magnets .campaign-editor-magnet-preview__empty{
        min-height:180px;
        padding:18px;
        border-radius:14px;
        background:rgba(0,0,0,0.04);
    }

    .lead-magnet-editor .workspace-funnel-readiness-grid,
    .lead-magnet-editor .workspace-funnel-settings-destination-grid,
    .lead-magnet-editor .workspace-funnel-handoff-process,
    body.campaign-funnel-page .funnel-cta-snapshot{
        gap:14px;
    }

    .lead-magnet-editor .workspace-header-copy,
    .lead-magnet-editor .workspace-family-copy,
    .lead-magnet-editor .workspace-item-copy{
        min-width:0;
        max-width:100%;
    }

    .lead-magnet-editor .workspace-chip,
    .lead-magnet-editor .metric-chip,
    .lead-magnet-editor .tag,
    .campaign-editor-type-pill,
    .campaign-editor-status-pill,
    .campaign-editor-weighted-score,
    .workspace-pill,
    body.campaign-ads-page .metric-pill,
    body.organic-cadence-page .pill,
    body.experiments-hub-page .exp-hub-pill{
        max-width:100%;
        min-width:0;
        white-space:normal;
        overflow-wrap:anywhere;
        text-align:left;
    }

    .lead-magnet-editor .workspace-chip,
    .lead-magnet-editor .metric-chip,
    .workspace-pill,
    body.campaign-ads-page .metric-pill,
    body.organic-cadence-page .pill,
    body.experiments-hub-page .exp-hub-pill{
        justify-content:flex-start;
    }

    .lead-magnet-editor .workspace-chip strong,
    .lead-magnet-editor .metric-chip strong,
    body.campaign-ads-page .metric-pill strong,
    body.organic-cadence-page .pill strong{
        flex:0 0 auto;
    }
}

@media (max-width:900px){
    .signup-card:has(.signup-step--plan:not([hidden])){
        width:100%;
        padding:22px;
    }

    .signup-plan-decision{
        width:100%;
        gap:18px;
    }

    .signup-step--plan .pricing-toggle-shell,
    .signup-step--plan .marketing-button{
        width:100%;
        min-width:0;
    }

    .signup-step--plan .pricing-toggle{
        gap:8px;
    }

    .signup-step--plan .pricing-toggle__option{
        justify-content:center;
        font-size:14px;
    }

    .signup-step--plan .pricing-toggle__option--annual{
        max-width:132px;
    }

    .signup-step--plan .pricing-toggle__option--annual strong{
        margin-top:2px;
    }

    .signup-step--plan .pricing-plan{
        padding:24px 22px 26px;
        border-radius:24px;
    }

    .signup-pricing-sparkle{
        display:none;
    }

    .signup-title{
        padding:16px 20px;
    }

    .signup-actions .btn{
        width:100%;
        min-width:0;
    }

    .signup-email-actions{
        width:100%;
        max-width:340px;
        gap:14px;
        flex-wrap:nowrap;
    }

    .signup-email-actions .btn{
        width:auto;
        min-width:150px;
    }
}