:root {
    --page:#f7f8fb;
    --surface:#ffffff;
    --surface-soft:#f1f4f8;
    --surface-strong:#e8edf4;

    --text:#111827;
    --text-soft:#657084;
    --text-faint:#8a94a6;

    --line:#dde3ec;

    --blue:#246bfe;
    --blue-soft:#e8f0ff;

    --coral:#ff6257;
    --coral-soft:#fff0ee;

    --orange:#ff9a3d;
    --orange-soft:#fff3e7;

    --green:#17a673;
    --green-soft:#e7f8f1;

    --violet:#7958e8;

    --shadow:
        0 1px 2px rgba(15,23,42,.04),
        0 14px 38px rgba(15,23,42,.06);

    --sidebar:#101522;
}

[data-theme="dark"] {
    --page:#0d111a;
    --surface:#141a25;
    --surface-soft:#1a2130;
    --surface-strong:#222b3b;

    --text:#f6f8fc;
    --text-soft:#a8b1c2;
    --text-faint:#768297;

    --line:#293245;

    --blue-soft:#18284b;
    --coral-soft:#3c2223;
    --orange-soft:#3b2b1d;
    --green-soft:#17372d;

    --shadow:none;
}

* {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
}

body {
    margin:0;
    background:var(--page);
    color:var(--text);
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    -webkit-font-smoothing:antialiased;
}

a {
    color:inherit;
}

button,
input,
select,
textarea {
    font:inherit;
}

/* ============================
   PUBLIC NAVIGATION
   ============================ */

.mz-public-header {
    position:sticky;
    top:0;
    z-index:100;
    background:
        color-mix(
            in srgb,
            var(--surface) 90%,
            transparent
        );
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(18px);
}

.mz-public-nav {
    width:min(1240px,calc(100% - 36px));
    min-height:72px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:32px;
}

.mz-logo {
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
}

.mz-logo-symbol {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    color:#fff;
    font-weight:900;
    background:
        linear-gradient(
            145deg,
            var(--coral),
            var(--orange)
        );
    box-shadow:
        0 8px 20px rgba(255,98,87,.22);
}

.mz-logo-copy {
    display:block;
    line-height:1.05;
}

.mz-logo-copy strong,
.mz-logo-copy small {
    display:block;
}

.mz-logo-copy strong {
    font-size:16px;
}

.mz-logo-copy small {
    margin-top:4px;
    color:var(--text-soft);
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.mz-nav-links {
    display:flex;
    align-items:center;
    gap:3px;
    flex:1;
}

.mz-nav-links a {
    padding:9px 11px;
    border-radius:9px;
    color:var(--text-soft);
    font-size:14px;
    font-weight:650;
    text-decoration:none;
}

.mz-nav-links a:hover {
    background:var(--surface-soft);
    color:var(--text);
}

.mz-nav-actions {
    display:flex;
    align-items:center;
    gap:9px;
}

.mz-free-pill {
    padding:8px 12px;
    border-radius:999px;
    background:var(--green-soft);
    color:var(--green);
    text-decoration:none;
    font-size:12px;
    font-weight:800;
}

.mz-icon-button {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface);
    color:var(--text);
    cursor:pointer;
}

/* ============================
   PUBLIC HERO
   ============================ */

.mz-hero {
    position:relative;
    overflow:hidden;
    padding:96px 20px 84px;
    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(36,107,254,.10),
            transparent 34%
        ),
        radial-gradient(
            circle at 90% 20%,
            rgba(255,98,87,.11),
            transparent 30%
        );
}

.mz-hero-inner {
    width:min(1080px,100%);
    margin:0 auto;
    text-align:center;
}

.mz-kicker {
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 12px;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--surface);
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
    box-shadow:var(--shadow);
}

.mz-kicker-dot {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--green);
}

.mz-hero h1 {
    max-width:930px;
    margin:22px auto 18px;
    font-size:
        clamp(
            45px,
            7vw,
            78px
        );
    line-height:.98;
    letter-spacing:-.055em;
    font-weight:850;
}

.mz-gradient-text {
    background:
        linear-gradient(
            90deg,
            var(--blue),
            var(--violet),
            var(--coral)
        );
    -webkit-background-clip:text;
    color:transparent;
}

.mz-hero p {
    max-width:720px;
    margin:0 auto;
    color:var(--text-soft);
    font-size:18px;
    line-height:1.7;
}

.mz-hero-actions {
    margin-top:28px;
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
}

.mz-button {
    min-height:46px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:0 17px;
    border-radius:11px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    text-decoration:none;
    font-weight:750;
    cursor:pointer;
}

.mz-button-primary {
    border-color:var(--blue);
    background:var(--blue);
    color:#fff;
}

.mz-button-dark {
    border-color:#151922;
    background:#151922;
    color:#fff;
}

.mz-button:hover {
    transform:translateY(-1px);
}

/* ============================
   PUBLIC SECTIONS
   ============================ */

.mz-section {
    width:min(1240px,calc(100% - 36px));
    margin:0 auto;
    padding:72px 0;
}

.mz-section-head {
    margin-bottom:26px;
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:30px;
}

.mz-section-head h2 {
    margin:0;
    font-size:
        clamp(
            29px,
            4vw,
            42px
        );
    letter-spacing:-.04em;
}

.mz-section-head p {
    max-width:560px;
    margin:9px 0 0;
    color:var(--text-soft);
    line-height:1.6;
}

.mz-tool-grid {
    display:grid;
    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );
    gap:14px;
}

.mz-tool-card {
    position:relative;
    min-height:185px;
    padding:20px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface);
    text-decoration:none;
    box-shadow:var(--shadow);
    transition:
        transform .15s ease,
        border-color .15s ease;
}

.mz-tool-card:hover {
    transform:translateY(-3px);
    border-color:
        color-mix(
            in srgb,
            var(--blue) 45%,
            var(--line)
        );
}

.mz-tool-icon {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    margin-bottom:20px;
    border-radius:12px;
    background:var(--blue-soft);
    color:var(--blue);
    font-size:13px;
    font-weight:900;
}

.mz-tool-card:nth-child(3n+2)
.mz-tool-icon {
    background:var(--coral-soft);
    color:var(--coral);
}

.mz-tool-card:nth-child(3n+3)
.mz-tool-icon {
    background:var(--orange-soft);
    color:var(--orange);
}

.mz-tool-card h3 {
    margin:0 0 7px;
    font-size:17px;
}

.mz-tool-card p {
    margin:0;
    color:var(--text-soft);
    font-size:14px;
    line-height:1.6;
}

.mz-tool-category {
    margin-top:16px;
    display:inline-block;
    color:var(--text-faint);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.06em;
}

/* ============================
   TOOL WORKSPACE
   ============================ */

.mz-tool-layout {
    width:min(1240px,calc(100% - 36px));
    margin:42px auto 80px;
}

.mz-tool-title {
    max-width:820px;
    margin-bottom:28px;
}

.mz-tool-title h1 {
    margin:8px 0 10px;
    font-size:
        clamp(
            34px,
            5vw,
            55px
        );
    letter-spacing:-.045em;
}

.mz-tool-title p {
    color:var(--text-soft);
    line-height:1.7;
}

.mz-tool-workspace {
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(320px,.82fr);
    gap:18px;
}

.mz-tool-panel {
    border:1px solid var(--line);
    border-radius:17px;
    background:var(--surface);
    box-shadow:var(--shadow);
    overflow:hidden;
}

.mz-tool-panel-head {
    padding:16px 19px;
    border-bottom:1px solid var(--line);
    font-size:14px;
    font-weight:800;
}

.mz-tool-panel-body {
    padding:20px;
}

.mz-field {
    display:flex;
    flex-direction:column;
    gap:7px;
    margin-bottom:15px;
}

.mz-field label {
    color:var(--text-soft);
    font-size:12px;
    font-weight:750;
}

.mz-field input,
.mz-field select,
.mz-field textarea {
    width:100%;
    padding:12px 13px;
    border:1px solid var(--line);
    border-radius:10px;
    outline:0;
    background:var(--page);
    color:var(--text);
}

.mz-field input:focus,
.mz-field textarea:focus,
.mz-field select:focus {
    border-color:var(--blue);
    box-shadow:
        0 0 0 3px
        rgba(36,107,254,.09);
}

.mz-output {
    min-height:180px;
    padding:18px;
    border:1px dashed var(--line);
    border-radius:12px;
    background:var(--surface-soft);
    white-space:pre-wrap;
    word-break:break-word;
    line-height:1.7;
}

.mz-result-number {
    margin:8px 0;
    font-size:42px;
    font-weight:850;
    letter-spacing:-.04em;
}

.mz-related {
    margin-top:26px;
}

/* ============================
   APP / MARKETING OS
   ============================ */

.app-body {
    min-height:100vh;
    background:#f5f7fa;
}

[data-theme="dark"]
.app-body {
    background:var(--page);
}

.app-sidebar {
    position:fixed;
    inset:0 auto 0 0;
    z-index:300;
    width:232px;
    padding:18px 12px;
    background:var(--sidebar);
    color:#fff;
    overflow:auto;
}

.app-brand {
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 7px 23px;
    color:#fff;
    text-decoration:none;
}

.app-brand-mark {
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:
        linear-gradient(
            145deg,
            var(--coral),
            var(--orange)
        );
    color:#fff;
    font-weight:900;
}

.app-brand strong,
.app-brand small {
    display:block;
}

.app-brand small {
    margin-top:3px;
    color:#8390a8;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.app-nav {
    display:flex;
    flex-direction:column;
    gap:2px;
}

.app-nav a {
    min-height:39px;
    padding:0 10px;
    display:flex;
    align-items:center;
    gap:9px;
    border-radius:9px;
    color:#929db0;
    text-decoration:none;
    font-size:13px;
    font-weight:650;
}

.app-nav a:hover {
    background:#1a2232;
    color:#fff;
}

.app-nav span {
    width:19px;
    color:#748198;
    text-align:center;
}

.app-nav-spacer {
    height:20px;
}

.app-main {
    min-height:100vh;
    margin-left:232px;
}

.app-topbar {
    min-height:66px;
    padding:0 27px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border-bottom:1px solid var(--line);
    background:var(--surface);
}

.app-topbar h1 {
    margin:0;
    font-size:19px;
    letter-spacing:-.02em;
}

.app-content {
    padding:26px;
}

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

.metric-card {
    position:relative;
    padding:18px;
    border:1px solid var(--line);
    border-radius:13px;
    background:var(--surface);
}

.metric-card small {
    color:var(--text-soft);
    font-size:12px;
}

.metric-card strong {
    display:block;
    margin-top:9px;
    font-size:27px;
    letter-spacing:-.035em;
}

.panel {
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--surface);
    overflow:hidden;
}

.panel-head {
    min-height:54px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border-bottom:1px solid var(--line);
}

.panel-body {
    padding:18px;
}

.dashboard-grid {
    margin-top:15px;
    display:grid;
    grid-template-columns:
        1.55fr 1fr;
    gap:15px;
}

.badge {
    display:inline-flex;
    padding:5px 8px;
    border-radius:999px;
    background:var(--blue-soft);
    color:var(--blue);
    font-size:10px;
    font-weight:800;
}

.btn {
    min-height:39px;
    padding:0 13px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--line);
    border-radius:9px;
    background:var(--surface);
    color:var(--text);
    text-decoration:none;
    font-weight:750;
    cursor:pointer;
}

.btn-primary {
    border-color:var(--blue);
    background:var(--blue);
    color:#fff;
}

.btn-secondary {
    background:var(--surface);
}

.muted {
    color:var(--text-soft);
}

.small {
    font-size:12px;
}

.text-link {
    color:var(--blue);
    text-decoration:none;
    font-weight:700;
}

.empty-state {
    padding:38px 20px;
    color:var(--text-soft);
    text-align:center;
}

/* retain Phase 2 forms */

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

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

.field-span-2 {
    grid-column:span 2;
}

.field > span {
    color:var(--text-soft);
    font-size:12px;
    font-weight:750;
}

.field input,
.field select,
.field textarea,
.task-add-form input {
    width:100%;
    padding:11px 12px;
    border:1px solid var(--line);
    border-radius:9px;
    background:var(--page);
    color:var(--text);
    outline:0;
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.task-add-form input:focus {
    border-color:var(--blue);
}

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

.channel-option {
    display:flex;
    align-items:center;
    gap:7px;
    padding:9px;
    border:1px solid var(--line);
    border-radius:9px;
    background:var(--surface-soft);
}

.channel-option input {
    width:auto;
}

.form-actions {
    margin-top:18px;
    display:flex;
    gap:8px;
}

/* Campaign list */

.campaign-toolbar {
    margin-bottom:13px;
    display:flex;
    justify-content:space-between;
}

.campaign-list {
    padding:0;
}

.campaign-row {
    padding:15px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    border-bottom:1px solid var(--line);
}

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

.campaign-row-link {
    text-decoration:none;
}

.campaign-row-link:hover {
    background:var(--surface-soft);
}

.campaign-main {
    min-width:0;
    flex:1;
}

.campaign-name-line {
    display:flex;
    align-items:center;
    gap:8px;
}

.campaign-summary {
    margin-top:5px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.campaign-row-metrics {
    display:grid;
    grid-template-columns:
        repeat(
            3,
            minmax(85px,1fr)
        );
    gap:20px;
}

.campaign-row-metrics small,
.campaign-row-metrics strong {
    display:block;
}

.campaign-row-metrics small {
    color:var(--text-soft);
}

.status {
    padding:4px 7px;
    border-radius:999px;
    font-size:10px;
    font-weight:800;
}

.status-draft {
    background:var(--surface-strong);
    color:var(--text-soft);
}

.status-planned {
    background:var(--blue-soft);
    color:var(--blue);
}

.status-active {
    background:var(--green-soft);
    color:var(--green);
}

.status-paused {
    background:var(--orange-soft);
    color:var(--orange);
}

.status-completed {
    background:#e9ecff;
    color:var(--violet);
}

.campaign-detail-head {
    margin-bottom:17px;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
}

.campaign-detail-head h2 {
    margin:8px 0;
    font-size:28px;
}

.campaign-meta-row {
    display:flex;
    align-items:center;
    gap:9px;
}

.task-add-form {
    display:grid;
    grid-template-columns:
        1fr auto auto;
    gap:8px;
    margin-bottom:13px;
}

.task-row {
    padding:10px 0;
    display:flex;
    gap:9px;
    align-items:center;
    border-bottom:1px solid var(--line);
}

.task-check {
    width:25px;
    height:25px;
    border:1px solid var(--line);
    border-radius:7px;
    background:var(--surface);
    cursor:pointer;
}

.task-check.done {
    border-color:var(--green);
    background:var(--green);
    color:#fff;
}

.task-done {
    color:var(--text-soft);
    text-decoration:line-through;
}

/* Calendar */

.calendar-toolbar {
    margin-bottom:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
}

.calendar-toolbar h2 {
    width:205px;
    margin:0;
    text-align:center;
    font-size:21px;
}

.calendar-weekdays,
.calendar-grid {
    display:grid;
    grid-template-columns:
        repeat(
            7,
            minmax(0,1fr)
        );
}

.calendar-weekdays {
    border:1px solid var(--line);
    border-bottom:0;
}

.calendar-weekdays div {
    padding:9px;
    background:var(--surface-soft);
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    text-align:center;
}

.calendar-grid {
    border-left:1px solid var(--line);
    border-top:1px solid var(--line);
}

.calendar-day {
    min-height:125px;
    padding:7px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
    background:var(--surface);
}

.calendar-day.outside {
    opacity:.35;
}

.calendar-day.today {
    background:var(--blue-soft);
}

.calendar-day-number {
    margin-bottom:6px;
    font-size:11px;
    font-weight:900;
}

.calendar-events {
    display:flex;
    flex-direction:column;
    gap:3px;
}

.calendar-event {
    padding:4px 5px;
    overflow:hidden;
    border-radius:5px;
    text-overflow:ellipsis;
    white-space:nowrap;
    text-decoration:none;
    font-size:9px;
    font-weight:750;
}

.calendar-event-campaign_start {
    background:var(--green-soft);
    color:var(--green);
}

.calendar-event-campaign_end {
    background:var(--coral-soft);
    color:var(--coral);
}

.calendar-event-task {
    background:var(--blue-soft);
    color:var(--blue);
}

.calendar-event-task_done {
    background:var(--surface-soft);
    color:var(--text-faint);
    text-decoration:line-through;
}

.calendar-legend {
    margin-top:13px;
    display:flex;
    gap:16px;
    color:var(--text-soft);
    font-size:11px;
}

/* Footer */

.mz-footer {
    margin-top:70px;
    border-top:1px solid var(--line);
    background:var(--surface);
}

.mz-footer-grid {
    width:min(1240px,calc(100% - 36px));
    margin:auto;
    padding:42px 0;
    display:grid;
    grid-template-columns:
        2fr 1fr 1fr;
    gap:40px;
}

.mz-footer-grid p {
    max-width:400px;
    color:var(--text-soft);
    line-height:1.6;
}

.mz-footer-grid > div:not(:first-child) {
    display:flex;
    flex-direction:column;
    gap:9px;
}

.mz-footer-grid > div:not(:first-child) a {
    color:var(--text-soft);
    text-decoration:none;
    font-size:13px;
}

.mz-footer-bottom {
    width:min(1240px,calc(100% - 36px));
    margin:auto;
    padding:17px 0 24px;
    display:flex;
    justify-content:space-between;
    border-top:1px solid var(--line);
    color:var(--text-faint);
    font-size:11px;
}

.mobile-app-toggle {
    display:none;
}

@media(max-width:950px) {

    .mz-nav-links {
        display:none;
    }

    .mz-tool-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .mz-tool-workspace,
    .dashboard-grid {
        grid-template-columns:1fr;
    }

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

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

    .campaign-row-metrics {
        width:100%;
    }
}

@media(max-width:760px) {

    .app-sidebar {
        transform:translateX(-100%);
        transition:transform .2s ease;
    }

    .app-sidebar.open {
        transform:translateX(0);
    }

    .app-main {
        margin-left:0;
    }

    .mobile-app-toggle {
        width:38px;
        height:38px;
        display:grid;
        place-items:center;
        border:1px solid var(--line);
        border-radius:9px;
        background:var(--surface);
    }

    .app-content {
        padding:16px;
    }

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

    .field-span-2 {
        grid-column:auto;
    }

    .channel-grid {
        grid-template-columns:1fr;
    }

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

    .calendar-weekdays {
        display:none;
    }

    .calendar-grid {
        grid-template-columns:1fr;
    }

    .calendar-day.outside {
        display:none;
    }

    .mz-footer-grid {
        grid-template-columns:1fr;
    }
}

@media(max-width:560px) {

    .mz-tool-grid,
    .metric-grid {
        grid-template-columns:1fr;
    }

    .mz-public-nav {
        width:calc(100% - 24px);
    }

    .mz-free-pill {
        display:none;
    }

    .mz-hero {
        padding:65px 15px 55px;
    }

    .mz-hero-actions {
        display:grid;
    }

    .mz-button {
        width:100%;
    }

    .mz-section {
        width:calc(100% - 24px);
    }

    .mz-tool-layout {
        width:calc(100% - 24px);
    }

    .mz-footer-bottom {
        flex-direction:column;
        gap:6px;
    }
}

/* =====================================================
   PHASE 3A — CONTENT STUDIO
   ===================================================== */

.flash {
    margin-bottom:16px;
    padding:12px 14px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface);
    font-size:13px;
}

.flash.success {
    border-left:4px solid var(--green);
}

.flash.error {
    border-left:4px solid var(--coral);
}

.content-editor-layout {
    margin-top:15px;
    display:grid;
    grid-template-columns:
        minmax(0,1.65fr)
        minmax(310px,.75fr);
    gap:15px;
}

.content-secondary-actions {
    margin-top:20px;
    padding-top:17px;
    border-top:1px solid var(--line);
    display:flex;
    gap:8px;
}

.content-filter-bar {
    margin:15px 0;
    padding:12px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface);
}

.content-filters {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.content-filters select {
    min-width:150px;
    padding:9px 11px;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--page);
    color:var(--text);
}

.content-table-wrap {
    width:100%;
    overflow-x:auto;
}

.content-table {
    width:100%;
    border-collapse:collapse;
    font-size:13px;
}

.content-table th {
    padding:11px 15px;
    border-bottom:1px solid var(--line);
    color:var(--text-soft);
    background:var(--surface-soft);
    text-align:left;
    font-size:10px;
    font-weight:850;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.content-table td {
    padding:14px 15px;
    border-bottom:1px solid var(--line);
    vertical-align:middle;
}

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

.content-row {
    cursor:pointer;
}

.content-row:hover td {
    background:var(--surface-soft);
}

.content-table td:first-child {
    min-width:260px;
}

.content-table td:first-child strong,
.content-table td:first-child small {
    display:block;
}

.content-table td:first-child small {
    max-width:480px;
    margin-top:4px;
    overflow:hidden;
    color:var(--text-soft);
    text-overflow:ellipsis;
    white-space:nowrap;
}

.content-empty-cell {
    padding:50px 20px !important;
    text-align:center;
    color:var(--text-soft);
}

.content-empty-cell strong {
    display:block;
    color:var(--text);
    font-size:18px;
}

.content-empty-cell p {
    margin:8px auto 18px;
}

.status-ready {
    background:var(--blue-soft);
    color:var(--blue);
}

.status-published {
    background:var(--green-soft);
    color:var(--green);
}

@media(max-width:1050px) {

    .content-editor-layout {
        grid-template-columns:1fr;
    }
}

@media(max-width:700px) {

    .content-filters {
        display:grid;
        grid-template-columns:1fr;
    }

    .content-filters select {
        width:100%;
    }
}

/* =====================================================
   PHASE 3B — GENERATOR UTILITIES
   ===================================================== */

.mz-output {
    font-family:inherit;
}

.mz-output:empty::before {
    content:"No output yet.";
    color:var(--text-faint);
}

.mz-tool-panel-body
.mz-button + .mz-button {
    margin-left:6px;
}

@media(max-width:560px) {

    .mz-tool-panel-body
    .mz-button {
        width:100%;
    }

    .mz-tool-panel-body
    .mz-button + .mz-button {
        margin-left:0;
        margin-top:8px;
    }
}

/* PHASE 4A CONTACTS RECOVERY */

.contacts-top-actions {
    display:flex;
    gap:8px;
}

.contacts-import-panel {
    max-width:780px;
    margin-top:16px;
}

.contact-import-box {
    padding:24px;
    border:1px dashed var(--line);
    border-radius:12px;
    background:var(--surface-soft);
}

.contact-profile-layout {
    margin-top:16px;
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(280px,.55fr);
    gap:15px;
    align-items:start;
}

.contact-campaign-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.contact-score-card {
    position:sticky;
    top:82px;
}

.contact-score-number {
    font-size:52px;
    line-height:1;
    font-weight:850;
    letter-spacing:-.05em;
}

.contact-score-number span {
    color:var(--text-faint);
    font-size:16px;
}

.score-track {
    height:8px;
    margin:15px 0;
    overflow:hidden;
    border-radius:999px;
    background:var(--surface-strong);
}

.score-fill {
    height:100%;
    border-radius:inherit;
    background:linear-gradient(
        90deg,
        var(--coral),
        var(--orange),
        var(--green)
    );
}

.score-reason {
    margin-top:16px;
    padding-top:15px;
    border-top:1px solid var(--line);
}

.score-reason p {
    color:var(--text-soft);
    font-size:12px;
    line-height:1.6;
}

.contacts-filter-bar {
    margin:15px 0;
    padding:12px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface);
}

.contacts-filters {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
}

.contacts-filters input,
.contacts-filters select {
    height:38px;
    padding:0 10px;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--page);
    color:var(--text);
}

.contacts-filters input {
    width:220px;
}

.contacts-table-wrap {
    width:100%;
    overflow-x:auto;
}

.contacts-table {
    width:100%;
    border-collapse:collapse;
    font-size:13px;
}

.contacts-table th {
    padding:11px 15px;
    border-bottom:1px solid var(--line);
    background:var(--surface-soft);
    color:var(--text-soft);
    text-align:left;
    font-size:10px;
    font-weight:850;
    text-transform:uppercase;
}

.contacts-table td {
    padding:13px 15px;
    border-bottom:1px solid var(--line);
    vertical-align:middle;
}

.contact-row {
    cursor:pointer;
}

.contact-row:hover td {
    background:var(--surface-soft);
}

.contact-name-cell {
    min-width:220px;
    display:flex;
    align-items:center;
    gap:10px;
}

.contact-avatar {
    width:36px;
    height:36px;
    flex:0 0 36px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:var(--blue-soft);
    color:var(--blue);
    font-weight:900;
}

.contact-name-cell strong,
.contact-name-cell small,
.contacts-table td:nth-child(2) strong,
.contacts-table td:nth-child(2) small {
    display:block;
}

.contact-name-cell small,
.contacts-table td:nth-child(2) small {
    margin-top:3px;
    color:var(--text-soft);
}

.contact-score-inline {
    display:flex;
    align-items:center;
    gap:8px;
}

.mini-score-track {
    width:55px;
    height:5px;
    overflow:hidden;
    border-radius:99px;
    background:var(--surface-strong);
}

.mini-score-fill {
    height:100%;
    background:var(--blue);
}

.tag-list {
    min-width:130px;
    display:flex;
    flex-wrap:wrap;
    gap:4px;
}

.contact-tag {
    padding:3px 6px;
    border-radius:6px;
    background:var(--surface-soft);
    color:var(--text-soft);
    font-size:10px;
    font-weight:750;
}

.status-lead {
    background:var(--blue-soft);
    color:var(--blue);
}

.status-qualified {
    background:var(--orange-soft);
    color:var(--orange);
}

.status-customer {
    background:var(--green-soft);
    color:var(--green);
}

.status-inactive {
    background:var(--surface-strong);
    color:var(--text-soft);
}

@media(max-width:1050px) {
    .contact-profile-layout {
        grid-template-columns:1fr;
    }

    .contact-score-card {
        position:static;
    }
}

@media(max-width:820px) {
    .contacts-filter-bar {
        align-items:stretch;
        flex-direction:column;
    }

    .contacts-filters {
        display:grid;
        grid-template-columns:1fr;
    }

    .contacts-filters input,
    .contacts-filters select {
        width:100%;
    }

    .contact-campaign-grid {
        grid-template-columns:1fr;
    }
}

/* =====================================================
   PHASE 4B — AUDIENCE LAB
   ===================================================== */

.audience-layout {
    margin-top:16px;
    display:grid;
    grid-template-columns:
        minmax(0,1.65fr)
        minmax(300px,.55fr);
    gap:15px;
    align-items:start;
}

.audience-filter-grid {
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:14px;
}

.audience-sidebar {
    display:flex;
    flex-direction:column;
    gap:15px;
    position:sticky;
    top:82px;
}

.audience-results-panel {
    margin-top:15px;
}

.audience-assign-panel .btn[disabled] {
    opacity:.45;
    cursor:not-allowed;
}

.audience-saved-list {
    display:flex;
    flex-direction:column;
}

.audience-saved-row {
    padding:12px 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border-bottom:1px solid var(--line);
}

.audience-saved-row:last-child {
    border-bottom:0;
}

.audience-saved-row > a {
    min-width:0;
    flex:1;
    text-decoration:none;
}

.audience-saved-row strong,
.audience-saved-row small {
    display:block;
}

.audience-saved-row small {
    margin-top:3px;
    color:var(--text-soft);
    font-size:11px;
}

.audience-delete {
    width:27px;
    height:27px;
    border:1px solid var(--line);
    border-radius:7px;
    background:var(--surface);
    color:var(--text-soft);
    cursor:pointer;
    font-size:17px;
    line-height:1;
}

.audience-delete:hover {
    border-color:var(--coral);
    color:var(--coral);
}

@media(max-width:1100px) {

    .audience-layout {
        grid-template-columns:1fr;
    }

    .audience-sidebar {
        position:static;
    }
}

@media(max-width:700px) {

    .audience-filter-grid {
        grid-template-columns:1fr;
    }

    .audience-filter-grid
    .field-span-2 {
        grid-column:auto;
    }
}


/* =====================================================
   PHASE 5A — CRM FOUNDATION
   ===================================================== */

.crm-stage-strip {
    margin:15px 0;
    display:grid;
    grid-template-columns:
        repeat(
            5,
            minmax(0,1fr)
        );
    gap:9px;
}

.crm-stage-card {
    min-height:105px;
    padding:14px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface);
    text-decoration:none;
}

.crm-stage-card:hover {
    border-color:var(--blue);
    transform:translateY(-1px);
}

.crm-stage-card span {
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.crm-stage-card strong {
    font-size:17px;
}

.crm-stage-card small {
    color:var(--text-faint);
}

.crm-detail-layout {
    margin-top:15px;
    display:grid;
    grid-template-columns:
        minmax(0,1.55fr)
        minmax(300px,.55fr);
    gap:15px;
    align-items:start;
}

.crm-detail-sidebar {
    position:sticky;
    top:82px;
    display:flex;
    flex-direction:column;
    gap:15px;
}

.crm-deal-value {
    padding-bottom:16px;
    margin-bottom:8px;
    border-bottom:1px solid var(--line);
}

.crm-deal-value span {
    display:block;
    color:var(--text-soft);
    font-size:11px;
    font-weight:800;
    letter-spacing:.07em;
}

.crm-deal-value strong {
    display:block;
    margin-top:5px;
    font-size:35px;
    letter-spacing:-.04em;
}

.crm-summary-row {
    padding:10px 0;
    display:flex;
    justify-content:space-between;
    gap:18px;
    border-bottom:1px solid var(--line);
    font-size:12px;
}

.crm-summary-row:last-child {
    border-bottom:0;
}

.crm-summary-row span {
    color:var(--text-soft);
}

.crm-stage-pill {
    display:inline-flex;
    padding:5px 8px;
    border-radius:7px;
    background:var(--blue-soft);
    color:var(--blue);
    font-size:11px;
    font-weight:800;
}

.crm-probability {
    min-width:100px;
    display:flex;
    align-items:center;
    gap:8px;
}

.crm-activity-list {
    max-height:430px;
    overflow:auto;
}

.crm-activity-item {
    position:relative;
    padding:13px 14px 13px 34px;
    border-bottom:1px solid var(--line);
}

.crm-activity-item:last-child {
    border-bottom:0;
}

.crm-activity-dot {
    position:absolute;
    top:17px;
    left:15px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--blue);
}

.crm-activity-item strong,
.crm-activity-item small {
    display:block;
}

.crm-activity-item strong {
    font-size:12px;
}

.crm-activity-item small {
    margin-top:4px;
    color:var(--text-faint);
    font-size:10px;
}

.crm-table td:first-child strong,
.crm-table td:first-child small {
    display:block;
}

.crm-table td:first-child small {
    margin-top:4px;
    color:var(--text-soft);
}

.status-open {
    background:var(--blue-soft);
    color:var(--blue);
}

.status-won {
    background:var(--green-soft);
    color:var(--green);
}

.status-lost {
    background:var(--coral-soft);
    color:var(--coral);
}

@media(max-width:1180px) {

    .crm-stage-strip {
        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );
    }
}

@media(max-width:1050px) {

    .crm-detail-layout {
        grid-template-columns:1fr;
    }

    .crm-detail-sidebar {
        position:static;
    }
}

@media(max-width:700px) {

    .crm-stage-strip {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }
}

@media(max-width:480px) {

    .crm-stage-strip {
        grid-template-columns:1fr;
    }
}


/* =====================================================
   PHASE 5B-1 — CRM KANBAN
   ===================================================== */

.crm-top-actions {
    display:flex;
    align-items:center;
    gap:8px;
}

.crm-view-switch {
    display:flex;
    gap:4px;
    padding:3px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface-soft);
}

.crm-view-switch .btn {
    height:32px;
    padding:0 10px;
    border:0;
}

.crm-view-switch .is-active {
    background:var(--surface);
    box-shadow:0 1px 4px rgba(0,0,0,.08);
}

.crm-kanban-board {
    margin-top:16px;
    display:grid;
    grid-template-columns:
        repeat(
            5,
            minmax(245px,1fr)
        );
    gap:12px;
    overflow-x:auto;
    padding-bottom:12px;
}

.crm-kanban-column {
    min-width:245px;
    display:flex;
    flex-direction:column;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--surface-soft);
    overflow:hidden;
}

.crm-kanban-column-head {
    padding:13px 14px;
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:flex-start;
    border-bottom:1px solid var(--line);
    background:var(--surface);
}

.crm-kanban-column-head strong,
.crm-kanban-column-head small {
    display:block;
}

.crm-kanban-column-head strong {
    font-size:13px;
}

.crm-kanban-column-head small {
    margin-top:3px;
    color:var(--text-soft);
    font-size:10px;
}

.crm-kanban-stage-value {
    color:var(--text-soft);
    font-size:12px;
    font-weight:800;
}

.crm-kanban-cards {
    min-height:280px;
    padding:9px;
    display:flex;
    flex-direction:column;
    gap:9px;
}

.crm-kanban-empty {
    padding:24px 12px;
    color:var(--text-faint);
    text-align:center;
    font-size:11px;
}

.crm-kanban-card {
    border:1px solid var(--line);
    border-radius:11px;
    background:var(--surface);
    box-shadow:0 2px 8px rgba(0,0,0,.035);
    overflow:hidden;
}

.crm-kanban-card-main {
    display:block;
    padding:12px;
    text-decoration:none;
}

.crm-kanban-card:hover {
    border-color:var(--blue);
}

.crm-kanban-card-top {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:8px;
}

.crm-kanban-card-top > strong {
    line-height:1.35;
    font-size:13px;
}

.crm-kanban-money {
    margin-top:10px;
    font-size:19px;
    font-weight:850;
    letter-spacing:-.03em;
}

.crm-kanban-meta {
    margin-top:9px;
    display:flex;
    justify-content:space-between;
    gap:8px;
    color:var(--text-soft);
    font-size:10px;
}

.crm-kanban-campaign {
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid var(--line);
    color:var(--text-faint);
    font-size:10px;
}

.crm-kanban-actions {
    padding:8px;
    display:grid;
    gap:7px;
    border-top:1px solid var(--line);
    background:var(--surface-soft);
}

.crm-kanban-actions select {
    width:100%;
    height:31px;
    padding:0 7px;
    border:1px solid var(--line);
    border-radius:7px;
    background:var(--surface);
    color:var(--text);
    font-size:10px;
}

.crm-quick-status {
    display:grid;
    grid-template-columns:
        repeat(3,1fr);
    gap:5px;
}

.crm-quick-status button {
    height:28px;
    border:1px solid var(--line);
    border-radius:7px;
    background:var(--surface);
    color:var(--text-soft);
    cursor:pointer;
    font-size:10px;
    font-weight:850;
}

.crm-quick-status button:hover {
    border-color:var(--blue);
    color:var(--blue);
}

.crm-quick-status button.is-current {
    background:var(--blue-soft);
    color:var(--blue);
    border-color:transparent;
}

.crm-kanban-column-foot {
    margin-top:auto;
    padding:10px 14px;
    display:flex;
    justify-content:space-between;
    gap:10px;
    border-top:1px solid var(--line);
    background:var(--surface);
    font-size:10px;
}

.crm-kanban-column-foot span {
    color:var(--text-soft);
}

@media(max-width:850px) {

    .crm-top-actions {
        gap:5px;
    }

    .crm-view-switch .btn,
    .crm-top-actions > .btn {
        padding:0 8px;
        font-size:10px;
    }
}


/* =====================================================
   PHASE 5B-2 — CRM ANALYTICS
   ===================================================== */

.crm-attribution-grid {
    margin:15px 0;
    display:grid;
    grid-template-columns:
        minmax(0,1.1fr)
        minmax(0,.9fr);
    gap:15px;
}

.crm-insight-metrics {
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:10px;
}

.crm-insight-metrics > div {
    padding:12px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface-soft);
}

.crm-insight-metrics small,
.crm-insight-metrics strong {
    display:block;
}

.crm-insight-metrics small {
    color:var(--text-soft);
    font-size:10px;
    font-weight:750;
}

.crm-insight-metrics strong {
    margin-top:5px;
    font-size:18px;
}

.crm-outcome-bar {
    height:8px;
    margin-top:14px;
    border-radius:999px;
    overflow:hidden;
    background:var(--coral-soft);
}

.crm-outcome-won {
    height:100%;
    background:var(--green);
}

.crm-stage-distribution {
    display:flex;
    flex-direction:column;
}

.crm-stage-distribution-row {
    padding:12px 14px;
    display:flex;
    justify-content:space-between;
    gap:14px;
    border-bottom:1px solid var(--line);
}

.crm-stage-distribution-row:last-child {
    border-bottom:0;
}

.crm-stage-distribution-row > div:last-child {
    text-align:right;
}

.crm-stage-distribution-row strong,
.crm-stage-distribution-row small {
    display:block;
}

.crm-stage-distribution-row small {
    margin-top:3px;
    color:var(--text-soft);
    font-size:10px;
}

.crm-campaign-attribution {
    margin-bottom:15px;
}

.crm-unattributed-row td {
    background:var(--surface-soft);
}

.crm-contact-deals {
    margin-top:15px;
}

.crm-contact-summary {
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:8px;
    margin-bottom:12px;
}

.crm-contact-summary > div {
    padding:10px;
    border:1px solid var(--line);
    border-radius:9px;
    background:var(--surface-soft);
}

.crm-contact-summary small,
.crm-contact-summary strong {
    display:block;
}

.crm-contact-summary small {
    color:var(--text-soft);
    font-size:10px;
}

.crm-contact-summary strong {
    margin-top:4px;
    font-size:14px;
}

.crm-contact-deal-list {
    display:flex;
    flex-direction:column;
}

.crm-contact-deal-row {
    padding:10px 0;
    display:flex;
    justify-content:space-between;
    gap:10px;
    border-bottom:1px solid var(--line);
    text-decoration:none;
}

.crm-contact-deal-row:last-child {
    border-bottom:0;
}

.crm-contact-deal-row > div:last-child {
    text-align:right;
}

.crm-contact-deal-row strong,
.crm-contact-deal-row small {
    display:block;
}

.crm-contact-deal-row small {
    margin-top:3px;
    color:var(--text-soft);
    font-size:10px;
}

.dashboard-crm-section {
    margin-top:22px;
}

.dashboard-section-head {
    margin-bottom:12px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.dashboard-section-head h2 {
    margin:0;
}

.dashboard-section-head p {
    margin:3px 0 0;
}

.dashboard-crm-campaigns {
    margin-top:14px;
}

.crm-dashboard-campaign-list {
    display:flex;
    flex-direction:column;
}

.crm-dashboard-campaign-row {
    padding:12px 14px;
    display:flex;
    justify-content:space-between;
    gap:12px;
    border-bottom:1px solid var(--line);
}

.crm-dashboard-campaign-row:last-child {
    border-bottom:0;
}

.crm-dashboard-campaign-row > div:last-child {
    text-align:right;
}

.crm-dashboard-campaign-row strong,
.crm-dashboard-campaign-row small {
    display:block;
}

.crm-dashboard-campaign-row small {
    margin-top:3px;
    color:var(--text-soft);
    font-size:10px;
}

@media(max-width:1000px) {

    .crm-attribution-grid {
        grid-template-columns:1fr;
    }
}

@media(max-width:650px) {

    .crm-insight-metrics,
    .crm-contact-summary {
        grid-template-columns:1fr;
    }

    .dashboard-section-head {
        align-items:flex-start;
        flex-direction:column;
    }
}

