:root {
    --ink: #14110b;
    --muted: #716b61;
    --line: rgba(20, 17, 11, 0.1);
    --panel: rgba(255, 255, 255, 0.86);
    --panel-strong: #ffffff;
    --surface: #f7f7f4;
    --input-bg: rgba(255, 255, 255, 0.88);
    --brand: #8a681d;
    --brand-rgb: 138,104,29;
    --brand-strong: #735516;
    --brand-strong-rgb: 115,85,22;
    --brand-deep: #5f4512;
    --brand-deep-rgb: 95,69,18;
    --banner-gold-start: #8a681d;
    --banner-gold-start-rgb: 138,104,29;
    --banner-gold-mid: #674911;
    --banner-gold-mid-rgb: 103,73,17;
    --banner-gold-end: #342306;
    --banner-gold-end-rgb: 52,35,6;
    --banner-gold-gradient: linear-gradient(135deg, var(--banner-gold-start), var(--banner-gold-mid) 58%, var(--banner-gold-end));
    --aqua: #0f766e;
    --aqua-rgb: 15,118,110;
    --coral: #a65a45;
    --gold: #b98a2c;
    --gold-rgb: 185,138,44;
    --gold-dark: #8a681d;
    --gold-deep: #5f4512;
    --green: #2f7d50;
    --shadow: 0 22px 70px rgba(31, 42, 68, 0.14);
    --soft-shadow: 0 14px 36px rgba(31, 42, 68, 0.1);
    --radius: 8px;
    --sidebar-width: 284px;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="dark"] {
    --ink: #f0eee8;
    --muted: #b2aa9c;
    --line: rgba(240, 238, 232, 0.12);
    --panel: rgba(20, 29, 42, 0.84);
    --panel-strong: #182335;
    --surface: #0d141f;
    --input-bg: rgba(18, 27, 40, 0.78);
    --brand: #d6ad4d;
    --brand-rgb: 214,173,77;
    --brand-strong: #c79a36;
    --brand-strong-rgb: 199,154,54;
    --brand-deep: #f0d892;
    --brand-deep-rgb: 240,216,146;
    --banner-gold-start: #8a681d;
    --banner-gold-start-rgb: 138,104,29;
    --banner-gold-mid: #674911;
    --banner-gold-mid-rgb: 103,73,17;
    --banner-gold-end: #342306;
    --banner-gold-end-rgb: 52,35,6;
    --banner-gold-gradient: linear-gradient(135deg, var(--banner-gold-start), var(--banner-gold-mid) 58%, var(--banner-gold-end));
    --aqua: #63c7bd;
    --aqua-rgb: 99,199,189;
    --coral: #d18470;
    --gold: #d8b35a;
    --gold-rgb: 216,179,90;
    --gold-dark: #f0d892;
    --gold-deep: #8a681d;
    --green: #72c090;
    --shadow: 0 24px 76px rgba(0, 0, 0, 0.36);
    --soft-shadow: 0 16px 42px rgba(0, 0, 0, 0.24);
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background: var(--surface);
}

body {
    min-height: 100%;
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 14% 8%, rgba(var(--brand-rgb), 0.14), transparent 28rem),
        radial-gradient(circle at 88% 18%, rgba(var(--brand-deep-rgb), 0.1), transparent 24rem),
        linear-gradient(135deg, #fbfbf8 0%, #f7f7f4 48%, #f2eee4 100%);
    overflow-x: hidden;
}

.brand-word,
.brand-nowrap {
    white-space: nowrap;
    word-break: keep-all;
}

:root[data-theme="dark"] body {
    background:
        radial-gradient(circle at 16% 7%, rgba(var(--gold-rgb), 0.14), transparent 27rem),
        radial-gradient(circle at 86% 16%, rgba(var(--brand-rgb), 0.1), transparent 25rem),
        linear-gradient(135deg, #0d141f 0%, #111a27 52%, #1f1a10 100%);
}

:root[data-theme="dark"] .ambient {
    opacity: 0.18;
}

@media (max-width: 979px) {
        body {
            background:
                linear-gradient(145deg, rgba(var(--brand-rgb), 0.08) 0%, transparent 34rem),
                linear-gradient(215deg, rgba(var(--brand-deep-rgb), 0.08) 0%, transparent 30rem),
                #f7f7f4;
    }

        :root[data-theme="dark"] body {
            background:
                linear-gradient(145deg, rgba(var(--gold-rgb), 0.1) 0%, transparent 34rem),
                linear-gradient(215deg, rgba(var(--brand-rgb), 0.08) 0%, transparent 30rem),
                #0d141f;
    }

    .ambient {
        display: none;
        animation: none;
    }

    .surface-motion-lattice {
        opacity: 0.07;
        background-size: 5.75rem 5.75rem;
    }

    .surface-motion-sheen {
        opacity: 0.42;
    }

    .login-metrics div,
    .stat-card,
    .panel,
    .login-card,
    .mobile-topbar,
    .mobile-drawer {
        backdrop-filter: none;
    }
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

.ambient {
    position: fixed;
    width: 28rem;
    height: 28rem;
    border-radius: 999px;
    filter: blur(26px);
    opacity: 0.26;
    pointer-events: none;
    z-index: 0;
    animation: floatGlow 12s ease-in-out infinite;
}

.ambient-one {
    top: -12rem;
    right: -8rem;
    background: var(--brand);
}

.ambient-two {
    bottom: -14rem;
    left: -10rem;
    background: var(--brand-deep);
    animation-delay: -5s;
}

.surface-motion {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.surface-motion-lattice {
    opacity: 0.12;
    background-image:
        linear-gradient(90deg, rgba(var(--brand-rgb), 0.2) 1px, transparent 1px),
        linear-gradient(0deg, rgba(var(--brand-rgb), 0.14) 1px, transparent 1px);
    background-position: 0 0, 0 0;
    background-size: 7.5rem 7.5rem;
    mask-image: linear-gradient(120deg, transparent 0 12%, #000 30% 74%, transparent 100%);
    -webkit-mask-image: linear-gradient(120deg, transparent 0 12%, #000 30% 74%, transparent 100%);
    animation: surfaceLatticeDrift 34s linear infinite;
}

.surface-motion-sheen {
    opacity: 0.72;
    background:
        linear-gradient(112deg, transparent 0 33%, rgba(255, 255, 255, 0.36) 42%, transparent 52%),
        linear-gradient(152deg, transparent 0 62%, rgba(var(--brand-rgb), 0.1) 72%, transparent 84%);
    background-position: -120% 0, 120% 0;
    background-size: 240% 100%, 220% 100%;
    mix-blend-mode: soft-light;
    animation: surfaceSheenSweep 22s cubic-bezier(0.54, 0, 0.26, 1) infinite;
}

.surface-motion-grain {
    opacity: 0.034;
    background-image:
        repeating-linear-gradient(0deg, rgba(20, 17, 11, 0.32) 0 1px, transparent 1px 3px),
        repeating-linear-gradient(90deg, rgba(20, 17, 11, 0.2) 0 1px, transparent 1px 4px);
    background-size: 4px 4px, 5px 5px;
    animation: surfaceGrainShift 1.2s steps(4, end) infinite;
}

:root[data-theme="dark"] .surface-motion-lattice {
    opacity: 0.1;
    background-image:
        linear-gradient(90deg, rgba(var(--gold-rgb), 0.18) 1px, transparent 1px),
        linear-gradient(0deg, rgba(var(--gold-rgb), 0.12) 1px, transparent 1px);
}

:root[data-theme="dark"] .surface-motion-sheen {
    opacity: 0.5;
    background:
        linear-gradient(112deg, transparent 0 34%, rgba(var(--gold-rgb), 0.24) 43%, transparent 54%),
        linear-gradient(152deg, transparent 0 62%, rgba(var(--aqua-rgb), 0.1) 72%, transparent 84%);
}

:root[data-theme="dark"] .surface-motion-grain {
    opacity: 0.045;
    background-image:
        repeating-linear-gradient(0deg, rgba(240, 238, 232, 0.22) 0 1px, transparent 1px 3px),
        repeating-linear-gradient(90deg, rgba(240, 238, 232, 0.16) 0 1px, transparent 1px 4px);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.brand strong,
.brand span {
    display: block;
}

.brand small {
    display: block;
    color: var(--muted);
    font-size: 0.76rem;
    margin-top: 0.1rem;
}

.brand-wordmark {
    display: block;
    width: auto;
    height: auto;
    max-height: 2.4rem;
    max-width: 8.75rem;
    object-fit: contain;
}

.brand-wordmark.is-compact {
    max-height: 2rem;
    max-width: 7.25rem;
}

:root[data-theme="dark"] .brand-wordmark {
    filter: brightness(0) invert(1) saturate(0.2) opacity(0.92);
}

.brand-menu-logo {
    display: block;
    width: 2.18rem;
    height: 2.25rem;
    max-width: 2.18rem;
    max-height: 2.25rem;
    flex: 0 0 auto;
    object-fit: contain;
}

.brand-menu-logo.is-compact {
    width: 2rem;
    height: 2.06rem;
    max-width: 2rem;
    max-height: 2.06rem;
}

:root[data-theme="dark"] .brand-menu-logo {
    filter: none;
}

.brand-mark {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    font-weight: 800;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.22), transparent),
        var(--banner-gold-gradient);
    box-shadow: 0 16px 34px rgba(138, 104, 29, 0.28);
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.eyebrow:before {
    content: "";
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 999px;
    background: var(--coral);
    box-shadow: 0 0 0 0.35rem rgba(166, 90, 69, 0.12);
}

.login-page {
    min-height: 100vh;
}

.login-shell {
    position: relative;
    z-index: 1;
    display: grid;
    min-height: 100vh;
    gap: 2rem;
    padding: 1.25rem;
    align-items: center;
}

.login-intro {
    display: grid;
    gap: 2rem;
    animation: riseIn 520ms ease both;
}

.login-brand {
    width: max-content;
}

.login-copy {
    max-width: 40rem;
}

.login-copy h1 {
    margin: 0.75rem 0 1rem;
    font-size: clamp(2.55rem, 12vw, 5.2rem);
    line-height: 0.94;
    letter-spacing: 0;
}

.login-copy p {
    max-width: 34rem;
    margin: 0;
    color: var(--muted);
    font-size: 1.06rem;
    line-height: 1.7;
}

.login-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.login-metrics div,
.stat-card,
.panel,
.login-card {
    border: 1px solid rgba(255, 255, 255, 0.72);
    background: var(--panel);
    box-shadow: var(--soft-shadow);
    backdrop-filter: blur(22px);
}

.login-metrics div {
    min-width: 0;
    padding: 1rem;
    border-radius: var(--radius);
}

.login-metrics strong {
    display: block;
    font-size: 1.35rem;
}

.login-metrics span {
    display: block;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.35;
}

.login-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1.5rem;
    width: 100%;
    max-width: 34rem;
    justify-self: center;
    padding: 1.15rem;
    border-radius: 8px;
    animation: riseIn 620ms ease 100ms both;
}

.card-glow {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.12), transparent 42%),
        radial-gradient(circle at 100% 0, rgba(185, 138, 44, 0.18), transparent 16rem);
    pointer-events: none;
}

.login-card-head,
.form-stack {
    position: relative;
    z-index: 1;
}

.login-card h2 {
    margin: 0.5rem 0 0.3rem;
    font-size: 2rem;
}

.login-card p {
    margin: 0;
    color: var(--muted);
}

.form-stack {
    display: grid;
    gap: 0.85rem;
}

.auth-grid {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1.25rem;
}

.register-stack {
    border-top: 1px solid var(--line);
    padding-top: 1.25rem;
}

.form-title {
    display: block;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 850;
}

.editor-heading-text {
    display: block;
    margin: 0.15rem 0 0;
    color: var(--ink);
    font-size: clamp(1.35rem, 3vw, 2.05rem);
    font-weight: 950;
    line-height: 1.04;
}

.meta-auth-button {
    position: relative;
    z-index: 1;
    display: inline-flex;
    min-height: 3.1rem;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius);
    color: var(--ink);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 244, 235, 0.9));
    box-shadow: 0 16px 36px rgba(138, 104, 29, 0.13);
    font-size: 0.92rem;
    font-weight: 850;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.meta-auth-button:hover {
    transform: translateY(-2px);
    border-color: rgba(138, 104, 29, 0.35);
    box-shadow: 0 20px 42px rgba(138, 104, 29, 0.18);
}

.meta-auth-mark {
    display: inline-flex;
    width: 1.45rem;
    height: 1.45rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    font-size: 0.8rem;
    font-weight: 950;
}

.auth-divider {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.auth-divider:before,
.auth-divider:after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--line);
}

.helper-copy {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.45;
}

.login-notice {
    margin: 0;
}

.login-notice .notice-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.75rem;
}

.login-notice .notice-action-row a {
    flex: 1 1 9rem;
    justify-content: center;
    text-decoration: none;
}

.full-button {
    width: 100%;
}

.form-stack label {
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 750;
}

.input-control {
    width: 100%;
    min-height: 3.15rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem 0.95rem;
    color: var(--ink);
    background: var(--input-bg);
    outline: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease, opacity 180ms ease, background-color 180ms ease;
}

select.input-control,
.transfer-select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2.6rem;
    background:
        linear-gradient(45deg, transparent 50%, var(--muted) 50%) right 1.12rem center / 0.42rem 0.42rem no-repeat,
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.82));
}

.input-control:focus {
    border-color: rgba(138, 104, 29, 0.55);
    box-shadow: 0 0 0 0.25rem rgba(138, 104, 29, 0.1);
    transform: translateY(-1px);
}

.cms-rich-editor {
    display: grid;
    gap: 0.55rem;
}

.cms-rich-toolbar,
.cms-rich-surface {
    display: none;
}

.cms-rich-editor.is-ready:not(.is-plain-text) .cms-rich-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(250, 247, 239, 0.88));
    box-shadow: 0 0.65rem 1.6rem rgba(20, 18, 12, 0.06);
}

.cms-rich-editor.is-ready:not(.is-plain-text) .cms-rich-surface {
    display: block;
    min-height: 10.5rem;
    height: auto;
    overflow: auto;
    white-space: normal;
}

.cms-rich-editor.is-ready:not(.is-plain-text) [data-rich-source] {
    display: none;
}

.cms-rich-button {
    min-width: 2.05rem;
    min-height: 2.05rem;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: 999px;
    padding: 0.28rem 0.62rem;
    background: rgba(255, 255, 255, 0.84);
    color: var(--ink);
    font: inherit;
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1;
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.cms-rich-button:hover,
.cms-rich-button:focus-visible {
    border-color: rgba(138, 104, 29, 0.52);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 0.55rem 1.1rem rgba(138, 104, 29, 0.14);
    transform: translateY(-1px);
}

.cms-rich-button.is-muted {
    color: var(--muted);
    font-weight: 750;
}

.cms-rich-surface h3,
.cms-rich-surface h4 {
    margin: 0.5rem 0 0.35rem;
    color: var(--ink);
    line-height: 1.1;
}

.cms-rich-surface p {
    margin: 0.35rem 0;
}

.cms-rich-surface ul,
.cms-rich-surface ol {
    margin: 0.4rem 0 0.4rem 1.35rem;
    padding: 0;
}

.cms-rich-surface a {
    color: var(--gold);
    font-weight: 800;
}

.form-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: var(--muted);
    font-size: 0.88rem;
}

.check-label {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--muted) !important;
    font-weight: 600 !important;
}

.button-primary,
.button-soft,
.button-quiet,
.button-danger,
.button-secondary,
.send-button,
.chip-button {
    position: relative;
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: 0.58rem;
    overflow: hidden;
    border: 0;
    border-radius: var(--radius);
    font-weight: 800;
    text-decoration: none;
    isolation: isolate;
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}

.button-primary,
.send-button {
    padding: 0 1.22rem;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 34%),
        var(--banner-gold-gradient);
    box-shadow:
        0 16px 34px rgba(52, 35, 6, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.button-primary:before,
.send-button:before,
.public-button:before,
.public-link-button:before {
    content: "";
    position: absolute;
    inset: -40% auto -40% -55%;
    z-index: -1;
    width: 45%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
    transform: skewX(-18deg);
    transition: left 520ms ease;
}

.button-primary:after,
.public-button:after,
.public-link-button:after {
    content: "";
    width: 0.46rem;
    height: 0.46rem;
    border-top: 0.12rem solid currentColor;
    border-right: 0.12rem solid currentColor;
    opacity: 0.82;
    transform: rotate(45deg);
    transition: transform 180ms ease, opacity 180ms ease;
}

.button-primary:hover,
.send-button:hover,
.button-soft:hover,
.button-secondary:hover,
.chip-button:hover {
    transform: translateY(-2px);
}

.button-primary:hover,
.send-button:hover {
    box-shadow:
        0 20px 42px rgba(52, 35, 6, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.button-primary:hover:before,
.send-button:hover:before,
.public-button:hover:before,
.public-link-button:hover:before {
    left: 112%;
}

.button-primary:hover:after,
.public-button:hover:after,
.public-link-button:hover:after {
    opacity: 1;
    transform: translateX(0.12rem) rotate(45deg);
}

.button-primary.compact,
.button-secondary.compact {
    padding: 0 1rem;
}

.button-soft,
.button-quiet,
.button-secondary,
.chip-button {
    color: var(--ink);
    padding: 0 1rem;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.74);
}

.button-danger {
    padding: 0 1rem;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 35%),
        linear-gradient(135deg, #b42318, #7a271a);
    box-shadow: 0 14px 30px rgba(122, 39, 26, 0.26);
}

.button-danger:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 38px rgba(122, 39, 26, 0.34);
}

.button-quiet.danger,
.button-secondary.danger {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.1);
}

.app-shell .button-soft,
.app-shell .button-quiet,
.app-shell .button-secondary,
.app-shell .chip-button {
    color: var(--ink);
    text-shadow: none;
}

.app-shell .button-soft *,
.app-shell .button-quiet *,
.app-shell .button-secondary *,
.app-shell .chip-button * {
    color: inherit;
}

.app-shell .button-primary,
.app-shell .button-danger,
.app-shell .send-button {
    color: #fff;
}

.app-shell .button-primary *,
.app-shell .button-danger *,
.app-shell .send-button * {
    color: inherit;
}

.ai-generate-disabled {
    color: rgba(36, 35, 31, 0.54);
    background: rgba(239, 237, 231, 0.82);
    border-color: rgba(36, 35, 31, 0.12);
    box-shadow: none;
    filter: grayscale(0.9);
}

.ai-generate-disabled:hover {
    color: rgba(36, 35, 31, 0.72);
    background: rgba(239, 237, 231, 0.96);
}

:root[data-theme="dark"] .button-soft,
:root[data-theme="dark"] .button-quiet,
:root[data-theme="dark"] .button-secondary,
:root[data-theme="dark"] .chip-button,
:root[data-theme="dark"] .input-control,
:root[data-theme="dark"] .meta-auth-button {
    color: var(--ink);
    border-color: var(--line);
    background: var(--input-bg);
}

:root[data-theme="dark"] .ai-generate-disabled {
    color: rgba(246, 240, 225, 0.56);
    border-color: rgba(246, 240, 225, 0.12);
    background: rgba(246, 240, 225, 0.08);
}

:root[data-theme="dark"] select.input-control,
:root[data-theme="dark"] .transfer-select {
    background:
        linear-gradient(45deg, transparent 50%, var(--muted) 50%) right 1.12rem center / 0.42rem 0.42rem no-repeat,
        linear-gradient(135deg, rgba(18, 27, 40, 0.94), rgba(24, 35, 53, 0.78));
}

.app-shell {
    min-height: 100vh;
}

.page-transition-veil {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1rem;
    opacity: 0;
    pointer-events: none;
    transform: translateY(0.35rem);
    background:
        linear-gradient(135deg, rgba(251, 251, 248, 0.68), rgba(247, 247, 244, 0.44)),
        rgba(20, 17, 11, 0.04);
    backdrop-filter: blur(14px) saturate(1.08);
    -webkit-backdrop-filter: blur(14px) saturate(1.08);
    transition: opacity 190ms ease, transform 190ms ease;
}

:root[data-theme="dark"] .page-transition-veil {
    background:
        linear-gradient(135deg, rgba(13, 20, 31, 0.78), rgba(17, 26, 39, 0.56)),
        rgba(0, 0, 0, 0.18);
}

.page-transition-mark {
    display: grid;
    width: 4.1rem;
    height: 4.1rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.58);
    box-shadow: 0 1.4rem 3.2rem rgba(31, 42, 68, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92);
    animation: pageTransitionMark 900ms ease-in-out infinite alternate;
}

:root[data-theme="dark"] .page-transition-mark {
    border-color: rgba(240, 238, 232, 0.16);
    background: rgba(18, 27, 40, 0.72);
    box-shadow: 0 1.4rem 3.2rem rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.page-transition-mark img {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
}

.page-transition-track {
    position: relative;
    display: block;
    width: min(9.5rem, 34vw);
    height: 0.16rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(138, 104, 29, 0.18);
}

.page-transition-track i {
    position: absolute;
    inset: 0 auto 0 0;
    width: 52%;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, var(--brand), var(--gold));
    animation: pageTransitionTrack 880ms cubic-bezier(0.62, 0, 0.28, 1) infinite;
}

.is-page-leaving .page-transition-veil {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.main-content {
    animation: pageContentArrive 260ms ease-out both;
}

.mobile-topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    height: 4.25rem;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.72);
    background: rgba(255, 255, 255, 0.76);
    backdrop-filter: blur(20px);
}

.brand-compact {
    font-weight: 850;
}

.brand-compact .brand-mark {
    width: 2.25rem;
    height: 2.25rem;
}

.icon-button {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.75);
    box-shadow: 0 10px 24px rgba(31, 42, 68, 0.08);
}

.primary-icon-button {
    border-color: rgba(138, 104, 29, 0.32);
    color: #ffffff;
    background: linear-gradient(135deg, #8a681d, #4f380d);
    font-size: 1.35rem;
    font-weight: 900;
    cursor: pointer;
}

:root[data-theme="dark"] .mobile-topbar,
:root[data-theme="dark"] .icon-button,
:root[data-theme="dark"] .mobile-drawer {
    border-color: rgba(232, 237, 247, 0.12);
    background: rgba(15, 23, 35, 0.82);
}

.menu-toggle span {
    display: block;
    width: 1.15rem;
    height: 0.12rem;
    margin: 0.12rem 0;
    border-radius: 999px;
    background: var(--ink);
}

.search-dot {
    width: 1rem;
    height: 1rem;
    border: 0.14rem solid currentColor;
    border-radius: 999px;
    position: relative;
}

.search-dot:after {
    content: "";
    position: absolute;
    width: 0.5rem;
    height: 0.13rem;
    right: -0.42rem;
    bottom: -0.22rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
}

.sidebar,
.mobile-drawer {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.72)),
        rgba(255, 255, 255, 0.84);
    backdrop-filter: blur(24px);
}

:root[data-theme="dark"] .sidebar,
:root[data-theme="dark"] .mobile-drawer {
    background:
        linear-gradient(180deg, rgba(20, 29, 42, 0.94), rgba(15, 23, 35, 0.8)),
        rgba(13, 20, 31, 0.9);
}

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 14;
    display: none;
    height: 100dvh;
    max-height: 100dvh;
    width: var(--sidebar-width);
    padding: 1.25rem;
    border-right: 1px solid rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
    overflow: hidden;
}

:root[data-theme="dark"] .sidebar {
    border-right-color: rgba(232, 237, 247, 0.1);
}

.sidebar-head {
    display: block;
    flex: 0 0 auto;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.control-strip {
    display: flex;
    width: 100%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 0.12rem;
    overflow: visible;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.22rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 235, 0.72)),
        rgba(255, 255, 255, 0.8);
    box-shadow: 0 14px 34px rgba(138, 104, 29, 0.12), inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
}

:root[data-theme="dark"] .control-strip {
    border-color: rgba(216, 179, 90, 0.2);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.94), rgba(31, 41, 55, 0.72)),
        rgba(15, 23, 35, 0.8);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.2), inset 0 0.08rem 0 rgba(255, 255, 255, 0.06);
}

.control-strip-logo {
    display: inline-grid;
    width: 2.22rem;
    height: 2.22rem;
    flex: 0 0 2.22rem;
    place-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.64);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
    transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.control-strip-logo:hover {
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.14), inset 0 0.08rem 0 rgba(255, 255, 255, 0.84);
    transform: translateY(-1px);
}

.control-strip-logo .brand-menu-logo {
    width: 1.42rem;
    height: 1.48rem;
    max-width: 1.42rem;
    max-height: 1.48rem;
}

:root[data-theme="dark"] .control-strip-logo {
    background: rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] .control-strip-logo:hover {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 0.65rem 1.25rem rgba(0, 0, 0, 0.2), inset 0 0.08rem 0 rgba(255, 255, 255, 0.08);
}

.control-strip-actions {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 0;
}

.control-strip.is-raised {
    position: absolute;
    top: -0.7rem;
    right: 0.85rem;
    left: 0.85rem;
    z-index: 3;
    width: auto;
    margin: 0;
}

.sidebar-tools {
    justify-content: space-between;
}

.mobile-drawer-tools {
    margin-bottom: 1.25rem;
}

.nav-jump {
    margin-top: 0.8rem;
    position: relative;
    z-index: 1;
}

.sidebar > .nav-jump,
.mobile-drawer > .nav-jump {
    display: none;
}

.sidebar > .nav-jump.is-open,
.mobile-drawer > .nav-jump.is-open {
    display: block;
    z-index: 90;
    animation: menuSearchReveal 180ms ease both;
}

.sidebar > .nav-jump.is-open + .nav-group,
.mobile-drawer > .nav-jump.is-open + .nav-group {
    z-index: 0;
}

@keyframes menuSearchReveal {
    from {
        opacity: 0;
        transform: translateY(-0.35rem) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.mobile-drawer .nav-jump {
    margin-top: -0.35rem;
    margin-bottom: 0.9rem;
}

.mobile-drawer .nav-jump.is-open {
    margin-top: 0.75rem;
}

.nav-jump-input {
    width: 100%;
    min-height: 2.55rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.2rem 0.9rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(248, 245, 235, 0.62)),
        rgba(255, 255, 255, 0.78);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
    font: inherit;
    font-size: 0.84rem;
    font-weight: 850;
    outline: none;
}

.nav-jump-input::placeholder {
    color: var(--muted);
}

.nav-jump-input:focus {
    border-color: rgba(138, 104, 29, 0.44);
    box-shadow: 0 0 0 3px rgba(138, 104, 29, 0.12), inset 0 0.08rem 0 rgba(255, 255, 255, 0.8);
}

:root[data-theme="dark"] .nav-jump-input {
    border-color: rgba(216, 179, 90, 0.2);
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.92), rgba(31, 41, 55, 0.68)),
        rgba(15, 23, 35, 0.78);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.06);
}

.nav-jump-results {
    display: grid;
    gap: 0.32rem;
    margin-top: 0.45rem;
    padding: 0.35rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 1.15rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 235, 0.88)),
        var(--panel);
    box-shadow: 0 1rem 2.4rem rgba(31, 42, 68, 0.12);
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 0.12rem);
    z-index: 400;
}

.mobile-drawer .nav-jump-results {
    position: static;
    max-height: 16rem;
    overflow-y: auto;
}

.nav-jump-results[hidden] {
    display: none;
}

.nav-jump-results a {
    display: grid;
    gap: 0.08rem;
    padding: 0.62rem 0.78rem;
    border-radius: 0.86rem;
    color: var(--ink);
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 900;
}

.nav-jump-results a:hover,
.nav-jump-results a:focus {
    background: rgba(138, 104, 29, 0.1);
    outline: none;
}

.nav-jump-results small {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

:root[data-theme="dark"] .nav-jump-results {
    border-color: rgba(216, 179, 90, 0.18);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.98), rgba(15, 23, 35, 0.92)),
        var(--panel);
}

.sidebar-tools .control-strip-actions {
    flex: 0 1 auto;
}

.action-control-bar {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    align-items: center;
    justify-content: flex-end;
    gap: 0.12rem;
    overflow: visible;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.18rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(248, 245, 235, 0.7)),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.8rem 1.8rem rgba(138, 104, 29, 0.1), inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
}

:root[data-theme="dark"] .action-control-bar {
    border-color: rgba(216, 179, 90, 0.2);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.92), rgba(31, 41, 55, 0.7)),
        rgba(15, 23, 35, 0.78);
    box-shadow: 0 0.8rem 1.8rem rgba(0, 0, 0, 0.18), inset 0 0.08rem 0 rgba(255, 255, 255, 0.06);
}

.button-row.action-control-bar,
.cms-modal-actions.action-control-bar,
.automation-head-actions.action-control-bar,
.channel-page-modal-actions.action-control-bar,
.flow-step-actions.action-control-bar,
.team-seat-actions.action-control-bar,
.admin-feedback-sort.action-control-bar {
    flex-wrap: nowrap;
    gap: 0.12rem;
}

.cms-editor-head .action-control-bar,
.panel-head .action-control-bar,
.cms-modal-actions.action-control-bar {
    margin-left: auto;
}

.channel-tools .action-control-bar {
    margin-top: 0.7rem;
}

.action-control-button,
.action-control-button.compact {
    display: inline-grid;
    place-items: center;
    width: 2.32rem;
    min-width: 2.32rem;
    height: 2.32rem;
    min-height: 2.32rem;
    flex: 0 0 auto;
    overflow: visible;
    border: 0;
    border-radius: 999px;
    padding: 0 !important;
    color: var(--brand-deep);
    background: transparent;
    box-shadow: none;
    font-size: 0 !important;
    line-height: 0;
}

.action-control-button[hidden] {
    display: none !important;
}

.action-control-button.button-primary {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.45rem 1rem rgba(52, 35, 6, 0.18), inset 0 0.08rem 0 rgba(255, 255, 255, 0.2);
}

.action-control-button.danger,
.action-control-button.button-quiet.danger,
.action-control-button.button-secondary.danger {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.1);
}

.action-control-button:before,
.action-control-button:after {
    content: none !important;
}

.action-control-button:hover {
    background: rgba(138, 104, 29, 0.11);
    box-shadow: none;
    transform: translateY(-1px);
}

.action-control-button.button-primary:hover {
    box-shadow: 0 0.7rem 1.25rem rgba(52, 35, 6, 0.22), inset 0 0.08rem 0 rgba(255, 255, 255, 0.24);
}

:root[data-theme="dark"] .action-control-button {
    color: var(--brand-deep);
    background: transparent;
}

:root[data-theme="dark"] .action-control-button:hover {
    background: rgba(216, 179, 90, 0.14);
}

.action-control-button .action-icon {
    position: relative;
    display: block;
    width: 1.08rem;
    height: 1.08rem;
    color: currentColor;
    font-size: 1rem;
    line-height: 1;
}

.action-control-button .action-icon:before,
.action-control-button .action-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.action-icon.is-add:before,
.action-icon.is-close:before {
    top: 50%;
    left: 15%;
    width: 70%;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateY(-50%);
}

.action-icon.is-add:after,
.action-icon.is-close:after {
    top: 15%;
    left: 50%;
    width: 0.13rem;
    height: 70%;
    border-radius: 999px;
    background: currentColor;
    transform: translateX(-50%);
}

.action-icon.is-close {
    transform: rotate(45deg);
}

.action-icon.is-delete:before {
    top: 0.16rem;
    left: 0.25rem;
    width: 0.58rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
}

.action-icon.is-delete:after {
    top: 0.36rem;
    left: 0.28rem;
    width: 0.54rem;
    height: 0.58rem;
    border: 0.13rem solid currentColor;
    border-top: 0;
    border-radius: 0 0 0.12rem 0.12rem;
}

.cms-editor-actions {
    gap: 0.25rem;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.16);
}

.cms-editor-actions .action-control-button {
    display: inline-flex;
    width: auto;
    min-width: 2.55rem;
    height: 2.55rem;
    min-height: 2.55rem;
    gap: 0.42rem;
    padding: 0 0.72rem !important;
    font-size: 0.78rem !important;
    line-height: 1;
}

.cms-editor-actions .action-control-label {
    display: inline-block;
    font-weight: 900;
    letter-spacing: 0;
}

.cms-toolbar-help-button {
    color: #fff;
}

.cms-toolbar-help-button .knowledge-video-trigger-screen {
    width: 1.35rem;
    height: 1rem;
    border-width: 0.13rem;
    border-radius: 0.24rem;
}

.cms-toolbar-help-button .knowledge-video-trigger-screen::before {
    bottom: -0.42rem;
    width: 0.12rem;
    height: 0.32rem;
}

.cms-toolbar-help-button .knowledge-video-trigger-screen::after {
    bottom: -0.46rem;
    width: 0.86rem;
    height: 0.12rem;
}

.cms-delete-page-button,
.cms-delete-page-button.action-control-button.danger {
    color: #8b1f1a;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0.4rem 1rem rgba(47, 20, 7, 0.16), inset 0 0.08rem 0 rgba(255, 255, 255, 0.82);
}

.cms-delete-page-button:hover,
.cms-delete-page-button.action-control-button.danger:hover {
    color: #fff;
    background: #b13a32;
}

.cms-delete-page-button .action-icon.is-delete {
    width: 1.18rem;
    height: 1.18rem;
}

.action-icon.is-save:before {
    top: 0.22rem;
    left: 0.28rem;
    width: 0.52rem;
    height: 0.18rem;
    background: currentColor;
}

.action-icon.is-save:after {
    inset: 0.14rem 0.14rem 0.14rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.14rem;
}

.action-icon.is-sync:before {
    inset: 0.13rem;
    border: 0.13rem solid currentColor;
    border-left-color: transparent;
    border-radius: 999px;
}

.action-icon.is-sync:after {
    right: 0.05rem;
    top: 0.1rem;
    width: 0.34rem;
    height: 0.34rem;
    border-top: 0.13rem solid currentColor;
    border-right: 0.13rem solid currentColor;
    transform: rotate(26deg);
}

.action-icon.is-run:before,
.action-icon.is-send:before {
    top: 0.16rem;
    left: 0.26rem;
    width: 0;
    height: 0;
    border-top: 0.38rem solid transparent;
    border-bottom: 0.38rem solid transparent;
    border-left: 0.58rem solid currentColor;
}

.action-icon.is-send {
    transform: rotate(-14deg);
}

.action-icon.is-edit:before {
    top: 0.2rem;
    left: 0.45rem;
    width: 0.16rem;
    height: 0.72rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(42deg);
}

.action-icon.is-edit:after {
    right: 0.18rem;
    bottom: 0.12rem;
    width: 0.42rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
}

.action-icon.is-upload:before,
.action-icon.is-download:before {
    top: 0.18rem;
    left: 50%;
    width: 0.13rem;
    height: 0.58rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateX(-50%);
}

.action-icon.is-upload:after,
.action-icon.is-download:after {
    left: 0.31rem;
    width: 0.46rem;
    height: 0.46rem;
    border-top: 0.13rem solid currentColor;
    border-left: 0.13rem solid currentColor;
}

.action-icon.is-upload:after {
    top: 0.12rem;
    transform: rotate(45deg);
}

.action-icon.is-download:before {
    top: 0.28rem;
}

.action-icon.is-download:after {
    bottom: 0.12rem;
    transform: rotate(225deg);
}

.action-icon.is-preview:before {
    inset: 0.25rem 0.08rem;
    border: 0.13rem solid currentColor;
    border-radius: 60% 40%;
    transform: rotate(-12deg);
}

.action-icon.is-preview:after {
    top: 0.45rem;
    left: 0.45rem;
    width: 0.18rem;
    height: 0.18rem;
    border-radius: 999px;
    background: currentColor;
}

.action-icon.is-ai:before {
    top: 0.12rem;
    left: 0.5rem;
    width: 0.12rem;
    height: 0.84rem;
    border-radius: 999px;
    background: currentColor;
}

.action-icon.is-ai:after {
    top: 0.5rem;
    left: 0.12rem;
    width: 0.84rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0.2rem -0.28rem 0 -0.02rem currentColor, -0.18rem 0.28rem 0 -0.02rem currentColor;
}

.action-icon.is-check:before {
    top: 0.2rem;
    left: 0.36rem;
    width: 0.34rem;
    height: 0.66rem;
    border-right: 0.16rem solid currentColor;
    border-bottom: 0.16rem solid currentColor;
    transform: rotate(42deg);
}

.action-icon.is-settings:before {
    inset: 0.18rem;
    border: 0.13rem solid currentColor;
    border-radius: 999px;
}

.action-icon.is-settings:after {
    top: 0.45rem;
    left: 0.45rem;
    width: 0.18rem;
    height: 0.18rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 -0.44rem 0 -0.02rem currentColor, 0 0.44rem 0 -0.02rem currentColor, -0.44rem 0 0 -0.02rem currentColor, 0.44rem 0 0 -0.02rem currentColor;
}

.action-icon.is-back:before {
    top: 0.28rem;
    left: 0.22rem;
    width: 0.5rem;
    height: 0.5rem;
    border-left: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    transform: rotate(45deg);
}

.action-icon.is-default:before {
    inset: 0.32rem;
    border-radius: 999px;
    background: currentColor;
}

.sidebar-tool-button {
    position: relative;
    display: inline-grid;
    width: 2.22rem;
    height: 2.22rem;
    place-items: center;
    border: 0;
    border-radius: 999px;
    color: var(--brand-deep);
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    transition: transform 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.sidebar-tool-button + .sidebar-tool-button:before {
    content: "";
    position: absolute;
    left: -0.02rem;
    top: 0.46rem;
    bottom: 0.46rem;
    width: 1px;
    background: rgba(138, 104, 29, 0.16);
}

:root[data-theme="dark"] .sidebar-tool-button + .sidebar-tool-button:before {
    background: rgba(216, 179, 90, 0.16);
}

.sidebar-tool-button:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.22);
    transform: translateY(-1px);
}

.nav-jump-toggle[aria-expanded="true"] {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.22);
}

.drawer-close-in-strip .close-x,
.drawer-close-in-strip .close-x:after {
    width: 1rem;
    background: currentColor;
}

.theme-switch {
    position: relative;
    display: inline-grid;
    cursor: pointer;
}

.theme-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.theme-switch-track {
    position: relative;
    display: block;
    width: 1.82rem;
    height: 1.02rem;
    border: 1px solid rgba(17, 24, 39, 0.42);
    border-radius: 999px;
    background: linear-gradient(135deg, #131922, #2d3440);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.12), 0 0.5rem 1.1rem rgba(31, 42, 68, 0.12);
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.theme-switch-track:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0.3rem;
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 999px;
    background: #d8b35a;
    box-shadow: 0 0 0 0.14rem rgba(216, 179, 90, 0.2);
    transform: translateY(-50%);
}

.theme-switch-track i {
    position: absolute;
    top: 0.14rem;
    left: 0.14rem;
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    background: #fff8e6;
    box-shadow: 0 0.25rem 0.55rem rgba(0, 0, 0, 0.24);
    transition: transform 180ms ease, background 180ms ease;
}

.theme-switch input:checked + .theme-switch-track {
    border-color: rgba(99, 199, 189, 0.28);
    background: rgba(99, 199, 189, 0.16);
    box-shadow: 0 0.55rem 1.2rem rgba(99, 199, 189, 0.1), inset 0 0.08rem 0 rgba(255, 255, 255, 0.22);
}

.theme-switch input:checked + .theme-switch-track:before {
    left: auto;
    right: 0.3rem;
    width: 0.28rem;
    height: 0.28rem;
    background: transparent;
    box-shadow: -0.14rem 0.02rem 0 var(--brand-deep);
}

.theme-switch input:checked + .theme-switch-track i {
    background: #f0eee8;
    transform: translateX(0.8rem);
}

.theme-switch input:focus-visible + .theme-switch-track {
    outline: 2px solid rgba(216, 179, 90, 0.45);
    outline-offset: 3px;
}

.drawer-theme-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.68rem 0.76rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.56);
    font-size: 0.82rem;
    font-weight: 850;
}

.sidebar-tools .inbox-shortcut {
    width: 2.22rem;
    height: 2.22rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
}

.sidebar-tools .inbox-shortcut.has-label {
    width: auto;
    min-width: 4.95rem;
    grid-template-columns: auto auto;
    justify-content: center;
    gap: 0.4rem;
    padding: 0 0.72rem;
}

.sidebar-tool-text {
    font-size: 0.73rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

.sidebar-tools .inbox-shortcut:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.22);
}

.sidebar-tool-button .nav-badge {
    position: absolute;
    top: -0.5rem;
    right: -0.35rem;
    z-index: 2;
}

.exit-icon {
    position: relative;
    width: 1.08rem;
    height: 1.08rem;
    border: 0.13rem solid currentColor;
    border-right: 0;
    border-radius: 0.22rem 0 0 0.22rem;
}

.exit-icon:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0.46rem;
    width: 0.7rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateY(-50%);
}

.exit-icon:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -0.12rem;
    width: 0.42rem;
    height: 0.42rem;
    border-top: 0.13rem solid currentColor;
    border-right: 0.13rem solid currentColor;
    transform: translateY(-50%) rotate(45deg);
}

:root[data-theme="dark"] .drawer-theme-row {
    background: rgba(18, 27, 40, 0.72);
}

.sidebar-head .brand {
    flex: 1 1 auto;
    min-height: 2.65rem;
    min-width: 0;
    max-width: calc(100% - 8.2rem);
    overflow: hidden;
}

.sidebar-head .brand-wordmark {
    max-width: min(7.15rem, 100%);
    max-height: 2rem;
}

.sidebar-head .brand > span:not(.brand-mark) {
    min-width: 0;
}

.sidebar-head .brand strong,
.sidebar-head .brand small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-group {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: start;
    gap: 0.45rem;
    margin-top: 1.6rem;
}

.sidebar > .nav-group {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0.18rem;
    padding-bottom: 1rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.nav-section {
    --section-accent: var(--brand);
    --section-accent-deep: var(--brand-deep);
    --section-border: rgba(138, 104, 29, 0.14);
    --section-border-strong: rgba(138, 104, 29, 0.32);
    --section-wash: rgba(138, 104, 29, 0.1);
    --section-glow: rgba(138, 104, 29, 0.13);
    display: grid;
    gap: 0;
}

.nav-section[data-nav-section="conversations"] {
    --section-accent: #9a7727;
    --section-accent-deep: #21180b;
    --section-border: rgba(138, 104, 29, 0.14);
    --section-border-strong: rgba(138, 104, 29, 0.33);
    --section-wash: rgba(138, 104, 29, 0.1);
    --section-glow: rgba(138, 104, 29, 0.15);
}

.nav-section[data-nav-section="website"] {
    --section-accent: #0f766e;
    --section-accent-deep: #083f3d;
    --section-border: rgba(15, 118, 110, 0.14);
    --section-border-strong: rgba(15, 118, 110, 0.32);
    --section-wash: rgba(15, 118, 110, 0.11);
    --section-glow: rgba(15, 118, 110, 0.15);
}

.nav-section[data-nav-section="seo"] {
    --section-accent: #2f7d50;
    --section-accent-deep: #123821;
    --section-border: rgba(47, 125, 80, 0.15);
    --section-border-strong: rgba(47, 125, 80, 0.34);
    --section-wash: rgba(47, 125, 80, 0.1);
    --section-glow: rgba(47, 125, 80, 0.16);
}

.nav-section[data-nav-section="contacts"] {
    --section-accent: #2f7d50;
    --section-accent-deep: #123821;
    --section-border: rgba(47, 125, 80, 0.14);
    --section-border-strong: rgba(47, 125, 80, 0.32);
    --section-wash: rgba(47, 125, 80, 0.1);
    --section-glow: rgba(47, 125, 80, 0.15);
}

.nav-section[data-nav-section="financials"] {
    --section-accent: #9a7727;
    --section-accent-deep: #21180b;
    --section-border: rgba(185, 138, 44, 0.2);
    --section-border-strong: rgba(185, 138, 44, 0.4);
    --section-wash: rgba(185, 138, 44, 0.12);
    --section-glow: rgba(185, 138, 44, 0.19);
}

.nav-section[data-nav-section="products"] {
    --section-accent: #a9465b;
    --section-accent-deep: #4b1d27;
    --section-border: rgba(138, 104, 29, 0.2);
    --section-border-strong: rgba(138, 104, 29, 0.4);
    --section-wash: rgba(138, 104, 29, 0.12);
    --section-glow: rgba(138, 104, 29, 0.19);
}

.nav-section[data-nav-section="calendar"] {
    --section-accent: #a9465b;
    --section-accent-deep: #4b1d27;
    --section-border: rgba(111, 74, 99, 0.15);
    --section-border-strong: rgba(111, 74, 99, 0.34);
    --section-wash: rgba(111, 74, 99, 0.1);
    --section-glow: rgba(111, 74, 99, 0.16);
}

.nav-section[data-nav-section="marketing"] {
    --section-accent: #3658a8;
    --section-accent-deep: #161c4a;
    --section-border: rgba(166, 90, 69, 0.15);
    --section-border-strong: rgba(166, 90, 69, 0.34);
    --section-wash: rgba(166, 90, 69, 0.1);
    --section-glow: rgba(166, 90, 69, 0.16);
}

.nav-section[data-nav-section="elearning"] {
    --section-accent: #3658a8;
    --section-accent-deep: #161c4a;
    --section-border: rgba(109, 90, 166, 0.15);
    --section-border-strong: rgba(109, 90, 166, 0.34);
    --section-wash: rgba(109, 90, 166, 0.1);
    --section-glow: rgba(109, 90, 166, 0.16);
}

.nav-section[data-nav-section="forms"] {
    --section-accent: #794c8b;
    --section-accent-deep: #2c1737;
    --section-border: rgba(118, 90, 130, 0.15);
    --section-border-strong: rgba(118, 90, 130, 0.34);
    --section-wash: rgba(118, 90, 130, 0.1);
    --section-glow: rgba(118, 90, 130, 0.16);
}

.nav-section[data-nav-section="tools"] {
    --section-accent: #9a7727;
    --section-accent-deep: #21180b;
    --section-border: rgba(111, 95, 70, 0.15);
    --section-border-strong: rgba(111, 95, 70, 0.34);
    --section-wash: rgba(111, 95, 70, 0.1);
    --section-glow: rgba(111, 95, 70, 0.16);
}

.nav-section[data-nav-section="community"] {
    --section-accent: #2f7d50;
    --section-accent-deep: #123821;
    --section-border: rgba(47, 125, 80, 0.15);
    --section-border-strong: rgba(47, 125, 80, 0.34);
    --section-wash: rgba(47, 125, 80, 0.1);
    --section-glow: rgba(47, 125, 80, 0.16);
}

.nav-section[data-nav-section="projects"] {
    --section-accent: #794c8b;
    --section-accent-deep: #2c1737;
    --section-border: rgba(116, 95, 140, 0.15);
    --section-border-strong: rgba(116, 95, 140, 0.34);
    --section-wash: rgba(116, 95, 140, 0.1);
    --section-glow: rgba(116, 95, 140, 0.16);
}

.nav-section[data-nav-section="cloudfolder"] {
    --section-accent: #0f766e;
    --section-accent-deep: #083f3d;
    --section-border: rgba(95, 111, 137, 0.15);
    --section-border-strong: rgba(95, 111, 137, 0.34);
    --section-wash: rgba(95, 111, 137, 0.1);
    --section-glow: rgba(95, 111, 137, 0.16);
}

.nav-section[data-nav-section="automation"] {
    --section-accent: #a9465b;
    --section-accent-deep: #4b1d27;
    --section-border: rgba(125, 79, 69, 0.15);
    --section-border-strong: rgba(125, 79, 69, 0.34);
    --section-wash: rgba(125, 79, 69, 0.1);
    --section-glow: rgba(125, 79, 69, 0.16);
}

.nav-section[data-nav-section="ai"] {
    --section-accent: #794c8b;
    --section-accent-deep: #2c1737;
    --section-border: rgba(111, 95, 70, 0.16);
    --section-border-strong: rgba(111, 95, 70, 0.36);
    --section-wash: rgba(111, 95, 70, 0.1);
    --section-glow: rgba(111, 95, 70, 0.16);
}

.nav-section[data-nav-section="workspace"] {
    --section-accent: #5f5140;
    --section-accent-deep: #21180b;
    --section-border: rgba(95, 81, 64, 0.15);
    --section-border-strong: rgba(95, 81, 64, 0.34);
    --section-wash: rgba(95, 81, 64, 0.1);
    --section-glow: rgba(95, 81, 64, 0.15);
}

.nav-section[data-nav-section="integrations"] {
    --section-accent: #0f766e;
    --section-accent-deep: #083f3d;
    --section-border: rgba(15, 118, 110, 0.14);
    --section-border-strong: rgba(15, 118, 110, 0.32);
    --section-wash: rgba(15, 118, 110, 0.11);
    --section-glow: rgba(15, 118, 110, 0.15);
}

.nav-section[data-nav-section="helpdesk"] {
    --section-accent: #3658a8;
    --section-accent-deep: #161c4a;
    --section-border: rgba(54, 88, 168, 0.15);
    --section-border-strong: rgba(54, 88, 168, 0.34);
    --section-wash: rgba(54, 88, 168, 0.1);
    --section-glow: rgba(54, 88, 168, 0.16);
}

.nav-section[data-nav-section="team"] {
    --section-accent: #794c8b;
    --section-accent-deep: #2c1737;
    --section-border: rgba(121, 76, 139, 0.15);
    --section-border-strong: rgba(121, 76, 139, 0.34);
    --section-wash: rgba(121, 76, 139, 0.1);
    --section-glow: rgba(121, 76, 139, 0.16);
}

.nav-section[data-nav-section="pos"] {
    --section-accent: #a9465b;
    --section-accent-deep: #4b1d27;
    --section-border: rgba(169, 70, 91, 0.15);
    --section-border-strong: rgba(169, 70, 91, 0.34);
    --section-wash: rgba(169, 70, 91, 0.1);
    --section-glow: rgba(169, 70, 91, 0.16);
}

.nav-section[data-nav-section="release-admin"] {
    --section-accent: #9a7727;
    --section-accent-deep: #21180b;
    --section-border: rgba(154, 119, 39, 0.16);
    --section-border-strong: rgba(154, 119, 39, 0.36);
    --section-wash: rgba(154, 119, 39, 0.11);
    --section-glow: rgba(154, 119, 39, 0.17);
}

.nav-parent {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 2.9rem;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--section-accent) 42%, rgba(255, 255, 255, 0.22));
    border-radius: var(--radius);
    padding: 0.7rem 0.78rem 0.7rem 0.95rem;
    color: #fff;
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.18), transparent 6rem),
        linear-gradient(135deg, var(--section-accent), var(--section-accent-deep));
    box-shadow: 0 0.75rem 1.6rem var(--section-glow), inset 0 0.08rem 0 rgba(255, 255, 255, 0.2);
    font: inherit;
    font-size: 0.83rem;
    font-weight: 900;
    letter-spacing: 0;
    text-align: left;
    text-shadow: 0 0.08rem 0.16rem rgba(0, 0, 0, 0.62), 0 0.22rem 0.7rem rgba(0, 0, 0, 0.34);
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 180ms ease, box-shadow 180ms ease, filter 180ms ease, transform 180ms ease;
}

.nav-parent:before {
    content: "";
    width: 0.72rem;
    height: 0.92rem;
    flex: 0 0 auto;
    margin-right: 0.58rem;
    background: url("/assets/images/r-white.png") center / contain no-repeat;
    filter: drop-shadow(0 0.18rem 0.25rem rgba(0, 0, 0, 0.42));
}

.nav-parent span:first-child {
    flex: 1 1 auto;
}

.nav-parent:hover,
.nav-section.is-open .nav-parent,
.nav-section.is-current .nav-parent {
    border-color: color-mix(in srgb, var(--section-accent) 58%, rgba(255, 255, 255, 0.32));
    color: #fff;
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.24), transparent 6rem),
        linear-gradient(135deg, var(--section-accent), var(--section-accent-deep));
    box-shadow: 0 0.9rem 1.8rem var(--section-glow), inset 0 0.08rem 0 rgba(255, 255, 255, 0.26);
    filter: saturate(1.06);
}

.nav-parent:hover {
    transform: translateX(1px);
}

:root[data-theme="dark"] .nav-parent {
    color: #fff;
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.18), transparent 6rem),
        linear-gradient(135deg, var(--section-accent), var(--section-accent-deep));
}

:root[data-theme="dark"] .nav-parent:hover,
:root[data-theme="dark"] .nav-section.is-open .nav-parent,
:root[data-theme="dark"] .nav-section.is-current .nav-parent {
    color: #fff;
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.24), transparent 6rem),
        linear-gradient(135deg, var(--section-accent), var(--section-accent-deep));
}

.nav-chevron {
    position: relative;
    width: 0.62rem;
    height: 0.62rem;
    flex: 0 0 auto;
    border-right: 0.13rem solid currentColor;
    border-bottom: 0.13rem solid currentColor;
    opacity: 0.64;
    transform: rotate(45deg) translateY(-0.08rem);
    transition: transform 220ms ease, opacity 220ms ease;
}

.nav-section.is-open > .nav-parent .nav-chevron {
    opacity: 0.9;
    transform: rotate(225deg) translate(-0.08rem, -0.08rem);
}

.nav-section.is-open > .nav-parent {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.nav-section-links {
    display: grid;
    max-height: 0;
    gap: 0.24rem;
    overflow: hidden;
    opacity: 0;
    padding: 0 0.18rem;
    transform: translateY(-0.25rem);
    transition: max-height 260ms ease, opacity 180ms ease, padding 220ms ease, transform 220ms ease;
}

.nav-section.is-open .nav-section-links {
    max-height: 44rem;
    opacity: 1;
    margin-top: -1px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-top: 0;
    border-radius: 0 0 var(--radius) var(--radius);
    padding: 0.45rem;
    background:
        linear-gradient(135deg, var(--section-accent), var(--section-accent-deep));
    box-shadow: 0 0.9rem 1.8rem var(--section-glow), inset 0 0.08rem 0 rgba(255, 255, 255, 0.2);
    transform: translateY(0);
}

.nav-section[data-nav-section="website"].is-open .nav-section-links {
    max-height: 56rem;
    padding-bottom: 0.75rem;
}

.nav-subsection {
    display: grid;
    gap: 0;
}

.nav-subtoggle {
    display: flex;
    width: 100%;
    min-height: 2.55rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.62rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius);
    padding: 0.58rem 0.66rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    font: inherit;
    font-size: 0.84rem;
    font-weight: 850;
    text-align: left;
    text-shadow: 0 0.08rem 0.16rem rgba(0, 0, 0, 0.72), 0 0.22rem 0.7rem rgba(0, 0, 0, 0.38);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.nav-subtoggle:hover,
.nav-subsection.is-current .nav-subtoggle,
.nav-subsection.is-open .nav-subtoggle {
    border-color: rgba(255, 255, 255, 0.32);
    background: rgba(0, 0, 0, 0.16);
}

.nav-subtoggle:hover {
    transform: translateX(2px);
}

.nav-subtoggle .nav-icon {
    display: none;
}

.nav-subtoggle span:nth-child(2) {
    min-width: 0;
    flex: 1 1 auto;
}

.nav-subsection.is-open > .nav-subtoggle .nav-chevron {
    opacity: 0.9;
    transform: rotate(225deg) translate(-0.08rem, -0.08rem);
}

.nav-subsection.is-open > .nav-subtoggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.nav-subsection-links {
    display: grid;
    max-height: 0;
    gap: 0.18rem;
    overflow: hidden;
    opacity: 0;
    padding: 0 0 0 1.2rem;
    transform: translateY(-0.2rem);
    transition: max-height 220ms ease, opacity 170ms ease, padding 200ms ease, transform 200ms ease;
}

.nav-subsection.is-open .nav-subsection-links {
    max-height: 14rem;
    opacity: 1;
    margin-top: -1px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-top: 0;
    border-radius: 0 0 var(--radius) var(--radius);
    padding: 0.32rem 0.44rem 0.42rem;
    background: rgba(0, 0, 0, 0.1);
    transform: translateY(0);
}

.nav-link {
    display: flex;
    min-height: 2.8rem;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid transparent;
    border-radius: var(--radius);
    padding: 0.65rem 0.75rem;
    color: #ffffff;
    font-size: 0.94rem;
    font-weight: 750;
    text-shadow: 0 0.08rem 0.16rem rgba(0, 0, 0, 0.72), 0 0.22rem 0.7rem rgba(0, 0, 0, 0.38);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease, color 180ms ease;
}

.nav-section-links .nav-link > .nav-icon {
    display: none;
}

.nav-sub-link {
    min-height: 2.28rem;
    gap: 0;
    padding: 0.48rem 0.6rem;
    font-size: 0.82rem;
    font-weight: 780;
}

.nav-sub-link:before {
    content: none;
}

.nav-preview-button {
    justify-content: center;
    margin-top: 0.45rem;
    margin-bottom: 0.35rem;
    border: 1px solid rgba(255, 255, 255, 0.58);
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(0, 0, 0, 0.16)),
        rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.28);
    font-weight: 950;
}

.nav-preview-button .nav-icon {
    color: #ffffff;
}

.nav-text {
    min-width: 0;
    flex: 1 1 auto;
}

.nav-badge {
    display: inline-grid;
    min-width: 1.42rem;
    height: 1.42rem;
    flex: 0 0 auto;
    place-items: center;
    padding: 0 0.42rem;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 999px;
    color: #ffffff;
    background: linear-gradient(135deg, #a65a45 0%, #c9843e 100%);
    box-shadow: 0 0.6rem 1.3rem rgba(166, 90, 69, 0.3), inset 0 0.08rem 0 rgba(255, 255, 255, 0.45);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    transform-origin: center;
}

.nav-badge[hidden] {
    display: none;
}

.nav-badge.is-blooming {
    animation: badgeBloom 560ms cubic-bezier(0.18, 0.9, 0.22, 1.2) both;
}

.nav-link:hover,
.nav-link.is-active {
    border-color: rgba(255, 255, 255, 0.24);
    color: #ffffff;
    background: rgba(0, 0, 0, 0.18);
    transform: translateX(2px);
}

.nav-link.is-module-locked {
    opacity: 0.52;
    filter: grayscale(1);
}

.nav-link.is-module-locked:hover {
    opacity: 0.78;
    filter: grayscale(0.45);
}

.ai-assist-image-inline-link {
    width: 100%;
    margin-top: 0.55rem;
    justify-content: center;
    font-size: 0.82rem;
    text-decoration: none;
}

.ai-assist-image-inline-link:before {
    content: none !important;
}

.ai-assist-image-inline-link.is-module-locked {
    opacity: 0.78;
    filter: grayscale(1);
}

.ai-assist-image-inline-link.is-module-locked:before {
    content: none !important;
}

.ai-assist-image-inline-link:hover {
    opacity: 1;
    filter: none;
}

.nav-preview-button:hover,
.nav-preview-button.is-active {
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.24), rgba(0, 0, 0, 0.2)),
        rgba(0, 0, 0, 0.16);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.32);
    transform: translateY(-1px);
}

:root[data-theme="dark"] .nav-link {
    color: #ffffff;
}

:root[data-theme="dark"] .nav-link:hover,
:root[data-theme="dark"] .nav-link.is-active {
    color: #ffffff;
}

:root[data-theme="dark"] .nav-preview-button,
:root[data-theme="dark"] .nav-preview-button:hover,
:root[data-theme="dark"] .nav-preview-button.is-active {
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.18)),
        rgba(255, 255, 255, 0.08);
}

.inbox-shortcut {
    position: relative;
    display: inline-grid;
    width: 2.85rem;
    height: 2.85rem;
    place-items: center;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius);
    color: var(--brand-deep);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.08)),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 16px 34px rgba(138, 104, 29, 0.12);
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.inbox-shortcut:hover {
    transform: translateY(-1px);
    background: #fff;
    box-shadow: 0 20px 42px rgba(138, 104, 29, 0.16);
}

:root[data-theme="dark"] .inbox-shortcut {
    color: var(--brand-deep);
    border-color: rgba(216, 179, 90, 0.2);
    background:
        linear-gradient(135deg, rgba(216, 179, 90, 0.12), rgba(99, 199, 189, 0.09)),
        rgba(18, 27, 40, 0.78);
}

:root[data-theme="dark"] .inbox-shortcut:hover {
    background: rgba(24, 35, 53, 0.96);
}

.inbox-shortcut .nav-badge {
    position: absolute;
    top: -0.45rem;
    right: -0.45rem;
}

.inbox-shortcut.in-drawer {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 3rem;
    justify-content: flex-start;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.7rem 0.8rem;
}

.inbox-shortcut.in-drawer .nav-text {
    font-weight: 850;
}

.inbox-shortcut.in-drawer .nav-badge {
    position: static;
    margin-left: auto;
}

.inbox-shortcut.is-mobile {
    width: 2.65rem;
    height: 2.65rem;
}

.nav-icon,
.bottom-icon {
    position: relative;
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    flex: 0 0 auto;
}

.inbox-icon {
    border: 0.13rem solid currentColor;
    border-radius: 0.2rem;
    overflow: hidden;
}

.inbox-icon:before,
.inbox-icon:after {
    content: "";
    position: absolute;
    top: 0.24rem;
    width: 0.72rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
}

.inbox-icon:before {
    left: 0.03rem;
    transform: rotate(32deg);
    transform-origin: left center;
}

.inbox-icon:after {
    right: 0.03rem;
    transform: rotate(-32deg);
    transform-origin: right center;
}

.notification-icon {
    border: 0.13rem solid currentColor;
    border-radius: 0.58rem 0.58rem 0.28rem 0.28rem;
    border-bottom-width: 0.16rem;
}

.notification-icon:before {
    content: "";
    position: absolute;
    left: 0.36rem;
    right: 0.36rem;
    bottom: -0.33rem;
    height: 0.16rem;
    border-radius: 999px;
    background: currentColor;
}

.notification-icon:after {
    content: "";
    position: absolute;
    top: -0.24rem;
    left: 50%;
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateX(-50%);
}

.unread-icon {
    border: 0.13rem solid currentColor;
    border-radius: 999px;
}

.unread-icon:after {
    content: "";
    position: absolute;
    top: -0.1rem;
    right: -0.1rem;
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 999px;
    background: var(--coral);
}

.star-icon {
    background: currentColor;
    clip-path: polygon(50% 0, 62% 35%, 100% 35%, 69% 57%, 80% 94%, 50% 72%, 20% 94%, 31% 57%, 0 35%, 38% 35%);
}

.archive-icon,
.crm-icon,
.booking-icon,
.calendar-icon,
.invoice-icon,
.invoices-icon,
.customers-icon,
	.products-icon,
	.pos-icon,
	.cms-icon,
.forms-icon,
.flow-icon,
.cta-icon,
.support-icon,
.image-icon,
.preview-icon,
.marketing-icon,
.settings-icon {
    border: 0.13rem solid currentColor;
    border-radius: 0.28rem;
}

.crm-icon:after,
.booking-icon:after,
.calendar-icon:after,
.invoice-icon:after,
.invoices-icon:after,
.customers-icon:after,
	.products-icon:after,
	.pos-icon:after,
	.cms-icon:after,
.forms-icon:after,
.flow-icon:after,
.cta-icon:after,
.support-icon:after,
.image-icon:after,
.preview-icon:after,
.marketing-icon:after,
.settings-icon:after {
    content: "";
    position: absolute;
    inset: 0.25rem;
    border-radius: 0.12rem;
    background: currentColor;
    opacity: 0.45;
}

.preview-icon {
    border-radius: 999px;
}

.pos-icon:before {
    content: "";
    position: absolute;
    left: 0.22rem;
    right: 0.22rem;
    bottom: 0.18rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
    z-index: 1;
}

.pos-icon:after {
    inset: 0.22rem 0.28rem 0.42rem;
    opacity: 0.36;
}

.flow-icon:before {
    content: "";
    position: absolute;
    top: 0.22rem;
    left: 0.22rem;
    width: 0.22rem;
    height: 0.22rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0.48rem 0.24rem 0 currentColor, 0.18rem 0.58rem 0 currentColor;
    z-index: 1;
}

.cta-icon:before {
    content: "";
    position: absolute;
    top: 0.2rem;
    right: 0.18rem;
    width: 0.28rem;
    height: 0.28rem;
    border-top: 0.13rem solid currentColor;
    border-right: 0.13rem solid currentColor;
    transform: rotate(45deg);
    z-index: 1;
}

.mobile-drawer {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 40;
    display: flex;
    flex-direction: column;
    width: min(21.5rem, 88vw);
    height: 100dvh;
    max-height: 100dvh;
    padding: 1rem;
    box-shadow: var(--shadow);
    overflow: hidden;
    transform: translateX(-105%);
    transition: transform 260ms ease;
}

.mobile-drawer > .nav-group {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0.18rem;
    padding-bottom: 1rem;
    -webkit-overflow-scrolling: touch;
}

.drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.close-x,
.close-x:after {
    display: block;
    width: 1.15rem;
    height: 0.13rem;
    border-radius: 999px;
    background: var(--ink);
    transform: rotate(45deg);
}

.close-x:after {
    content: "";
    transform: rotate(90deg);
}

.plus-icon,
.plus-icon:after {
    display: block;
    width: 0.9rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
}

.plus-icon:after {
    content: "";
    transform: rotate(90deg);
}

.cms-add-page-button {
    min-width: 2.35rem;
    width: 2.35rem;
    height: 2.35rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 12px 24px rgba(138, 104, 29, 0.18);
}

.drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 35;
    background: rgba(18, 21, 33, 0.34);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.drawer-open .mobile-drawer {
    transform: translateX(0);
}

.drawer-open .drawer-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.main-content {
    position: relative;
    z-index: 1;
    padding: 1.1rem 1rem 1.25rem;
    transition: opacity 180ms ease, transform 180ms ease, filter 180ms ease;
}

.is-page-leaving .main-content {
    animation: none;
    opacity: 0.72;
    transform: translateY(-0.24rem);
    filter: blur(0.02rem);
}

:root[data-theme="dark"] .login-metrics div,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .home-card,
:root[data-theme="dark"] .home-setup-panel,
:root[data-theme="dark"] .home-setup-step,
:root[data-theme="dark"] .module-card,
:root[data-theme="dark"] .onboarding-card,
:root[data-theme="dark"] .onboarding-module-card,
:root[data-theme="dark"] .conversation-item,
:root[data-theme="dark"] .thread-panel,
:root[data-theme="dark"] .financial-metric,
:root[data-theme="dark"] .financial-status-row,
:root[data-theme="dark"] .financial-list-row,
:root[data-theme="dark"] .momentum-item,
:root[data-theme="dark"] .quick-actions a,
:root[data-theme="dark"] .week-day-card,
:root[data-theme="dark"] .availability-slot-card,
:root[data-theme="dark"] .cms-page-settings-card,
:root[data-theme="dark"] .cms-page-row,
:root[data-theme="dark"] .cms-block-card,
:root[data-theme="dark"] .cms-block-actions button,
:root[data-theme="dark"] .commerce-list-row,
:root[data-theme="dark"] .commerce-editor-panel,
:root[data-theme="dark"] .workspace-logo-panel,
:root[data-theme="dark"] .channel-hero,
:root[data-theme="dark"] .channel-picker,
:root[data-theme="dark"] .channel-setup-notes,
:root[data-theme="dark"] .channel-card,
:root[data-theme="dark"] .flow-step-card,
:root[data-theme="dark"] .contact-type-card,
:root[data-theme="dark"] .form-field-card,
:root[data-theme="dark"] .forms-delivery-card,
:root[data-theme="dark"] .form-submission-row,
:root[data-theme="dark"] .seo-mini-card,
:root[data-theme="dark"] .seo-settings-card,
:root[data-theme="dark"] .seo-location-card,
:root[data-theme="dark"] .seo-check-row,
:root[data-theme="dark"] .seo-sitemap-row,
:root[data-theme="dark"] .seo-ai-row,
:root[data-theme="dark"] .seo-ai-actions-panel,
:root[data-theme="dark"] .seo-ai-opportunities,
:root[data-theme="dark"] .seo-opportunity-panel,
:root[data-theme="dark"] .seo-opportunity-card,
:root[data-theme="dark"] .seo-opportunity-empty,
:root[data-theme="dark"] .seo-health-card,
:root[data-theme="dark"] .seo-tool-panel,
:root[data-theme="dark"] .seo-health-row,
:root[data-theme="dark"] .seo-google-preview,
:root[data-theme="dark"] .seo-gap-grid article,
:root[data-theme="dark"] .seo-image-alt-list article,
:root[data-theme="dark"] .seo-broken-list article,
:root[data-theme="dark"] .workspace-danger-zone {
    border-color: var(--line);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.94), rgba(15, 23, 35, 0.74)),
        rgba(20, 29, 42, 0.8);
    box-shadow: var(--soft-shadow);
}

:root[data-theme="dark"] .notice-panel,
:root[data-theme="dark"] .empty-state {
    color: #ffd2cc;
    border-color: rgba(255, 143, 130, 0.22);
    background: rgba(24, 35, 53, 0.82);
}

:root[data-theme="dark"] .notice-panel.success-panel {
    color: #b8f2ce;
    border-color: rgba(99, 215, 151, 0.24);
    background: rgba(24, 48, 40, 0.78);
}

:root[data-theme="dark"] .empty-state {
    color: var(--muted);
}

:root[data-theme="dark"] ::placeholder {
    color: rgba(149, 161, 184, 0.72);
}

.page-hero {
    display: grid;
    align-items: end;
    margin: 0 auto 0.85rem;
    max-width: none;
}

.page-hero h1 {
    margin: 0;
    font-size: clamp(2rem, 8vw, 3.35rem);
    line-height: 1;
    letter-spacing: 0;
}

.page-hero p {
    max-width: 43rem;
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.65;
}

.hero-actions {
    display: flex;
    gap: 0.65rem;
}

.stats-grid,
.workspace-grid {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: none;
    margin: 0;
}

.stats-grid {
    grid-template-columns: 1fr;
    margin-bottom: 1rem;
}

.todo-dashboard-alerts {
    display: grid;
    gap: 0.75rem;
    max-width: none;
    margin: 0 0 1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius);
    padding: 0.9rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 235, 0.8)),
        rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
}

.todo-dashboard-alerts-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
}

.todo-dashboard-alerts-head h2 {
    margin: 0.1rem 0 0;
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 950;
    letter-spacing: 0;
}

.todo-dashboard-alert-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.62rem;
}

.todo-dashboard-alert-card {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-left: 0.28rem solid var(--accent);
    border-radius: var(--radius);
    padding: 0.78rem 0.86rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.todo-dashboard-alert-card:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.34);
    box-shadow: 0 0.8rem 1.8rem rgba(31, 28, 23, 0.08);
}

.todo-dashboard-alert-card.is-overdue {
    border-left-color: #a65a45;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(255, 244, 240, 0.9)),
        rgba(166, 90, 69, 0.08);
}

.todo-dashboard-alert-card.is-soon {
    border-left-color: var(--accent);
}

.todo-dashboard-alert-card span {
    color: var(--accent);
    font-size: 0.68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.todo-dashboard-alert-card.is-overdue span {
    color: #8b332d;
}

.todo-dashboard-alert-card strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.94rem;
    font-weight: 900;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.todo-dashboard-alert-card small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.stat-card {
    display: grid;
    gap: 0.35rem;
    min-height: 8rem;
    padding: 1rem;
    border-radius: var(--radius);
}

.stat-card span,
.stat-card small {
    color: var(--muted);
    font-size: 0.85rem;
    font-weight: 700;
}

.stat-card strong {
    font-size: 2.3rem;
    line-height: 1;
}

.rise-in {
    animation: riseIn 520ms ease var(--delay) both;
}

.panel {
    border-radius: var(--radius);
    padding: 0.85rem;
}

.notice-panel,
.empty-state {
    max-width: 92rem;
    margin: 0 auto 1rem;
    border: 1px solid rgba(166, 90, 69, 0.2);
    border-radius: var(--radius);
    padding: 0.9rem 1rem;
    color: #7a342f;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.empty-state {
    position: relative;
    display: flex;
    min-height: 6.8rem;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-color: var(--line);
    color: var(--muted);
    text-align: center;
    line-height: 1.5;
}

.empty-state:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: var(--banner-gold-gradient);
    opacity: 0.85;
}

.notice-panel.success-panel {
    border-color: rgba(47, 125, 80, 0.24);
    color: #17623f;
    background: rgba(240, 255, 248, 0.86);
}

.notice-panel.dashboard-flash-notice {
    max-width: 22rem;
    padding: 0.68rem 0.9rem;
    text-align: center;
    transition: opacity 220ms ease, transform 220ms ease;
}

.notice-panel.dashboard-flash-notice.is-dismissing {
    opacity: 0;
    transform: translateY(-0.35rem);
}

.notice-panel.inline-notice {
    max-width: none;
    margin: 0;
    box-shadow: none;
}

.toast-stack {
    position: fixed;
    top: 1.05rem;
    right: 1.05rem;
    z-index: 360;
    display: grid;
    width: min(24rem, calc(100vw - 1.5rem));
    gap: 0.68rem;
    pointer-events: none;
}

.notice-panel.is-floating-toast {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0.82rem 2.55rem 0.82rem 0.95rem;
    border-color: rgba(138, 104, 29, 0.24);
    border-radius: 12px;
    color: #211a10;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 243, 232, 0.96)),
        #fff;
    box-shadow: 0 1rem 2.6rem rgba(20, 24, 32, 0.2);
    pointer-events: auto;
    transform-origin: top right;
    animation: toastIn 220ms ease both;
    transition: opacity 220ms ease, transform 220ms ease;
}

.notice-panel.is-floating-toast.success-panel {
    border-color: rgba(138, 104, 29, 0.28);
    color: #18140e;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.99), rgba(242, 232, 204, 0.98)),
        #fff;
}

.notice-panel.is-floating-toast:before {
    content: "";
    position: absolute;
    top: 0.72rem;
    bottom: 0.72rem;
    left: 0.55rem;
    width: 0.18rem;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--brand), var(--brand-deep));
    opacity: 0.9;
}

.notice-panel.is-floating-toast.is-dismissing {
    opacity: 0;
    transform: translateX(0.55rem) scale(0.98);
}

.toast-close {
    position: absolute;
    top: 0.42rem;
    right: 0.42rem;
    display: grid;
    width: 1.7rem;
    height: 1.7rem;
    place-items: center;
    border: 0;
    border-radius: 999px;
    color: rgba(20, 24, 32, 0.72);
    background: rgba(20, 24, 32, 0.08);
    font-size: 1.15rem;
    line-height: 1;
}

.toast-close:hover {
    color: #fff;
    background: var(--brand-deep);
}

@keyframes toastIn {
    from {
        opacity: 0;
        transform: translateX(0.7rem) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@media (max-width: 640px) {
    .toast-stack {
        top: 0.75rem;
        right: 0.75rem;
        left: 0.75rem;
        width: auto;
    }
}

.notice-popup {
    position: fixed;
    top: 1.1rem;
    right: 1.1rem;
    z-index: 120;
    display: grid;
    width: min(30rem, calc(100vw - 2rem));
    gap: 0.45rem;
    margin: 0;
    padding: 1rem 1rem 1rem 1.1rem;
    border-color: rgba(138, 104, 29, 0.24);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 235, 0.94)),
        #fff;
    box-shadow: 0 1.1rem 2.7rem rgba(31, 42, 68, 0.22);
    animation: noticePopupIn 220ms ease both;
}

.notice-popup.needs-attention {
    border-color: rgba(166, 90, 69, 0.28);
    box-shadow: 0 1.1rem 2.7rem rgba(122, 39, 31, 0.18);
}

.notice-popup strong {
    padding-right: 4.2rem;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.notice-popup p {
    margin: 0;
    color: var(--muted);
    font-weight: 780;
    line-height: 1.45;
}

.notice-popup ul {
    display: grid;
    gap: 0.35rem;
    margin: 0.3rem 0 0;
    padding-left: 1.1rem;
    color: var(--ink);
    font-weight: 850;
}

.notice-popup-close {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    min-height: 2rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0 0.72rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.82);
    font-size: 0.72rem;
    font-weight: 900;
    cursor: pointer;
}

.notice-popup-close:hover {
    background: #fff;
    transform: translateY(-1px);
}

@keyframes noticePopupIn {
    from {
        opacity: 0;
        transform: translateY(-0.45rem) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 42rem) {
    .notice-popup {
        top: 0.75rem;
        right: 0.75rem;
        left: 0.75rem;
        width: auto;
    }
}

.home-dashboard {
    display: grid;
    gap: 0.85rem;
    width: 100%;
    max-width: 76rem;
    margin: 0 auto;
}

.home-hero {
    display: grid;
    gap: 0.75rem;
    align-items: center;
    min-height: 4.8rem;
    border-color: transparent;
    padding: 0.15rem 0 0.35rem;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

.home-hero span,
.home-card em,
.momentum-panel .eyebrow {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.home-hero h1 {
    margin: 0.16rem 0 0;
    color: var(--ink);
    font-size: clamp(1.55rem, 2.2vw, 2.05rem);
    line-height: 1.05;
    letter-spacing: 0;
}

.home-inbox-link {
    display: inline-flex;
    width: max-content;
    min-height: 2.35rem;
    align-items: center;
    gap: 0.55rem;
    border-radius: var(--radius);
    padding: 0 0.78rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.8rem 1.6rem rgba(138, 104, 29, 0.14);
    font-size: 0.82rem;
    font-weight: 900;
}

.home-card-grid,
.home-lower-grid {
    display: grid;
    gap: 0.75rem;
}

.home-setup-panel {
    display: grid;
    grid-column: 1 / -1;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.1) 0 0.22rem, transparent 0.22rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 235, 0.74));
    box-shadow: var(--soft-shadow);
}

.home-setup-head {
    display: grid;
    gap: 0.32rem;
    max-width: 42rem;
}

.home-setup-head h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    letter-spacing: 0;
}

.home-setup-head p {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.home-setup-list {
    display: grid;
    gap: 0.62rem;
}

.home-setup-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.8rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 999px;
    padding: 0.48rem 0.72rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.42);
}

.home-setup-summary span {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    gap: 0.45rem;
    border-radius: 999px;
    padding: 0 0.72rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.3rem rgba(95, 69, 18, 0.18);
}

.home-setup-summary strong {
    font-size: 1rem;
    line-height: 1;
}

.home-setup-summary small {
    font-size: 0.74rem;
    font-weight: 950;
    line-height: 1;
}

.home-setup-summary em {
    color: var(--muted);
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 800;
    line-height: 1.35;
}

.home-attention-panel,
.home-flow-panel,
.home-suggestion-panel {
    display: grid;
    grid-column: 1 / -1;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(255, 255, 255, 0.9);
    box-shadow: var(--soft-shadow);
}

.home-daily-copilot-panel {
    display: grid;
    grid-column: 1 / -1;
    gap: 1rem;
    overflow: hidden;
    border: 1px solid rgba(15, 118, 110, 0.22);
    border-radius: var(--radius);
    padding: 1rem;
    color: #fff;
    background:
        radial-gradient(circle at 8% 12%, rgba(255, 255, 255, 0.16), transparent 13rem),
        radial-gradient(circle at 86% 12%, rgba(15, 118, 110, 0.34), transparent 16rem),
        linear-gradient(135deg, #1f1607, #6b4b10 62%, #0f766e);
    box-shadow: 0 1.2rem 2.8rem rgba(31, 42, 68, 0.16);
}

.home-daily-copilot-panel.is-refreshing {
    cursor: wait;
}

.home-daily-copilot-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
}

.home-daily-copilot-persona {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
}

.home-daily-copilot-persona img {
    width: clamp(4.2rem, 8vw, 6.1rem);
    aspect-ratio: 1;
    border: 2px solid rgba(255, 255, 255, 0.42);
    border-radius: 999px;
    object-fit: cover;
    box-shadow:
        0 0 0 0.42rem rgba(255, 255, 255, 0.08),
        0 1rem 2rem rgba(0, 0, 0, 0.26);
}

.home-daily-copilot-head .eyebrow {
    color: rgba(255, 255, 255, 0.78);
}

.home-daily-copilot-head h2 {
    margin: 0.12rem 0 0;
    color: #fff;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    line-height: 1.05;
    letter-spacing: 0;
}

.home-daily-copilot-head p {
    max-width: 48rem;
    margin: 0.42rem 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.94rem;
    font-weight: 750;
    line-height: 1.55;
}

.home-daily-copilot-head p.home-daily-copilot-role {
    max-width: 40rem;
    margin: 0.3rem 0 0;
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.8rem;
    font-weight: 850;
    line-height: 1.35;
}

.home-daily-copilot-note {
    max-width: 52rem;
    margin-top: 0.72rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 14px;
    padding: 0.9rem 1rem;
    color: #1f1607;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.16) 0 0.2rem, transparent 0.2rem),
        #fffaf0;
    box-shadow: 0 1rem 1.8rem rgba(0, 0, 0, 0.18);
}

.home-daily-copilot-note p {
    max-width: none;
    margin: 0;
    color: #2d261b;
    font-size: 0.98rem;
    font-weight: 680;
    line-height: 1.65;
}

.home-daily-copilot-status {
    display: grid;
    gap: 0.2rem;
    justify-items: end;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0.58rem 0.78rem;
    background: rgba(255, 255, 255, 0.1);
    text-align: right;
    white-space: nowrap;
}

.home-daily-copilot-status span {
    color: #fff;
    font-size: 0.78rem;
    font-weight: 950;
}

.home-daily-copilot-status small {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.66rem;
    font-weight: 900;
    text-transform: uppercase;
}

.home-daily-copilot-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.68rem;
}

.home-daily-copilot-action {
    display: grid;
    gap: 0.35rem;
    min-height: 6.2rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    padding: 0.82rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
    text-decoration: none;
    box-shadow: 0 0.7rem 1.6rem rgba(0, 0, 0, 0.14);
    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease;
}

.home-daily-copilot-action:hover {
    transform: translateY(-0.08rem);
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.15);
}

.home-daily-copilot-action strong {
    color: #fff;
    font-size: 0.95rem;
    font-weight: 950;
    line-height: 1.18;
}

.home-daily-copilot-action small {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.78rem;
    font-weight: 750;
    line-height: 1.4;
}

.home-daily-copilot-actions.is-loading {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.8rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.1);
}

.home-daily-copilot-actions.is-loading p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.84rem;
    font-weight: 850;
}

.home-daily-copilot-pulse {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    background: #2dd4bf;
    box-shadow: 0 0 0 0 rgba(45, 212, 191, 0.42);
    animation: daily-copilot-pulse 1.5s infinite;
}

@keyframes daily-copilot-pulse {
    70% {
        box-shadow: 0 0 0 0.65rem rgba(45, 212, 191, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(45, 212, 191, 0);
    }
}

@keyframes daily-copilot-message-change {
    0% {
        opacity: 0.42;
        transform: translateY(0.18rem);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.home-daily-copilot-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
}

.home-daily-copilot-facts span {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.35rem 0.6rem;
    color: rgba(255, 255, 255, 0.78);
    background: rgba(255, 255, 255, 0.09);
    font-size: 0.72rem;
    font-weight: 850;
}

.home-daily-copilot-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.72rem;
}

.home-daily-copilot-foot span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.76rem;
    font-weight: 800;
    transition: opacity 180ms ease, transform 180ms ease;
}

.home-daily-copilot-foot span.is-changing {
    animation: daily-copilot-message-change 420ms ease both;
}

.home-daily-copilot-foot .button-soft {
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    background: rgba(255, 255, 255, 0.13);
}

.home-daily-copilot-panel.is-refreshing .home-daily-copilot-foot .button-soft {
    opacity: 0.62;
    pointer-events: none;
}

.home-module-promo-panel {
    display: grid;
    grid-column: 1 / -1;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(90deg, rgba(15, 118, 110, 0.12) 0 0.22rem, transparent 0.22rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 235, 0.74));
    box-shadow: var(--soft-shadow);
}

.home-module-promo-grid {
    display: grid;
    gap: 0.75rem;
}

.home-module-promo-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    min-height: 100%;
    padding: 0.95rem;
    overflow: hidden;
    text-decoration: none;
    color: var(--ink);
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: calc(var(--radius) - 0.25rem);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 0.85rem 1.8rem rgba(31, 42, 68, 0.08);
}

.home-module-promo-card:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, color-mix(in srgb, var(--promo-color, #8a681d) 18%, transparent), transparent 52%);
    pointer-events: none;
}

.home-module-promo-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 1rem 2.1rem rgba(31, 42, 68, 0.12);
}

.home-module-promo-card.is-seo {
    --promo-color: #0f766e;
}

.home-module-promo-card.is-marketing {
    --promo-color: #8a681d;
}

.home-module-promo-card.is-ai {
    --promo-color: #7c3aed;
}

.home-module-promo-copy {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.35rem;
}

.home-module-promo-copy em {
    color: var(--promo-color, #8a681d);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-module-promo-copy strong {
    color: var(--ink);
    font-size: 1.05rem;
    letter-spacing: 0;
}

.home-module-promo-copy small {
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.home-module-promo-copy b {
    justify-self: start;
    margin-top: 0.15rem;
    padding: 0.52rem 0.72rem;
    color: #fff;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--promo-color, #8a681d), color-mix(in srgb, var(--promo-color, #8a681d) 72%, #111827 28%));
    box-shadow: 0 0.75rem 1.4rem color-mix(in srgb, var(--promo-color, #8a681d) 22%, transparent);
    font-size: 0.78rem;
    line-height: 1;
}

.home-attention-list,
.home-suggestion-list {
    display: grid;
    gap: 0.62rem;
}

.home-attention-item,
.home-suggestion-item {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.82rem;
    min-height: 4.35rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 0.78rem;
    color: var(--ink);
    background:
        linear-gradient(90deg, var(--card-wash) 0 0.2rem, transparent 0.2rem),
        rgba(255, 255, 255, 0.78);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.home-attention-item:hover,
.home-suggestion-item:hover,
.home-flow-step:hover {
    border-color: rgba(138, 104, 29, 0.24);
    box-shadow: 0 0.8rem 1.6rem rgba(21, 26, 48, 0.08);
    transform: translateY(-1px);
}

.home-attention-number {
    display: grid;
    min-width: 2.75rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 999px;
    padding: 0 0.62rem;
    color: #fff;
    background: var(--card-accent-deep);
    font-size: 0.82rem;
    font-weight: 950;
}

.home-attention-copy,
.home-suggestion-item > span:not(.home-suggestion-mark) {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
}

.home-attention-copy strong,
.home-suggestion-item strong {
    color: var(--ink);
    font-size: 0.98rem;
    font-weight: 950;
}

.home-attention-copy small,
.home-suggestion-item small,
.home-flow-step small {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.42;
}

.home-attention-item b,
.home-suggestion-item b {
    justify-self: end;
    border-radius: 999px;
    padding: 0.46rem 0.68rem;
    color: var(--card-accent-deep);
    background: var(--card-wash);
    font-size: 0.76rem;
    font-weight: 950;
    white-space: nowrap;
}

.home-flow-track {
    display: grid;
    gap: 0.62rem;
}

.home-flow-step {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    display: grid;
    gap: 0.3rem;
    align-content: start;
    min-height: 8.25rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 0.82rem;
    color: var(--ink);
    background:
        linear-gradient(180deg, var(--card-wash) 0 0.24rem, transparent 0.24rem),
        rgba(255, 255, 255, 0.78);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.home-flow-step span {
    display: grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--card-accent-deep);
    font-size: 0.76rem;
    font-weight: 950;
}

.home-flow-step strong {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.home-flow-step em {
    color: var(--card-accent-deep);
    font-size: 1.34rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1;
}

.home-suggestion-mark {
    display: grid;
    width: 2.1rem;
    height: 2.1rem;
    place-items: center;
    border-radius: 999px;
    background: var(--card-accent-deep);
}

.home-suggestion-mark:after {
    content: "";
    width: 0.52rem;
    height: 0.9rem;
    border-right: 0.16rem solid #fff;
    border-bottom: 0.16rem solid #fff;
    transform: rotate(42deg) translateY(-0.08rem);
}

.home-suggestion-toggle .home-auto-toggle {
    justify-self: end;
}

.home-attention-item.is-messaging,
.home-suggestion-item.is-messaging,
.home-flow-step.is-messaging,
.home-attention-item.is-conversations,
.home-suggestion-item.is-conversations,
.home-flow-step.is-conversations {
    --card-accent: #9a7727;
    --card-accent-deep: #21180b;
    --card-wash: rgba(154, 119, 39, 0.14);
}

.home-attention-item.is-website,
.home-suggestion-item.is-website,
.home-flow-step.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #083f3d;
    --card-wash: rgba(15, 118, 110, 0.13);
}

.home-attention-item.is-contacts,
.home-suggestion-item.is-contacts,
.home-flow-step.is-contacts,
.home-attention-item.is-seo,
.home-suggestion-item.is-seo,
.home-flow-step.is-seo {
    --card-accent: #2f7d50;
    --card-accent-deep: #123821;
    --card-wash: rgba(47, 125, 80, 0.13);
}

.home-attention-item.is-financials,
.home-suggestion-item.is-financials,
.home-flow-step.is-financials,
.home-attention-item.is-products,
.home-suggestion-item.is-products,
.home-flow-step.is-products {
    --card-accent: #9a7727;
    --card-accent-deep: #21180b;
    --card-wash: rgba(154, 119, 39, 0.14);
}

.home-attention-item.is-calendar,
.home-suggestion-item.is-calendar,
.home-flow-step.is-calendar {
    --card-accent: #a9465b;
    --card-accent-deep: #4b1d27;
    --card-wash: rgba(169, 70, 91, 0.13);
}

.home-attention-item.is-marketing,
.home-suggestion-item.is-marketing,
.home-flow-step.is-marketing,
.home-attention-item.is-forms,
.home-suggestion-item.is-forms,
.home-flow-step.is-forms,
.home-attention-item.is-projects,
.home-suggestion-item.is-projects,
.home-flow-step.is-projects {
    --card-accent: #3658a8;
    --card-accent-deep: #161c4a;
    --card-wash: rgba(54, 88, 168, 0.13);
}

.home-attention-item.is-workspace,
.home-suggestion-item.is-workspace,
.home-flow-step.is-workspace {
    --card-accent: #794c8b;
    --card-accent-deep: #2c1737;
    --card-wash: rgba(121, 76, 139, 0.13);
}

:root[data-theme="dark"] .home-attention-panel,
:root[data-theme="dark"] .home-flow-panel,
:root[data-theme="dark"] .home-suggestion-panel,
:root[data-theme="dark"] .home-setup-summary,
:root[data-theme="dark"] .home-attention-item,
:root[data-theme="dark"] .home-flow-step,
:root[data-theme="dark"] .home-suggestion-item {
    background:
        linear-gradient(90deg, rgba(216, 179, 90, 0.14) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.06);
    border-color: rgba(216, 179, 90, 0.16);
}

.home-marketing-panel {
    grid-column: 1 / -1;
    display: grid;
    gap: 1rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--marketing-primary, #8a681d) 24%, transparent);
    border-radius: var(--radius);
    padding: 1rem;
    color: var(--marketing-text, #fff);
    background:
        radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--marketing-accent, #0f766e) 35%, transparent), transparent 15rem),
        linear-gradient(135deg, var(--marketing-primary, #8a681d), color-mix(in srgb, var(--marketing-primary, #8a681d) 68%, #111827 32%));
    box-shadow: 0 1.2rem 2.8rem rgba(31, 42, 68, 0.14);
}

.home-website-traffic-panel {
    background:
        radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--marketing-accent, #0f766e) 36%, transparent), transparent 15rem),
        linear-gradient(135deg, color-mix(in srgb, var(--marketing-primary, #8a681d) 84%, #111827 16%), color-mix(in srgb, var(--marketing-accent, #0f766e) 72%, #111827 28%));
}

.home-marketing-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
}

.home-marketing-head .eyebrow {
    color: var(--marketing-muted, rgba(255, 255, 255, 0.78));
}

.home-marketing-head h2 {
    margin: 0.14rem 0 0;
    color: var(--marketing-text, #fff);
    font-size: clamp(1.25rem, 2.4vw, 1.95rem);
    line-height: 1.04;
}

.home-marketing-head p {
    max-width: 44rem;
    margin: 0.38rem 0 0;
    color: var(--marketing-muted, rgba(255, 255, 255, 0.78));
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1.45;
}

.home-marketing-link {
    display: inline-flex;
    min-height: 2.35rem;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--marketing-text, #fff) 28%, transparent);
    border-radius: 999px;
    padding: 0 0.82rem;
    color: var(--marketing-text, #fff);
    background: color-mix(in srgb, var(--marketing-text, #fff) 12%, transparent);
    box-shadow: 0 0.8rem 1.8rem rgba(0, 0, 0, 0.12);
    font-size: 0.78rem;
    font-weight: 950;
    text-decoration: none;
    white-space: nowrap;
}

.home-marketing-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8.8rem, 1fr));
    gap: 0.68rem;
}

.home-marketing-metrics span {
    display: grid;
    gap: 0.22rem;
    border: 1px solid color-mix(in srgb, var(--marketing-text, #fff) 16%, transparent);
    border-radius: 8px;
    padding: 0.75rem;
    background: color-mix(in srgb, var(--marketing-text, #fff) 10%, transparent);
    box-shadow: 0 0.65rem 1.6rem rgba(0, 0, 0, 0.1);
}

.home-marketing-metrics b {
    color: var(--marketing-text, #fff);
    font-size: clamp(1.25rem, 2.2vw, 1.7rem);
    line-height: 1;
    font-weight: 950;
}

.home-marketing-metrics small {
    color: var(--marketing-muted, rgba(255, 255, 255, 0.78));
    font-size: 0.72rem;
    font-weight: 850;
}

.home-marketing-chart {
    display: grid;
    gap: 0.7rem;
    border: 1px solid color-mix(in srgb, var(--marketing-text, #fff) 14%, transparent);
    border-radius: 8px;
    padding: 0.72rem;
    background: color-mix(in srgb, #000 12%, transparent);
}

.home-marketing-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.home-marketing-chart-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--marketing-text, #fff);
}

.home-marketing-chart-title strong {
    font-size: 0.9rem;
    font-weight: 950;
}

.home-marketing-chart-title span {
    color: var(--marketing-muted, rgba(255, 255, 255, 0.78));
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.home-marketing-chart svg {
    display: block;
    width: 100%;
    height: auto;
    min-height: 15rem;
}

.home-marketing-gridline {
    stroke: color-mix(in srgb, var(--marketing-text, #fff) 18%, transparent);
    stroke-width: 1;
}

.home-marketing-area {
    fill: url(#marketingViewsFill);
}

.home-marketing-area.is-clicks {
    fill: url(#marketingClicksFill);
}

.home-traffic-area {
    fill: url(#websiteTrafficFill);
}

.home-marketing-line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 4;
}

.home-marketing-line.is-views {
    stroke: var(--marketing-text, #fff);
}

.home-marketing-line.is-clicks {
    stroke: var(--marketing-accent, #0f766e);
}

.home-marketing-point {
    stroke: color-mix(in srgb, var(--marketing-primary, #8a681d) 72%, #000 28%);
    stroke-width: 2;
}

.home-marketing-point.is-views {
    fill: var(--marketing-text, #fff);
}

.home-marketing-point.is-clicks {
    fill: var(--marketing-accent, #0f766e);
}

.home-marketing-axis {
    fill: var(--marketing-muted, rgba(255, 255, 255, 0.78));
    font-size: 0.72rem;
    font-weight: 850;
}

.home-marketing-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    color: var(--marketing-muted, rgba(255, 255, 255, 0.78));
    font-size: 0.76rem;
    font-weight: 900;
}

.home-marketing-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
}

.home-marketing-legend i {
    width: 0.74rem;
    height: 0.74rem;
    border-radius: 999px;
    background: var(--marketing-text, #fff);
    box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--marketing-text, #fff) 14%, transparent);
}

.home-marketing-legend i.is-clicks {
    background: var(--marketing-accent, #0f766e);
}

@media (max-width: 720px) {
    .home-daily-copilot-head,
    .home-daily-copilot-actions {
        grid-template-columns: 1fr;
    }

    .home-daily-copilot-persona {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .home-daily-copilot-persona img {
        width: 4.1rem;
    }

    .home-daily-copilot-status {
        justify-items: start;
        text-align: left;
        white-space: normal;
    }

    .home-marketing-head,
    .home-marketing-metrics {
        grid-template-columns: 1fr;
    }

    .home-marketing-chart-grid {
        grid-template-columns: 1fr;
    }

    .home-marketing-link {
        justify-self: start;
    }

    .home-marketing-chart svg {
        min-height: 12.5rem;
    }
}

.home-setup-step {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.82rem;
    min-height: 4.2rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 0.78rem;
    color: var(--ink);
    background:
        linear-gradient(90deg, var(--card-wash) 0 0.2rem, transparent 0.2rem),
        rgba(255, 255, 255, 0.78);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.home-setup-step:hover {
    border-color: rgba(138, 104, 29, 0.24);
    box-shadow: 0 0.8rem 1.6rem rgba(21, 26, 48, 0.08);
    transform: translateY(-1px);
}

.home-setup-step.is-priority {
    border-color: rgba(138, 104, 29, 0.28);
    background:
        linear-gradient(90deg, var(--card-accent-deep) 0 0.22rem, transparent 0.22rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), color-mix(in srgb, var(--card-wash) 72%, #ffffff 28%));
    box-shadow: 0 1rem 2rem rgba(31, 42, 68, 0.12);
}

.home-setup-step.is-priority .home-setup-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    color: #fff;
}

.home-setup-step.is-priority .home-setup-number:after {
    content: "";
    width: 0.48rem;
    height: 0.82rem;
    margin-left: 0.12rem;
    border-right: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    transform: rotate(42deg) translateY(-0.05rem);
}

.home-setup-number {
    display: grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
    font-size: 0.78rem;
    font-weight: 950;
}

.home-setup-copy {
    display: grid;
    min-width: 0;
    gap: 0.18rem;
}

.home-setup-copy strong {
    color: var(--ink);
    font-size: 0.98rem;
    font-weight: 950;
}

.home-setup-copy small {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.4;
}

.home-setup-step b {
    justify-self: end;
    border-radius: 999px;
    padding: 0.46rem 0.68rem;
    color: var(--card-accent-deep);
    background: var(--card-wash);
    font-size: 0.76rem;
    font-weight: 950;
    white-space: nowrap;
}

.home-setup-step.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #083f3d;
    --card-wash: rgba(15, 118, 110, 0.13);
}

.home-setup-step.is-contacts,
.home-setup-step.is-seo {
    --card-accent: #2f7d50;
    --card-accent-deep: #123821;
    --card-wash: rgba(47, 125, 80, 0.13);
}

.home-setup-step.is-financials {
    --card-accent: #9a7727;
    --card-accent-deep: #21180b;
    --card-wash: rgba(154, 119, 39, 0.14);
}

.home-setup-step.is-products {
    --card-accent: #9a7727;
    --card-accent-deep: #21180b;
    --card-wash: rgba(154, 119, 39, 0.14);
}

.home-setup-step.is-conversations {
    --card-accent: #3658a8;
    --card-accent-deep: #161c4a;
    --card-wash: rgba(54, 88, 168, 0.13);
}

.home-setup-step.is-calendar {
    --card-accent: #a9465b;
    --card-accent-deep: #4b1d27;
    --card-wash: rgba(169, 70, 91, 0.13);
}

.home-setup-step.is-marketing,
.home-setup-step.is-forms {
    --card-accent: #3658a8;
    --card-accent-deep: #161c4a;
    --card-wash: rgba(54, 88, 168, 0.13);
}

.home-setup-step.is-ai {
    --card-accent: #794c8b;
    --card-accent-deep: #2c1737;
    --card-wash: rgba(121, 76, 139, 0.13);
}

.home-setup-step.is-projects,
.home-setup-step.is-automation,
.home-setup-step.is-helpdesk {
    --card-accent: #794c8b;
    --card-accent-deep: #2c1737;
    --card-wash: rgba(121, 76, 139, 0.13);
}

.home-setup-step.is-cloudfolder,
.home-setup-step.is-team {
    --card-accent: #0f766e;
    --card-accent-deep: #083f3d;
    --card-wash: rgba(15, 118, 110, 0.13);
}

.home-setup-step.is-events,
.home-setup-step.is-elearning,
.home-setup-step.is-pos {
    --card-accent: #a9465b;
    --card-accent-deep: #4b1d27;
    --card-wash: rgba(169, 70, 91, 0.13);
}

.home-attention-item,
.home-setup-step {
    position: relative;
    overflow: hidden;
    border-color: color-mix(in srgb, var(--card-accent) 34%, rgba(255, 255, 255, 0.22));
    color: #fff;
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.24), transparent 7.5rem),
        linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
    box-shadow: 0 1rem 2.2rem color-mix(in srgb, var(--card-accent-deep) 24%, transparent);
}

.home-attention-item:after,
.home-setup-step:after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(140deg, transparent 0 38%, rgba(255, 255, 255, 0.14) 38% 39%, transparent 39%),
        radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.18), transparent 6.5rem);
}

.home-attention-item:hover,
.home-setup-step:hover {
    border-color: color-mix(in srgb, var(--card-accent) 52%, rgba(255, 255, 255, 0.26));
    box-shadow: 0 1.25rem 2.7rem color-mix(in srgb, var(--card-accent-deep) 32%, transparent);
    filter: saturate(1.04);
}

.home-attention-number,
.home-attention-copy,
.home-attention-item b,
.home-setup-number,
.home-setup-copy,
.home-setup-step b {
    position: relative;
    z-index: 1;
}

.home-attention-copy strong,
.home-attention-copy small,
.home-setup-copy strong,
.home-setup-copy small {
    color: #fff;
    text-shadow: 0 4px 18px rgba(0, 0, 0, 0.46);
}

.home-attention-number,
.home-setup-number,
.home-setup-step.is-priority .home-setup-number {
    color: #fff;
    background: rgba(17, 19, 24, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07), 0 0.55rem 1rem rgba(0, 0, 0, 0.18);
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.45);
}

.home-attention-item b,
.home-setup-step b {
    color: var(--card-accent-deep);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0.65rem 1.35rem rgba(0, 0, 0, 0.16);
}

.home-setup-step.is-priority {
    border-color: color-mix(in srgb, var(--card-accent) 56%, rgba(255, 255, 255, 0.32));
    background:
        radial-gradient(circle at 11% 16%, rgba(255, 255, 255, 0.28), transparent 7.5rem),
        linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
    box-shadow: 0 1.2rem 2.6rem color-mix(in srgb, var(--card-accent-deep) 34%, transparent);
}

.home-card {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.1);
    --card-chip: rgba(138, 104, 29, 0.08);
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    overflow: hidden;
    min-height: 7.9rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.88rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.82)),
        var(--card-wash);
    box-shadow: var(--soft-shadow);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.home-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
}

.home-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: linear-gradient(180deg, var(--card-accent), var(--card-accent-deep));
}

.home-card-icon {
    display: grid;
    width: 2.18rem;
    height: 2.18rem;
    place-items: center;
    border-color: currentColor;
    color: var(--card-accent-deep);
}

.home-card-copy {
    display: grid;
    min-width: 0;
}

.home-card strong {
    margin-top: 0.24rem;
    color: var(--card-accent-deep);
    font-size: 1.75rem;
    line-height: 1;
}

.home-card small {
    margin-top: 0.2rem;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
}

.home-card .home-card-copy > span {
    margin-top: 0.36rem;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.38;
}

.home-card b {
    grid-column: 1 / -1;
    align-self: end;
    width: max-content;
    border-radius: 999px;
    padding: 0.42rem 0.68rem;
    color: var(--card-accent-deep);
    background: var(--card-chip);
    font-size: 0.78rem;
}

.home-card.is-messaging {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.1);
    --card-chip: rgba(138, 104, 29, 0.08);
}

.home-card.is-conversations {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.1);
    --card-chip: rgba(138, 104, 29, 0.08);
}

.home-card.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #0b5752;
    --card-wash: rgba(15, 118, 110, 0.1);
    --card-chip: rgba(15, 118, 110, 0.08);
}

.home-card.is-contacts {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.1);
    --card-chip: rgba(47, 125, 80, 0.08);
}

.home-card.is-financials {
    --card-accent: #b98a2c;
    --card-accent-deep: #6f5018;
    --card-wash: rgba(185, 138, 44, 0.12);
    --card-chip: rgba(185, 138, 44, 0.12);
}

.home-card.is-products {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.1);
    --card-chip: rgba(138, 104, 29, 0.1);
}

.home-card.is-calendar {
    --card-accent: #6f4a63;
    --card-accent-deep: #4a3244;
    --card-wash: rgba(111, 74, 99, 0.1);
    --card-chip: rgba(111, 74, 99, 0.08);
}

.home-card.is-marketing {
    --card-accent: #a65a45;
    --card-accent-deep: #743a2c;
    --card-wash: rgba(166, 90, 69, 0.1);
    --card-chip: rgba(166, 90, 69, 0.08);
}

.home-card.is-seo {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.1);
    --card-chip: rgba(47, 125, 80, 0.08);
}

.home-card.is-workspace {
    --card-accent: #5f5140;
    --card-accent-deep: #3b3329;
    --card-wash: rgba(95, 81, 64, 0.1);
    --card-chip: rgba(95, 81, 64, 0.08);
}

.home-toggle-card {
    grid-template-rows: auto 1fr auto;
}

.home-toggle-row {
    grid-column: 1 / -1;
    display: flex;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
}

.home-card-link {
    display: inline-flex;
    min-height: 1.85rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.62rem;
    color: var(--card-accent-deep);
    background: var(--card-chip);
    font-size: 0.74rem;
    font-weight: 900;
}

.home-auto-toggle {
    display: inline-flex;
    align-self: center;
    grid-auto-flow: column;
    align-items: center;
    justify-items: start;
    white-space: nowrap;
}

.dashboard-customiser-page {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 88rem;
    margin: 0 auto;
}

.dashboard-customiser-intro {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.95rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.dashboard-customiser-intro h2 {
    margin: 0.16rem 0 0;
    color: var(--ink);
    font-size: clamp(1.12rem, 1.7vw, 1.45rem);
    line-height: 1.15;
    letter-spacing: 0;
}

.dashboard-customiser-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
}

.dashboard-customiser-summary span,
.dashboard-widget-controls span {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.72);
}

.dashboard-customiser-summary b,
.dashboard-widget-controls b {
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.dashboard-customiser-summary small,
.dashboard-widget-controls small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1.35;
}

.dashboard-customiser-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.85rem;
}

.dashboard-customiser-card {
    --dashboard-widget-accent: #8a681d;
    display: grid;
    align-content: space-between;
    gap: 0.72rem;
    min-height: 15rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.95rem;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--dashboard-widget-accent) 16%, transparent) 0 0.22rem, transparent 0.22rem),
        rgba(255, 255, 255, 0.84);
    box-shadow: var(--soft-shadow);
    transition: opacity 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.dashboard-customiser-card.is-muted {
    opacity: 0.68;
}

.dashboard-customiser-card.is-saving {
    opacity: 0.74;
}

.dashboard-customiser-card.is-saved {
    animation: savedFlash 980ms ease both;
}

.dashboard-customiser-card.is-save-error {
    border-color: rgba(164, 62, 62, 0.36);
    box-shadow: 0 0 0 0.2rem rgba(164, 62, 62, 0.08), var(--soft-shadow);
}

.dashboard-customiser-card:hover {
    border-color: rgba(138, 104, 29, 0.24);
    box-shadow: var(--shadow);
}

.dashboard-customiser-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.dashboard-customiser-card-head > span {
    color: var(--brand-deep);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.dashboard-customiser-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.12rem;
    line-height: 1.14;
    letter-spacing: 0;
}

.dashboard-customiser-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.48;
}

.dashboard-widget-toggle {
    align-self: center;
    display: inline-flex;
    grid-auto-flow: column;
    align-items: center;
    justify-items: start;
    white-space: nowrap;
    cursor: pointer;
}

.dashboard-widget-toggle span {
    min-width: 3.1rem;
    color: var(--ink);
    font-size: 0.76rem;
    font-weight: 900;
    text-align: right;
}

.dashboard-widget-toggle.is-saved i {
    animation: moduleToggleSaved 980ms ease both;
}

.dashboard-widget-toggle.is-saving {
    opacity: 0.68;
}

.dashboard-widget-toggle.is-save-error i {
    border-color: rgba(164, 62, 62, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(164, 62, 62, 0.1);
}

.dashboard-widget-controls {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: stretch;
}

.dashboard-widget-controls label {
    display: grid;
    gap: 0.3rem;
    color: var(--ink);
    font-size: 0.72rem;
    font-weight: 900;
}

.dashboard-widget-controls .input-control {
    min-height: 2.45rem;
}

.dashboard-customiser-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}

:root[data-theme="dark"] .dashboard-customiser-intro,
:root[data-theme="dark"] .dashboard-customiser-summary span,
:root[data-theme="dark"] .dashboard-widget-controls span,
:root[data-theme="dark"] .dashboard-customiser-card {
    border-color: rgba(216, 179, 90, 0.16);
    background:
        linear-gradient(90deg, rgba(216, 179, 90, 0.14) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] .module-control-summary,
:root[data-theme="dark"] .module-summary-stats span {
    border-color: rgba(216, 179, 90, 0.16);
    background:
        linear-gradient(135deg, rgba(216, 179, 90, 0.12), transparent 50%),
        rgba(255, 255, 255, 0.06);
}

@media (max-width: 720px) {
    .dashboard-customiser-summary,
    .dashboard-customiser-grid,
    .dashboard-widget-controls {
        grid-template-columns: 1fr;
    }

    .dashboard-customiser-actions,
    .dashboard-customiser-actions .button-primary,
    .dashboard-customiser-actions .button-soft,
    .dashboard-customiser-intro .button-soft {
        width: 100%;
    }
}

.module-settings-page {
    display: grid;
    gap: 0.85rem;
    width: 100%;
    max-width: 92rem;
    margin: 0 auto;
}

.module-card-grid,
.onboarding-module-grid {
    display: grid;
    gap: 0.72rem;
}

.module-card-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
    gap: 1rem;
}

.module-group {
    display: grid;
    gap: 0.72rem;
}

.module-control-summary {
    display: grid;
    gap: 1rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.05)),
        rgba(255, 255, 255, 0.86);
    box-shadow: var(--soft-shadow);
}

.module-control-summary > div:first-child {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.module-control-summary strong {
    color: var(--ink);
    font-size: clamp(1.12rem, 2vw, 1.55rem);
    font-weight: 950;
    line-height: 1.12;
}

.module-control-summary p {
    max-width: 42rem;
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
    font-weight: 650;
    line-height: 1.5;
}

.module-summary-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.module-summary-stats span {
    display: grid;
    gap: 0.05rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.58rem 0.68rem;
    background: rgba(255, 255, 255, 0.72);
}

.module-summary-stats b {
    color: var(--brand-deep);
    font-size: 1.1rem;
    line-height: 1;
}

.module-summary-stats em {
    color: var(--muted);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.module-summary-billing {
    justify-self: stretch;
}

.module-group-head {
    display: grid;
    gap: 0.25rem;
    max-width: 48rem;
}

.module-group-head h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    font-weight: 950;
    letter-spacing: 0;
}

.module-group-head p {
    margin: 0;
    color: var(--muted);
    font-size: 0.96rem;
    font-weight: 720;
}

.module-section-grid {
    display: grid;
    gap: 0.72rem;
}

.module-group-divider {
    height: 1px;
    margin: 0.35rem 0;
    background: linear-gradient(90deg, transparent, rgba(138, 104, 29, 0.38), transparent);
}

.module-group.is-team-bridge .module-section-grid {
    grid-template-columns: minmax(0, 1fr);
}

.module-group.is-team-bridge .module-card {
    min-height: 13rem;
    border-color: rgba(138, 104, 29, 0.26);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.78)),
        linear-gradient(135deg, rgba(95, 81, 64, 0.16), rgba(138, 104, 29, 0.08));
}

.module-card-coming-soon {
    border-style: dashed;
}

.module-card-coming-soon .module-card-foot {
    opacity: 0.82;
}

.module-card,
.onboarding-module-card {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    position: relative;
    overflow: hidden;
    display: grid;
    align-content: space-between;
    gap: 0.85rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.82)),
        var(--card-wash);
    box-shadow: var(--soft-shadow);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.module-card {
    grid-template-rows: minmax(0, 1fr) auto;
    min-height: 11.6rem;
    height: 100%;
    scroll-margin-top: 1.5rem;
}

.onboarding-module-card {
    min-height: 10.4rem;
}

.module-card:before,
.onboarding-module-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: linear-gradient(180deg, var(--card-accent), var(--card-accent-deep));
}

.module-card:hover,
.onboarding-module-card:hover {
    transform: translateY(-1px);
    border-color: rgba(18, 21, 33, 0.14);
    box-shadow: var(--shadow);
}

.module-card:target {
    border-color: rgba(138, 104, 29, 0.36);
    box-shadow:
        0 0 0 0.18rem rgba(138, 104, 29, 0.12),
        var(--shadow);
}

.module-card.is-saving {
    opacity: 0.72;
}

.module-card.is-saved {
    animation: savedFlash 980ms ease both;
}

.module-card.is-save-error {
    border-color: rgba(164, 62, 62, 0.36);
    box-shadow: 0 0 0 0.2rem rgba(164, 62, 62, 0.08), var(--soft-shadow);
}

.module-card.is-muted {
    opacity: 0.72;
}

.module-card.is-trial:not(.is-paid) {
    border-style: dashed;
    border-color: rgba(138, 104, 29, 0.32);
}

.module-card.is-expired:not(.is-paid) {
    border-color: rgba(166, 90, 69, 0.32);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.84)),
        rgba(166, 90, 69, 0.08);
}

.module-card.is-expired:not(.is-paid) .module-status {
    color: #7b2f26;
    background: rgba(166, 90, 69, 0.12);
}

.module-card.is-paid {
    border-color: rgba(218, 190, 112, 0.52);
    background:
        linear-gradient(135deg, var(--card-accent), var(--card-accent-deep)),
        var(--card-accent-deep);
    box-shadow:
        0 1.1rem 2.6rem rgba(95, 69, 18, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.module-card.is-paid:before {
    width: 0.34rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(218, 190, 112, 0.74));
}

.module-card.is-paid .module-eyebrow,
.module-card.is-paid > div > span,
.module-card.is-paid strong,
.module-card.is-paid p {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.34);
}

.module-card.is-paid p {
    opacity: 0.92;
}

.module-card.is-paid .module-status {
    color: #17120a;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38);
}

.module-card.is-paid .module-price-chip {
    display: none;
}

.module-card.is-paid .module-toggle span {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.36);
}

.module-card.is-conversations,
.onboarding-module-card.is-conversations {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.08);
}

.module-card.is-helpdesk,
.onboarding-module-card.is-helpdesk {
    --card-accent: #6f5f46;
    --card-accent-deep: #3f3629;
    --card-wash: rgba(111, 95, 70, 0.08);
}

.module-card.is-website,
.onboarding-module-card.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #0b5752;
    --card-wash: rgba(15, 118, 110, 0.08);
}

.module-card.is-contacts,
.onboarding-module-card.is-contacts {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.08);
}

.module-card.is-financials,
.onboarding-module-card.is-financials {
    --card-accent: #b98a2c;
    --card-accent-deep: #6f5018;
    --card-wash: rgba(185, 138, 44, 0.1);
}

.module-card.is-products,
.onboarding-module-card.is-products {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.09);
}

.module-card.is-pos,
.onboarding-module-card.is-pos {
    --card-accent: #0f5f6f;
    --card-accent-deep: #083946;
    --card-wash: rgba(15, 95, 111, 0.08);
}

.module-card.is-tables {
    --card-accent: #3f6f5f;
    --card-accent-deep: #21483c;
    --card-wash: rgba(63, 111, 95, 0.08);
}

.module-card.is-calendar,
.onboarding-module-card.is-calendar {
    --card-accent: #6f4a63;
    --card-accent-deep: #4a3244;
    --card-wash: rgba(111, 74, 99, 0.08);
}

.module-card.is-events,
.onboarding-module-card.is-events {
    --card-accent: #7d4f45;
    --card-accent-deep: #54312a;
    --card-wash: rgba(125, 79, 69, 0.08);
}

.module-card.is-marketing,
.onboarding-module-card.is-marketing {
    --card-accent: #a65a45;
    --card-accent-deep: #743a2c;
    --card-wash: rgba(166, 90, 69, 0.08);
}

.module-card.is-elearning,
.onboarding-module-card.is-elearning {
    --card-accent: #6d5aa6;
    --card-accent-deep: #433461;
    --card-wash: rgba(109, 90, 166, 0.08);
}

.module-card.is-franchisees,
.onboarding-module-card.is-franchisees {
    --card-accent: #8f4f64;
    --card-accent-deep: #5b2d40;
    --card-wash: rgba(143, 79, 100, 0.08);
}

.module-card.is-forms,
.onboarding-module-card.is-forms {
    --card-accent: #765a82;
    --card-accent-deep: #513a60;
    --card-wash: rgba(118, 90, 130, 0.08);
}

.module-card.is-seo,
.onboarding-module-card.is-seo {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.08);
}

.module-card.is-ai,
.onboarding-module-card.is-ai {
    --card-accent: #6f5f46;
    --card-accent-deep: #111827;
    --card-wash: rgba(111, 95, 70, 0.09);
}

.module-card.is-team,
.onboarding-module-card.is-team {
    --card-accent: #5f5140;
    --card-accent-deep: #3b3329;
    --card-wash: rgba(95, 81, 64, 0.08);
}

.module-card.is-community,
.onboarding-module-card.is-community {
    --card-accent: #3f7566;
    --card-accent-deep: #244f45;
    --card-wash: rgba(63, 117, 102, 0.08);
}

.module-card.is-projects,
.onboarding-module-card.is-projects {
    --card-accent: #745f8c;
    --card-accent-deep: #4b3b62;
    --card-wash: rgba(116, 95, 140, 0.08);
}

.module-card.is-cloudfolder,
.onboarding-module-card.is-cloudfolder {
    --card-accent: #5f6f89;
    --card-accent-deep: #354257;
    --card-wash: rgba(95, 111, 137, 0.08);
}

.module-card.is-automation,
.onboarding-module-card.is-automation {
    --card-accent: #7d4f45;
    --card-accent-deep: #54312a;
    --card-wash: rgba(125, 79, 69, 0.08);
}

.automation-head-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}

.automation-summary-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0.2rem 0 1rem;
}

.automation-summary-card {
    display: grid;
    gap: 0.24rem;
    min-width: 0;
    border: 1px solid rgba(118, 93, 35, 0.16);
    border-radius: 8px;
    padding: 0.9rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.12), transparent 42%),
        #fff;
    box-shadow: 0 0.75rem 1.5rem rgba(18, 21, 33, 0.06);
}

.automation-summary-card em {
    color: var(--muted);
    font-size: 0.66rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.automation-summary-card strong {
    color: var(--ink);
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    line-height: 1;
}

.automation-summary-card small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.35;
}

.automation-summary-card.is-live {
    border-color: rgba(63, 117, 102, 0.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(63, 117, 102, 0.12), transparent 42%),
        #fff;
}

.automation-summary-card.is-action {
    border-color: rgba(138, 104, 29, 0.35);
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.22), transparent 45%),
        linear-gradient(135deg, rgba(138, 104, 29, 0.12), #fff 64%);
}

.automation-summary-card.is-muted {
    background: rgba(255, 255, 255, 0.72);
}

:root[data-theme="dark"] .automation-summary-card,
:root[data-theme="dark"] .automation-summary-card.is-live,
:root[data-theme="dark"] .automation-summary-card.is-action,
:root[data-theme="dark"] .automation-summary-card.is-muted {
    border-color: rgba(240, 216, 146, 0.16);
    background:
        radial-gradient(circle at 100% 0%, rgba(214, 173, 77, 0.14), transparent 46%),
        rgba(18, 27, 40, 0.82);
}

.automation-idea-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0.2rem 0 1rem;
}

.automation-idea-strip span {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    border: 1px solid rgba(118, 93, 35, 0.18);
    border-radius: 8px;
    padding: 0.85rem;
    background: linear-gradient(135deg, rgba(125, 79, 69, 0.1), rgba(118, 93, 35, 0.08));
}

.automation-idea-strip strong {
    color: var(--ink);
    font-size: 0.9rem;
}

.automation-idea-strip small {
    color: var(--muted);
    font-weight: 750;
    line-height: 1.45;
}

.automation-rule-grid {
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
}

.automation-rule-card {
    align-content: space-between;
}

.reports-page .automation-rule-grid {
    align-items: start;
    grid-auto-rows: auto;
}

.reports-page .automation-rule-card {
    min-height: 0;
    height: auto;
    align-content: start;
    grid-template-rows: auto;
    gap: 0.65rem;
    padding: 0.86rem 0.95rem;
}

.reports-page .automation-rule-card p {
    margin-bottom: 0;
}

.reports-page .automation-rule-meta {
    margin-top: 0.62rem;
}

.reports-page .automation-rule-actions {
    justify-content: flex-start;
}

.automation-rule-card.is-muted {
    opacity: 0.74;
}

.automation-rule-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.85rem;
}

.automation-rule-meta span {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
    border-radius: 7px;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.68);
}

.automation-rule-meta em {
    color: var(--muted);
    font-size: 0.62rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.automation-rule-meta b {
    color: var(--ink);
    font-size: 0.78rem;
    line-height: 1.3;
}

.automation-rule-actions {
    align-items: center;
    gap: 0.45rem;
}

.automation-settings-modal {
    z-index: 220;
}

.automation-settings-modal .cms-modal-card {
    width: min(54rem, 100%);
}

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

.automation-form-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
}

.automation-form-grid label.wide {
    grid-column: 1 / -1;
}

.automation-form-grid small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 750;
    line-height: 1.35;
}

.automation-start-toggle {
    align-self: end;
}

.automation-test-button {
    border-color: rgba(138, 104, 29, 0.28);
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
}

@media (max-width: 720px) {
    .automation-head-actions,
    .automation-head-actions .button-primary,
    .automation-head-actions .button-secondary {
        width: 100%;
    }

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

    .automation-idea-strip,
    .automation-form-grid,
    .automation-rule-meta {
        grid-template-columns: 1fr;
    }
}

.module-card.is-workspace,
.onboarding-module-card.is-workspace {
    --card-accent: #5f5140;
    --card-accent-deep: #3b3329;
    --card-wash: rgba(95, 81, 64, 0.08);
}

.module-settings-page .module-card,
.module-settings-page .module-group.is-team-bridge .module-card {
    border-color: rgba(255, 255, 255, 0.22);
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.2), transparent 32%),
        linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
    box-shadow:
        0 1rem 2.35rem rgba(18, 21, 33, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.module-settings-page .module-card:before,
.module-settings-page .module-group.is-team-bridge .module-card:before {
    width: 0.32rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.3));
}

.module-settings-page .module-card:hover {
    border-color: rgba(255, 255, 255, 0.34);
    box-shadow:
        0 1.2rem 2.7rem rgba(18, 21, 33, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.module-settings-page .module-card.is-muted {
    opacity: 0.84;
}

.module-settings-page .module-card-coming-soon {
    border-color: rgba(255, 255, 255, 0.28);
}

.module-settings-page .module-eyebrow,
.module-settings-page .module-card > div:not(.module-card-foot) > span,
.module-settings-page .module-card strong,
.module-settings-page .module-card p,
.module-settings-page .module-toggle span {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.module-settings-page .module-card p {
    opacity: 0.9;
}

.module-settings-page .module-status,
.module-settings-page .module-price-chip {
    color: #17120a !important;
    background: rgba(255, 255, 255, 0.86);
    text-shadow: none !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.34);
}

.module-settings-page .module-billing-link.button-soft,
.module-settings-page .module-billing-link.button-secondary {
    color: #17120a !important;
    border-color: rgba(255, 255, 255, 0.72);
    background: rgba(255, 255, 255, 0.9);
    text-shadow: none;
}

.module-settings-page .module-billing-link.button-primary {
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.24);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 34%),
        var(--banner-gold-gradient);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.32);
}

.module-settings-page .module-billing-link.button-soft *,
.module-settings-page .module-billing-link.button-secondary * {
    color: #17120a !important;
}

.module-settings-page .module-billing-link.button-primary * {
    color: #fff !important;
}

.module-eyebrow,
.module-card > div > span,
.onboarding-module-card > span {
    color: var(--card-accent-deep);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.module-card h2,
.module-card strong,
.onboarding-module-card strong {
    display: block;
    margin: 0.28rem 0 0;
    color: var(--ink);
    font-size: 1.04rem;
    line-height: 1.12;
    font-weight: 950;
}

.module-card p,
.onboarding-module-card p {
    margin: 0.42rem 0 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.module-card p {
    max-width: 34rem;
}

.module-card-copy {
    min-width: 0;
}

.module-setup-checklist {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.55rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.68rem;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52);
}

.module-setup-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
}

.module-setup-head span,
.module-setup-head b {
    color: var(--ink) !important;
    text-shadow: none !important;
}

.module-setup-head span {
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.module-setup-head b {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 0.24rem 0.48rem;
    background: rgba(138, 104, 29, 0.12);
    color: var(--brand-deep) !important;
    font-size: 0.66rem;
    font-weight: 950;
    line-height: 1;
}

.module-setup-items {
    display: grid;
    gap: 0.38rem;
}

.module-setup-item {
    display: grid;
    grid-template-columns: 1.18rem minmax(0, 1fr);
    gap: 0.48rem;
    align-items: start;
    border: 1px solid rgba(18, 21, 33, 0.06);
    border-radius: 8px;
    padding: 0.48rem;
    color: var(--ink);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.68);
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.module-setup-item:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.24);
    background: #fff;
}

.module-setup-item i {
    position: relative;
    width: 1.05rem;
    height: 1.05rem;
    margin-top: 0.08rem;
    border: 2px solid rgba(18, 21, 33, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.9);
}

.module-setup-item.is-done i {
    border-color: transparent;
    background: linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
}

.module-setup-item.is-done i:after {
    content: "";
    position: absolute;
    left: 0.28rem;
    top: 0.16rem;
    width: 0.28rem;
    height: 0.52rem;
    border: solid #fff;
    border-width: 0 0.12rem 0.12rem 0;
    transform: rotate(42deg);
}

.module-setup-item span {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.module-setup-item strong,
.module-setup-item small {
    color: var(--ink) !important;
    text-shadow: none !important;
}

.module-setup-item strong {
    margin: 0;
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.2;
}

.module-setup-item small {
    color: var(--muted) !important;
    font-size: 0.68rem;
    font-weight: 720;
    line-height: 1.32;
}

.module-setup-item.is-done {
    border-color: rgba(63, 117, 102, 0.2);
    background: rgba(255, 255, 255, 0.52);
}

.module-setup-item.is-done strong {
    color: var(--brand-deep) !important;
}

.module-card.is-paid .module-setup-checklist,
.module-settings-page .module-setup-checklist {
    border-color: rgba(255, 255, 255, 0.48);
    background: rgba(255, 255, 255, 0.9);
}

.module-setup-complete {
    position: relative;
    z-index: 1;
    display: inline-grid;
    grid-template-columns: auto auto;
    grid-template-areas:
        "icon label"
        "icon detail";
    gap: 0.02rem 0.5rem;
    align-items: center;
    justify-self: start;
    border: 1px solid rgba(255, 255, 255, 0.44);
    border-radius: 999px;
    padding: 0.5rem 0.75rem;
    color: #17120a;
    background: rgba(255, 255, 255, 0.92);
    box-shadow:
        0 0.72rem 1.45rem rgba(18, 21, 33, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.module-setup-complete span {
    position: relative;
    display: grid;
    grid-area: icon;
    width: 1.28rem;
    height: 1.28rem;
    place-items: center;
    border-radius: 999px;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.5rem 0.9rem rgba(95, 69, 18, 0.2);
}

.module-setup-complete span:after {
    content: "";
    width: 0.34rem;
    height: 0.62rem;
    margin-top: -0.1rem;
    border: solid #fff;
    border-width: 0 0.13rem 0.13rem 0;
    transform: rotate(42deg);
}

.module-setup-complete strong,
.module-setup-complete small {
    color: inherit !important;
    text-shadow: none !important;
}

.module-setup-complete strong {
    grid-area: label;
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
}

.module-setup-complete small {
    grid-area: detail;
    color: rgba(23, 18, 10, 0.62) !important;
    font-size: 0.62rem;
    font-weight: 850;
    line-height: 1;
}

:root[data-theme="dark"] .module-setup-checklist {
    border-color: rgba(240, 216, 146, 0.12);
    background: rgba(10, 16, 25, 0.38);
}

:root[data-theme="dark"] .module-setup-head span,
:root[data-theme="dark"] .module-setup-item strong {
    color: #f8f5ee !important;
}

:root[data-theme="dark"] .module-setup-head b {
    color: #17120a !important;
    background: rgba(240, 216, 146, 0.88);
}

:root[data-theme="dark"] .module-setup-item {
    border-color: rgba(240, 216, 146, 0.1);
    background: rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] .module-setup-item small {
    color: rgba(248, 245, 238, 0.72) !important;
}

button.module-card {
    width: 100%;
    border-color: rgba(18, 21, 33, 0.08);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.project-shell {
    display: grid;
    grid-template-columns: minmax(16rem, 0.34fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.project-list-panel,
.project-detail-panel {
    min-width: 0;
}

.project-detail-panel {
    display: grid;
    gap: 1rem;
}

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

.project-tile.is-active {
    border-color: rgba(138, 104, 29, 0.34);
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.14) 0 0.22rem, transparent 0.22rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.72));
    box-shadow: 0 1rem 2rem rgba(138, 104, 29, 0.12);
}

@media (max-width: 759px) {
    .project-shell {
        grid-template-columns: 1fr;
    }
}

.module-card-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.72rem;
}

.billing-plan-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    margin: 0 0 1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius);
    padding: 0.92rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(255, 255, 255, 0.76);
    box-shadow: var(--soft-shadow);
}

.billing-plan-summary strong {
    display: block;
    margin-top: 0.16rem;
    color: var(--ink);
    font-size: 1.08rem;
    font-weight: 950;
}

.billing-plan-total {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.62rem;
    flex: 1 1 24rem;
    text-align: center;
}

.billing-plan-total span {
    color: var(--ink);
    font-size: 0.95rem;
    font-weight: 950;
}

.billing-subtotal {
    text-decoration: line-through;
    opacity: 0.68;
}

.billing-discount {
    color: var(--brand-deep) !important;
}

.billing-payment-button {
    min-height: 3rem;
    gap: 0.62rem;
    flex: 0 1 auto;
    margin: 0 auto;
    border-radius: 999px;
    padding: 0 1.15rem;
    color: #fff !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 46%),
        var(--banner-gold-gradient);
    box-shadow: 0 1rem 2.6rem rgba(95, 69, 18, 0.28);
}

.billing-payment-button.is-loading {
    pointer-events: none;
}

.billing-payment-button.is-loading .billing-payment-icon {
    border-radius: 999px;
    animation: billingButtonPulse 900ms ease-in-out infinite alternate;
}

.billing-payment-button span {
    color: #fff !important;
}

.billing-payment-button:hover {
    box-shadow: 0 1.15rem 3rem rgba(95, 69, 18, 0.34);
}

.billing-payment-button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
    transform: none;
    box-shadow: 0 0.65rem 1.5rem rgba(95, 69, 18, 0.16);
}

.billing-seat-summary {
    display: inline-flex;
    min-height: 1.55rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 999px;
    padding: 0 0.56rem;
    color: var(--muted) !important;
    background: rgba(255, 255, 255, 0.64);
    font-size: 0.7rem !important;
    font-weight: 900 !important;
}

.billing-payment-icon {
    position: relative;
    display: inline-flex;
    width: 1.42rem;
    height: 1rem;
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 0.22rem;
    box-shadow: inset 0 -0.28rem 0 rgba(255, 255, 255, 0.16);
}

.billing-payment-icon:before {
    content: "";
    position: absolute;
    top: 0.22rem;
    right: 0.18rem;
    left: 0.18rem;
    height: 0.12rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
}

.billing-payment-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.42rem;
    width: 100%;
}

.billing-payment-note {
    width: 100%;
    max-width: 22rem;
    margin: 0.1rem auto 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
}

.payment-logo {
    position: relative;
    display: inline-flex;
    width: 3.15rem;
    min-height: 1.85rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(20, 17, 11, 0.1);
    border-radius: 0.42rem;
    padding: 0;
    color: #171611;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 0.42rem 1rem rgba(20, 17, 11, 0.08);
    overflow: hidden;
}

.payment-logo:before,
.payment-logo:after {
    content: "";
    position: absolute;
}

.payment-logo.is-mastercard {
    background:
        radial-gradient(circle at 43% 50%, #eb5f2f 0 0.64rem, transparent 0.66rem),
        radial-gradient(circle at 57% 50%, #f4b536 0 0.64rem, transparent 0.66rem),
        rgba(255, 255, 255, 0.9);
}

.payment-logo.is-visa:before {
    inset: 0.45rem 0.55rem 0.5rem;
    background:
        linear-gradient(112deg, transparent 0 18%, #1a326f 18% 33%, transparent 33% 100%),
        linear-gradient(90deg, #1a326f 0 100%);
    clip-path: polygon(0 0, 18% 100%, 35% 100%, 48% 28%, 61% 100%, 78% 100%, 100% 0, 82% 0, 70% 60%, 59% 0, 42% 0, 30% 60%, 18% 0);
}

.payment-logo.is-paypal {
    background: #fff;
}

.payment-logo.is-paypal:before,
.payment-logo.is-paypal:after {
    width: 0.9rem;
    height: 1.2rem;
    border-radius: 0.34rem 0.45rem 0.4rem 0.18rem;
    transform: skew(-10deg);
}

.payment-logo.is-paypal:before {
    left: 1.08rem;
    top: 0.32rem;
    background: #173c74;
}

.payment-logo.is-paypal:after {
    left: 1.32rem;
    top: 0.48rem;
    background: rgba(29, 155, 209, 0.86);
}

.payment-logo.is-stripe:before {
    inset: 0.58rem 0.5rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #7a4ef0, #4f2eb8);
}

.payment-logo.is-stripe:after {
    inset: 0.82rem 0.82rem 0.82rem 0.86rem;
    border-radius: 999px;
    background:
        linear-gradient(90deg, transparent 0 35%, rgba(255, 255, 255, 0.95) 35% 46%, transparent 46% 100%),
        rgba(255, 255, 255, 0.7);
}

.billing-module-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--ink);
    font-size: 0.76rem;
    font-weight: 950;
    cursor: pointer;
}

.cta-booking-only.is-hidden {
    display: none;
}

.product-digital-panel.is-hidden {
    display: none;
}

.billing-sales-page {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 96rem;
    margin: 0 auto;
}

.billing-standalone .main-content {
    width: min(100%, 100rem);
    margin: 0 auto;
    padding: 1.25rem 1rem 2.5rem;
}

.billing-sales-hero,
.billing-seat-panel,
.billing-offer-panel,
.billing-confidence-panel,
.billing-plan-summary,
.billing-module-card {
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    box-shadow: var(--soft-shadow);
}

.billing-sales-hero {
    display: grid;
    gap: 1rem;
    align-items: center;
    overflow: hidden;
    padding: clamp(1rem, 2.4vw, 1.65rem);
    color: #fff;
    background:
        radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.26), transparent 22rem),
        var(--banner-gold-gradient);
}

.billing-sales-hero .eyebrow,
.billing-sales-hero h1,
.billing-sales-hero p {
    color: #fff;
}

.billing-sales-hero h1 {
    max-width: 48rem;
    margin: 0.35rem 0 0;
    font-size: clamp(2rem, 6vw, 4.6rem);
    line-height: 0.94;
}

.billing-sales-hero p {
    max-width: 43rem;
    margin: 0.7rem 0 0;
    font-size: clamp(0.95rem, 2vw, 1.16rem);
    line-height: 1.5;
    opacity: 0.9;
}

.billing-free-stack {
    display: grid;
    gap: 0.32rem;
    align-content: center;
    justify-self: start;
    min-height: 6rem;
    border: 1px solid rgba(255, 255, 255, 0.26);
    border-radius: 8px;
    padding: 0.9rem 1rem;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(14px);
}

.billing-free-stack span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.billing-free-stack strong {
    color: #fff;
    font-size: 1rem;
    line-height: 1.25;
}

.billing-checkout-stack .button-primary {
    justify-self: start;
    margin-top: 0.35rem;
    color: var(--brand-deep) !important;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 0.8rem 1.8rem rgba(20, 17, 11, 0.18);
}

.billing-seat-panel,
.billing-offer-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.08)),
        rgba(255, 255, 255, 0.82);
}

.billing-seat-panel strong,
.billing-offer-panel strong {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink);
    font-size: 1.08rem;
    line-height: 1.15;
}

.billing-seat-panel p,
.billing-offer-panel p {
    max-width: 38rem;
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.billing-reassurance-strip,
.billing-route-strip,
.public-sales-step-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.72rem;
}

.billing-reassurance-strip span,
.billing-route-strip span,
.public-sales-step-strip span {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.88rem 0.95rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.82)),
        rgba(138, 104, 29, 0.08);
    box-shadow: var(--soft-shadow);
}

.billing-reassurance-strip span:before,
.billing-route-strip span:before,
.public-sales-step-strip span:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.2rem;
    background: var(--banner-gold-gradient);
}

.billing-reassurance-strip strong,
.billing-route-strip strong,
.public-sales-step-strip strong {
    display: block;
    color: var(--ink);
    font-size: 0.92rem;
    line-height: 1.15;
    font-weight: 950;
}

.billing-reassurance-strip small,
.billing-route-strip small,
.public-sales-step-strip small {
    display: block;
    margin-top: 0.28rem;
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.38;
    font-weight: 800;
}

.billing-route-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(11rem, auto);
    align-items: stretch;
}

.billing-route-strip .button-primary {
    min-height: 100%;
    justify-content: center;
    padding-inline: 1rem;
    text-align: center;
    white-space: normal;
}

.billing-confidence-panel {
    display: grid;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.12), transparent 18rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78));
}

.billing-confidence-panel h2 {
    margin: 0.18rem 0 0;
    color: var(--ink);
    font-size: clamp(1.3rem, 2.6vw, 2rem);
    line-height: 1;
}

.billing-confidence-panel p {
    max-width: 48rem;
    margin: 0.42rem 0 0;
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 760;
    line-height: 1.48;
}

.billing-confidence-panel ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.58rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.billing-confidence-panel li {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.72rem;
    background: rgba(255, 255, 255, 0.72);
}

.billing-confidence-panel li strong {
    color: var(--ink);
    font-size: 0.82rem;
    line-height: 1.18;
}

.billing-confidence-panel li span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 780;
    line-height: 1.36;
}

.billing-success-next {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
}

.billing-success-next span {
    display: grid;
    gap: 0.2rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.88rem;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--soft-shadow);
}

.billing-success-next strong {
    color: var(--ink);
    font-size: 0.86rem;
    line-height: 1.18;
}

.billing-success-next small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 780;
    line-height: 1.38;
}

.public-sales-step-strip strong {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.75rem 1.25rem rgba(95, 69, 18, 0.18);
}

.billing-seat-counter {
    display: inline-grid;
    grid-template-columns: 2.7rem 5rem 2.7rem;
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0.65rem 1.35rem rgba(138, 104, 29, 0.12);
}

.billing-seat-counter button,
.billing-seat-counter .input-control {
    width: 100%;
    min-height: 2.7rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
    font-weight: 950;
}

.billing-seat-counter button {
    color: var(--brand-deep);
    font-size: 1.1rem;
    cursor: pointer;
}

.billing-seat-counter button:hover {
    background: rgba(138, 104, 29, 0.1);
}

.billing-seat-counter input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
}

.billing-seat-counter input[type="number"]::-webkit-outer-spin-button,
.billing-seat-counter input[type="number"]::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.billing-offer-panel {
    border-color: rgba(166, 90, 69, 0.16);
    background:
        linear-gradient(135deg, rgba(166, 90, 69, 0.12), rgba(138, 104, 29, 0.14)),
        rgba(255, 255, 255, 0.88);
}

.billing-offer-badge {
    display: grid;
    min-width: 6rem;
    min-height: 6rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 1rem 2rem rgba(166, 90, 69, 0.18);
    font-size: 1.05rem;
    font-weight: 950;
    text-align: center;
}

.billing-module-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.72rem;
}

.billing-module-card {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    overflow: hidden;
    min-height: 7.5rem;
    padding: 0.92rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.82)),
        var(--card-wash);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.billing-module-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: linear-gradient(180deg, var(--card-accent), var(--card-accent-deep));
}

.billing-module-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
}

.billing-module-card.is-muted {
    opacity: 0.62;
}

.billing-module-card.is-selected {
    border-color: rgba(138, 104, 29, 0.34);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.88)),
        linear-gradient(135deg, rgba(138, 104, 29, 0.16), rgba(95, 69, 18, 0.1));
    box-shadow: 0 1rem 2.4rem rgba(95, 69, 18, 0.13);
}

.billing-module-card.is-paid {
    border-color: rgba(138, 104, 29, 0.42);
    box-shadow: 0 1rem 2.4rem rgba(95, 69, 18, 0.16), inset 0 0 0 1px rgba(138, 104, 29, 0.12);
}

.billing-module-card.is-trial {
    border-style: dashed;
}

.billing-module-card.is-expired {
    border-color: rgba(166, 90, 69, 0.28);
}

.billing-module-card.is-conversations {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.08);
}

.billing-module-card.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #0b5752;
    --card-wash: rgba(15, 118, 110, 0.08);
}

.billing-module-card.is-seo,
.billing-module-card.is-contacts {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.08);
}

.billing-module-card.is-financials {
    --card-accent: #b98a2c;
    --card-accent-deep: #6f5018;
    --card-wash: rgba(185, 138, 44, 0.1);
}

.billing-module-card.is-products {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.09);
}

.billing-module-card.is-pos {
    --card-accent: #0f5f6f;
    --card-accent-deep: #083946;
    --card-wash: rgba(15, 95, 111, 0.08);
}

.billing-module-card.is-calendar {
    --card-accent: #6f4a63;
    --card-accent-deep: #4a3244;
    --card-wash: rgba(111, 74, 99, 0.08);
}

.billing-module-card.is-cloudfolder {
    --card-accent: #5f6f89;
    --card-accent-deep: #354257;
    --card-wash: rgba(95, 111, 137, 0.08);
}

.billing-module-card.is-projects {
    --card-accent: #745f8c;
    --card-accent-deep: #4b3b62;
    --card-wash: rgba(116, 95, 140, 0.08);
}

.billing-module-card.is-automation {
    --card-accent: #7d4f45;
    --card-accent-deep: #54312a;
    --card-wash: rgba(125, 79, 69, 0.08);
}

.billing-module-card.is-marketing {
    --card-accent: #a65a45;
    --card-accent-deep: #743a2c;
    --card-wash: rgba(166, 90, 69, 0.08);
}

.billing-module-card.is-elearning {
    --card-accent: #6d5aa6;
    --card-accent-deep: #433461;
    --card-wash: rgba(109, 90, 166, 0.08);
}

.billing-module-card.is-forms {
    --card-accent: #765a82;
    --card-accent-deep: #513a60;
    --card-wash: rgba(118, 90, 130, 0.08);
}

.billing-module-card.is-ai {
    --card-accent: #6f5f46;
    --card-accent-deep: #111827;
    --card-wash: rgba(111, 95, 70, 0.09);
}

.billing-module-pick {
    position: relative;
    z-index: 1;
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    cursor: pointer;
}

.billing-module-pick input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.billing-checkmark {
    display: grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border: 1px solid rgba(138, 104, 29, 0.24);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 0.55rem 1.1rem rgba(31, 42, 68, 0.08);
}

.billing-checkmark:after {
    content: "";
    width: 0.72rem;
    height: 0.42rem;
    border-bottom: 0.16rem solid #fff;
    border-left: 0.16rem solid #fff;
    opacity: 0;
    transform: translateY(-0.06rem) rotate(-45deg);
}

.billing-module-pick input:checked + .billing-checkmark {
    border-color: transparent;
    background: linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
}

.billing-module-pick input:checked + .billing-checkmark:after {
    opacity: 1;
}

.billing-module-copy {
    min-width: 0;
}

.billing-module-copy strong {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink);
    font-size: 1.05rem;
    line-height: 1.12;
    font-weight: 950;
}

.billing-module-copy p {
    max-width: 38rem;
    margin: 0.36rem 0 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.42;
}

.billing-mini-note {
    display: inline-flex;
    width: max-content;
    max-width: 100%;
    min-height: 1.45rem;
    align-items: center;
    margin-top: 0.5rem;
    border-radius: 999px;
    padding: 0 0.55rem;
    color: var(--card-accent-deep);
    background: var(--card-wash);
    font-size: 0.7rem;
    font-weight: 900;
}

.billing-model-note {
    display: inline-flex;
    width: max-content;
    max-width: 100%;
    min-height: 1.45rem;
    align-items: center;
    margin-top: 0.5rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0 0.55rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.62);
    font-size: 0.7rem;
    font-weight: 900;
}

.billing-module-price {
    display: grid;
    gap: 0.2rem;
    justify-items: end;
    text-align: right;
}

.billing-module-price span {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
}

.billing-module-price strong {
    color: var(--ink);
    font-size: 1.08rem;
    font-weight: 950;
}

.billing-manage-link {
    grid-column: 3;
    justify-self: end;
}

#billing-payment,
#billing-checkout {
    scroll-margin-top: 1rem;
}

.billing-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: 0.65rem 1rem;
    padding: 0.15rem 0.1rem 0;
}

.billing-section-head h2 {
    margin: 0.14rem 0 0;
    color: var(--ink);
    font-size: clamp(1.45rem, 3vw, 2.3rem);
    line-height: 1;
}

.billing-section-head p {
    max-width: 34rem;
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.45;
    font-weight: 800;
}

.public-sales-standalone {
    min-height: 100vh;
    background: linear-gradient(180deg, #fbfbf8 0%, #f3f7f6 52%, #f7f2e7 100%);
}

.public-sales-page {
    gap: 1.15rem;
}

.public-sales-topbar {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    padding: 0.72rem 0.9rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--soft-shadow);
}

.public-sales-brand {
    display: inline-flex;
    align-items: center;
    min-width: 8.5rem;
}

.public-sales-brand img {
    display: block;
    max-width: 8.8rem;
    max-height: 2rem;
    object-fit: contain;
}

.public-sales-brand.public-sales-mark {
    min-width: 0;
    width: 2.8rem;
    height: 2.8rem;
    justify-content: center;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    background: #fff;
}

.public-sales-brand.public-sales-mark img {
    max-width: 1.9rem;
    max-height: 2.2rem;
}

.public-sales-topbar nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    justify-content: flex-end;
}

.public-sales-topbar nav a:not(.button-primary) {
    border-radius: 999px;
    padding: 0.52rem 0.72rem;
    color: var(--muted);
    font-size: 0.83rem;
    font-weight: 850;
    text-decoration: none;
}

.public-sales-topbar nav a:not(.button-primary):hover {
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.08);
}

.public-sales-topbar nav .button-primary.compact {
    color: #fff !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 34%),
        linear-gradient(135deg, #8a681d, #21180b) !important;
}

.public-sales-topbar nav .button-primary.compact:visited,
.public-sales-topbar nav .button-primary.compact:hover,
.public-sales-topbar nav .button-primary.compact:focus-visible {
    color: #fff !important;
}

.public-sales-hero {
    grid-template-columns: minmax(0, 1fr) minmax(17rem, 0.32fr);
    min-height: 24rem;
    padding: clamp(1.2rem, 3vw, 2.6rem);
    background: linear-gradient(135deg, #13221f 0%, #0f766e 46%, #8a681d 100%);
}

.public-sales-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.15rem;
}

.public-sales-microcopy {
    margin-top: 0.75rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.86rem;
    font-weight: 850;
}

.public-sales-actions .button-soft {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
}

.public-sales-free-stack {
    justify-self: stretch;
    min-height: 12rem;
}

.public-sales-free-stack ul {
    display: grid;
    gap: 0.4rem;
    margin: 0.55rem 0 0;
    padding: 0;
    list-style: none;
}

.public-sales-free-stack li {
    position: relative;
    padding-left: 1rem;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.35;
}

.public-sales-free-stack li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45rem;
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #d1a642, #6f5018);
    box-shadow: 0 0 0 0.18rem rgba(255, 255, 255, 0.12);
}

.public-sales-cta-banner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.3fr);
    gap: 1rem;
    align-items: center;
    border: 1px solid rgba(105, 73, 12, 0.16);
    border-radius: 8px;
    padding: clamp(1rem, 2.8vw, 1.6rem);
    background: linear-gradient(135deg, #13221f 0%, #0f766e 54%, #8a681d 100%);
    box-shadow: var(--shadow);
}

.public-sales-proof-strip,
.public-sales-value-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.78rem;
}

.public-sales-proof-strip span,
.public-sales-value-grid article {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: var(--soft-shadow);
}

.public-sales-proof-strip span:before,
.public-sales-value-grid article:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.2rem;
    background: linear-gradient(180deg, #0f766e, #8a681d);
}

.public-sales-proof-strip strong,
.public-sales-value-grid strong {
    display: block;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.15;
    font-weight: 950;
}

.public-sales-proof-strip small,
.public-sales-value-grid p {
    display: block;
    margin-top: 0.4rem;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
    font-weight: 720;
}

.public-sales-value-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.public-sales-value-grid article {
    min-height: 11rem;
    padding: 1.05rem;
}

.public-sales-value-grid span {
    display: inline-flex;
    width: max-content;
    max-width: 100%;
    margin-bottom: 0.55rem;
    border-radius: 999px;
    padding: 0.24rem 0.55rem;
    background: rgba(15, 118, 110, 0.09);
    color: #0b5752;
    font-size: 0.72rem;
    font-weight: 950;
}

.public-sales-cta-banner .module-eyebrow,
.public-sales-cta-banner strong {
    color: #fff;
}

.public-sales-cta-banner strong {
    display: block;
    max-width: 48rem;
    margin-top: 0.18rem;
    font-size: clamp(1.25rem, 2.5vw, 2rem);
    line-height: 1.05;
    font-weight: 950;
}

.public-sales-cta-banner .button-primary {
    width: 100%;
    justify-content: center;
    color: #fff;
}

.public-sales-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    justify-content: flex-start;
}

.public-sales-cta-banner .public-sales-cta-actions {
    justify-self: stretch;
}

.public-sales-cta-actions .button-primary,
.public-sales-cta-actions .button-soft {
    justify-content: center;
}

.public-sales-cta-banner .public-sales-cta-actions .button-primary,
.public-sales-cta-banner .public-sales-cta-actions .button-soft {
    flex: 1 1 12rem;
    width: auto;
}

.public-sales-cta-banner .button-soft {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
}

.public-sales-intro,
.sales-final-cta {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: clamp(1rem, 2.4vw, 1.45rem);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--soft-shadow);
}

.public-sales-faq {
    display: grid;
    gap: 1rem;
    margin-top: 0.85rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: clamp(1rem, 2.4vw, 1.45rem);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--soft-shadow);
}

.public-sales-faq .marketing-section-heading {
    max-width: 46rem;
}

.trial-countdown-panel {
    display: grid;
    gap: 0.85rem;
    margin-top: 0.85rem;
    border: 1px solid rgba(138, 104, 29, 0.15);
    border-radius: 8px;
    padding: clamp(0.9rem, 2vw, 1.15rem);
    background:
        radial-gradient(circle at 92% 8%, rgba(138, 104, 29, 0.12), transparent 16rem),
        rgba(255, 255, 255, 0.88);
    box-shadow: var(--soft-shadow);
}

.trial-countdown-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    align-items: center;
    justify-content: space-between;
}

.trial-countdown-head h2 {
    margin: 0.2rem 0 0;
    color: var(--ink);
    font-size: clamp(1.05rem, 2vw, 1.45rem);
    line-height: 1.05;
}

.trial-countdown-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.72rem;
}

.trial-countdown-card {
    position: relative;
    display: grid;
    gap: 0.68rem;
    align-content: start;
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.95rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.84)),
        rgba(138, 104, 29, 0.08);
}

.trial-countdown-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: var(--banner-gold-gradient);
}

.trial-countdown-card.is-urgent {
    border-color: rgba(166, 90, 69, 0.24);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.84)),
        rgba(166, 90, 69, 0.09);
}

.trial-countdown-card strong {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink);
    font-size: 1.05rem;
    line-height: 1.15;
    font-weight: 950;
}

.trial-countdown-card p {
    margin: 0.3rem 0 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.42;
}

.trial-progress {
    overflow: hidden;
    height: 0.44rem;
    border-radius: 999px;
    background: rgba(18, 21, 33, 0.08);
}

.trial-progress span {
    display: block;
    width: var(--trial-left, 100%);
    height: 100%;
    border-radius: inherit;
    background: var(--banner-gold-gradient);
}

.public-sales-intro:before,
.sales-final-cta:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.24rem;
    background: linear-gradient(180deg, var(--brand), var(--brand-deep));
}

.public-sales-intro h2,
.sales-final-cta h2 {
    max-width: 48rem;
    margin: 0.3rem 0 0;
    color: var(--ink);
    font-size: clamp(1.45rem, 3vw, 2.45rem);
    line-height: 1;
}

.public-sales-intro p,
.sales-final-cta p {
    max-width: 44rem;
    margin: 0.6rem 0 0;
    color: var(--muted);
    line-height: 1.55;
}

.sales-module-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.82rem;
}

.sales-module-card {
    --card-accent: var(--brand);
    --card-accent-deep: var(--brand-deep);
    --card-wash: rgba(138, 104, 29, 0.08);
    position: relative;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 1rem;
    min-height: 22rem;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 1rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.82)),
        var(--card-wash);
    box-shadow: var(--soft-shadow);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.sales-module-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
}

.sales-module-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.25rem;
    background: linear-gradient(90deg, var(--card-accent), var(--card-accent-deep));
}

.sales-module-card.is-conversations {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.08);
}

.sales-module-card.is-website {
    --card-accent: #0f766e;
    --card-accent-deep: #0b5752;
    --card-wash: rgba(15, 118, 110, 0.08);
}

.sales-module-card.is-seo {
    --card-accent: #2f7d50;
    --card-accent-deep: #1f5f3d;
    --card-wash: rgba(47, 125, 80, 0.08);
}

.sales-module-card.is-financials,
.sales-module-card.is-products {
    --card-accent: #b98a2c;
    --card-accent-deep: #6f5018;
    --card-wash: rgba(185, 138, 44, 0.1);
}

.sales-module-card.is-calendar {
    --card-accent: #6f4a63;
    --card-accent-deep: #4a3244;
    --card-wash: rgba(111, 74, 99, 0.08);
}

.sales-module-card.is-marketing {
    --card-accent: #a65a45;
    --card-accent-deep: #743a2c;
    --card-wash: rgba(166, 90, 69, 0.08);
}

.sales-module-card.is-elearning {
    --card-accent: #6d5aa6;
    --card-accent-deep: #433461;
    --card-wash: rgba(109, 90, 166, 0.08);
}

.sales-module-card.is-forms,
.sales-module-card.is-projects,
.sales-module-card.is-cloudfolder,
.sales-module-card.is-automation,
.sales-module-card.is-ai {
    --card-accent: #765a82;
    --card-accent-deep: #513a60;
    --card-wash: rgba(118, 90, 130, 0.08);
}

.sales-module-card strong {
    display: block;
    margin-top: 0.28rem;
    color: var(--ink);
    font-size: clamp(1.35rem, 2.5vw, 2.1rem);
    line-height: 0.98;
    font-weight: 950;
}

.sales-module-outcome {
    display: block;
    margin-top: 0.42rem;
    color: var(--card-accent-deep);
    font-size: 0.88rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1.28;
}

.sales-module-card p {
    margin: 0.68rem 0 0;
    color: var(--muted);
    font-size: 0.94rem;
    line-height: 1.52;
}

.sales-feature-list {
    display: grid;
    gap: 0.42rem;
    margin: 0.9rem 0 0;
    padding: 0;
    list-style: none;
}

.sales-feature-list li {
    position: relative;
    padding-left: 1.15rem;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 760;
    line-height: 1.38;
}

.sales-feature-list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.48rem;
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--card-accent), var(--card-accent-deep));
}

.sales-module-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(18, 21, 33, 0.08);
    padding-top: 0.85rem;
}

.sales-module-actions span {
    color: var(--card-accent-deep);
    font-size: 0.85rem;
    font-weight: 950;
}

.sales-module-action-stack {
    display: grid;
    gap: 0.45rem;
    min-width: 10.5rem;
}

.sales-module-action-stack .button-primary,
.sales-module-action-stack .button-soft {
    justify-content: center;
}

.sales-final-cta {
    display: grid;
    gap: 0.85rem;
    justify-items: start;
    padding: clamp(1.2rem, 3vw, 2rem);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(242, 248, 247, 0.92));
}

.packages-comparison {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) minmax(0, 1.05fr);
    gap: 0.9rem;
    align-items: stretch;
    overflow: visible;
}

.package-card {
    position: relative;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    gap: 0.95rem;
    overflow: visible;
    border: 1px solid rgba(18, 21, 33, 0.09);
    border-radius: 8px;
    padding: clamp(1rem, 2.4vw, 1.35rem);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.86)),
        rgba(15, 118, 110, 0.05);
    box-shadow: var(--soft-shadow);
}

.package-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.28rem;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(90deg, #0f766e, #8a681d);
}

.package-card:hover,
.package-card:focus-within {
    z-index: 20;
}

.package-card-featured {
    --package-accent: #0f766e;
    --package-accent-soft: rgba(15, 118, 110, 0.08);
    border-color: rgba(15, 118, 110, 0.24);
    background:
        radial-gradient(circle at 86% 8%, rgba(15, 118, 110, 0.13), transparent 12rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(243, 250, 249, 0.9));
}

.package-card-modules {
    --package-accent: #8a681d;
    --package-accent-soft: rgba(138, 104, 29, 0.1);
    background:
        radial-gradient(circle at 14% 8%, rgba(138, 104, 29, 0.12), transparent 11rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(250, 247, 239, 0.9));
}

.package-card-enterprise {
    --package-accent: #765a82;
    --package-accent-soft: rgba(118, 90, 130, 0.1);
    background:
        radial-gradient(circle at 84% 10%, rgba(118, 90, 130, 0.13), transparent 12rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(247, 244, 249, 0.9));
}

.package-card-head h2 {
    margin: 0.16rem 0 0;
    color: var(--ink);
    font-size: clamp(1.9rem, 3.4vw, 2.8rem);
    line-height: 0.98;
}

.package-word {
    color: var(--package-word-color, currentColor);
}

.package-word-core {
    --package-word-color: #0b5752;
}

.package-word-modules {
    --package-word-color: #6f5018;
}

.package-word-enterprise {
    --package-word-color: #513a60;
}

.package-audience {
    display: block;
    margin-top: 0.38rem;
    color: #0b5752;
    font-size: clamp(0.98rem, 1.6vw, 1.16rem);
    font-weight: 900;
    line-height: 1.18;
}

.package-card-modules .package-audience {
    color: #6f5018;
}

.package-card-enterprise .package-audience {
    color: #513a60;
}

.package-card-head p {
    margin: 0.62rem 0 0;
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.5;
    font-weight: 720;
}

.package-price {
    display: flex;
    flex-wrap: wrap;
    gap: 0.38rem 0.5rem;
    align-items: baseline;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.72rem 0.8rem;
    background: rgba(255, 255, 255, 0.75);
}

.package-price strong {
    color: var(--ink);
    font-size: clamp(1.25rem, 2.4vw, 1.85rem);
    font-weight: 950;
    line-height: 1;
}

.package-price span {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.package-feature-list {
    display: grid;
    gap: 0.48rem;
    align-content: start;
    margin: 0;
    padding: 0;
    list-style: none;
}

.package-feature-list li {
    position: relative;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.58rem 0.66rem 0.58rem 1.9rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.76);
    font-size: 0.85rem;
    font-weight: 780;
    line-height: 1.36;
}

.package-feature-list li:before {
    content: "";
    position: absolute;
    left: 0.66rem;
    top: 0.88rem;
    width: 0.46rem;
    height: 0.46rem;
    border-radius: 999px;
    background: var(--package-accent, #0f766e);
    box-shadow: 0 0 0 0.15rem var(--package-accent-soft, rgba(15, 118, 110, 0.08));
}

.packages-module-list {
    display: grid;
    gap: 0.45rem;
    align-content: start;
}

.packages-module-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.58rem 0.66rem;
    background: rgba(255, 255, 255, 0.76);
}

.packages-module-row:hover,
.packages-module-row:focus-within {
    z-index: 30;
}

.packages-module-name {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 0.4rem;
}

.packages-module-name > span {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 900;
    line-height: 1.2;
    text-overflow: ellipsis;
}

.packages-module-row strong {
    color: #0b5752;
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1.18;
    text-align: right;
}

.packages-module-info {
    flex: 0 0 auto;
    z-index: 5;
}

.package-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    margin-top: 0.1rem;
}

.package-card-actions .button-primary,
.package-card-actions .button-soft {
    flex: 1 1 9rem;
    justify-content: center;
}

@media (max-width: 1100px) {
    .packages-comparison {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .package-card-featured {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .public-sales-hero,
    .sales-module-grid,
    .packages-comparison,
    .public-sales-cta-banner,
    .public-sales-step-strip,
    .public-sales-proof-strip,
    .public-sales-value-grid,
    .trial-countdown-grid {
        grid-template-columns: 1fr;
    }

    .public-sales-topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .public-sales-topbar nav {
        justify-content: flex-start;
    }

    .sales-module-card {
        min-height: 0;
    }

    .package-card-featured {
        grid-column: auto;
    }
}

@media (max-width: 560px) {
    .packages-module-row {
        grid-template-columns: 1fr;
        gap: 0.24rem;
    }

    .packages-module-row strong {
        text-align: left;
    }
}

.public-live-chat {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 120;
    display: grid;
    justify-items: end;
    font-family: inherit;
}

.public-live-chat-button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    padding: 0 1.25rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 1rem 2.8rem rgba(60, 42, 8, 0.28);
    font: inherit;
    font-size: 0.92rem;
    font-weight: 950;
    cursor: pointer;
}

.public-live-chat-button span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
}

.public-live-chat-button span:before {
    content: "";
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 999px;
    background: #73e8a5;
    box-shadow: 0 0 0 0.25rem rgba(115, 232, 165, 0.18);
}

.public-live-chat-panel {
    position: absolute;
    right: 0;
    bottom: 4rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    width: min(24rem, calc(100vw - 2rem));
    height: min(34rem, calc(100vh - 6rem));
    overflow: hidden;
    border: 1px solid rgba(20, 24, 32, 0.1);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 1.8rem 5rem rgba(20, 24, 32, 0.2);
    opacity: 0;
    pointer-events: none;
    transform: translateY(0.7rem) scale(0.98);
    transition: opacity 180ms ease, transform 180ms ease;
}

.public-live-chat.is-open .public-live-chat-panel {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.public-live-chat-panel header {
    display: flex;
    min-height: 3.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 0.9rem 0.7rem;
    color: #fff;
    background: linear-gradient(135deg, #8a681d, #171611);
}

.public-live-chat-panel header strong {
    font-size: 0.92rem;
    font-weight: 950;
}

.public-live-chat-panel header button {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    font: inherit;
    font-size: 1.2rem;
    cursor: pointer;
}

.public-live-chat-stream {
    display: grid;
    align-content: end;
    gap: 0.55rem;
    overflow-y: auto;
    padding: 0.9rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(248, 247, 242, 0.95)),
        #fbfbf8;
}

.public-live-chat-message {
    display: flex;
    animation: publicChatBloom 420ms ease both;
}

.public-live-chat-message.is-user {
    justify-content: flex-end;
}

.public-live-chat-bubble {
    max-width: 82%;
    border: 1px solid rgba(20, 24, 32, 0.08);
    border-radius: 16px 16px 16px 5px;
    padding: 0.62rem 0.75rem;
    color: #141820;
    background: #fff;
    box-shadow: 0 0.7rem 1.8rem rgba(20, 24, 32, 0.08);
    font-size: 0.9rem;
    font-weight: 720;
    line-height: 1.38;
    white-space: pre-line;
}

.public-live-chat-message.is-user .public-live-chat-bubble {
    border-color: rgba(138, 104, 29, 0.26);
    border-radius: 16px 16px 5px 16px;
    color: #fff;
    background: #8a681d;
}

.public-live-chat-typing {
    display: inline-flex;
    min-width: 3.2rem;
    min-height: 2.25rem;
    align-items: center;
}

.public-live-chat-typing-dots {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.public-live-chat-typing-dots i {
    width: 0.36rem;
    height: 0.36rem;
    border-radius: 999px;
    background: #8a681d;
    opacity: 0.28;
    animation: publicChatTypingDot 920ms ease-in-out infinite;
}

.public-live-chat-typing-dots i:nth-child(2) {
    animation-delay: 150ms;
}

.public-live-chat-typing-dots i:nth-child(3) {
    animation-delay: 300ms;
}

.public-live-chat-bubble a {
    color: inherit;
    font-weight: 900;
    text-decoration: underline;
    text-underline-offset: 0.18rem;
}

.public-live-chat-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    padding: 0.7rem 0.9rem 0;
    background: rgba(255, 255, 255, 0.96);
}

.public-live-chat-choices:empty {
    display: none;
}

.public-live-chat-choices button {
    border: 1px solid rgba(138, 104, 29, 0.28);
    border-radius: 999px;
    padding: 0.48rem 0.7rem;
    color: #5f4714;
    background: rgba(138, 104, 29, 0.08);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 900;
    cursor: pointer;
}

.public-live-chat-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.48rem;
    padding: 0.75rem 0.9rem 0.9rem;
    background: rgba(255, 255, 255, 0.96);
}

.public-live-chat-form input {
    min-width: 0;
    min-height: 2.7rem;
    border: 1px solid rgba(20, 24, 32, 0.12);
    border-radius: 999px;
    padding: 0 0.9rem;
    color: #141820;
    background: #fff;
    font: inherit;
    font-size: 0.9rem;
    outline: 0;
}

.public-live-chat-form input:focus {
    border-color: rgba(138, 104, 29, 0.44);
    box-shadow: 0 0 0 0.2rem rgba(138, 104, 29, 0.12);
}

.public-live-chat-form button {
    min-height: 2.7rem;
    border: 0;
    border-radius: 999px;
    padding: 0 0.9rem;
    color: #fff;
    background: #171611;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 950;
    cursor: pointer;
}

@keyframes publicChatBloom {
    from {
        opacity: 0;
        transform: translateY(0.45rem) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes publicChatTypingDot {
    0%, 80%, 100% {
        opacity: 0.24;
        transform: translateY(0);
    }

    35% {
        opacity: 1;
        transform: translateY(-0.16rem);
    }
}

@keyframes billingButtonPulse {
    from {
        box-shadow: inset 0 -0.28rem 0 rgba(255, 255, 255, 0.16), 0 0 0 rgba(255, 255, 255, 0);
        transform: scale(1);
    }

    to {
        box-shadow: inset 0 -0.28rem 0 rgba(255, 255, 255, 0.16), 0 0 0 0.28rem rgba(255, 255, 255, 0.18);
        transform: scale(1.04);
    }
}

@media (min-width: 760px) {
    .billing-sales-hero {
        grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.34fr);
    }

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

@media (max-width: 759px) {
    .billing-seat-panel,
    .billing-offer-panel,
    .billing-confidence-panel,
    .billing-plan-summary,
    .billing-reassurance-strip,
    .billing-route-strip {
        align-items: stretch;
    }

    .billing-confidence-panel ul,
    .billing-success-next,
    .billing-reassurance-strip,
    .billing-route-strip {
        grid-template-columns: 1fr;
    }

    .billing-seat-counter,
    .billing-plan-total,
    .billing-plan-total .button-primary {
        width: 100%;
    }

    .billing-module-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .billing-module-price,
    .billing-manage-link {
        grid-column: 1 / -1;
        justify-self: stretch;
        text-align: left;
        justify-items: start;
    }

    .billing-payment-strip {
        justify-content: flex-start;
    }

    .public-live-chat {
        right: 0.75rem;
        bottom: 0.75rem;
        left: 0.75rem;
        justify-items: end;
    }

    .public-live-chat.is-open {
        inset: 0;
        width: 100vw;
        height: var(--live-chat-viewport-height, 100dvh);
        justify-items: stretch;
        pointer-events: none;
    }

    .public-live-chat.is-open .public-live-chat-button {
        display: none;
    }

    .public-live-chat-panel {
        right: 0;
        bottom: 0;
        width: 100%;
        height: min(38rem, calc(100vh - 5.2rem));
        border-radius: 16px;
    }

    .public-live-chat.is-open .public-live-chat-panel {
        position: fixed;
        inset: auto 0 0 0;
        width: 100vw;
        max-width: 100vw;
        height: var(--live-chat-viewport-height, 100dvh);
        max-height: var(--live-chat-viewport-height, 100dvh);
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        border-radius: 0;
        pointer-events: auto;
        transform: none;
    }

    .public-live-chat-form {
        padding: 0.75rem max(0.75rem, env(safe-area-inset-right)) max(0.75rem, env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-left));
    }

    .public-live-chat-stream {
        padding-right: max(0.9rem, env(safe-area-inset-right));
        padding-left: max(0.9rem, env(safe-area-inset-left));
    }
}

.module-status,
.module-included,
.module-price-chip {
    display: inline-flex;
    min-height: 1.82rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.62rem;
    color: var(--card-accent-deep);
    background: rgba(255, 255, 255, 0.7);
    font-size: 0.72rem;
    font-weight: 950;
}

.module-price-chip {
    color: var(--ink);
    background: rgba(138, 104, 29, 0.1);
}

.module-included {
    color: #1f5f3d;
    background: rgba(47, 125, 80, 0.1);
}

.module-toggle {
    align-self: center;
    display: inline-flex;
    grid-auto-flow: column;
    align-items: center;
    justify-items: start;
    white-space: nowrap;
    cursor: pointer;
}

.module-toggle span {
    min-width: 1.8rem;
    text-align: right;
}

.module-toggle.is-saved i {
    animation: moduleToggleSaved 980ms ease both;
}

.module-toggle.is-saving {
    opacity: 0.68;
}

.module-toggle.is-save-error i {
    border-color: rgba(164, 62, 62, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(164, 62, 62, 0.1);
}

@keyframes moduleToggleSaved {
    0% {
        box-shadow: 0 0 0 0 rgba(47, 125, 80, 0.24), inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
    }

    45% {
        box-shadow: 0 0 0 0.32rem rgba(47, 125, 80, 0.14), inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
    }

    100% {
        box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
    }
}

.onboarding-page {
    min-height: 100vh;
    width: 100%;
    overflow-x: hidden;
}

.onboarding-shell {
    position: relative;
    z-index: 1;
    display: grid;
    width: 100%;
    max-width: 100vw;
    min-height: 100vh;
    overflow-x: hidden;
    padding: 1rem;
    place-items: center;
}

.onboarding-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: min(52rem, calc(100vw - 2rem));
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: var(--radius);
    padding: 1rem;
    background: var(--panel);
    box-shadow: var(--shadow);
    backdrop-filter: blur(22px);
    animation: riseIn 520ms ease both;
}

.onboarding-card.is-step-flow {
    --onboarding-progress-width: 0%;
    min-height: min(42rem, calc(100vh - 2rem));
    align-content: start;
    border-color: rgba(138, 104, 29, 0.15);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.78)),
        radial-gradient(circle at 12% 0%, rgba(15, 118, 110, 0.08), transparent 18rem),
        radial-gradient(circle at 96% 14%, rgba(166, 90, 69, 0.08), transparent 19rem),
        var(--panel);
}

.onboarding-card.is-step-flow:before,
.onboarding-card.is-step-flow:after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.onboarding-card.is-step-flow:before {
    inset: -45% -18% auto auto;
    width: 28rem;
    height: 28rem;
    border-radius: 999px;
    background:
        conic-gradient(from 135deg, rgba(138, 104, 29, 0), rgba(138, 104, 29, 0.2), rgba(15, 118, 110, 0.12), rgba(166, 90, 69, 0.12), rgba(138, 104, 29, 0));
    filter: blur(8px);
    opacity: 0.64;
    animation: onboardingAuraDrift 18s ease-in-out infinite;
}

.onboarding-card.is-step-flow:after {
    top: 0;
    left: 0;
    z-index: 3;
    width: var(--onboarding-progress-width);
    max-width: 100%;
    height: 0.18rem;
    background: linear-gradient(90deg, var(--aqua), var(--brand), var(--coral));
    box-shadow: 0 0.45rem 1.4rem rgba(138, 104, 29, 0.24);
    transition: width 460ms cubic-bezier(0.22, 1, 0.36, 1);
}

.onboarding-card.is-step-entering .card-glow {
    animation: onboardingGlowShift 560ms ease both;
}

.onboarding-card.is-step-flow .onboarding-head h1 {
    font-size: clamp(1.95rem, 7vw, 3.2rem);
}

.onboarding-card.is-fast-start {
    max-width: min(46rem, calc(100vw - 2rem));
    min-height: 0;
    gap: 0.9rem;
}

.onboarding-card.is-fast-start:after {
    background: var(--banner-gold-gradient);
}

.onboarding-card.is-fast-start:before {
    background:
        conic-gradient(from 135deg, rgba(138, 104, 29, 0), rgba(138, 104, 29, 0.2), rgba(95, 69, 18, 0.16), rgba(196, 138, 44, 0.12), rgba(138, 104, 29, 0));
}

.onboarding-card.is-fast-start .onboarding-head h1 {
    max-width: 34rem;
    font-size: clamp(2rem, 6vw, 3.35rem);
}

.onboarding-card.is-fast-start .onboarding-step {
    gap: 0.85rem;
}

.onboarding-head,
.onboarding-step,
.onboarding-actions {
    position: relative;
    z-index: 1;
}

.onboarding-head {
    display: grid;
    gap: 0.9rem;
}

.onboarding-head h1 {
    margin: 0.45rem 0 0;
    max-width: 42rem;
    color: var(--ink);
    font-size: clamp(2.05rem, 8vw, 4.1rem);
    line-height: 0.98;
    letter-spacing: 0;
}

.onboarding-progress {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(5.8rem, 1fr));
    gap: 0.4rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 1.2rem;
    padding: 0.22rem;
    min-height: 2.76rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.52)),
        rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.68), 0 0.75rem 1.6rem rgba(31, 42, 68, 0.06);
}

.onboarding-progress:before {
    content: "";
    position: absolute;
    inset: 50% 0.9rem auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(138, 104, 29, 0.28), transparent);
    transform: translateY(-50%);
}

.onboarding-progress span {
    position: relative;
    z-index: 1;
    display: inline-flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: 0.34rem;
    border-radius: 999px;
    padding: 0.56rem 0.45rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    outline: none;
    transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease, opacity 180ms ease, filter 180ms ease;
}

.onboarding-progress span.is-progress-hidden {
    display: none;
}

.onboarding-progress span.is-progress-soft {
    opacity: 0.72;
}

.onboarding-progress span.is-progress-edge {
    opacity: 0.38;
    filter: saturate(0.78);
    transform: scale(0.98);
}

.onboarding-progress span:hover,
.onboarding-progress span:focus-visible {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 0.45rem 1.05rem rgba(31, 42, 68, 0.08);
    transform: translateY(-1px);
}

.onboarding-progress i {
    position: relative;
    display: block;
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.32);
    transition: width 180ms ease, height 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.onboarding-progress span.is-active {
    color: #fff;
    opacity: 1;
    filter: none;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.8rem 1.6rem rgba(138, 104, 29, 0.2);
    transform: translateY(-1px);
}

.onboarding-progress span.is-complete {
    color: var(--ink);
    background: rgba(138, 104, 29, 0.11);
}

.onboarding-progress span.is-active i,
.onboarding-progress span.is-complete i {
    width: 0.58rem;
    height: 0.58rem;
    background: var(--brand);
    box-shadow: 0 0 0 0.22rem rgba(138, 104, 29, 0.12);
}

.onboarding-progress span.is-complete i:after {
    content: "";
    position: absolute;
    left: 0.2rem;
    top: 0.12rem;
    width: 0.14rem;
    height: 0.28rem;
    border: solid #fff;
    border-width: 0 0.08rem 0.08rem 0;
    transform: rotate(42deg);
}

.onboarding-head p,
.onboarding-step p,
.onboarding-actions span {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.onboarding-step {
    --step-drift: 0.95rem;
    display: grid;
    gap: 0.72rem;
    border-top: 1px solid var(--line);
    padding-top: 1rem;
    transform-origin: 50% 0;
}

.onboarding-step[hidden] {
    display: none;
}

.onboarding-step.is-active {
    animation: onboardingStepForward 460ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.onboarding-card[data-step-direction="back"] .onboarding-step.is-active {
    animation-name: onboardingStepBack;
}

.onboarding-card[data-step-direction="neutral"] .onboarding-step.is-active {
    animation-name: onboardingStepSettle;
}

.onboarding-step.is-active .onboarding-step-head,
.onboarding-step.is-active .onboarding-choice,
.onboarding-step.is-active .onboarding-domain-import,
.onboarding-step.is-active .onboarding-module-card {
    animation: onboardingItemArrive 420ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.onboarding-step.is-active .onboarding-step-head {
    animation-delay: 40ms;
}

.onboarding-step.is-active .onboarding-choice:nth-child(1),
.onboarding-step.is-active .onboarding-module-card:nth-child(1) {
    animation-delay: 90ms;
}

.onboarding-step.is-active .onboarding-choice:nth-child(2),
.onboarding-step.is-active .onboarding-module-card:nth-child(2) {
    animation-delay: 135ms;
}

.onboarding-step.is-active .onboarding-choice:nth-child(3),
.onboarding-step.is-active .onboarding-module-card:nth-child(3),
.onboarding-step.is-active .onboarding-domain-import {
    animation-delay: 180ms;
}

.onboarding-step-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.onboarding-step-head > span {
    display: grid;
    width: 2.1rem;
    height: 2.1rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    font-size: 0.75rem;
    font-weight: 950;
    box-shadow: 0 0.75rem 1.3rem rgba(138, 104, 29, 0.24), inset 0 0.08rem 0 rgba(255, 255, 255, 0.28);
}

.onboarding-step h2,
.onboarding-step .form-title {
    margin: 0;
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 950;
}

.onboarding-choice-grid {
    display: grid;
    gap: 0.65rem;
}

.onboarding-included-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    margin-top: 0.1rem;
}

.onboarding-included-strip span {
    display: inline-flex;
    align-items: center;
    min-height: 1.9rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.42rem 0.66rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
}

.onboarding-step .onboarding-choice-prompt {
    max-width: 38rem;
    margin-top: 0.25rem;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.45;
    font-weight: 760;
}

.onboarding-domain-import {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.15rem;
}

.onboarding-domain-import span {
    margin-left: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.onboarding-choice {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius);
    padding: 1rem 1rem 1rem 3.05rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78)),
        rgba(138, 104, 29, 0.08);
    box-shadow: 0 0.85rem 1.7rem rgba(31, 42, 68, 0.08);
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.onboarding-choice:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.38);
    box-shadow: 0 1.1rem 2.1rem rgba(31, 42, 68, 0.1);
}

.onboarding-choice input,
.onboarding-module-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.onboarding-choice:before,
.onboarding-module-card i {
    content: "";
    position: absolute;
    width: 1.34rem;
    height: 1.34rem;
    border: 1px solid rgba(121, 131, 153, 0.28);
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.12);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
}

.onboarding-choice:before {
    top: 1.12rem;
    left: 0.9rem;
}

.onboarding-choice:has(input:checked),
.onboarding-module-card:has(input:checked) {
    border-color: rgba(138, 104, 29, 0.3);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.84)),
        rgba(138, 104, 29, 0.1);
}

.onboarding-choice:has(input:checked):before,
.onboarding-module-card:has(input:checked) i {
    border-color: rgba(138, 104, 29, 0.4);
    background: radial-gradient(circle at 50% 50%, #fff 0 28%, var(--brand) 31% 100%);
}

.onboarding-choice strong {
    color: var(--ink);
    font-size: 1.02rem;
    font-weight: 950;
}

.onboarding-choice-copy {
    display: grid;
    gap: 0.18rem;
}

.onboarding-choice-copy small {
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.36;
    font-weight: 730;
}

.onboarding-choice-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.05rem;
    border: 1px solid rgba(138, 104, 29, 0.24);
    border-radius: 999px;
    padding: 0.48rem 0.72rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.62);
}

.onboarding-choice-action .is-selected {
    display: none;
}

.onboarding-choice:has(input:checked) .onboarding-choice-action {
    color: #fff;
    border-color: rgba(138, 104, 29, 0.42);
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.68rem 1.3rem rgba(138, 104, 29, 0.2);
}

.onboarding-choice:has(input:checked) .onboarding-choice-action .is-choose {
    display: none;
}

.onboarding-choice:has(input:checked) .onboarding-choice-action .is-selected {
    display: inline;
}

.onboarding-module-card {
    min-height: 13.1rem;
    cursor: pointer;
}

.onboarding-module-card i {
    display: none;
}

.onboarding-module-card.is-included {
    --card-accent: #8a681d;
    --card-accent-deep: #5f4512;
    --card-wash: rgba(138, 104, 29, 0.08);
    min-height: 10.6rem;
}

.onboarding-module-grid.is-single-addon {
    max-width: 46rem;
}

.onboarding-quick-addons {
    display: grid;
    gap: 0.65rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.58);
    box-shadow: 0 0.75rem 1.5rem rgba(31, 42, 68, 0.06);
}

.onboarding-quick-addons-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.65rem;
    align-items: baseline;
    justify-content: space-between;
}

.onboarding-quick-addons-head strong {
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 920;
}

.onboarding-quick-addons-head span {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 740;
}

.onboarding-module-grid.is-quick-addons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12.5rem, 1fr));
    gap: 0.55rem;
}

.onboarding-module-grid.is-quick-addons .onboarding-module-card {
    min-height: 0;
    gap: 0.36rem;
    border-radius: 8px;
    padding: 0.78rem;
}

.onboarding-module-grid.is-quick-addons .onboarding-module-card p {
    font-size: 0.78rem;
    line-height: 1.34;
}

.onboarding-module-grid.is-quick-addons .onboarding-feature-chips {
    margin-top: 0.18rem;
}

.onboarding-module-grid.is-quick-addons .onboarding-check {
    margin-top: 0.12rem;
    padding: 0.42rem 0.56rem;
    font-size: 0.72rem;
}

.onboarding-branding-card {
    display: grid;
    grid-template-columns: minmax(9rem, 0.72fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78)),
        rgba(138, 104, 29, 0.08);
    box-shadow: 0 0.9rem 1.8rem rgba(31, 42, 68, 0.08);
}

.onboarding-branding-preview {
    position: relative;
    overflow: hidden;
    min-height: 10rem;
    border-radius: calc(var(--radius) - 0.28rem);
    background:
        radial-gradient(circle at 18% 18%, rgba(15, 118, 110, 0.42), transparent 28%),
        linear-gradient(135deg, #8a681d 0%, #2f2210 100%);
}

.onboarding-branding-preview span,
.onboarding-branding-preview b,
.onboarding-branding-preview i {
    position: absolute;
    display: block;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 0.75rem 1.4rem rgba(20, 24, 32, 0.18);
}

.onboarding-branding-preview span {
    top: 1rem;
    left: 1rem;
    width: 3.2rem;
    height: 3.2rem;
}

.onboarding-branding-preview b {
    right: 1rem;
    bottom: 1.1rem;
    width: 5.4rem;
    height: 1.05rem;
}

.onboarding-branding-preview i {
    left: 1rem;
    bottom: 1.15rem;
    width: 2.4rem;
    height: 1.05rem;
    background: rgba(255, 255, 255, 0.62);
}

.onboarding-branding-copy {
    display: grid;
    gap: 0.55rem;
    align-content: center;
    min-width: 0;
}

.onboarding-branding-copy strong {
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 950;
}

.onboarding-branding-copy .button-primary {
    justify-self: start;
    margin-top: 0.15rem;
}

.onboarding-feature-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.38rem;
    margin: 0.6rem 0 0;
}

.onboarding-feature-chips small {
    display: inline-flex;
    align-items: center;
    min-height: 1.58rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.32rem 0.5rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.7rem;
    font-weight: 900;
    line-height: 1;
}

.onboarding-check {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    align-self: end;
    justify-self: start;
    margin-top: 0.35rem;
    border: 1px solid rgba(121, 131, 153, 0.24);
    border-radius: 999px;
    padding: 0.5rem 0.68rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1;
    box-shadow: 0 0.55rem 1.2rem rgba(31, 42, 68, 0.07);
}

.onboarding-check b {
    position: relative;
    display: block;
    width: 1.18rem;
    height: 1.18rem;
    flex: 0 0 auto;
    border: 1px solid rgba(121, 131, 153, 0.42);
    border-radius: 0.36rem;
    background: #fff;
}

.onboarding-module-card:has(input:checked) .onboarding-check {
    color: #5f4512;
    border-color: rgba(138, 104, 29, 0.34);
    background: rgba(138, 104, 29, 0.11);
}

.onboarding-module-card:has(input:checked) .onboarding-check b {
    border-color: var(--brand);
    background: var(--brand);
}

.onboarding-module-card:has(input:checked) .onboarding-check b:after {
    content: "";
    position: absolute;
    left: 0.34rem;
    top: 0.2rem;
    width: 0.32rem;
    height: 0.58rem;
    border: solid #fff;
    border-width: 0 0.13rem 0.13rem 0;
    transform: rotate(42deg);
}

.onboarding-actions {
    display: grid;
    gap: 0.62rem;
    border-top: 1px solid var(--line);
    padding-top: 1rem;
}

.onboarding-action-row {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 0.55rem;
}

.onboarding-action-row button[hidden] {
    display: none;
}

.onboarding-action-row button:disabled,
.onboarding-action-row button.is-disabled {
    cursor: not-allowed;
    opacity: 0.52;
    filter: saturate(0.72);
    box-shadow: none;
}

.onboarding-action-row .button-primary:not([hidden]) {
    grid-column: auto;
}

.onboarding-action-row [data-onboarding-next]:not([hidden]),
.onboarding-action-row [data-onboarding-finish]:not([hidden]) {
    grid-column: 2;
}

.onboarding-action-row:has([data-onboarding-prev][hidden]) [data-onboarding-next]:not([hidden]) {
    grid-column: 1 / -1;
}

.onboarding-card.is-fast-start .onboarding-action-row {
    grid-template-columns: 1fr;
}

.onboarding-card.is-fast-start .onboarding-action-row [data-onboarding-finish]:not([hidden]) {
    grid-column: 1 / -1;
}

@media (max-width: 759px) {
    .onboarding-card.is-step-flow {
        min-height: calc(100vh - 2rem);
    }

    .onboarding-progress {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .onboarding-progress::-webkit-scrollbar {
        display: none;
    }

    .onboarding-progress span {
        flex: 0 0 auto;
        min-width: max-content;
        scroll-snap-align: center;
    }

    .onboarding-action-row {
        grid-template-columns: 1fr;
    }

    .onboarding-action-row [data-onboarding-next]:not([hidden]),
    .onboarding-action-row [data-onboarding-finish]:not([hidden]) {
        grid-column: 1;
    }

    .onboarding-choice {
        grid-template-columns: 1fr;
    }

    .onboarding-branding-card {
        grid-template-columns: 1fr;
    }

    .onboarding-branding-preview {
        min-height: 8rem;
    }

    .onboarding-card.is-fast-start {
        min-height: 0;
    }

    .onboarding-choice-action {
        justify-self: start;
    }
}

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

.momentum-panel {
    display: grid;
    align-content: start;
}

.momentum-list,
.quick-actions {
    display: grid;
    gap: 0.55rem;
}

.momentum-item,
.quick-actions a {
    display: grid;
    gap: 0.18rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: var(--radius);
    padding: 0.76rem 0.85rem;
    background: rgba(255, 255, 255, 0.72);
}

.momentum-item strong,
.quick-actions a {
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 900;
}

.momentum-item span {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 750;
}

.financial-page {
    display: grid;
    gap: 0.85rem;
    width: 100%;
    max-width: 92rem;
    margin: 0 auto;
}

.financial-toolbar {
    padding: 0.15rem 0 0.35rem;
}

.financial-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.financial-action-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.financial-action-card {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius);
    padding: 0.9rem;
    color: var(--ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.14), transparent 42%),
        rgba(255, 255, 255, 0.9);
    box-shadow: var(--soft-shadow);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.financial-action-card:hover {
    border-color: rgba(138, 104, 29, 0.34);
    box-shadow: 0 1rem 2.25rem rgba(18, 21, 33, 0.12);
    transform: translateY(-2px);
}

.financial-action-card span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.financial-action-card strong {
    color: var(--ink);
    font-size: 0.98rem;
    line-height: 1.15;
}

.financial-action-card em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 760;
    line-height: 1.35;
}

.financial-action-card.is-urgent {
    border-color: rgba(166, 90, 69, 0.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(166, 90, 69, 0.18), transparent 44%),
        rgba(255, 255, 255, 0.92);
}

.financial-action-card.is-live,
.financial-action-card.is-calm {
    border-color: rgba(63, 117, 102, 0.22);
}

.financial-metric-grid,
.financial-overview-grid {
    display: grid;
    gap: 0.75rem;
}

.financial-metric {
    display: grid;
    gap: 0.28rem;
    min-height: 7.8rem;
    border: 1px solid var(--line);
    border-left: 0.24rem solid var(--metric-accent, var(--gold));
    border-radius: var(--radius);
    padding: 0.88rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78)),
        rgba(185, 138, 44, 0.08);
    box-shadow: var(--soft-shadow);
}

.financial-metric span,
.financial-panel .eyebrow {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.financial-metric strong {
    color: var(--metric-deep, #6f5018);
    font-size: 1.55rem;
    line-height: 1;
}

.financial-metric em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 760;
}

.financial-metric.is-paid {
    --metric-accent: var(--green);
    --metric-deep: #1f5f3d;
}

.financial-metric.is-open,
.financial-metric.is-total {
    --metric-accent: var(--gold);
    --metric-deep: #6f5018;
}

.financial-metric.is-danger {
    --metric-accent: var(--coral);
    --metric-deep: #9b3029;
}

.financial-metric.is-estimates,
.financial-metric.is-pending {
    --metric-accent: #987c31;
    --metric-deep: #6f5018;
}

.financial-metric.is-calm,
.financial-metric.is-products {
    --metric-accent: var(--aqua);
    --metric-deep: #0b5752;
}

.financial-metric.is-recurring {
    --metric-accent: var(--brand);
    --metric-deep: var(--brand-deep);
}

.financial-panel {
    display: grid;
    align-content: start;
    min-width: 0;
}

.financial-status-list,
.financial-list {
    display: grid;
    gap: 0.5rem;
}

.financial-status-row,
.financial-list-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    border: 1px solid rgba(185, 138, 44, 0.13);
    border-radius: var(--radius);
    padding: 0.68rem 0.75rem;
    background: rgba(255, 255, 255, 0.72);
}

.financial-status-row strong,
.financial-list-row b {
    color: #6f5018;
    font-size: 0.92rem;
    font-weight: 950;
}

.financial-status-row em,
.financial-list-row em,
.financial-list-row small {
    display: block;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.financial-list-row strong {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.financial-list-row > span:last-child {
    display: grid;
    gap: 0.12rem;
    justify-items: end;
}

:root[data-theme="dark"] .financial-action-card,
:root[data-theme="dark"] .financial-action-card.is-urgent,
:root[data-theme="dark"] .financial-action-card.is-live,
:root[data-theme="dark"] .financial-action-card.is-calm {
    border-color: rgba(240, 216, 146, 0.15);
    background:
        radial-gradient(circle at 100% 0%, rgba(214, 173, 77, 0.14), transparent 46%),
        rgba(18, 27, 40, 0.82);
}

:root[data-theme="dark"] .export-range-card,
:root[data-theme="dark"] .export-steps-card,
:root[data-theme="dark"] .export-preview-card,
:root[data-theme="dark"] .export-metric,
:root[data-theme="dark"] .export-card,
:root[data-theme="dark"] .export-invoice-row {
    border-color: rgba(240, 216, 146, 0.13);
    background: rgba(18, 27, 40, 0.82);
}

.invoice-export-page {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 84rem;
    margin: 0 auto;
}

.export-range-card,
.export-steps-card,
.export-preview-card {
    display: grid;
    gap: 0.8rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.95rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.76)),
        rgba(138, 104, 29, 0.08);
    box-shadow: var(--soft-shadow);
}

.export-steps-card {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0.78rem;
}

.export-steps-card span {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

.export-steps-card strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 999px;
    color: #fff;
    background: var(--gold-deep);
    font-size: 0.82rem;
}

.export-steps-card em {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.84rem;
    font-style: normal;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.export-range-card {
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
    align-items: end;
}

.export-range-card label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.export-summary-grid,
.export-card-grid {
    display: grid;
    gap: 0.8rem;
}

.export-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.export-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.export-metric,
.export-card {
    position: relative;
    display: grid;
    gap: 0.72rem;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.95rem;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.66));
    box-shadow: var(--soft-shadow);
}

.export-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.18rem;
    background: var(--gold-deep);
}

.export-card h2 {
    margin: 0;
    font-size: 1.02rem;
}

.export-metric span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.export-metric strong {
    color: #6f5018;
    font-size: 1.55rem;
    line-height: 1;
}

.export-metric em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 760;
}

.export-invoice-list {
    display: grid;
    gap: 0.5rem;
}

.export-invoice-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.75rem;
    align-items: center;
    border: 1px solid rgba(185, 138, 44, 0.13);
    border-radius: var(--radius);
    padding: 0.68rem 0.75rem;
    background: rgba(255, 255, 255, 0.76);
}

.export-invoice-row strong,
.export-invoice-row span,
.export-invoice-row em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.export-invoice-row strong {
    color: var(--ink);
    font-weight: 950;
}

.export-invoice-row span,
.export-invoice-row em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 760;
}

@media (max-width: 860px) {
    .export-range-card,
    .export-steps-card,
    .export-summary-grid,
    .export-card-grid,
    .export-invoice-row {
        grid-template-columns: 1fr;
    }

    .export-invoice-row {
        align-items: start;
    }
}

.compact-empty {
    min-height: 5.5rem;
    margin: 0;
}

.panel-head,
.thread-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.85rem;
}

.panel h2,
.panel h1,
.thread-head h2 {
    margin: 0.28rem 0 0;
    font-size: 1.05rem;
}

.icon-pill {
    min-width: 2.4rem;
    height: 2.4rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--muted);
    background: rgba(255, 255, 255, 0.72);
}

.conversation-list {
    display: grid;
    align-content: start;
    grid-auto-rows: max-content;
    gap: 0.32rem;
    min-width: 0;
}

.conversation-list.has-raised-strip {
    position: relative;
    display: flex;
    flex-direction: column;
    align-content: normal;
    padding-top: 2.45rem;
    overflow: visible;
}

.conversation-list [data-update="conversation-controls"] {
    flex: 0 0 auto;
}

.conversation-list.has-raised-strip [data-update="conversation-list"] {
    flex: 1 1 auto;
    min-height: 0;
}

.conversation-filter-strip {
    gap: 0.32rem;
}

.conversation-channel-actions {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.conversation-channel-actions::-webkit-scrollbar {
    display: none;
}

.conversation-deleted-action {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.18rem;
}

.channel-filter-button {
    position: relative;
    display: inline-grid;
    width: 2.05rem;
    height: 2.05rem;
    flex: 0 0 2.05rem;
    place-items: center;
    border: 0;
    border-radius: 999px;
    padding: 0;
    color: var(--brand-deep);
    background: transparent;
    cursor: pointer;
    transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.channel-filter-button:hover,
.channel-filter-button.is-active {
    background: rgba(138, 104, 29, 0.1);
    box-shadow: inset 0 0 0 1px rgba(138, 104, 29, 0.15);
    transform: translateY(-1px);
}

:root[data-theme="dark"] .channel-filter-button:hover,
:root[data-theme="dark"] .channel-filter-button.is-active {
    background: rgba(216, 179, 90, 0.14);
    box-shadow: inset 0 0 0 1px rgba(216, 179, 90, 0.18);
}

.channel-filter-icon {
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
}

.channel-filter-icon.platform-avatar {
    width: 1.35rem;
    height: 1.35rem;
    box-shadow: inset 0 0.06rem 0 rgba(255, 255, 255, 0.24), 0 0.32rem 0.68rem rgba(20, 17, 11, 0.12);
}

.channel-filter-icon.is-all {
    position: relative;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2d261b, var(--brand-deep));
    box-shadow: inset 0 0.06rem 0 rgba(255, 255, 255, 0.18);
}

.channel-filter-icon.is-all span {
    display: block;
    width: 0.28rem;
    height: 0.28rem;
    border-radius: 999px;
    background: #fff;
}

.channel-filter-icon.is-all span {
    position: relative;
    box-shadow: 0.42rem 0 0 #fff, 0 0.42rem 0 #fff, 0.42rem 0.42rem 0 #fff;
    transform: translate(-0.21rem, -0.21rem);
}

.conversation-filter-strip .inbox-deleted-toggle {
    width: 2.05rem;
    height: 2.05rem;
    flex: 0 0 2.05rem;
    margin: 0 0 0 0.08rem;
    justify-content: center;
    gap: 0;
    padding: 0;
    border-radius: 999px;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.08);
    box-shadow: inset 0 0 0 1px rgba(138, 104, 29, 0.12);
    white-space: nowrap;
}

.conversation-filter-strip .inbox-deleted-toggle:hover,
.conversation-filter-strip .inbox-deleted-toggle.is-on {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.2);
    transform: translateY(-1px);
}

.conversation-filter-strip .deleted-filter-icon {
    width: 0.9rem;
    height: 0.98rem;
}

.conversation-filter-strip .inbox-deleted-toggle.is-on .deleted-filter-icon:after,
.conversation-filter-strip .inbox-deleted-toggle:hover .deleted-filter-icon:after,
.conversation-filter-strip .inbox-deleted-toggle.is-on .deleted-filter-icon:before,
.conversation-filter-strip .inbox-deleted-toggle:hover .deleted-filter-icon:before {
    background: currentColor;
}

.inbox-search-button,
.inbox-new-email-button {
    position: relative;
    display: grid;
    width: 2.05rem;
    height: 2.05rem;
    flex: 0 0 auto;
    place-items: center;
    border: 0;
    border-radius: 999px;
    padding: 0;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
    cursor: pointer;
    transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.inbox-search-button {
    background: rgba(15, 118, 110, 0.1);
    color: #0f766e;
}

.inbox-search-button:hover,
.inbox-new-email-button:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.2);
    transform: translateY(-1px);
}

.inbox-search-icon {
    position: relative;
    display: block;
    width: 0.95rem;
    height: 0.95rem;
    border: 0.14rem solid currentColor;
    border-radius: 999px;
}

.inbox-search-icon:after {
    content: "";
    position: absolute;
    right: -0.42rem;
    bottom: -0.34rem;
    width: 0.54rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
    transform-origin: center;
}

.new-email-icon {
    position: relative;
    display: block;
    width: 1.1rem;
    height: 0.82rem;
    border: 0.12rem solid currentColor;
    border-radius: 0.18rem;
}

.new-email-icon:before {
    content: "";
    position: absolute;
    top: 0.08rem;
    left: 0.1rem;
    width: 0.66rem;
    height: 0.42rem;
    border-right: 0.1rem solid currentColor;
    border-bottom: 0.1rem solid currentColor;
    transform: rotate(45deg);
    transform-origin: center;
}

.new-email-icon:after {
    content: "+";
    position: absolute;
    right: -0.48rem;
    top: -0.58rem;
    display: grid;
    width: 0.82rem;
    height: 0.82rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--brand-deep);
    font-size: 0.82rem;
    font-weight: 950;
    line-height: 1;
}

.inbox-new-email-button:hover .new-email-icon:after {
    color: var(--brand-deep);
    background: #fff;
}

.deleted-filter-icon {
    position: relative;
    display: block;
    width: 0.96rem;
    height: 1.05rem;
    border: 0.13rem solid currentColor;
    border-top: 0;
    border-radius: 0 0 0.18rem 0.18rem;
}

.deleted-filter-icon:before,
.deleted-filter-icon:after {
    content: "";
    position: absolute;
    display: block;
    background: currentColor;
}

.deleted-filter-icon:before {
    top: -0.34rem;
    left: 50%;
    width: 1.12rem;
    height: 0.13rem;
    border-radius: 999px;
    transform: translateX(-50%);
}

.deleted-filter-icon:after {
    top: -0.52rem;
    left: 50%;
    width: 0.46rem;
    height: 0.13rem;
    border-radius: 999px;
    transform: translateX(-50%);
}

.inbox-deleted-toggle {
    display: inline-flex;
    justify-self: end;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.38rem;
    border: 0;
    padding: 0;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 850;
}

.inbox-deleted-toggle i {
    position: relative;
    display: inline-block;
    width: 2rem;
    height: 1.12rem;
    border: 1px solid rgba(121, 131, 153, 0.26);
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.15);
    transition: background 180ms ease, border-color 180ms ease;
}

.inbox-deleted-toggle i:before {
    content: "";
    position: absolute;
    top: 0.13rem;
    left: 0.13rem;
    width: 0.74rem;
    height: 0.74rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 3px 8px rgba(31, 42, 68, 0.18);
    transition: transform 180ms ease;
}

.inbox-deleted-toggle.is-on {
    color: var(--brand-deep);
}

.inbox-deleted-toggle.is-on i {
    border-color: rgba(138, 104, 29, 0.28);
    background: var(--banner-gold-gradient);
}

.inbox-deleted-toggle.is-on i:before {
    transform: translateX(0.86rem);
}

.conversation-list [data-update="conversation-list"] {
    display: grid;
    align-content: start;
    align-items: start;
    gap: 0.28rem;
    grid-auto-rows: max-content;
}

.conversation-item {
    position: relative;
    display: grid;
    grid-template-columns: 2.45rem minmax(0, 1fr);
    width: 100%;
    min-height: 5.45rem;
    max-height: 5.45rem;
    align-items: center;
    gap: 0.48rem;
    overflow: hidden;
    border: 1px solid rgba(18, 23, 34, 0.08);
    border-radius: 10px;
    padding: 0.24rem 0 0.24rem 0.46rem;
    color: inherit;
    text-align: left;
    background: rgba(255, 255, 255, 0.92);
    transform-origin: 50% 50%;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, filter 180ms ease;
    align-self: start;
}

.conversation-item.is-resolved {
    border-color: rgba(18, 23, 34, 0.07);
    color: rgba(22, 27, 46, 0.72);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: none;
}

.conversation-item.is-open.is-owned:not(.is-unread):not(.is-resolved) {
    border-color: rgba(18, 23, 34, 0.07);
    color: rgba(22, 27, 46, 0.76);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: none;
}

.conversation-item.is-unowned:not(.is-unread):not(.is-resolved) {
    border-color: rgba(166, 90, 69, 0.98);
    color: #fff;
    background: linear-gradient(135deg, #a65a45, #72372c);
    box-shadow: 0 12px 28px rgba(166, 90, 69, 0.18);
}

.conversation-item.is-deleted {
    border-color: rgba(75, 85, 99, 0.95);
    color: #fff;
    background: linear-gradient(135deg, #4b5563, #252b36);
    box-shadow: none;
}

.conversation-item.is-unread {
    border-color: rgba(138, 104, 29, 0.98);
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
    box-shadow: 0 16px 34px rgba(138, 104, 29, 0.24);
}

.conversation-item:hover,
.conversation-item.is-selected {
    transform: translateY(-1px);
    filter: saturate(1.08);
}

.conversation-item.is-selected {
    z-index: 2;
    border-color: rgba(18, 23, 34, 0.96);
    color: #fff;
    background: linear-gradient(135deg, #121722 0%, #2d261b 54%, var(--brand-deep) 100%);
    box-shadow:
        inset 0.32rem 0 0 #fff,
        inset 0.58rem 0 0 var(--brand),
        0 0 0 0.14rem rgba(255, 255, 255, 0.98),
        0 0 0 0.34rem rgba(18, 23, 34, 0.9),
        0 1.05rem 2.2rem rgba(18, 23, 34, 0.28);
}

.conversation-item.is-selected .avatar {
    box-shadow: 0 0 0 0.16rem rgba(255, 255, 255, 0.96);
}

.conversation-item.is-resolved.is-selected {
    color: #fff;
    background: linear-gradient(135deg, #121722 0%, #2d261b 54%, var(--brand-deep) 100%);
    box-shadow:
        inset 0.32rem 0 0 #fff,
        inset 0.58rem 0 0 var(--brand),
        0 0 0 0.14rem rgba(255, 255, 255, 0.98),
        0 0 0 0.34rem rgba(18, 23, 34, 0.82),
        0 0.85rem 1.8rem rgba(18, 23, 34, 0.18);
}

.avatar {
    display: grid;
    width: 2.28rem;
    height: 2.28rem;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 850;
}

.platform-avatar {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.25), 0 0.5rem 1rem rgba(20, 17, 11, 0.12);
}

.conversation-channel-stack {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 0.12rem;
    min-width: 0;
}

.conversation-item .platform-avatar {
    width: 2.12rem;
    height: 2.12rem;
    border-radius: 7px;
}

.platform-avatar > span,
.platform-avatar > span:before,
.platform-avatar > span:after {
    position: absolute;
    display: block;
    content: "";
}

.platform-avatar > span {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.platform-avatar.is-email {
    background: linear-gradient(135deg, #2563eb, #0f4fc8);
}

.platform-avatar.is-email > span {
    width: 1.16rem;
    height: 0.82rem;
    border: 0.13rem solid #fff;
    border-radius: 0.18rem;
}

.platform-avatar.is-email > span:before,
.platform-avatar.is-email > span:after {
    top: 0.06rem;
    width: 0.72rem;
    height: 0.72rem;
    border-top: 0.13rem solid #fff;
    transform-origin: top center;
}

.platform-avatar.is-email > span:before {
    left: -0.06rem;
    transform: rotate(34deg);
}

.platform-avatar.is-email > span:after {
    right: -0.06rem;
    transform: rotate(-34deg);
}

.platform-avatar.is-facebook {
    background: #1877f2;
}

.platform-avatar.is-facebook > span:before {
    content: "f";
    position: static;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.72rem;
    font-weight: 900;
    line-height: 1;
    transform: translateY(0.15rem);
}

.platform-avatar.is-instagram {
    background:
        radial-gradient(circle at 30% 108%, #fdf497 0 18%, #fd5949 42%, transparent 43%),
        radial-gradient(circle at 78% 0%, #285aeb 0 18%, transparent 22%),
        linear-gradient(135deg, #833ab4, #fd1d1d 52%, #fcb045);
}

.platform-avatar.is-instagram > span {
    width: 1.18rem;
    height: 1.18rem;
    border: 0.13rem solid #fff;
    border-radius: 0.34rem;
}

.platform-avatar.is-instagram > span:before {
    inset: 0.25rem;
    border: 0.13rem solid #fff;
    border-radius: 999px;
}

.platform-avatar.is-instagram > span:after {
    top: 0.18rem;
    right: 0.18rem;
    width: 0.16rem;
    height: 0.16rem;
    border-radius: 999px;
    background: #fff;
}

.platform-avatar.is-whatsapp {
    background: linear-gradient(135deg, #25d366, #128c7e);
}

.platform-avatar.is-whatsapp > span {
    width: 1.22rem;
    height: 1.22rem;
    border: 0.13rem solid #fff;
    border-radius: 999px;
}

.platform-avatar.is-whatsapp > span:before {
    left: 0.16rem;
    bottom: -0.16rem;
    width: 0.4rem;
    height: 0.4rem;
    border-left: 0.13rem solid #fff;
    border-bottom: 0.13rem solid #fff;
    transform: rotate(-18deg);
}

.platform-avatar.is-whatsapp > span:after {
    left: 0.38rem;
    top: 0.28rem;
    width: 0.38rem;
    height: 0.58rem;
    border: solid #fff;
    border-width: 0 0.13rem 0.13rem 0;
    border-radius: 0 0 0.2rem 0;
    transform: rotate(32deg);
}

.platform-avatar.is-chatflow {
    background: var(--banner-gold-gradient);
}

.platform-avatar.is-chatflow > span {
    width: 1.26rem;
    height: 0.94rem;
}

.platform-avatar.is-chatflow > span:before,
.platform-avatar.is-chatflow > span:after {
    border-radius: 999px;
    background: #fff;
    box-shadow: 0.48rem 0 0 rgba(255, 255, 255, 0.72), 0.96rem 0 0 rgba(255, 255, 255, 0.45);
}

.platform-avatar.is-chatflow > span:before {
    top: 0.16rem;
    left: 0;
    width: 0.28rem;
    height: 0.28rem;
}

.platform-avatar.is-chatflow > span:after {
    bottom: 0.16rem;
    right: 0.02rem;
    width: 0.28rem;
    height: 0.28rem;
    box-shadow: -0.48rem 0 0 rgba(255, 255, 255, 0.72), -0.96rem 0 0 rgba(255, 255, 255, 0.45);
}

.platform-avatar.is-website {
    background: linear-gradient(135deg, #0f766e, #12333a);
}

.platform-avatar.is-website > span {
    width: 1.14rem;
    height: 0.78rem;
    border: 0.13rem solid #fff;
    border-radius: 0.14rem;
}

.platform-avatar.is-website > span:before {
    left: 0.28rem;
    right: 0.28rem;
    bottom: -0.32rem;
    height: 0.13rem;
    background: #fff;
    box-shadow: 0 0.18rem 0 -0.02rem #fff;
}

.platform-avatar.is-internal {
    background: linear-gradient(135deg, #3f4658, #151923);
}

.platform-avatar.is-internal > span {
    width: 1.15rem;
    height: 0.78rem;
    border: 0.13rem solid #fff;
    border-radius: 0.34rem;
}

.platform-avatar.is-internal > span:before {
    left: 0.18rem;
    bottom: -0.32rem;
    width: 0.38rem;
    height: 0.38rem;
    border-left: 0.13rem solid #fff;
    border-bottom: 0.13rem solid #fff;
    transform: rotate(-12deg);
}

.channel-filter-icon.platform-avatar > span {
    transform: translate(-50%, -50%) scale(0.72);
    transform-origin: center;
}

.channel-filter-icon.platform-avatar.is-facebook > span {
    transform: translate(-50%, -50%) scale(0.78);
}

.channel-filter-icon.platform-avatar.is-facebook > span:before {
    font-size: 1.42rem;
}

.platform-avatar.is-linkedin {
    background: #0a66c2;
}

.platform-avatar.is-x {
    background: #000;
}

.platform-avatar.is-tiktok {
    background: linear-gradient(135deg, #010101, #191919);
}

.platform-avatar.is-youtube {
    background: #ff0000;
}

.platform-avatar.is-pinterest {
    background: #e60023;
}

.platform-avatar.is-threads {
    background: #101010;
}

.platform-avatar.is-linkedin > span,
.platform-avatar.is-x > span,
.platform-avatar.is-tiktok > span,
.platform-avatar.is-youtube > span,
.platform-avatar.is-pinterest > span,
.platform-avatar.is-threads > span {
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.12rem;
    font-weight: 950;
    line-height: 1;
    text-align: center;
}

.platform-avatar.is-linkedin > span {
    font-size: 0.95rem;
}

.platform-avatar.is-tiktok > span {
    font-size: 1.32rem;
    text-shadow: -0.08rem 0 #25f4ee, 0.08rem 0 #fe2c55;
}

.platform-avatar.is-youtube > span {
    font-size: 1rem;
}

.platform-avatar.is-threads > span {
    font-size: 1.05rem;
}

.gradient-a {
    background: var(--banner-gold-gradient);
}

.gradient-b {
    background: var(--banner-gold-gradient);
}

.gradient-c {
    background: var(--banner-gold-gradient);
}

.gradient-d {
    background: linear-gradient(135deg, var(--green), var(--aqua));
}

.conversation-copy {
    display: grid;
    gap: 0.1rem;
    align-content: center;
    min-width: 0;
    line-height: 1.05;
}

.conversation-primary,
.conversation-detail,
.conversation-icon-time {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.conversation-icon-time {
    max-width: 2.45rem;
    color: #111827;
    font-size: 0.56rem;
    font-weight: 850;
    line-height: 1;
    text-align: center;
}

.conversation-item.is-unread .conversation-icon-time,
.conversation-item.is-unowned .conversation-icon-time,
.conversation-item.is-deleted .conversation-icon-time,
.conversation-item.is-selected .conversation-icon-time {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.32);
}

.conversation-primary {
    font-size: 0.9rem;
    font-weight: 900;
    letter-spacing: 0;
}

.conversation-detail {
    opacity: 0.78;
    font-size: 0.61rem;
    font-weight: 620;
}

.conversation-message-preview {
    display: -webkit-box;
    min-width: 0;
    overflow: hidden;
    color: rgba(22, 27, 46, 0.78);
    opacity: 0.84;
    font-size: 0.68rem;
    font-weight: 620;
    line-height: 1.25;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.conversation-message-preview.is-ai-summary {
    opacity: 0.94;
}

.conversation-item.is-unread .conversation-message-preview,
.conversation-item.is-unowned:not(.is-resolved) .conversation-message-preview,
.conversation-item.is-deleted .conversation-message-preview,
.conversation-item.is-selected .conversation-message-preview {
    color: rgba(255, 255, 255, 0.92);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.24);
}

.conversation-item.is-resolved:not(.is-selected):not(.is-deleted) .conversation-message-preview,
.conversation-item.is-open.is-owned:not(.is-unread):not(.is-resolved) .conversation-message-preview {
    color: rgba(22, 27, 46, 0.78);
    text-shadow: none;
}

.unread-count {
    display: none;
    min-width: 1.7rem;
    height: 1.32rem;
    place-items: center;
    border-radius: 999px;
    padding: 0 0.44rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
    box-shadow: 0 9px 18px rgba(138, 104, 29, 0.24);
    font-size: 0.62rem;
    font-style: normal;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.thread-panel {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 37rem;
    grid-template-rows: auto 1fr auto;
    padding-top: 0.85rem;
    overflow: visible;
}

.thread-panel.is-loading-thread {
    pointer-events: none;
}

.thread-panel.is-loading-thread [data-update="thread-header"],
.thread-panel.is-loading-thread [data-update="message-stream"],
.thread-panel.is-loading-thread .composer {
    opacity: 0.5;
    filter: blur(2px);
    transform: scale(0.996);
    transition: opacity 160ms ease, filter 160ms ease, transform 160ms ease;
}

.thread-panel.is-loading-thread:after {
    content: "Opening...";
    position: absolute;
    inset: 0;
    z-index: 36;
    display: grid;
    place-items: center;
    border-radius: inherit;
    color: #fff;
    background: rgba(18, 23, 34, 0.18);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0;
    text-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.46);
    pointer-events: none;
}

.dashboard-updating .thread-panel,
.dashboard-updating .conversation-list,
.dashboard-updating .stats-grid,
.dashboard-updating .contact-panel {
    opacity: 0.72;
    transition: opacity 160ms ease;
}

.contact-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
}

.contact-title span {
    display: block;
    color: var(--muted);
    font-size: 0.82rem;
}

.thread-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.45rem;
    width: 100%;
}

.thread-action-bar {
    gap: 0.45rem 0.55rem;
}

.thread-action-bar.control-strip.is-raised {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    z-index: 4;
    width: 100%;
    flex-wrap: nowrap;
    align-items: center;
    margin: -1.35rem 0 0.8rem;
    border-radius: 1.45rem;
}

.thread-action-contact {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.58rem;
    padding-left: 0.18rem;
}

.thread-action-contact .avatar {
    width: 2.02rem;
    height: 2.02rem;
    flex: 0 0 2.02rem;
    border-radius: 999px;
    font-size: 0.72rem;
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.24), 0 0.45rem 0.95rem rgba(138, 104, 29, 0.14);
}

.thread-action-contact-copy {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

.thread-action-contact-copy strong,
.thread-action-contact-copy small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-action-contact-copy strong {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 950;
    line-height: 1.05;
}

.thread-action-contact-copy small {
    max-width: min(28vw, 26rem);
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 780;
    line-height: 1.15;
}

:root[data-theme="dark"] .thread-action-contact-copy strong {
    color: #f6efe0;
}

.thread-action-bar .control-strip-actions {
    flex: 0 1 auto;
    min-width: 0;
}

.mobile-thread-banner,
.mobile-week-banner,
.mobile-thread-menu {
    display: none;
}

.mobile-thread-back,
.mobile-thread-menu-toggle {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: var(--radius);
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
}

.back-icon {
    display: block;
    width: 0.9rem;
    height: 0.9rem;
    border-bottom: 0.15rem solid currentColor;
    border-left: 0.15rem solid currentColor;
    transform: translateX(0.12rem) rotate(45deg);
}

.ellipsis-icon,
.ellipsis-icon:before,
.ellipsis-icon:after {
    display: block;
    width: 0.28rem;
    height: 0.28rem;
    border-radius: 999px;
    background: currentColor;
}

.ellipsis-icon {
    position: relative;
}

.ellipsis-icon:before,
.ellipsis-icon:after {
    content: "";
    position: absolute;
    top: 0;
}

.ellipsis-icon:before {
    left: -0.55rem;
}

.ellipsis-icon:after {
    right: -0.55rem;
}

.workflow-button {
    display: inline-flex;
    width: 100%;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: var(--radius);
    padding: 0 0.85rem;
    color: #fff;
    font-weight: 850;
    box-shadow: 0 12px 24px rgba(31, 42, 68, 0.12);
    transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}

.workflow-button:hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
}

.workflow-primary {
    background: var(--banner-gold-gradient);
}

.workflow-transfer {
    background: var(--banner-gold-gradient);
}

.workflow-release {
    background: linear-gradient(135deg, var(--coral), #cc554c);
}

.workflow-resolve {
    background: linear-gradient(135deg, var(--green), var(--aqua));
}

.workflow-unread {
    background: var(--banner-gold-gradient);
}

.workflow-contact {
    background: linear-gradient(135deg, #8a681d, #4d390f);
}

.workflow-delete {
    background: linear-gradient(135deg, #2d261b, #a64438);
}

.transfer-control {
    display: block;
    min-width: 0;
    width: 100%;
}

.transfer-select {
    min-width: 0;
    height: 2.75rem;
    width: 100%;
    flex: 1 1 auto;
    border: 0;
    border-radius: var(--radius);
    padding: 0 2.15rem 0 0.85rem;
    color: #fff;
    background:
        linear-gradient(45deg, transparent 50%, currentColor 50%) calc(100% - 1.05rem) 50% / 0.38rem 0.38rem no-repeat,
        var(--banner-gold-gradient);
    box-shadow: 0 12px 24px rgba(31, 42, 68, 0.12);
    font-weight: 850;
    outline: none;
    appearance: none;
}

.transfer-select option {
    color: var(--ink);
    background: #fff;
}

.transfer-select:focus {
    border-color: rgba(138, 104, 29, 0.55);
    box-shadow: 0 0 0 0.2rem rgba(138, 104, 29, 0.1);
}

.thread-action-bar .thread-actions {
    display: flex;
    width: auto;
    margin-left: auto;
    flex: 0 1 auto;
    flex-wrap: nowrap;
    gap: 0.12rem;
    align-items: center;
    justify-content: flex-end;
    overflow-x: auto;
    scrollbar-width: none;
}

.thread-action-bar .thread-actions::-webkit-scrollbar {
    display: none;
}

.thread-action-bar .thread-actions > *,
.mobile-thread-menu .thread-actions > * {
    position: relative;
}

.thread-action-bar .thread-actions > * + *:before {
    content: none;
}

:root[data-theme="dark"] .thread-action-bar .thread-actions > * + *:before {
    background: rgba(216, 179, 90, 0.16);
}

.thread-action-bar .workflow-button,
.thread-action-bar .workflow-transfer-control {
    display: inline-flex;
    width: auto;
    min-width: 2.22rem;
    height: 2.22rem;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: 0;
    border-radius: 999px;
    padding: 0 0.72rem;
    color: var(--brand-deep);
    background: transparent;
    box-shadow: none;
    font-size: 0.73rem;
    font-weight: 900;
    line-height: 1;
    transition: transform 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

:root[data-theme="dark"] .thread-action-bar .workflow-button,
:root[data-theme="dark"] .thread-action-bar .workflow-transfer-control {
    color: #f4e9cf;
}

.thread-action-bar .workflow-button:hover,
.thread-action-bar .workflow-transfer-control:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.65rem 1.25rem rgba(138, 104, 29, 0.22);
    filter: none;
    transform: translateY(-1px);
}

.thread-action-bar .workflow-icon-only {
    width: 2.22rem;
    padding: 0;
}

.thread-action-bar .workflow-delete {
    color: #8f3027;
}

:root[data-theme="dark"] .thread-action-bar .workflow-delete {
    color: #ffb0a8;
}

.thread-action-bar .workflow-delete:hover,
.mobile-thread-menu .workflow-delete:hover {
    color: #fff;
    background: linear-gradient(135deg, #3a201c, #8f3027);
}

.workflow-transfer-control {
    min-width: 7rem;
}

.workflow-transfer-control:after {
    content: "";
    position: absolute;
    right: 0.82rem;
    top: 50%;
    width: 0.42rem;
    height: 0.42rem;
    border-right: 0.12rem solid currentColor;
    border-bottom: 0.12rem solid currentColor;
    pointer-events: none;
    transform: translateY(-66%) rotate(45deg);
}

.thread-action-bar .transfer-select,
.mobile-thread-menu .transfer-select {
    height: 2.22rem;
    min-height: 0;
    border: 0;
    padding: 0 1.7rem 0 0;
    color: inherit;
    background: transparent;
    box-shadow: none;
    font-size: 0.73rem;
    font-weight: 900;
}

.thread-action-bar .transfer-select:focus,
.mobile-thread-menu .transfer-select:focus {
    box-shadow: none;
}

.mobile-thread-menu .thread-actions {
    display: grid;
    gap: 0.35rem;
}

.mobile-thread-menu .workflow-button,
.mobile-thread-menu .workflow-transfer-control {
    display: inline-flex;
    width: 100%;
    height: 2.7rem;
    align-items: center;
    justify-content: flex-start;
    gap: 0.55rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 1rem;
    padding: 0 0.85rem;
    color: var(--brand-deep);
    background: rgba(248, 245, 235, 0.64);
    box-shadow: none;
    font-size: 0.78rem;
    font-weight: 900;
}

:root[data-theme="dark"] .mobile-thread-menu .workflow-button,
:root[data-theme="dark"] .mobile-thread-menu .workflow-transfer-control {
    border-color: rgba(216, 179, 90, 0.16);
    color: #f4e9cf;
    background: rgba(24, 35, 53, 0.88);
}

.mobile-thread-menu .workflow-button:hover,
.mobile-thread-menu .workflow-transfer-control:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
    filter: none;
}

.mobile-thread-menu .workflow-icon-only {
    justify-content: center;
}

.workflow-icon {
    position: relative;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    color: currentColor;
}

.workflow-icon-claim:before,
.workflow-icon-restore:before,
.workflow-icon-reopen:before {
    content: "";
    position: absolute;
    inset: 0.16rem;
    border: 0.13rem solid currentColor;
    border-radius: 999px;
}

.workflow-icon-claim:after,
.workflow-icon-resolve:before {
    content: "";
    position: absolute;
    left: 0.25rem;
    top: 0.18rem;
    width: 0.4rem;
    height: 0.68rem;
    border-right: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    transform: rotate(42deg);
}

.workflow-icon-send:before {
    content: "";
    position: absolute;
    left: 0.1rem;
    top: 0.42rem;
    width: 0.78rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
}

.workflow-icon-send:after {
    content: "";
    position: absolute;
    right: 0.08rem;
    top: 0.3rem;
    width: 0.38rem;
    height: 0.38rem;
    border-top: 0.14rem solid currentColor;
    border-right: 0.14rem solid currentColor;
    transform: rotate(45deg);
}

.workflow-icon-contact:before {
    content: "";
    position: absolute;
    left: 0.32rem;
    top: 0.1rem;
    width: 0.36rem;
    height: 0.36rem;
    border: 0.13rem solid currentColor;
    border-radius: 999px;
}

.workflow-icon-contact:after {
    content: "";
    position: absolute;
    left: 0.16rem;
    right: 0.16rem;
    bottom: 0.08rem;
    height: 0.38rem;
    border: 0.13rem solid currentColor;
    border-radius: 999px 999px 0.22rem 0.22rem;
    border-bottom-width: 0.1rem;
}

.workflow-icon-unread:before {
    content: "";
    position: absolute;
    inset: 0.22rem 0.08rem 0.18rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.18rem;
}

.workflow-icon-unread:after {
    content: "";
    position: absolute;
    top: 0.36rem;
    left: 0.24rem;
    width: 0.5rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(-28deg);
    box-shadow: 0.2rem 0.11rem 0 currentColor;
}

.workflow-icon-release:before {
    content: "";
    position: absolute;
    left: 0.18rem;
    right: 0.18rem;
    top: 0.24rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(-35deg);
}

.workflow-icon-release:after {
    content: "";
    position: absolute;
    right: 0.12rem;
    top: 0.17rem;
    width: 0.38rem;
    height: 0.38rem;
    border-top: 0.14rem solid currentColor;
    border-right: 0.14rem solid currentColor;
    transform: rotate(10deg);
}

.workflow-icon-restore:after,
.workflow-icon-reopen:after {
    content: "";
    position: absolute;
    left: 0.08rem;
    top: 0.28rem;
    width: 0.38rem;
    height: 0.38rem;
    border-left: 0.14rem solid currentColor;
    border-top: 0.14rem solid currentColor;
    transform: rotate(-35deg);
}

.workflow-icon-delete:before {
    content: "";
    position: absolute;
    left: 0.24rem;
    right: 0.24rem;
    top: 0.34rem;
    bottom: 0.08rem;
    border: 0.13rem solid currentColor;
    border-top: 0;
    border-radius: 0 0 0.16rem 0.16rem;
}

.workflow-icon-delete:after {
    content: "";
    position: absolute;
    left: 0.18rem;
    right: 0.18rem;
    top: 0.2rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 -0.13rem 0 -0.03rem currentColor;
}

.message-stream {
    display: grid;
    align-content: end;
    gap: 0.8rem;
    min-height: 20rem;
    max-height: 52vh;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.45rem 0.35rem 1.1rem;
    scroll-behavior: smooth;
}

.message-bubble {
    max-width: min(34rem, 86%);
    padding: 0.85rem;
    border-radius: var(--radius);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.08);
    transform-origin: 50% 100%;
    animation: messageReveal 760ms cubic-bezier(0.18, 0.84, 0.24, 1) both;
}

.message-bubble.is-search-focus {
    box-shadow:
        0 0 0 0.18rem rgba(238, 196, 83, 0.95),
        0 0 0 0.42rem rgba(15, 118, 110, 0.22),
        0 1.1rem 2.4rem rgba(31, 42, 68, 0.22);
    animation: messageSearchPulse 1.2s ease-in-out 0s 3 both;
}

@keyframes messageSearchPulse {
    0%, 100% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.018);
    }
}

.message-bubble:nth-child(1) {
    animation-delay: 0ms;
}

.message-bubble:nth-child(2) {
    animation-delay: 110ms;
}

.message-bubble:nth-child(3) {
    animation-delay: 220ms;
}

.message-bubble:nth-child(4) {
    animation-delay: 330ms;
}

.message-bubble:nth-child(5) {
    animation-delay: 440ms;
}

.message-bubble:nth-child(6) {
    animation-delay: 550ms;
}

.message-bubble:nth-child(7) {
    animation-delay: 660ms;
}

.message-bubble:nth-child(8) {
    animation-delay: 770ms;
}

.message-bubble:nth-child(9) {
    animation-delay: 880ms;
}

.message-bubble:nth-child(n + 10) {
    animation-delay: 990ms;
}

.message-bubble span {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.76rem;
    font-weight: 850;
}

.message-bubble .platform-pill {
    display: inline-flex;
    margin-left: 0.35rem;
    border-radius: 999px;
    padding: 0.12rem 0.42rem;
    color: inherit;
    background: rgba(18, 21, 33, 0.08);
    font-size: 0.68rem;
    font-style: normal;
    opacity: 0.78;
}

.message-bubble.outbound .platform-pill {
    background: rgba(255, 255, 255, 0.18);
}

.message-bubble p,
.message-text p {
    margin: 0;
    line-height: 1.55;
}

.message-text {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.message-text a {
    color: inherit;
    overflow-wrap: anywhere;
    font-weight: 850;
}

.email-replies-toggle {
    justify-self: start;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: 999px;
    padding: 0.35rem 0.7rem;
    color: var(--brand-deep);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.45rem 1rem rgba(31, 42, 68, 0.08);
    font-size: 0.76rem;
    font-weight: 900;
    cursor: pointer;
}

.email-replies-toggle:hover {
    border-color: rgba(138, 104, 29, 0.36);
    background: #fff;
}

.message-bubble.outbound .email-replies-toggle {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.14);
}

.email-quoted-replies {
    border-left: 3px solid rgba(138, 104, 29, 0.38);
    padding: 0.05rem 0 0.05rem 0.75rem;
    color: currentColor;
    opacity: 0.82;
}

.email-quoted-replies[hidden] {
    display: none;
}

.message-choice-options {
    display: grid;
    gap: 0.45rem;
}

.message-choice-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
    border-radius: 0.95rem;
    padding: 0.42rem 0.55rem 0.42rem 0.42rem;
    color: #14110b;
    background: rgba(255, 255, 255, 0.9);
}

.message-choice-option strong {
    display: inline-flex;
    width: 1.8rem;
    height: 1.8rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--brand);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 950;
}

.message-choice-option em {
    min-width: 0;
    color: #14110b;
    font-size: 0.84rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1.3;
}

.message-choice-footer {
    color: currentColor;
    font-size: 0.82rem;
    font-weight: 850;
    opacity: 0.78;
}

.message-bubble time {
    display: block;
    margin-top: 0.45rem;
    color: currentColor;
    font-size: 0.72rem;
    opacity: 0.7;
}

.message-bubble.inbound {
    color: #14110b;
    background: #fff;
}

.message-bubble.outbound {
    justify-self: end;
    color: #fff;
    background: var(--banner-gold-gradient);
}

.composer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.5rem;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.45rem;
    background: rgba(255, 255, 255, 0.78);
}

.composer textarea:disabled {
    color: var(--muted);
    cursor: not-allowed;
}

.composer .send-button:disabled {
    cursor: not-allowed;
    filter: grayscale(0.25);
    opacity: 0.52;
    transform: none;
}

.composer.is-thea-polishing {
    border-color: rgba(15, 118, 110, 0.34);
    box-shadow: 0 0.85rem 2rem rgba(15, 118, 110, 0.1);
}

.composer textarea {
    width: 100%;
    min-height: 2.65rem;
    max-height: 9rem;
    resize: vertical;
    border: 0;
    padding: 0.7rem 0.25rem;
    color: var(--ink);
    background: transparent;
    outline: none;
}

@media (max-width: 979px) {
    .page-hero {
        display: none;
    }

    .main-content {
        padding: 0;
    }

    .workspace-grid {
        display: block;
        min-height: calc(100dvh - 4.25rem);
    }

    .conversation-list {
        height: calc(100dvh - 4.25rem);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border: 0;
        border-radius: 0;
        padding: 0;
        background: transparent;
        box-shadow: none;
    }

    .conversation-list.has-raised-strip {
        padding-top: 0;
        overflow-y: auto;
    }

    .conversation-filter-strip.control-strip.is-raised {
        position: sticky;
        top: 0.6rem;
        right: auto;
        left: auto;
        z-index: 8;
        width: auto;
        margin: 0.75rem 0.85rem 0.55rem;
    }

    .inbox-deleted-toggle {
        margin: 0.6rem 0.85rem;
    }

    .new-email-fields {
        grid-template-columns: 1fr;
    }

    .conversation-item {
        min-height: 5.35rem;
        max-height: 5.35rem;
        padding: 0.24rem 0 0.24rem 0.46rem;
    }

    .thread-panel {
        display: none;
    }

    .mobile-thread-open {
        overflow: hidden;
    }

    .mobile-thread-open .mobile-topbar {
        display: none;
    }

    .mobile-thread-open .main-content {
        padding: 0;
    }

    .mobile-thread-open .workspace-grid {
        min-height: 100dvh;
    }

    .mobile-thread-open .conversation-list {
        display: none;
    }

    .mobile-thread-open .thread-panel {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: block;
        min-height: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        padding: 4.35rem 0.75rem 5.5rem;
        background:
            linear-gradient(180deg, rgba(246, 248, 255, 0.98), rgba(255, 255, 255, 0.98)),
            var(--surface);
        box-shadow: none;
    }

    .mobile-thread-open .thread-action-bar,
    .mobile-thread-open .thread-head {
        display: none;
    }

    .mobile-thread-open .mobile-thread-banner {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 76;
        display: grid;
        grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
        gap: 0.55rem;
        align-items: center;
        min-height: 4.15rem;
        padding: max(0.55rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right)) 0.55rem max(0.75rem, env(safe-area-inset-left));
        color: #fff;
        background: var(--banner-gold-gradient);
        box-shadow: 0 12px 34px rgba(138, 104, 29, 0.22);
    }

    .mobile-thread-banner strong {
        overflow: hidden;
        font-size: 1rem;
        font-weight: 900;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-thread-menu-open .mobile-thread-menu {
        position: fixed;
        top: 4.55rem;
        right: max(0.75rem, env(safe-area-inset-right));
        z-index: 82;
        display: grid;
        width: min(18rem, calc(100vw - 1.5rem));
        border: 1px solid rgba(255, 255, 255, 0.72);
        border-radius: var(--radius);
        padding: 0.55rem;
        background: rgba(255, 255, 255, 0.96);
        box-shadow: var(--shadow);
    }

    .mobile-thread-menu .workflow-button {
        min-height: 2.7rem;
    }

    .mobile-thread-open .message-stream {
        align-content: start;
        height: calc(100dvh - 9.85rem);
        max-height: none;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0.7rem 0.1rem 1rem;
    }

    .mobile-thread-open .thread-panel .composer {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 78;
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        border-radius: 8px 8px 0 0;
        padding: 0.55rem max(0.75rem, env(safe-area-inset-right)) max(0.55rem, env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-left));
        background: #fff;
        box-shadow: 0 -12px 34px rgba(31, 42, 68, 0.14);
    }

    .week-dashboard {
        gap: 0.55rem;
    }

    .week-toolbar {
        padding: 0.85rem 0.85rem 0;
    }

    .week-board {
        grid-template-columns: 1fr;
        gap: 0.55rem;
        padding: 0 0.65rem 0.8rem;
    }

    .week-day-card {
        cursor: pointer;
        min-height: 10.5rem;
        overflow: hidden;
    }

    .week-day-open {
        overflow: hidden;
    }

    .week-day-open .mobile-topbar {
        display: none;
    }

    .week-day-open .main-content {
        padding: 0;
    }

    .week-day-open .week-toolbar {
        display: none;
    }

    .week-day-open .calendar-summary-row {
        display: none;
    }

    .week-day-open .mobile-week-banner {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 76;
        display: grid;
        grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
        gap: 0.55rem;
        align-items: center;
        min-height: 4.15rem;
        padding: max(0.55rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right)) 0.55rem max(0.75rem, env(safe-area-inset-left));
        color: #fff;
        background: var(--banner-gold-gradient);
        box-shadow: 0 12px 34px rgba(138, 104, 29, 0.22);
    }

    .mobile-week-banner strong {
        overflow: hidden;
        font-size: 1rem;
        font-weight: 900;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .week-day-open .week-dashboard {
        min-height: 100dvh;
    }

    .week-day-open .week-board {
        display: block;
        min-height: 100dvh;
        padding: 0;
    }

    .week-day-open .week-day-card {
        display: none;
    }

    .week-day-open .week-day-card.is-open {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        min-height: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        padding: 4.95rem 0.85rem 1rem;
        background:
            linear-gradient(180deg, rgba(246, 248, 255, 0.98), rgba(255, 255, 255, 0.98)),
            var(--surface);
        box-shadow: none;
    }

    .week-day-open .week-day-card.is-open header {
        border: 1px solid var(--line);
        border-radius: var(--radius);
        padding: 0.75rem;
        background: rgba(255, 255, 255, 0.82);
    }

    .week-day-open .week-day-card.is-open .week-event-list {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 1rem;
    }

    .week-day-open .week-day-card.is-open .week-event {
        padding: 0.72rem 0.75rem;
    }

    .week-day-open .week-day-card.is-open .week-event span,
    .week-day-open .week-day-card.is-open .week-event em {
        font-size: 0.76rem;
    }

    .week-day-open .week-day-card.is-open .week-event strong {
        font-size: 0.92rem;
    }
}

.send-button {
    min-width: 2.65rem;
    height: 2.65rem;
    border: 0;
    border-radius: var(--radius);
    font-weight: 850;
}

.send-button {
    padding: 0 0.9rem;
}

.send-icon-button {
    width: 2.65rem;
    min-width: 2.65rem;
    padding: 0;
}

.thea-polish-button {
    width: 2.65rem;
    min-width: 2.65rem;
    padding: 0;
    color: #fff;
    background:
        radial-gradient(circle at 74% 24%, rgba(255, 255, 255, 0.32), transparent 0.42rem),
        linear-gradient(135deg, #0f766e, #5f470f);
    box-shadow: 0 0.78rem 1.65rem rgba(15, 118, 110, 0.2);
}

.thea-polish-button span {
    display: grid;
    width: 1.35rem;
    height: 1.35rem;
    place-items: center;
    margin: 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.54);
    border-radius: 999px;
    color: #fff;
    font-size: 0.86rem;
    font-weight: 900;
    line-height: 1;
    text-shadow: 0 0.08rem 0.18rem rgba(0, 0, 0, 0.34);
}

.thea-polish-button:hover {
    background:
        radial-gradient(circle at 74% 24%, rgba(255, 255, 255, 0.36), transparent 0.42rem),
        linear-gradient(135deg, #138f85, #6f5514);
}

.thea-polish-button[aria-busy="true"] span {
    animation: theaPulse 760ms ease-in-out infinite alternate;
}

@keyframes theaPulse {
    from {
        transform: scale(0.92);
        opacity: 0.72;
    }

    to {
        transform: scale(1.06);
        opacity: 1;
    }
}

.send-icon {
    position: relative;
    display: block;
    width: 1.12rem;
    height: 1.12rem;
    transform: translateX(-0.03rem) rotate(-8deg);
}

.send-icon:before {
    content: "";
    position: absolute;
    inset: 0.08rem;
    background: currentColor;
    clip-path: polygon(0 44%, 100% 0, 62% 100%, 45% 61%, 18% 78%);
}

.status-tag {
    display: inline-flex;
    align-items: center;
    min-height: 1.85rem;
    border-radius: 999px;
    padding: 0 0.7rem;
    color: var(--green);
    background: rgba(47, 125, 80, 0.1);
    font-size: 0.78rem;
    font-weight: 850;
}

.calendar-page {
    display: grid;
    gap: 1rem;
    width: 100%;
}

.calendar-toolbar {
    display: grid;
    gap: 0.85rem;
    align-items: center;
}

.calendar-toolbar h1 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.55rem, 2vw, 2.2rem);
    letter-spacing: 0;
}

.calendar-toolbar span {
    display: block;
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 800;
}

.calendar-toolbar .info-tip {
    display: inline-grid;
    color: #8a681d;
    font-size: 0.68rem;
}

.mini-toggle {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.25rem;
    max-width: 30rem;
    padding: 0.25rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.78);
}

.mini-toggle a {
    display: inline-flex;
    min-height: 2.3rem;
    align-items: center;
    justify-content: center;
    border-radius: calc(var(--radius) - 2px);
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 900;
}

.mini-toggle a.is-on {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 10px 22px rgba(138, 104, 29, 0.15);
}

.calendar-layout,
.booking-layout {
    display: grid;
    gap: 1rem;
}

.calendar-summary-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: 0.65rem;
}

.calendar-summary-card {
    --calendar-summary-accent: var(--brand);
    display: grid;
    align-content: start;
    min-height: 6.8rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-left: 0.28rem solid var(--calendar-summary-accent);
    border-radius: var(--radius);
    padding: 0.85rem 0.92rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.74)),
        rgba(138, 104, 29, 0.08);
    box-shadow: 0 0.85rem 1.8rem rgba(31, 42, 68, 0.06);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.calendar-summary-card span,
.calendar-summary-card em {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 850;
    text-transform: uppercase;
}

.calendar-summary-card strong {
    margin-top: 0.18rem;
    color: var(--brand-deep);
    font-size: 1.85rem;
    line-height: 1;
}

.calendar-summary-card.is-availability {
    --calendar-summary-accent: #2f7d50;
}

.calendar-summary-card.is-booking {
    --calendar-summary-accent: #8a681d;
}

.calendar-summary-card.is-diary {
    --calendar-summary-accent: #0f766e;
}

.calendar-summary-card.is-action {
    --calendar-summary-accent: #a65a45;
}

.calendar-summary-action {
    text-decoration: none;
}

.calendar-summary-action strong {
    font-size: 1.12rem;
    line-height: 1.15;
}

.calendar-summary-action:hover,
.calendar-summary-action:focus-visible {
    border-color: rgba(138, 104, 29, 0.24);
    box-shadow: 0 1rem 2.2rem rgba(138, 104, 29, 0.12);
    transform: translateY(-1px);
    outline: none;
}

html[data-theme="dark"] .calendar-summary-card {
    border-color: rgba(212, 189, 132, 0.16);
    background:
        linear-gradient(135deg, rgba(20, 29, 42, 0.92), rgba(15, 23, 42, 0.78)),
        rgba(212, 189, 132, 0.08);
}

html[data-theme="dark"] .calendar-summary-card strong {
    color: #f7e8bf;
}

.calendar-main,
.calendar-side,
.booking-column {
    display: grid;
    align-content: start;
    gap: 0.8rem;
}

.calendar-strip {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr) 2.35rem;
    align-items: center;
    gap: 0.5rem;
}

.calendar-strip button {
    display: grid;
    height: 2.35rem;
    place-items: center;
    border: 0;
    border-radius: var(--radius);
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.08);
    font-size: 1.4rem;
    font-weight: 900;
}

.calendar-strip strong {
    text-align: center;
}

.appointment-strip {
    grid-template-columns: minmax(0, 1fr) auto;
}

.appointment-strip strong {
    text-align: left;
}

.appointment-request-list {
    display: grid;
    gap: 0.75rem;
}

.appointment-request-card {
    gap: 0.42rem;
}

.appointment-request-card p {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.5;
}

.appointment-request-card .button-primary {
    justify-self: start;
    margin-top: 0.35rem;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(7.5rem, 1fr));
    gap: 0.55rem;
    overflow-x: auto;
    padding-bottom: 0.2rem;
}

.calendar-day {
    display: grid;
    gap: 0.38rem;
    min-height: 7.25rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: var(--radius);
    padding: 0.7rem;
    background: rgba(255, 255, 255, 0.72);
}

.calendar-day span,
.calendar-day em,
.agenda-card span,
.agenda-card em,
.booking-card span,
.booking-card em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 800;
}

.calendar-day strong {
    font-size: 1.7rem;
    line-height: 1;
}

.calendar-day em {
    align-self: end;
    color: var(--brand-deep);
}

.calendar-day.is-today,
.calendar-day.is-strong {
    color: #fff;
    border-color: transparent;
    background: var(--banner-gold-gradient);
    box-shadow: 0 14px 32px rgba(138, 104, 29, 0.18);
}

.calendar-day.is-today span,
.calendar-day.is-today em,
.calendar-day.is-strong span,
.calendar-day.is-strong em {
    color: rgba(255, 255, 255, 0.82);
}

.calendar-day.is-muted {
    opacity: 0.58;
}

.time-board {
    display: grid;
    gap: 0.55rem;
}

.time-row {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: stretch;
}

.time-row > span {
    padding-top: 0.78rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.time-event,
.agenda-card,
.booking-card {
    display: grid;
    gap: 0.18rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: var(--radius);
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.8);
    box-shadow: 0 10px 24px rgba(31, 42, 68, 0.06);
}

.time-event {
    border-left: 0.28rem solid var(--brand);
}

.time-event strong,
.agenda-card strong,
.booking-card strong {
    color: var(--ink);
    font-size: 0.94rem;
}

.is-blue {
    --event-color: var(--brand);
    border-left-color: var(--event-color);
}

.is-green {
    --event-color: var(--green);
    border-left-color: var(--event-color);
}

.is-amber {
    --event-color: var(--gold);
    border-left-color: var(--event-color);
}

.is-pink {
    --event-color: #a65a45;
    border-left-color: var(--event-color);
}

.calendar-side-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
}

.calendar-side-head span,
.booking-column h2,
.booking-column .form-title {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.calendar-side-head strong {
    color: var(--ink);
    font-size: 2rem;
    line-height: 1;
}

.agenda-card,
.booking-card {
    border-left: 0.28rem solid var(--event-color, var(--brand));
}

.booking-card.is-confirmed {
    --event-color: var(--green);
}

.booking-board-card,
.booking-slot-card {
    gap: 0.42rem;
}

.booking-board-card p {
    margin: 0.2rem 0 0;
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 750;
    line-height: 1.45;
}

.booking-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.4rem;
}

.booking-availability-map {
    margin-bottom: 0.75rem;
}

.availability-map {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.45rem 0.55rem;
    align-items: center;
}

.availability-map span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.availability-map i {
    display: block;
    height: 0.72rem;
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.15);
}

.availability-map .is-open {
    background: linear-gradient(135deg, rgba(47, 125, 80, 0.22), rgba(15, 118, 110, 0.2));
}

.availability-map .is-busy {
    background: linear-gradient(135deg, rgba(138, 104, 29, 0.25), rgba(166, 90, 69, 0.18));
}

.availability-page {
    padding-bottom: 1rem;
}

.availability-layout {
    display: grid;
    gap: 1rem;
}

.availability-form-panel,
.availability-types-panel,
.availability-week-panel,
.availability-slots-panel {
    min-width: 0;
}

.availability-form-grid {
    display: grid;
    gap: 0.7rem;
    align-items: end;
}

.availability-form-grid label {
    display: grid;
    gap: 0.32rem;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
}

.availability-form-grid .workflow-button {
    min-height: 2.9rem;
}

.availability-type-legend,
.availability-slot-list {
    display: grid;
    gap: 0.55rem;
}

.availability-type-pill {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.24rem 0.55rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-left-width: 0.28rem;
    border-radius: var(--radius);
    padding: 0.68rem 0.75rem;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.05);
}

.availability-type-pill i {
    grid-row: span 2;
    display: block;
    width: 0.86rem;
    height: 0.86rem;
    border-radius: 999px;
    box-shadow: 0 0.45rem 0.9rem rgba(31, 42, 68, 0.12);
}

.availability-type-pill strong {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 0.88rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-type-pill span {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 780;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-type-pill.is-muted {
    opacity: 0.52;
}

.availability-slot-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.42rem 0.8rem;
    align-items: center;
    border: 1px solid var(--line);
    border-left: 0.28rem solid var(--brand);
    border-radius: var(--radius);
    padding: 0.78rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.9rem 2rem rgba(31, 42, 68, 0.06);
    animation: cmsBloomIn 520ms cubic-bezier(0.18, 0.9, 0.22, 1.1) both;
}

.availability-slot-card div {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

.availability-slot-card span,
.availability-slot-card em {
    color: var(--muted);
    font-size: 0.76rem;
    font-style: normal;
    font-weight: 820;
}

.availability-slot-card strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.96rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-slot-card p {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 760;
}

.availability-slot-card p:empty {
    display: none;
}

.week-dashboard {
    gap: 0.9rem;
}

.week-toolbar {
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
}

.week-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.week-summary-grid,
.week-board {
    display: grid;
    gap: 0.7rem;
}

.week-board {
    grid-template-columns: 1fr;
    width: 100%;
}

.week-summary-card {
    --week-accent: var(--brand);
    --week-deep: var(--brand-deep);
    display: grid;
    gap: 0.35rem;
    min-height: 9rem;
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 1rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.72)),
        rgba(138, 104, 29, 0.08);
    box-shadow: var(--soft-shadow);
}

.week-summary-card span,
.week-summary-card em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 900;
    text-transform: uppercase;
}

.week-summary-card strong {
    color: var(--week-deep);
    font-size: 2.45rem;
    line-height: 1;
}

.week-summary-card.is-messaging {
    --week-deep: var(--brand-deep);
}

.week-summary-card.is-calendar {
    --week-deep: #5f4512;
}

.week-summary-card.is-financials {
    --week-deep: #6f5018;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.72)),
        rgba(185, 138, 44, 0.12);
}

.week-summary-card.is-bookings {
    --week-deep: #1f5f3d;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.72)),
        rgba(47, 125, 80, 0.1);
}

.week-day-card {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0.7rem;
    width: 100%;
    min-height: 13rem;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.76rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.8rem 1.8rem rgba(31, 42, 68, 0.05);
}

.week-day-card.is-today {
    border-color: rgba(138, 104, 29, 0.48);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.68)),
        linear-gradient(135deg, rgba(138, 104, 29, 0.18), rgba(95, 69, 18, 0.08));
    box-shadow: 0 1rem 2.2rem rgba(138, 104, 29, 0.12);
}

.week-day-card header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.1rem 0.5rem;
    align-items: start;
    justify-content: space-between;
}

.week-day-card header span {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.week-day-card header strong {
    grid-row: span 2;
    color: var(--brand-deep);
    font-size: 1.45rem;
    line-height: 1;
}

.week-day-card header b {
    align-self: start;
    border-radius: 999px;
    padding: 0.18rem 0.42rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.45rem 0.9rem rgba(138, 104, 29, 0.18);
    font-size: 0.64rem;
    line-height: 1;
    text-transform: uppercase;
}

.week-day-card header em {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 820;
}

.week-event-list {
    display: grid;
    align-content: start;
    gap: 0.42rem;
    min-width: 0;
    min-height: 0;
}

.week-event {
    display: grid;
    min-width: 0;
    gap: 0.1rem;
    border: 1px solid rgba(138, 104, 29, 0.08);
    border-left: 0.24rem solid var(--brand);
    border-radius: var(--radius);
    padding: 0.48rem 0.55rem;
    color: var(--ink);
    background: rgba(246, 247, 251, 0.86);
}

button.week-event {
    width: 100%;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

button.week-event:hover,
button.week-event:focus-visible {
    border-color: rgba(15, 118, 110, 0.22);
    box-shadow: 0 0.75rem 1.5rem rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
    outline: none;
}

.week-event span,
.week-event em {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.week-event strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.week-event-google {
    border-color: rgba(138, 104, 29, 0.16);
    border-left-color: #8a681d;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 244, 235, 0.9));
}

.week-event-local {
    border-color: rgba(15, 118, 110, 0.16);
    border-left-color: #0f766e;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(232, 246, 243, 0.9));
}

.week-empty {
    margin: 0;
    border: 1px dashed rgba(121, 131, 153, 0.22);
    border-radius: var(--radius);
    padding: 0.55rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.4);
    font-size: 0.76rem;
    font-weight: 760;
    text-align: center;
}

.week-shape {
    display: grid;
    gap: 0.72rem;
}

.week-shape span {
    position: relative;
    display: grid;
    min-height: 2.25rem;
    overflow: hidden;
    border-radius: var(--radius);
    background: rgba(121, 131, 153, 0.12);
}

.week-shape span:before {
    content: "";
    width: var(--value);
    border-radius: inherit;
    background: var(--banner-gold-gradient);
}

.week-shape b {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
    color: var(--ink);
    font-size: 0.82rem;
}

.contact-facts {
    display: grid;
    gap: 0.65rem;
    margin: 0;
}

.contact-facts div {
    padding: 0.85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.54);
}

.contact-facts dt {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
    text-transform: uppercase;
}

.contact-facts dd {
    margin: 0.25rem 0 0;
    font-weight: 750;
}

.mini-timeline {
    margin-top: 1rem;
}

.identity-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 1rem;
}

    .identity-chip {
        display: inline-flex;
        min-height: 2rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 0 0.7rem;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.78rem;
        font-weight: 800;
    }

    .management-search-panel,
    .contact-type-card {
        grid-template-columns: 1fr;
    }

    .contact-type-card {
        align-items: stretch;
    }

    .contact-type-meta {
        justify-items: stretch;
    }

    .mini-timeline ol {
        display: grid;
    gap: 0.55rem;
    margin: 0.65rem 0 0;
    padding-left: 1.15rem;
    color: var(--muted);
}

@media (min-width: 640px) {
    .login-card {
        padding: 1.5rem;
    }

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

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

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

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

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

    .module-control-summary {
        grid-template-columns: minmax(0, 1fr) minmax(17rem, 0.72fr) auto;
    }

    .module-summary-billing {
        justify-self: end;
        white-space: nowrap;
    }

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

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

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

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

    .page-hero {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .thread-actions {
        grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    }

    .transfer-control {
        min-width: 9.5rem;
    }

}

@media (max-width: 680px) {
    .cms-block-palette {
        grid-template-columns: 1fr;
    }

    .cms-block-palette button {
        min-height: 5.65rem;
    }

    .franchise-settings-grid,
    .franchisee-fields,
    .franchisee-card-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 980px) {
    .login-shell {
        grid-template-columns: minmax(0, 1.08fr) minmax(24rem, 0.72fr);
        padding: 3rem;
    }

    .login-card {
        max-width: 42rem;
    }

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

    .register-stack {
        border-top: 0;
        border-left: 1px solid var(--line);
        padding-top: 0;
        padding-left: 1.25rem;
    }

    .mobile-topbar {
        display: none;
    }

    .sidebar {
        display: flex;
        flex-direction: column;
    }

    .main-content {
        margin-left: var(--sidebar-width);
        padding: 2rem 2rem 2.5rem;
    }

    .home-hero {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .home-card-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .home-flow-track {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }

    .workspace-danger-grid {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.32fr);
        align-items: end;
    }

    .onboarding-module-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .onboarding-shell {
        padding: 2.5rem;
    }

    .onboarding-card {
        padding: 1.35rem;
    }

    .onboarding-card.is-step-flow .onboarding-module-grid.is-single-addon {
        grid-template-columns: minmax(0, 1fr);
    }

    .onboarding-card.is-step-flow .onboarding-module-grid.is-included-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .onboarding-card.is-step-flow .onboarding-module-grid:not(.is-included-row):not(.is-single-addon) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .financial-action-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

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

    .financial-overview-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        align-items: start;
    }

    .financial-wide-panel {
        grid-column: span 2;
    }

    .week-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .week-dashboard {
        grid-template-rows: auto auto minmax(0, 1fr);
        height: calc(100dvh - 4.5rem);
        min-height: 0;
        overflow: hidden;
    }

    .week-board {
        grid-template-columns: repeat(7, minmax(0, 1fr));
        min-height: 0;
        overflow: hidden;
    }

    .week-day-card {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .week-event-list {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .workspace-grid {
        grid-template-columns: minmax(22rem, 1fr) minmax(0, 2fr);
        align-items: stretch;
        height: calc(100dvh - 9.45rem);
        min-height: 0;
    }

    .calendar-toolbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .calendar-layout {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.32fr);
        align-items: start;
    }

    .availability-layout {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.34fr);
        align-items: start;
    }

    .availability-form-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .availability-notes {
        grid-column: span 3;
    }

    .booking-layout {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: start;
    }

    .conversation-list,
    .thread-panel {
        height: 100%;
        min-height: 0;
    }

    .thread-panel {
        overflow: visible;
    }

    .conversation-list {
        overflow: hidden;
    }

    .conversation-list {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .conversation-list.has-raised-strip {
        overflow: visible;
    }

    .conversation-list.has-raised-strip [data-update="conversation-list"] {
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-right: 0.08rem;
    }

    .conversation-item {
        grid-template-columns: 2.7rem minmax(0, 1fr);
        min-height: 5.55rem;
        max-height: 5.55rem;
        align-items: center;
        gap: 0.58rem;
        padding: 0.38rem 0.68rem 0.38rem 0.56rem;
    }

    .conversation-item .platform-avatar {
        width: 2.28rem;
        height: 2.28rem;
    }

    .conversation-icon-time {
        max-width: 2.7rem;
        font-size: 0.62rem;
    }

    .conversation-copy {
        gap: 0.16rem;
        line-height: 1.08;
    }

    .conversation-primary {
        font-size: 0.94rem;
    }

    .conversation-detail {
        font-size: 0.68rem;
    }

    .conversation-message-preview {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }

    .thread-panel {
        grid-template-rows: auto minmax(0, 1fr) auto;
    }

    .message-stream {
        min-height: 0;
        max-height: none;
    }
}

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

    .main-content {
        animation: none !important;
        transform: none !important;
        filter: none !important;
    }

    .page-transition-mark,
    .page-transition-track i,
    .surface-motion {
        animation: none !important;
    }
}

@keyframes pageContentArrive {
    from {
        opacity: 0;
        transform: translateY(0.42rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pageTransitionMark {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-0.18rem);
    }
}

@keyframes pageTransitionTrack {
    from {
        transform: translateX(-110%);
    }

    to {
        transform: translateX(210%);
    }
}

@keyframes surfaceLatticeDrift {
    from {
        background-position: 0 0, 0 0;
    }

    to {
        background-position: 7.5rem 3.75rem, 3.75rem 7.5rem;
    }
}

@keyframes surfaceSheenSweep {
    0% {
        background-position: -150% 0, 130% 0;
    }

    44% {
        background-position: 120% 0, -80% 0;
    }

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

@keyframes surfaceGrainShift {
    0% {
        transform: translate3d(0, 0, 0);
    }

    25% {
        transform: translate3d(-1px, 1px, 0);
    }

    50% {
        transform: translate3d(1px, -1px, 0);
    }

    75% {
        transform: translate3d(1px, 1px, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }
}

@keyframes riseIn {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bloomIn {
    from {
        opacity: 0;
        transform: translateY(0.55rem) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes onboardingAuraDrift {
    0%,
    100% {
        transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
    }

    50% {
        transform: translate3d(-1.2rem, 1rem, 0) rotate(18deg) scale(1.05);
    }
}

@keyframes onboardingGlowShift {
    0% {
        opacity: 0.72;
        transform: translateX(-1.4rem);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes onboardingStepForward {
    from {
        opacity: 0;
        filter: blur(5px);
        transform: translateX(var(--step-drift)) scale(0.992);
    }

    to {
        opacity: 1;
        filter: blur(0);
        transform: translateX(0) scale(1);
    }
}

@keyframes onboardingStepBack {
    from {
        opacity: 0;
        filter: blur(5px);
        transform: translateX(-0.95rem) scale(0.992);
    }

    to {
        opacity: 1;
        filter: blur(0);
        transform: translateX(0) scale(1);
    }
}

@keyframes onboardingStepSettle {
    from {
        opacity: 0.92;
        transform: translateY(0.22rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes onboardingItemArrive {
    from {
        opacity: 0;
        transform: translateY(0.65rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes floatGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(1.25rem, -0.8rem, 0) scale(1.06);
    }
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(47, 125, 80, 0.36);
    }

    70% {
        box-shadow: 0 0 0 0.65rem rgba(47, 125, 80, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(47, 125, 80, 0);
    }
}

@keyframes badgeBloom {
    0% {
        opacity: 0;
        transform: scale(0.45);
        box-shadow: 0 0 0 0 rgba(166, 90, 69, 0.42), 0 0.4rem 0.9rem rgba(166, 90, 69, 0.2);
    }

    52% {
        opacity: 1;
        transform: scale(1.24);
        box-shadow: 0 0 0 0.42rem rgba(166, 90, 69, 0.16), 0 0.8rem 1.7rem rgba(166, 90, 69, 0.34);
    }

    100% {
        opacity: 1;
        transform: scale(1);
        box-shadow: 0 0.6rem 1.3rem rgba(166, 90, 69, 0.3), inset 0 0.08rem 0 rgba(255, 255, 255, 0.45);
    }
}

@keyframes messageReveal {
    0% {
        opacity: 0;
        transform: translateY(0.45rem) scale(0.988);
    }

    72% {
        opacity: 1;
        transform: translateY(-0.05rem) scale(1.004);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cmsBloomIn {
    0% {
        opacity: 0;
        transform: translateY(0.65rem) scale(0.96);
        box-shadow: 0 0 0 0 rgba(138, 104, 29, 0.28), 0 0.4rem 0.9rem rgba(31, 42, 68, 0.08);
    }

    58% {
        opacity: 1;
        transform: translateY(-0.08rem) scale(1.018);
        box-shadow: 0 0 0 0.45rem rgba(138, 104, 29, 0.1), 0 1.2rem 2.6rem rgba(138, 104, 29, 0.16);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes savedFlash {
    0% {
        color: var(--ink);
        border-color: rgba(47, 125, 80, 0.82);
        background: rgba(47, 125, 80, 0.14);
        box-shadow: 0 0 0 0 rgba(47, 125, 80, 0.26);
        opacity: 1;
    }

    45% {
        color: var(--ink);
        border-color: rgba(47, 125, 80, 0.9);
        background: rgba(47, 125, 80, 0.22);
        box-shadow: 0 0 0 0.32rem rgba(47, 125, 80, 0.12);
        opacity: 1;
    }

    100% {
        color: var(--ink);
        border-color: var(--line);
        background: var(--input-bg);
        box-shadow: none;
        opacity: 1;
    }
}

.cms-shell {
    display: grid;
    gap: 1rem;
}

.team-shell {
    display: grid;
    gap: 1rem;
}

.cms-shell:not(.is-editor-open) {
    display: block;
}

.team-shell:not(.is-editor-open) {
    display: block;
}

.cms-shell:not(.is-editor-open) .cms-editor-panel {
    display: none;
}

.team-shell:not(.is-editor-open) .cms-editor-panel {
    display: none;
}

.cms-shell:not(.is-editor-open) .cms-side-column {
    min-height: calc(100dvh - 4rem);
}

.team-shell:not(.is-editor-open) .cms-side-column {
    min-height: calc(100dvh - 4rem);
}

.cms-shell:not(.is-editor-open) .cms-pages-panel {
    min-height: calc(100dvh - 4rem);
}

.team-shell:not(.is-editor-open) .cms-pages-panel {
    min-height: calc(100dvh - 4rem);
}

.landing-pages-shell:not(.is-editor-open) .cms-pages-panel {
    min-height: 0;
}

.landing-pages-shell:not(.is-editor-open) .cms-page-tree {
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.9rem;
}

.cms-shell.is-editor-open .cms-side-column {
    display: none;
}

.cms-editor-bar {
    display: none;
}

.cms-side-column {
    display: grid;
    gap: 1.5rem;
    min-width: 0;
}

.cms-pages-panel,
.cms-editor-panel,
.cms-images-panel {
    min-width: 0;
}

.cms-upload-box,
.cms-page-settings,
.cms-modal-fields {
    display: grid;
    gap: 0.65rem;
}

.image-dropzone {
    position: relative;
    display: grid;
    min-height: 9rem;
    place-items: center;
    gap: 0.35rem;
    overflow: hidden;
    border: 1.5px dashed rgba(138, 104, 29, 0.42);
    border-radius: calc(var(--radius) + 0.15rem);
    padding: 1rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 235, 0.66)),
        rgba(138, 104, 29, 0.07);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.58), 0 0.9rem 1.9rem rgba(20, 18, 12, 0.06);
    text-align: center;
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background 160ms ease;
}

.image-dropzone:hover,
.image-dropzone.is-dragover {
    border-color: rgba(95, 69, 18, 0.76);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(218, 190, 112, 0.2)),
        rgba(138, 104, 29, 0.11);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1.1rem 2.25rem rgba(20, 18, 12, 0.1);
    transform: translateY(-1px);
}

.image-dropzone-icon {
    display: grid;
    width: 2.7rem;
    height: 2.35rem;
    place-items: center;
    border: 0.16rem solid rgba(138, 104, 29, 0.72);
    border-radius: 0.38rem;
    color: var(--brand-deep);
}

.image-dropzone-icon:before {
    content: "";
    width: 0.7rem;
    height: 0.7rem;
    border-top: 0.16rem solid currentColor;
    border-left: 0.16rem solid currentColor;
    transform: rotate(45deg) translate(0.08rem, 0.08rem);
}

.image-dropzone strong {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.image-dropzone small {
    max-width: 28rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.45;
}

.image-dropzone-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

:root[data-theme="dark"] .image-dropzone {
    border-color: rgba(222, 205, 158, 0.34);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(222, 205, 158, 0.09)),
        rgba(255, 255, 255, 0.03);
}

.cms-image-library-page {
    display: grid;
    gap: 1rem;
}

.cms-library-upload-panel {
    width: 100%;
    max-width: none;
}

.ai-image-modal-card {
    width: min(52rem, 100%);
}

.ai-image-preview {
    display: grid;
    gap: 0.6rem;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 8px;
    padding: 0.75rem;
    background: rgba(138, 104, 29, 0.07);
}

.ai-image-preview img {
    display: block;
    width: 100%;
    max-height: 32rem;
    object-fit: contain;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 0.9rem 2rem rgba(20, 18, 12, 0.12);
}

.ai-image-preview p {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 800;
}

.cms-page-tree,
.cms-block-list,
.cms-image-grid {
    display: grid;
    gap: 0.5rem;
}

.cms-page-family {
    display: grid;
    gap: 0.42rem;
    align-content: start;
    min-width: 0;
}

.cms-subpage-accordion {
    display: grid;
    min-width: 0;
    margin-top: -0.78rem;
    position: relative;
    z-index: 1;
}

.cms-subpage-accordion summary {
    display: flex;
    width: 100%;
    max-width: 100%;
    min-height: 2.15rem;
    align-items: center;
    justify-content: center;
    gap: 0.38rem;
    margin: 0;
    border: 1px solid var(--cms-tree-line);
    border-top: 0;
    border-radius: 0 0 8px 8px;
    padding: 0 0.82rem;
    color: color-mix(in srgb, var(--cms-tree-colour) 78%, #14110b 22%);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0.72rem 1.3rem rgba(31, 42, 68, 0.08);
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 950;
    list-style: none;
    user-select: none;
}

.cms-subpage-accordion summary::-webkit-details-marker {
    display: none;
}

.cms-subpage-accordion summary:after {
    content: "";
    display: block;
    margin-left: 0.12rem;
    width: 0.42rem;
    height: 0.42rem;
    border-right: 0.12rem solid currentColor;
    border-bottom: 0.12rem solid currentColor;
    transform: translateY(-0.1rem) rotate(45deg);
    transition: transform 180ms ease;
}

.cms-subpage-accordion[open] summary:after {
    transform: translateY(0.08rem) rotate(225deg);
}

.cms-subpage-accordion[open] summary {
    border-color: color-mix(in srgb, var(--cms-tree-colour) 48%, #ffffff 52%);
    color: #fff;
    background:
        linear-gradient(135deg, var(--cms-tree-colour), color-mix(in srgb, var(--cms-tree-colour) 58%, #050505 42%));
    box-shadow: 0 0.95rem 1.8rem rgba(20, 17, 11, 0.14);
}

.cms-subpage-list {
    display: grid;
    gap: 0.42rem;
    margin-left: 1rem;
    border-left: 0.18rem solid var(--cms-tree-line);
    padding: 0.45rem 0 0 0.8rem;
    overflow: hidden;
    transform-origin: top;
    animation: cmsAccordionOpen 320ms cubic-bezier(0.18, 0.9, 0.24, 1) both;
}

@keyframes cmsAccordionOpen {
    from {
        opacity: 0;
        max-height: 0;
        transform: translateY(-0.35rem) scaleY(0.96);
    }

    to {
        opacity: 1;
        max-height: 80rem;
        transform: translateY(0) scaleY(1);
    }
}

.cms-subpage-list .cms-page-row {
    animation: cmsSubpageCardIn 360ms cubic-bezier(0.18, 0.9, 0.24, 1) both;
}

.cms-subpage-list .cms-page-row:nth-child(2) {
    animation-delay: 35ms;
}

.cms-subpage-list .cms-page-row:nth-child(3) {
    animation-delay: 70ms;
}

.cms-subpage-list .cms-page-row:nth-child(4) {
    animation-delay: 105ms;
}

.cms-subpage-list .cms-page-row:nth-child(n + 5) {
    animation-delay: 140ms;
}

@keyframes cmsSubpageCardIn {
    from {
        opacity: 0;
        transform: translateX(-0.7rem);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.landing-template-panel {
    scroll-margin-top: 1rem;
}

.landing-start-panel,
.landing-launch-checklist {
    display: grid;
    gap: 0.85rem;
}

.landing-start-panel {
    border-color: rgba(138, 104, 29, 0.18);
    background:
        radial-gradient(circle at 90% 10%, rgba(138, 104, 29, 0.14), transparent 8rem),
        rgba(255, 255, 255, 0.82);
}

.landing-start-panel strong,
.landing-launch-head strong {
    display: block;
    color: var(--ink);
    font-size: 1.12rem;
    line-height: 1.08;
    font-weight: 750;
}

.landing-start-actions,
.landing-editor-head-actions,
.landing-launch-actions {
    display: flex;
    width: fit-content;
    max-width: 100%;
    flex-wrap: wrap;
    gap: 0.18rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0.18rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 235, 0.72)),
        rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.7rem 1.6rem rgba(138, 104, 29, 0.08), inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
}

.landing-editor-head-actions {
    margin-left: auto;
}

.landing-start-actions > *,
.landing-editor-head-actions > *,
.landing-launch-actions > * {
    min-height: 2.25rem;
    border-radius: 999px;
}

.landing-ai-action {
    justify-content: center;
    border-radius: 8px;
    white-space: normal;
    text-align: center;
}

.landing-ai-action.is-disabled {
    opacity: 0.82;
}

.ai-clear-action-button {
    letter-spacing: 0;
    white-space: normal;
}

.ai-clear-action-button.is-ai-generating {
    opacity: 0.82;
    cursor: progress;
}

.ai-clear-action-button.is-ai-generating:after {
    content: "";
    display: inline-block;
    width: 0.72rem;
    height: 0.72rem;
    margin-left: 0.45rem;
    border: 0.12rem solid currentColor;
    border-right-color: transparent;
    border-radius: 999px;
    vertical-align: -0.08rem;
    animation: aiButtonSpin 760ms linear infinite;
}

@keyframes aiButtonSpin {
    to {
        transform: rotate(360deg);
    }
}

.ai-clear-action-button .action-icon {
    display: none !important;
}

.ai-landing-success-actions {
    display: flex;
    width: fit-content;
    max-width: 100%;
    flex-wrap: wrap;
    gap: 0.18rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0.18rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 235, 0.72)),
        rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.7rem 1.6rem rgba(138, 104, 29, 0.08), inset 0 0.08rem 0 rgba(255, 255, 255, 0.72);
}

.ai-landing-success-actions > * {
    min-height: 2.25rem;
    border-radius: 999px;
}

.landing-empty-state {
    gap: 0.6rem;
    justify-items: start;
    text-align: left;
}

.landing-empty-state strong {
    color: var(--ink);
    font-size: 1rem;
}

.landing-empty-state span {
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 760;
}

.landing-empty-state div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.landing-launch-checklist {
    margin: 0 0 1rem;
    border: 1px solid rgba(138, 104, 29, 0.15);
    border-radius: 10px;
    padding: 0.9rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.11), transparent 10rem),
        rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.landing-launch-head {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    justify-content: space-between;
}

.landing-launch-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.landing-launch-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.1rem 0.45rem;
    align-items: center;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.72);
}

.landing-launch-item i {
    grid-row: 1 / span 2;
    width: 0.72rem;
    height: 0.72rem;
    border: 2px solid rgba(105, 73, 12, 0.34);
    border-radius: 999px;
}

.landing-launch-item.is-done i {
    border-color: #8a681d;
    background: #8a681d;
    box-shadow: inset 0 0 0 2px #fff;
}

.landing-launch-item b {
    color: var(--ink);
    font-size: 0.74rem;
    line-height: 1.05;
}

.landing-launch-item small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 760;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-next-step {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.5rem;
    align-items: center;
    margin: 0;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 760;
    line-height: 1.45;
}

.landing-next-step span {
    display: inline-flex;
    min-height: 1.45rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.5rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.11);
    font-size: 0.68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.landing-template-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.landing-template-card {
    --template-accent: var(--brand);
    --template-deep: var(--brand-deep);
    --template-ink: #111827;
    --template-muted: #596070;
    position: relative;
    display: grid;
    gap: 0.85rem;
    align-content: space-between;
    min-height: 13rem;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.85rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78)),
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), transparent);
    color: var(--template-ink);
    box-shadow: var(--soft-shadow);
}

.landing-template-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.22rem;
    background: linear-gradient(90deg, var(--template-accent), var(--template-deep));
}

.landing-template-card.is-newsletter,
.landing-template-card.is-lead-magnet {
    --template-accent: #2f7d50;
    --template-deep: #1f5f3d;
}

.landing-template-card.is-booking,
.landing-template-card.is-consultation {
    --template-accent: #0f766e;
    --template-deep: #0b5752;
}

.landing-template-card.is-product-launch,
.landing-template-card.is-urgent-offer,
.landing-template-card.is-direct-sales {
    --template-accent: #a65a45;
    --template-deep: #743a2c;
}

.landing-template-card.is-event,
.landing-template-card.is-local-service {
    --template-accent: #765a82;
    --template-deep: #513a60;
}

.landing-template-card strong {
    display: block;
    margin-top: 0.22rem;
    color: var(--template-ink);
    font-size: 1rem;
    line-height: 1.08;
    font-weight: 950;
}

.landing-template-card .module-eyebrow {
    color: var(--template-deep);
}

.landing-template-card p {
    margin: 0.42rem 0 0;
    color: var(--template-muted);
    font-size: 0.78rem;
    line-height: 1.42;
}

.landing-template-card small {
    display: inline-flex;
    width: max-content;
    max-width: 100%;
    margin-top: 0.58rem;
    border-radius: 999px;
    padding: 0.2rem 0.48rem;
    color: var(--template-deep);
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.66rem;
    font-weight: 900;
}

.landing-template-card .button-secondary {
    border-color: rgba(17, 24, 39, 0.12);
    color: var(--template-ink);
    background: rgba(255, 255, 255, 0.86);
}

@media (max-width: 760px) {
    .landing-start-actions,
    .landing-editor-head-actions,
    .landing-launch-actions,
    .ai-landing-success-actions,
    .landing-empty-state div {
        width: 100%;
        align-items: stretch;
        border-radius: 14px;
        flex-direction: column;
    }

    .landing-start-actions > *,
    .landing-editor-head-actions > *,
    .landing-launch-actions > *,
    .ai-landing-success-actions > *,
    .landing-empty-state div > * {
        width: 100%;
    }

    .landing-launch-steps {
        grid-template-columns: 1fr;
    }

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

.management-search-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8.5rem, 0.42fr) minmax(8.5rem, 0.42fr);
    gap: 0.55rem;
    margin-bottom: 0.75rem;
}

.management-search-input {
    width: 100%;
}

.management-filter-select {
    width: 100%;
}

.mailchimp-sync-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 0 0 0.75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.66);
}

.mailchimp-sync-copy {
    display: flex;
    flex: 1 1 12rem;
    align-items: center;
    min-width: 0;
    gap: 0.62rem;
}

.mailchimp-sync-button {
    flex: 0 0 auto;
    min-width: 8.8rem;
    white-space: nowrap;
}

.mailchimp-sync-copy > div {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

.mailchimp-sync-copy strong,
.mailchimp-sync-copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailchimp-sync-copy strong {
    color: var(--ink);
    font-size: 0.82rem;
}

.mailchimp-sync-copy span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 760;
}

.contact-owner-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.7rem;
    border-radius: 999px;
    padding: 0 0.65rem;
    color: #3d2b08;
    background: rgba(138, 104, 29, 0.12);
    font-size: 0.72rem;
    font-weight: 900;
    white-space: nowrap;
}

.contact-owner-pill.is-muted {
    color: var(--muted);
    background: rgba(105, 112, 133, 0.1);
}

.cms-page-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.62);
}

:root .cms-page-family.cms-colour-0,
:root .cms-page-row.cms-colour-0 {
    --cms-tree-colour: #806013;
    --cms-tree-soft: rgba(128, 96, 19, 0.14);
    --cms-tree-line: rgba(128, 96, 19, 0.28);
}

:root .cms-page-family.cms-colour-1,
:root .cms-page-row.cms-colour-1 {
    --cms-tree-colour: #0f766e;
    --cms-tree-soft: rgba(15, 118, 110, 0.13);
    --cms-tree-line: rgba(15, 118, 110, 0.24);
}

:root .cms-page-family.cms-colour-2,
:root .cms-page-row.cms-colour-2 {
    --cms-tree-colour: #2f7d50;
    --cms-tree-soft: rgba(47, 125, 80, 0.13);
    --cms-tree-line: rgba(47, 125, 80, 0.24);
}

:root .cms-page-family.cms-colour-3,
:root .cms-page-row.cms-colour-3 {
    --cms-tree-colour: #a65a45;
    --cms-tree-soft: rgba(166, 90, 69, 0.13);
    --cms-tree-line: rgba(166, 90, 69, 0.24);
}

:root .cms-page-family.cms-colour-4,
:root .cms-page-row.cms-colour-4 {
    --cms-tree-colour: #6b5a3f;
    --cms-tree-soft: rgba(107, 90, 63, 0.14);
    --cms-tree-line: rgba(107, 90, 63, 0.24);
}

:root .cms-page-family.cms-colour-5,
:root .cms-page-row.cms-colour-5 {
    --cms-tree-colour: #2e6f8f;
    --cms-tree-soft: rgba(46, 111, 143, 0.13);
    --cms-tree-line: rgba(46, 111, 143, 0.24);
}

:root .cms-page-family.cms-colour-6,
:root .cms-page-row.cms-colour-6 {
    --cms-tree-colour: #77527a;
    --cms-tree-soft: rgba(119, 82, 122, 0.13);
    --cms-tree-line: rgba(119, 82, 122, 0.24);
}

:root .cms-page-family.cms-colour-7,
:root .cms-page-row.cms-colour-7 {
    --cms-tree-colour: #85621f;
    --cms-tree-soft: rgba(133, 98, 31, 0.13);
    --cms-tree-line: rgba(133, 98, 31, 0.24);
}

:root .cms-page-row.cms-page-row.cms-tree-root {
    border-color: transparent;
    color: #fff;
    background: var(--cms-tree-colour);
    box-shadow: 0 0.85rem 2rem rgba(20, 17, 11, 0.13);
}

:root .cms-page-row.cms-page-row.cms-tree-child {
    border-color: var(--cms-tree-line);
    background: var(--cms-tree-soft);
}

:root .cms-page-row.cms-page-row.cms-tree-root.is-selected,
:root .cms-page-row.cms-page-row.cms-tree-child.is-selected {
    border-color: rgba(255, 255, 255, 0.62);
    box-shadow: 0 0 0 2px rgba(138, 104, 29, 0.2), 0 0.85rem 2rem rgba(20, 17, 11, 0.15);
}

.cms-shell:not(.is-editor-open) .cms-page-row {
    min-height: 4.25rem;
    padding: 0.8rem 0.85rem;
}

.cms-page-row.is-selected {
    border-color: rgba(138, 104, 29, 0.35);
    background: rgba(138, 104, 29, 0.09);
}

[data-management-row].is-filtered-out {
    display: none;
}

[data-management-row].is-search-match {
    border-color: rgba(47, 125, 80, 0.28);
    background:
        linear-gradient(90deg, rgba(47, 125, 80, 0.1), transparent 42%),
        rgba(255, 255, 255, 0.78);
}

.cms-page-row.is-child {
    margin-left: calc(var(--cms-depth, 1) * 1rem);
}

.website-pages-shell:not(.is-editor-open) .cms-page-tree {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.78rem;
    align-items: start;
}

.website-pages-shell:not(.is-editor-open) .cms-page-family {
    gap: 0.58rem;
    min-width: 0;
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card {
    position: relative;
    display: grid;
    min-height: 5.2rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--cms-tree-colour) 28%, #ffffff 72%);
    border-radius: 8px;
    padding: 0;
    color: #fff;
    background:
        linear-gradient(135deg, var(--cms-tree-colour), color-mix(in srgb, var(--cms-tree-colour) 54%, #050505 46%)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
    box-shadow: 0 0.85rem 1.9rem rgba(20, 17, 11, 0.12);
    isolation: isolate;
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.has-image {
    background-position: center;
    background-size: cover;
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card:hover {
    border-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-2px);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-selected {
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 3px rgba(138, 104, 29, 0.26), 0 1.35rem 3rem rgba(20, 17, 11, 0.2);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card > a {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    padding: 0.85rem 5.15rem 0.85rem 1rem;
    color: inherit;
    text-decoration: none;
}

.cms-page-card-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.54)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.22), transparent 12rem);
    pointer-events: none;
}

.cms-page-card-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.55rem;
    padding-right: 2.85rem;
}

.website-pages-shell:not(.is-editor-open) .cms-page-card-meta {
    display: none;
}

.cms-page-card-meta small {
    min-width: 0;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.72rem;
    font-weight: 850;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-homepage-badge {
    display: inline-flex;
    min-height: 1.55rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.44);
    border-radius: 999px;
    padding: 0 0.58rem;
    color: #2d2108;
    background: rgba(255, 255, 255, 0.9);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 0.45rem 1rem rgba(0, 0, 0, 0.12);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-homepage .cms-row-actions {
    display: none;
}

.cms-page-card-titleline {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.55rem;
}

.cms-page-home-mark {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 1.9rem;
    align-items: center;
    gap: 0.32rem;
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 999px;
    padding: 0 0.62rem 0 0.5rem;
    color: #2d2108;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0.55rem 1.15rem rgba(0, 0, 0, 0.14);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    text-shadow: none;
}

.cms-page-home-icon {
    position: relative;
    display: block;
    width: 0.86rem;
    height: 0.72rem;
    border: 0.13rem solid currentColor;
    border-top: 0;
    border-radius: 0.1rem 0.1rem 0.16rem 0.16rem;
}

.cms-page-home-icon:before {
    content: "";
    position: absolute;
    left: 50%;
    top: -0.42rem;
    width: 0.6rem;
    height: 0.6rem;
    border-top: 0.13rem solid currentColor;
    border-left: 0.13rem solid currentColor;
    transform: translateX(-50%) rotate(45deg);
}

.cms-page-home-icon:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -0.13rem;
    width: 0.2rem;
    height: 0.36rem;
    border-radius: 0.08rem 0.08rem 0 0;
    background: currentColor;
    transform: translateX(-50%);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card strong {
    display: block;
    min-width: 0;
    overflow: visible;
    color: #fff;
    font-size: clamp(1.08rem, 2vw, 1.34rem);
    line-height: 1;
    font-weight: 950;
    text-overflow: initial;
    white-space: normal;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card .cms-row-actions {
    position: absolute;
    top: 50%;
    right: 0.72rem;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 0.16rem;
    background: rgba(0, 0, 0, 0.18);
    box-shadow: 0 0.65rem 1.4rem rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(12px);
    transform: translateY(-50%);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card .cms-arrow-button {
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card .cms-page-parent-icon {
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child {
    min-height: 4.7rem;
    margin-left: 0;
    border-color: color-mix(in srgb, var(--cms-tree-colour) 28%, #ffffff 72%);
    color: #fff;
    background:
        linear-gradient(135deg, var(--cms-tree-colour), color-mix(in srgb, var(--cms-tree-colour) 54%, #050505 46%)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.2), transparent 10rem);
    box-shadow: 0 0.72rem 1.5rem rgba(20, 17, 11, 0.1);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child .cms-page-card-shade {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.42)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.18), transparent 10rem);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child .cms-page-card-titleline {
    padding-left: 0.2rem;
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child strong {
    color: #fff;
    font-size: clamp(0.96rem, 1.55vw, 1.12rem);
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.38);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child.has-image strong {
    color: #fff;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.46), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.46);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child.has-image .cms-page-card-shade {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.62)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.16), transparent 10rem);
}

:root[data-theme="dark"] .website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child {
    background:
        linear-gradient(135deg, var(--cms-tree-colour), color-mix(in srgb, var(--cms-tree-colour) 48%, #050505 52%)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.16), transparent 10rem);
}

.landing-page-card {
    min-width: 0;
}

.landing-page-card a {
    position: relative;
    display: flex;
    min-height: 12.5rem;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 0.85rem;
    color: #fff;
    background:
        var(--banner-gold-gradient),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.16);
    text-decoration: none;
    isolation: isolate;
    transform: translateY(0);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.landing-page-card.has-image a {
    background-image:
        linear-gradient(180deg, rgba(10, 13, 20, 0.16), rgba(10, 13, 20, 0.78)),
        var(--landing-card-image);
    background-position: center;
    background-size: cover;
}

.landing-page-card a:hover {
    border-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-2px);
}

.landing-page-card.is-selected a {
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 3px rgba(138, 104, 29, 0.26), 0 1.35rem 3rem rgba(20, 17, 11, 0.2);
}

.landing-page-card-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.54)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.22), transparent 12rem);
    pointer-events: none;
}

.landing-page-card-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.55rem;
}

.landing-page-card-meta small {
    min-width: 0;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.72rem;
    font-weight: 850;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-page-status {
    display: inline-flex;
    min-height: 1.45rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    padding: 0 0.55rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    font-size: 0.66rem;
    font-weight: 950;
    text-transform: capitalize;
    backdrop-filter: blur(10px);
}

.landing-page-status.is-published {
    background: rgba(47, 125, 80, 0.42);
}

.landing-page-status.is-archived {
    background: rgba(105, 112, 133, 0.42);
}

.landing-page-card strong {
    display: block;
    color: #fff;
    font-size: clamp(1.15rem, 3vw, 1.75rem);
    line-height: 1;
    font-weight: 950;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.landing-page-card-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.85rem;
}

.landing-page-card-footer strong {
    flex: 1 1 auto;
    min-width: 0;
}

.landing-page-view-count {
    display: inline-flex;
    flex: 0 0 auto;
    min-width: 4.6rem;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 8px;
    padding: 0.42rem 0.52rem;
    color: #fff;
    background: rgba(7, 9, 14, 0.34);
    box-shadow: 0 0.9rem 1.9rem rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(12px);
}

.landing-page-view-count span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.58rem;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
}

.landing-page-view-count b {
    color: #fff;
    font-size: 1rem;
    line-height: 1;
    font-weight: 950;
    text-shadow: 0 0.12rem 0.18rem rgba(0, 0, 0, 0.34);
}

@media (min-width: 880px) {
    .website-pages-shell:not(.is-editor-open) {
        display: block;
    }

    .website-pages-shell:not(.is-editor-open) .cms-side-column {
        width: 100%;
        min-height: calc(100dvh - 4rem);
    }

    .website-pages-shell:not(.is-editor-open) .cms-pages-panel {
        min-height: calc(100dvh - 4rem);
    }

    .website-pages-shell:not(.is-editor-open) .cms-page-tree {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.78rem;
        align-items: start;
    }

    .website-pages-shell:not(.is-editor-open) .cms-page-family {
        border: 0;
        border-radius: 0;
        padding: 0;
        background: transparent;
        box-shadow: none;
    }

    .website-pages-shell:not(.is-editor-open) .cms-page-row.is-child {
        margin-left: calc(var(--cms-depth, 1) * 0.55rem);
    }
}

.blog-post-list {
    display: grid;
    gap: 0.62rem;
}

.blog-post-tile {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: stretch;
    border: 1px solid rgba(15, 118, 110, 0.14);
    border-radius: 8px;
    padding: 0.55rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.08), transparent 44%),
        rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.75rem 1.55rem rgba(31, 42, 68, 0.06);
    text-decoration: none;
}

.blog-post-tile.is-selected,
.blog-post-tile:hover {
    border-color: rgba(15, 118, 110, 0.34);
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.13), transparent 48%),
        rgba(255, 255, 255, 0.9);
}

.blog-post-tile img,
.blog-cover-placeholder {
    width: 100%;
    min-height: 5rem;
    border-radius: 7px;
    background: rgba(15, 118, 110, 0.1);
    object-fit: cover;
}

.blog-cover-placeholder {
    display: grid;
    place-items: center;
    color: #0b5752;
}

.blog-post-tile > div {
    display: grid;
    gap: 0.32rem;
    align-content: center;
    min-width: 0;
}

.blog-post-tile strong,
.blog-post-tile p,
.blog-post-tile small {
    overflow: hidden;
    text-overflow: ellipsis;
}

.blog-post-tile strong {
    white-space: nowrap;
}

.blog-post-tile p {
    display: -webkit-box;
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.blog-post-tile small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.blog-cover-editor {
    display: grid;
    gap: 0.85rem;
    align-items: stretch;
    margin-bottom: 1rem;
}

.blog-cover-preview {
    display: grid;
    min-height: 12rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(15, 118, 110, 0.16);
    border-radius: 8px;
    color: #0b5752;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.11), transparent 48%),
        rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
}

.blog-cover-preview img {
    width: 100%;
    height: 100%;
    min-height: 12rem;
    object-fit: cover;
}

.blog-cover-controls {
    display: grid;
    gap: 0.62rem;
    align-content: start;
}

.blog-cover-controls label,
.blog-editor-grid label,
.blog-editor-grid .ai-assist-field {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.blog-cover-file-field small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
}

.blog-cover-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.blog-cover-upload-button,
.blog-cover-remove-button,
.blog-ai-open-button {
    display: inline-flex;
    width: auto;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.blog-cover-upload-button {
    min-width: 11rem;
}

.blog-cover-upload-button .action-icon,
.blog-cover-remove-button .action-icon,
.blog-ai-open-button .action-icon {
    position: relative;
    display: block;
    width: 1rem;
    height: 1rem;
    color: currentColor;
}

.blog-cover-upload-button .action-icon:before,
.blog-cover-upload-button .action-icon:after,
.blog-cover-remove-button .action-icon:before,
.blog-cover-remove-button .action-icon:after,
.blog-ai-open-button .action-icon:before,
.blog-ai-open-button .action-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.blog-editor-ai-actions {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.blog-content-label-row {
    display: flex;
    min-height: 2.05rem;
    gap: 0.55rem;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.cms-field-label-row {
    display: flex;
    min-height: 2.05rem;
    gap: 0.55rem;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.blog-content-ai-button {
    min-height: 2.35rem;
    padding: 0.52rem 0.82rem;
    border-radius: 8px;
    font-size: 0.76rem;
    line-height: 1;
    white-space: nowrap;
}

.cms-field-ai-button {
    min-height: 2.35rem;
    padding: 0.52rem 0.82rem;
    border-radius: 8px;
    font-size: 0.76rem;
    line-height: 1;
    white-space: nowrap;
}

.blog-content-ai-button .action-icon {
    display: none;
}

.cms-field-ai-button .action-icon {
    display: none;
}

.blog-content-ai-button .action-icon:before,
.blog-content-ai-button .action-icon:after,
.cms-field-ai-button .action-icon:before,
.cms-field-ai-button .action-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.blog-content-field {
    min-height: 22rem;
    resize: vertical;
}

.cms-ai-modal-card,
.blog-ai-modal-card {
    width: min(44rem, 100%);
}

.cms-ai-prompt,
.blog-ai-prompt {
    min-height: 10rem;
    resize: vertical;
}

.social-platform-panel {
    gap: 0.85rem;
}

.social-status-shell:not(.is-editor-open) .cms-side-column {
    min-height: 0;
}

.social-platform-panel .panel-head strong {
    display: block;
    margin-top: 0.12rem;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 900;
}

.social-platform-grid {
    display: grid;
    gap: 0.72rem;
}

@media (min-width: 48rem) {
    .social-platform-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 72rem) {
    .social-platform-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.social-platform-card {
    --platform-color: #334155;
    --platform-color-dark: #111827;
    display: grid;
    gap: 0.62rem;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 8px;
    padding: 0.95rem;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.2), transparent 42%),
        linear-gradient(135deg, var(--platform-color), var(--platform-color-dark));
    box-shadow: 0 0.9rem 1.8rem rgba(20, 17, 11, 0.14);
}

.social-platform-card.is-facebook {
    --platform-color: #1877f2;
    --platform-color-dark: #0b4fb3;
}

.social-platform-card.is-instagram {
    --platform-color: #833ab4;
    --platform-color-dark: #fd1d1d;
    background:
        radial-gradient(circle at 18% 100%, #fdf497 0 10%, #fd5949 31%, transparent 32%),
        radial-gradient(circle at 88% 0%, #285aeb 0 15%, transparent 18%),
        linear-gradient(135deg, #833ab4, #fd1d1d 52%, #fcb045);
}

.social-platform-card.is-linkedin {
    --platform-color: #0a66c2;
    --platform-color-dark: #064780;
}

.social-platform-card.is-x {
    --platform-color: #111;
    --platform-color-dark: #000;
}

.social-platform-card.is-tiktok {
    --platform-color: #010101;
    --platform-color-dark: #fe2c55;
}

.social-platform-card.is-youtube {
    --platform-color: #ff0000;
    --platform-color-dark: #9d0000;
}

.social-platform-card.is-pinterest {
    --platform-color: #e60023;
    --platform-color-dark: #8c0015;
}

.social-platform-card.is-threads {
    --platform-color: #27272a;
    --platform-color-dark: #050505;
}

.social-platform-card.is-inactive {
    --platform-color: #8b949e;
    --platform-color-dark: #59616b;
    border-color: rgba(148, 163, 184, 0.42);
    color: #f8fafc;
    filter: grayscale(0.72);
    box-shadow: 0 0.55rem 1.1rem rgba(20, 17, 11, 0.08);
}

.social-platform-card.is-inactive .platform-avatar,
.social-platform-card.is-inactive .social-platform-stat,
.social-platform-card.is-inactive .social-platform-link {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.1);
}

.social-platform-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.social-platform-card .platform-avatar {
    width: 2.7rem;
    height: 2.7rem;
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.28);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.25), 0 0.5rem 1.1rem rgba(0, 0, 0, 0.16);
}

.social-status-shell.is-editor-open .cms-editor-head,
.social-status-shell.is-editor-open .cms-editor-panel > .notice-panel,
.social-status-shell.is-editor-open .social-post-editor-grid {
    width: min(86rem, 100%);
    margin-right: auto;
    margin-left: auto;
}

.social-post-editor-grid {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.social-post-editor-main,
.social-post-editor-aside {
    display: grid;
    gap: 1rem;
    align-content: start;
    min-width: 0;
}

.editor-form-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.85rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 10px;
    padding: clamp(0.9rem, 1.6vw, 1.1rem);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(250, 247, 238, 0.72)),
        rgba(255, 255, 255, 0.7);
    box-shadow: 0 1rem 2.2rem rgba(20, 17, 11, 0.08);
}

.editor-form-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    min-width: 0;
}

.editor-form-card-head strong {
    display: block;
    margin-top: 0.12rem;
    color: var(--ink);
    font-size: 1.02rem;
    line-height: 1.12;
    font-weight: 950;
}

.editor-form-card label:not(.toggle-field),
.editor-form-card .ai-assist-field,
.social-repeat-group {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.social-editor-detail-grid {
    display: grid;
    gap: 0.72rem;
}

.social-approval-toggle {
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 0 0.85rem;
    background: rgba(255, 255, 255, 0.62);
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 900;
}

.social-editor-copy-card textarea.input-control {
    min-height: 18rem;
    resize: vertical;
}

.social-channel-picker {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.72rem;
    margin-inline: -0.2rem;
    padding: 0.35rem;
    overflow-x: auto;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(var(--brand-rgb), 0.94), rgba(57, 154, 103, 0.88)),
        var(--brand);
    box-shadow: 0 16px 36px rgba(70, 52, 15, 0.14);
}

.social-channel-picker .field-group-label {
    flex: 0 0 auto;
    margin-right: 0.16rem;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.66rem;
    letter-spacing: 0.08em;
}

.social-channel-choice {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 0.22rem;
    min-height: 1.65rem;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 999px;
    padding: 0.18rem 0.28rem;
    background: rgba(255, 255, 255, 0.82);
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 920;
    box-shadow: 0 8px 18px rgba(47, 34, 9, 0.08);
    transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.editor-form-card .social-channel-picker .social-channel-choice {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-template-columns: none;
    height: 1.65rem;
}

.social-channel-choice input {
    width: 0.74rem;
    height: 0.74rem;
    margin: 0;
    accent-color: var(--accent);
}

.social-channel-choice .social-platform-glyph,
.social-channel-choice .platform-avatar,
.social-channel-logo {
    flex: 0 0 1.12rem;
    width: 1.12rem;
    height: 1.12rem;
}

.social-channel-choice .platform-avatar,
.social-channel-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 950;
}

.social-channel-name {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.social-channel-choice.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

@supports selector(.social-channel-choice:has(input:checked)) {
    .social-channel-choice:has(input:checked) {
        border-color: rgba(255, 255, 255, 0.72);
        background: #ffffff;
        box-shadow: 0 12px 28px rgba(47, 34, 9, 0.16), inset 0 0 0 2px rgba(57, 154, 103, 0.28);
        transform: translateY(-1px);
    }
}

.social-channel-logo.is-x {
    background: #111;
}

.social-channel-logo.is-x:before {
    content: "X";
}

.social-channel-logo.is-tiktok {
    background: linear-gradient(135deg, #25f4ee 0 18%, #010101 19% 74%, #fe2c55 75%);
}

.social-channel-logo.is-tiktok:before {
    content: "♪";
    font-size: 0.9rem;
    line-height: 1;
}

.social-channel-logo.is-youtube {
    border-radius: 0.34rem;
    background: #ff0033;
}

.social-channel-logo.is-youtube:before {
    content: "";
    width: 0;
    height: 0;
    margin-left: 0.08rem;
    border-top: 0.22rem solid transparent;
    border-bottom: 0.22rem solid transparent;
    border-left: 0.36rem solid #fff;
}

.social-channel-logo.is-pinterest {
    background: #e60023;
}

.social-channel-logo.is-pinterest:before {
    content: "P";
    font-family: Georgia, serif;
    font-size: 0.86rem;
}

.social-channel-logo.is-threads {
    background: #111;
}

.social-channel-logo.is-threads:before {
    content: "@";
    font-size: 0.86rem;
}

.social-media-tabs {
    display: grid;
    gap: 0.72rem;
}

.social-media-tab-radio {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.social-media-tab-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.social-media-tab-list label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 0.45rem;
    background: rgba(255, 255, 255, 0.66);
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 920;
    text-align: center;
    cursor: pointer;
}

.social-media-panel {
    display: none;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 0.72rem;
    background: rgba(255, 255, 255, 0.55);
}

#media-kind-text:checked ~ .social-media-tab-list label[for="media-kind-text"],
#media-kind-image:checked ~ .social-media-tab-list label[for="media-kind-image"],
#media-kind-carousel:checked ~ .social-media-tab-list label[for="media-kind-carousel"],
#media-kind-video:checked ~ .social-media-tab-list label[for="media-kind-video"] {
    border-color: rgba(57, 154, 103, 0.38);
    background: rgba(57, 154, 103, 0.12);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px rgba(57, 154, 103, 0.14);
}

#media-kind-text:checked ~ .social-media-panel.is-text,
#media-kind-image:checked ~ .social-media-panel.is-image,
#media-kind-carousel:checked ~ .social-media-panel.is-carousel,
#media-kind-video:checked ~ .social-media-panel.is-video {
    display: grid;
    gap: 0.6rem;
}

.social-media-panel select[multiple] {
    min-height: 9rem;
}

.social-video-upload-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: end;
    padding: 0.75rem;
    border: 1px solid rgba(57, 154, 103, 0.16);
    border-radius: var(--radius);
    background: rgba(57, 154, 103, 0.08);
}

.social-video-upload-box .button-soft {
    min-height: 2.75rem;
    white-space: nowrap;
}

.social-repeat-group {
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 0.72rem;
    background: rgba(255, 255, 255, 0.55);
}

.social-timing-toggle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 0.35rem;
    background: rgba(255, 255, 255, 0.66);
}

.social-timing-toggle input {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.social-timing-toggle label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.4rem;
    border-radius: calc(var(--radius) - 4px);
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 950;
    cursor: pointer;
}

.social-timing-toggle input:checked + input + label,
.social-timing-toggle input:nth-of-type(2):checked ~ label:nth-of-type(2) {
    background: rgba(57, 154, 103, 0.14);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px rgba(57, 154, 103, 0.24);
}

.social-scheduled-fields {
    display: grid;
    gap: 0.72rem;
}

.social-editor-schedule-card.is-post-now .social-scheduled-fields,
.social-scheduled-fields.is-disabled {
    opacity: 0.48;
}

.social-editor-schedule-card.is-post-now .social-scheduled-fields {
    pointer-events: none;
}

.field-group-label {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.social-repeat-fields {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(5.8rem, 0.72fr);
    gap: 0.55rem;
}

.social-repeat-fields label {
    min-width: 0;
}

.editor-form-card .notice-panel {
    margin: 0;
    box-shadow: none;
}

.social-editor-schedule-card .social-schedule-callout {
    align-items: stretch;
    flex-direction: column;
}

.social-editor-schedule-card .social-schedule-callout .button-primary {
    width: 100%;
}

.social-editor-actions {
    flex: 0 0 auto;
}

.social-schedule-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: var(--radius);
    padding: 0.78rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(248, 245, 235, 0.76)),
        rgba(255, 255, 255, 0.7);
}

.social-schedule-callout div {
    display: grid;
    gap: 0.16rem;
}

.social-schedule-callout strong {
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 950;
}

.social-schedule-callout span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 760;
}

.social-action-feedback {
    display: grid;
    gap: 0.5rem;
}

.social-action-feedback .notice-panel {
    margin: 0;
}

@media (max-width: 680px) {
    .social-schedule-callout {
        align-items: stretch;
        flex-direction: column;
    }

    .social-schedule-callout .button-primary {
        width: 100%;
    }
}

@media (min-width: 48rem) {
    .social-editor-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .social-editor-detail-grid .is-title {
        grid-column: 1 / -1;
    }
}

@media (min-width: 64rem) {
    .social-post-editor-grid {
        grid-template-columns: minmax(0, 1.48fr) minmax(19rem, 0.82fr);
    }
}

@media (max-width: 32rem) {
    .social-video-upload-box,
    .social-repeat-fields {
        grid-template-columns: 1fr;
    }
}

:root[data-theme="dark"] .editor-form-card {
    border-color: rgba(222, 205, 158, 0.14);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(222, 205, 158, 0.08)),
        var(--panel);
}

:root[data-theme="dark"] .social-approval-toggle,
:root[data-theme="dark"] .social-repeat-group {
    border-color: rgba(222, 205, 158, 0.14);
    background: rgba(255, 255, 255, 0.05);
}

.social-platform-action.is-facebook {
    color: #fff;
    background: #1877f2;
    box-shadow: 0 0.45rem 1rem rgba(24, 119, 242, 0.24), inset 0 0.08rem 0 rgba(255, 255, 255, 0.22);
}

.social-platform-action.is-instagram {
    color: #fff;
    background:
        radial-gradient(circle at 30% 108%, #fdf497 0 18%, #fd5949 42%, transparent 43%),
        radial-gradient(circle at 78% 0%, #285aeb 0 18%, transparent 22%),
        linear-gradient(135deg, #833ab4, #fd1d1d 52%, #fcb045);
    box-shadow: 0 0.45rem 1rem rgba(225, 48, 108, 0.24), inset 0 0.08rem 0 rgba(255, 255, 255, 0.22);
}

.social-platform-action.is-linkedin {
    color: #fff;
    background: #0a66c2;
    box-shadow: 0 0.45rem 1rem rgba(10, 102, 194, 0.24), inset 0 0.08rem 0 rgba(255, 255, 255, 0.22);
}

.social-platform-action.is-facebook:hover,
.social-platform-action.is-instagram:hover,
.social-platform-action.is-linkedin:hover {
    color: #fff;
    box-shadow: 0 0.7rem 1.25rem rgba(20, 17, 11, 0.2), inset 0 0.08rem 0 rgba(255, 255, 255, 0.25);
}

.social-platform-glyph {
    position: relative;
    display: block;
    width: 1.08rem;
    height: 1.08rem;
    color: #fff;
}

.social-platform-glyph:before,
.social-platform-glyph:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.social-platform-glyph.is-facebook:before {
    content: "f";
    inset: auto;
    left: 50%;
    bottom: -0.18rem;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1;
    transform: translateX(-43%);
}

.social-platform-glyph.is-instagram {
    border: 0.13rem solid #fff;
    border-radius: 0.32rem;
}

.social-platform-glyph.is-instagram:before {
    inset: 0.26rem;
    border: 0.12rem solid #fff;
    border-radius: 999px;
}

.social-platform-glyph.is-instagram:after {
    top: 0.18rem;
    right: 0.18rem;
    width: 0.15rem;
    height: 0.15rem;
    border-radius: 999px;
    background: #fff;
}

.social-platform-glyph.is-linkedin:before {
    content: "in";
    inset: auto;
    left: 50%;
    top: 50%;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
    transform: translate(-50%, -50%);
}

.social-channel-choice .social-platform-glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0.24rem 0.7rem rgba(20, 17, 11, 0.16);
}

.social-channel-choice .social-platform-glyph.is-facebook {
    border-radius: 50%;
    background: #1877f2;
}

.social-channel-choice .social-platform-glyph.is-instagram {
    border: 0;
    border-radius: 0.42rem;
    background:
        radial-gradient(circle at 30% 108%, #fdf497 0 18%, #fd5949 42%, transparent 43%),
        radial-gradient(circle at 78% 0%, #285aeb 0 18%, transparent 22%),
        linear-gradient(135deg, #833ab4, #fd1d1d 52%, #fcb045);
}

.social-channel-choice .social-platform-glyph.is-instagram:before {
    inset: 0.34rem;
    border-width: 0.1rem;
}

.social-channel-choice .social-platform-glyph.is-instagram:after {
    top: 0.28rem;
    right: 0.28rem;
}

.social-channel-choice .social-platform-glyph.is-linkedin {
    border-radius: 0.3rem;
    background: #0a66c2;
}

.social-platform-status {
    display: inline-flex;
    min-height: 1.8rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    padding: 0 0.62rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
    font-size: 0.72rem;
    font-weight: 900;
}

.social-platform-status.is-due {
    border-color: rgba(255, 255, 255, 0.74);
    color: #7a271f;
    background: #fff;
    box-shadow: 0 0.55rem 1.15rem rgba(0, 0, 0, 0.12);
}

.social-platform-status.is-on-track {
    border-color: rgba(255, 255, 255, 0.48);
    background: rgba(15, 118, 110, 0.34);
}

.social-platform-status.is-messaging {
    border-color: rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.2);
}

.social-platform-status.is-inactive {
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(15, 23, 42, 0.18);
}

.social-platform-card h3 {
    margin: 0;
    color: #fff;
    font-size: 1.15rem;
    line-height: 1.1;
}

.social-platform-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.82rem;
    line-height: 1.42;
}

.social-platform-stat {
    display: grid;
    gap: 0.1rem;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 8px;
    padding: 0.58rem 0.65rem;
    background: rgba(255, 255, 255, 0.14);
}

.social-platform-stat span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.social-platform-stat strong {
    color: #fff;
    font-size: 0.92rem;
    font-weight: 950;
}

.social-platform-guidance {
    font-weight: 820;
}

.social-platform-link {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.36);
    border-radius: 999px;
    padding: 0.58rem 0.82rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
}

button.social-platform-link {
    cursor: pointer;
}

.social-platform-link:hover {
    background: rgba(255, 255, 255, 0.24);
    transform: translateY(-1px);
}

.quick-scheduler-page {
    display: grid;
    gap: 1rem;
}

.quick-scheduler-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-color: rgba(138, 104, 29, 0.16);
    padding-block: 0.8rem;
    background:
        radial-gradient(circle at top left, rgba(138, 104, 29, 0.15), transparent 38%),
        rgba(255, 255, 255, 0.82);
}

.quick-scheduler-hero h1 {
    margin: 0;
    font-size: clamp(1.65rem, 4vw, 2.7rem);
    line-height: 1;
}

.quick-scheduler-hero p {
    max-width: 42rem;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.quick-scheduler-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(18rem, 0.65fr);
    gap: 1rem;
    align-items: start;
}

.quick-scheduler-card,
.quick-scheduler-side {
    display: grid;
    gap: 1rem;
}

.quick-slot-card {
    display: grid;
    gap: 0.35rem;
    border-radius: 8px;
    padding: 1rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand-deep), #3a2a0d);
    box-shadow: 0 1rem 2rem rgba(61, 43, 12, 0.2);
}

.quick-slot-card .eyebrow,
.quick-slot-card small {
    color: rgba(255, 255, 255, 0.82);
}

.quick-slot-card strong {
    font-size: clamp(1.35rem, 3vw, 2.3rem);
    line-height: 1.04;
}

.quick-image-dropzone {
    min-height: 13rem;
}

.quick-scheduler-submit {
    justify-content: center;
    min-height: 3.35rem;
    width: 100%;
}

.quick-channel-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.55rem;
}

.quick-channel-chip {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.78rem;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 900;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    background: #2f6eea;
    box-shadow: 0 0.55rem 1rem rgba(20, 18, 12, 0.11);
}

.quick-channel-chip.is-instagram {
    background: linear-gradient(135deg, #6d39d9, #d3357d 55%, #f0a13a);
}

.quick-channel-chip.is-muted {
    color: var(--ink);
    text-shadow: none;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(138, 104, 29, 0.16);
}

.quick-scheduler-note {
    display: grid;
    gap: 0.35rem;
    border-left: 0.25rem solid var(--brand);
    padding: 0.1rem 0 0.1rem 0.85rem;
}

.quick-scheduler-note p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.batch-scheduler-panel {
    display: grid;
    gap: 1rem;
}

.batch-scheduler-topline,
.batch-scheduler-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.batch-dropzone {
    min-height: 11rem;
}

.batch-settings-panel {
    display: grid;
    grid-template-columns: minmax(12rem, 0.35fr) minmax(0, 1fr);
    gap: 0.85rem;
    align-items: end;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.85rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), transparent 58%),
        rgba(255, 255, 255, 0.78);
}

.batch-settings-copy {
    min-height: 2.65rem;
    display: flex;
    align-items: center;
    border-radius: 8px;
    padding: 0.7rem 0.85rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.7);
    font-size: 0.84rem;
    font-weight: 850;
    line-height: 1.35;
}

.batch-empty-state {
    display: grid;
    min-height: 4.2rem;
    place-items: center;
    border: 1px dashed rgba(138, 104, 29, 0.2);
    border-radius: 8px;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.58);
    font-weight: 850;
}

.batch-empty-state[hidden] {
    display: none;
}

.batch-scheduler-list {
    display: grid;
    gap: 0.75rem;
}

.batch-scheduler-row {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    gap: 0.85rem;
    align-items: stretch;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 0.8rem 1.6rem rgba(20, 18, 12, 0.07);
}

.batch-preview {
    overflow: hidden;
    border-radius: 7px;
    background: rgba(20, 18, 12, 0.06);
}

.batch-preview img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 7rem;
    object-fit: cover;
}

.batch-row-fields {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.batch-row-timing {
    display: grid;
    grid-template-columns: minmax(9rem, 1fr) minmax(7rem, 0.5fr);
    gap: 0.55rem;
}

.batch-row-meta {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.batch-scheduler-footer {
    position: sticky;
    bottom: 0.8rem;
    z-index: 2;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 999px;
    padding: 0.65rem 0.75rem 0.65rem 1rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 0.9rem 2rem rgba(20, 18, 12, 0.12);
}

.batch-scheduler-footer span {
    color: var(--ink);
    font-size: 0.84rem;
    font-weight: 900;
}

.marketing-calendar-page {
    display: grid;
    gap: 1rem;
}

.marketing-calendar-hero {
    display: grid;
    gap: 0.75rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.68);
    border-radius: 8px;
    padding: 0.8rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), transparent 46%),
        rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
}

.marketing-calendar-title-row {
    display: grid;
    gap: 0.65rem;
    align-items: end;
}

.marketing-calendar-hero h1 {
    margin: 0;
    font-size: clamp(1.65rem, 4vw, 2.7rem);
    line-height: 1;
}

.marketing-calendar-hero p {
    max-width: 45rem;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.marketing-calendar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.marketing-calendar-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.12rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0.18rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(248, 245, 235, 0.7)),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.55rem 1.1rem rgba(138, 104, 29, 0.08);
}

.marketing-calendar-view-toggle a {
    display: inline-flex;
    min-height: 2.18rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.82rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
}

.marketing-calendar-view-toggle a.is-active {
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.45rem 0.95rem rgba(52, 35, 6, 0.18);
}

.marketing-calendar-actions > strong {
    display: inline-flex;
    min-height: 2.55rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 0.95rem;
    background: rgba(255, 255, 255, 0.78);
    font-size: 0.88rem;
    font-weight: 900;
}

.marketing-calendar-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.marketing-calendar-summary div {
    display: grid;
    gap: 0.18rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.62);
}

.marketing-calendar-summary span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.marketing-calendar-summary strong {
    color: var(--ink);
    font-size: 1.45rem;
    font-weight: 950;
}

.marketing-calendar-panel {
    display: grid;
    gap: 0.9rem;
    overflow: hidden;
}

.marketing-calendar-panel-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
}

.marketing-calendar-panel-head strong {
    display: block;
    margin-top: 0.15rem;
    font-size: 1.1rem;
    font-weight: 950;
}

.marketing-calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
}

.marketing-calendar-legend span {
    --post-color: #64748b;
    display: inline-flex;
    min-height: 1.9rem;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--post-color), #fff 68%);
    border-radius: 999px;
    padding: 0 0.68rem;
    color: var(--post-color);
    background: color-mix(in srgb, var(--post-color), transparent 88%);
    font-size: 0.72rem;
    font-weight: 900;
}

.marketing-calendar-frame {
    overflow-x: auto;
    padding-bottom: 0.25rem;
}

.marketing-calendar-grid {
    display: grid;
    min-width: 54rem;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.52);
}

.marketing-calendar-grid.is-week-view {
    min-width: 64rem;
}

.marketing-calendar-weekday {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 0.62rem 0.7rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.marketing-calendar-weekday:nth-child(7) {
    border-right: 0;
}

.marketing-calendar-day {
    display: grid;
    min-height: 9.2rem;
    align-content: start;
    gap: 0.52rem;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 0.62rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.46));
}

.marketing-calendar-grid.is-week-view .marketing-calendar-day {
    min-height: 28rem;
}

.marketing-calendar-day:nth-child(7n) {
    border-right: 0;
}

.marketing-calendar-day:nth-last-child(-n + 7) {
    border-bottom: 0;
}

.marketing-calendar-day.is-muted {
    background: rgba(239, 237, 231, 0.5);
}

.marketing-calendar-day.is-today {
    box-shadow: inset 0 0 0 2px rgba(138, 104, 29, 0.28);
}

.marketing-calendar-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.marketing-calendar-day-head span {
    display: grid;
    width: 1.85rem;
    height: 1.85rem;
    place-items: center;
    border-radius: 999px;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 950;
}

.marketing-calendar-day.is-today .marketing-calendar-day-head span {
    color: #fff;
    background: var(--banner-gold-gradient);
}

.marketing-calendar-day-head em {
    color: var(--brand-deep);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 900;
}

.marketing-calendar-events {
    display: grid;
    gap: 0.4rem;
}

.marketing-calendar-post-card {
    position: relative;
    min-width: 0;
}

.marketing-calendar-post {
    --post-color: #64748b;
    display: grid;
    gap: 0.12rem;
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--post-color), #fff 58%);
    border-left: 0.28rem solid var(--post-color);
    border-radius: 8px;
    padding: 0.5rem 0.55rem;
    color: var(--ink);
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--post-color), transparent 88%), rgba(255, 255, 255, 0.72));
    text-decoration: none;
    box-shadow: 0 0.35rem 0.9rem rgba(20, 17, 11, 0.06);
}

.marketing-calendar-post-card.has-delete .marketing-calendar-post {
    padding-right: 1.85rem;
}

.marketing-calendar-delete {
    position: absolute;
    top: 0.34rem;
    right: 0.34rem;
    display: inline-grid;
    place-items: center;
    width: 1.15rem;
    height: 1.15rem;
    border: 1px solid rgba(79, 86, 99, 0.18);
    border-radius: 999px;
    color: #4f5663;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 0.2rem 0.55rem rgba(20, 17, 11, 0.08);
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1;
    padding: 0;
}

.marketing-calendar-delete:hover,
.marketing-calendar-delete:focus {
    border-color: rgba(184, 49, 47, 0.35);
    color: #9f1d1d;
    background: #fff7f5;
}

.marketing-calendar-post:hover {
    transform: translateY(-1px);
    box-shadow: 0 0.55rem 1.15rem rgba(20, 17, 11, 0.1);
}

.marketing-calendar-post span,
.marketing-calendar-post em {
    overflow: hidden;
    color: color-mix(in srgb, var(--post-color), #111 22%);
    font-size: 0.62rem;
    font-style: normal;
    font-weight: 900;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.marketing-calendar-post strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.marketing-calendar-grid.is-week-view .marketing-calendar-post {
    gap: 0.18rem;
    padding: 0.7rem 0.72rem;
}

.marketing-calendar-grid.is-week-view .marketing-calendar-post strong {
    font-size: 0.86rem;
    white-space: normal;
}

.marketing-calendar-grid.is-week-view .marketing-calendar-post span,
.marketing-calendar-grid.is-week-view .marketing-calendar-post em {
    white-space: normal;
}

.marketing-calendar-post.is-scheduled {
    border-style: dashed;
    opacity: 0.82;
}

.marketing-calendar-post.is-facebook,
.marketing-calendar-legend .is-facebook {
    --post-color: #1877f2;
}

.marketing-calendar-post.is-instagram,
.marketing-calendar-legend .is-instagram {
    --post-color: #c13584;
}

.marketing-calendar-post.is-linkedin,
.marketing-calendar-legend .is-linkedin {
    --post-color: #0a66c2;
}

.marketing-calendar-post.is-x,
.marketing-calendar-legend .is-x {
    --post-color: #111827;
}

.marketing-calendar-post.is-tiktok,
.marketing-calendar-legend .is-tiktok {
    --post-color: #fe2c55;
}

.marketing-calendar-post.is-youtube,
.marketing-calendar-legend .is-youtube {
    --post-color: #ff0000;
}

.marketing-calendar-post.is-pinterest,
.marketing-calendar-legend .is-pinterest {
    --post-color: #e60023;
}

.marketing-calendar-post.is-threads,
.marketing-calendar-legend .is-threads {
    --post-color: #27272a;
}

.marketing-calendar-post.is-all,
.marketing-calendar-legend .is-all {
    --post-color: #8a681d;
}

.marketing-calendar-post.is-scheduled {
    --post-color: #8c929d;
    border-color: rgba(140, 146, 157, 0.34);
    border-left-color: #8c929d;
    color: #697085;
    background:
        linear-gradient(90deg, rgba(140, 146, 157, 0.12), rgba(255, 255, 255, 0.58));
    box-shadow: none;
    filter: grayscale(1);
}

.marketing-calendar-post.is-scheduled:hover {
    opacity: 1;
    box-shadow: 0 0.45rem 0.95rem rgba(20, 17, 11, 0.08);
}

.marketing-calendar-post.is-scheduled span,
.marketing-calendar-post.is-scheduled em {
    color: #7a808b;
}

.marketing-calendar-post.is-scheduled strong {
    color: #4f5663;
}

.marketing-calendar-empty {
    margin-top: 0.8rem;
}

.email-builder-page,
.email-campaign-page {
    display: grid;
    gap: 1rem;
}

.form-grid {
    display: grid;
    gap: 0.75rem;
}

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

.form-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.form-grid .wide,
.form-grid label.wide {
    grid-column: 1 / -1;
}

.form-grid label {
    display: grid;
    gap: 0.35rem;
    font-weight: 820;
}

.email-builder-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.email-campaign-command-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.email-builder-hero p,
.soft-helper {
    max-width: 54rem;
    margin: 0.35rem 0 0;
    color: var(--muted);
    line-height: 1.55;
}

.email-builder-actions,
.email-campaign-actions,
.email-template-starters,
.email-token-row {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.email-template-start-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.email-template-start-panel > div:first-child,
.email-template-sidebar-head {
    display: grid;
    gap: 0.2rem;
}

.email-template-start-panel strong,
.email-template-sidebar-head strong {
    color: var(--text);
}

.email-builder-layout,
.email-campaign-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(17rem, 24rem) minmax(0, 1fr);
    align-items: start;
}

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

.email-campaign-workspace {
    display: grid;
    gap: 1rem;
}

.email-campaign-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.email-campaign-overview-card {
    position: relative;
    display: grid;
    min-height: 12rem;
    align-content: space-between;
    gap: 0.65rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 1rem;
    color: #fff;
    background:
        linear-gradient(135deg, #8a681d, #3f2f10),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.22), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.16);
    isolation: isolate;
}

.email-campaign-overview-card:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.42)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.2), transparent 12rem);
    pointer-events: none;
}

.email-campaign-overview-card.is-audience {
    background: linear-gradient(135deg, #0f766e, #123f3b);
}

.email-campaign-overview-card.is-templates {
    background: linear-gradient(135deg, #765a82, #3b2c47);
}

.email-campaign-overview-card.is-campaigns {
    background: linear-gradient(135deg, #3f5f86, #172436);
}

.email-campaign-overview-card span,
.email-campaign-overview-card small {
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.78rem;
    font-weight: 820;
}

.email-campaign-overview-card span {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.email-campaign-overview-card strong {
    display: block;
    color: #fff;
    font-size: clamp(1.25rem, 3vw, 1.85rem);
    line-height: 1;
    font-weight: 950;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.email-campaign-overview-card .button-light {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 999px;
    padding: 0.45rem 0.82rem;
    width: fit-content;
    color: #21190a;
    background: rgba(255, 255, 255, 0.9);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}

.email-campaign-modal-card {
    width: min(64rem, 100%);
}

.email-delivery-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.email-campaign-autosave-status {
    width: fit-content;
    border-radius: 999px;
    padding: 0.42rem 0.68rem;
    background: color-mix(in srgb, var(--section-primary, var(--gold)) 10%, #fff);
    color: color-mix(in srgb, var(--section-primary, var(--gold)) 62%, #111 38%);
    font-size: 0.82rem;
    font-weight: 850;
}

.email-campaign-autosave-status.is-saving {
    color: #5f470f;
    background: #fff7dc;
}

.email-campaign-autosave-status.is-saved {
    color: #0f766e;
    background: #e8fbf7;
}

.email-campaign-autosave-status.is-error {
    color: #9f1d1d;
    background: #fff1ef;
}

.email-create-campaign-panel,
.email-campaign-list-panel {
    grid-column: 1 / -1;
}

.email-template-list,
.email-subscriber-list,
.email-campaign-list {
    display: grid;
    gap: 0.65rem;
}

.email-template-library-panel {
    display: grid;
    gap: 1rem;
}

.email-template-library-panel .panel-head {
    align-items: center;
}

.email-template-library-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.email-template-add-button {
    display: inline-grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 14px 30px rgba(36, 25, 7, 0.2);
    font: inherit;
    font-size: 1.55rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.email-template-add-button:hover,
.email-template-add-button:focus {
    box-shadow: 0 18px 38px rgba(36, 25, 7, 0.26);
    transform: translateY(-1px);
}

.email-template-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.9rem;
}

.email-template-list-card,
.email-subscriber-row,
.email-campaign-card {
    display: grid;
    gap: 0.25rem;
    border: 1px solid color-mix(in srgb, var(--section-primary, var(--gold)) 18%, transparent);
    border-radius: 10px;
    padding: 0.85rem;
    background: #fff;
    color: var(--text);
    text-decoration: none;
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.06);
}

.email-template-list-card.is-selected,
.email-campaign-card.is-sending,
.email-campaign-card.is-queued {
    background: linear-gradient(135deg, color-mix(in srgb, var(--section-primary, var(--gold)) 92%, #000 8%), color-mix(in srgb, var(--section-primary, var(--gold)) 58%, #000 42%));
    color: #fff;
}

.email-template-list-card.is-selected span,
.email-template-list-card.is-selected small,
.email-campaign-card.is-sending small,
.email-campaign-card.is-queued small {
    color: rgba(255, 255, 255, 0.82);
}

.email-template-list-card span,
.email-subscriber-row span,
.email-campaign-card small {
    color: var(--muted);
}

.email-template-list-card small,
.email-subscriber-row small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 750;
    text-transform: uppercase;
}

.email-template-card-grid .email-template-list-card {
    min-width: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
}

.email-template-card-grid .email-template-list-card a {
    position: relative;
    display: flex;
    min-height: 12rem;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 0.85rem;
    color: #fff;
    background:
        var(--banner-gold-gradient),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.22), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.16);
    text-decoration: none;
    isolation: isolate;
    transform: translateY(0);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.email-template-card-grid .email-template-list-card.is-tone-1 a {
    background: linear-gradient(135deg, #8a681d, #3f2f10);
}

.email-template-card-grid .email-template-list-card.is-tone-2 a {
    background: linear-gradient(135deg, #0f766e, #123f3b);
}

.email-template-card-grid .email-template-list-card.is-tone-3 a {
    background: linear-gradient(135deg, #2f7d50, #193f2b);
}

.email-template-card-grid .email-template-list-card.is-tone-4 a {
    background: linear-gradient(135deg, #765a82, #3b2c47);
}

.email-template-card-grid .email-template-list-card.is-tone-5 a {
    background: linear-gradient(135deg, #a65a45, #4f281f);
}

.email-template-card-grid .email-template-list-card.is-tone-6 a {
    background: linear-gradient(135deg, #3f5f86, #172436);
}

.email-template-card-grid .email-template-list-card a:hover,
.email-template-card-grid .email-template-list-card a:focus {
    border-color: rgba(255, 255, 255, 0.82);
    box-shadow: 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-2px);
}

.email-template-card-grid .email-template-list-card.is-selected a {
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 3px rgba(138, 104, 29, 0.26), 0 1.35rem 3rem rgba(20, 17, 11, 0.2);
}

.email-template-card-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.52)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.2), transparent 12rem);
    pointer-events: none;
}

.email-template-card-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.55rem;
}

.email-template-card-grid .email-template-card-meta small {
    min-width: 0;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.72rem;
    font-weight: 850;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.email-template-card-grid .email-template-list-card .landing-page-status {
    color: #fff;
}

.email-template-card-footer {
    display: grid;
    gap: 0.45rem;
}

.email-template-card-grid .email-template-card-footer strong {
    display: block;
    color: #fff;
    font-size: clamp(1.15rem, 3vw, 1.75rem);
    line-height: 1;
    font-weight: 950;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.email-template-card-grid .email-template-card-footer span {
    display: -webkit-box;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.email-template-empty {
    grid-column: 1 / -1;
}

.email-template-create-card {
    width: min(48rem, 100%);
}

.email-template-create-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.email-template-create-option {
    position: relative;
    display: grid;
    min-height: 9rem;
    align-content: end;
    gap: 0.55rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 1rem;
    color: #fff;
    background: linear-gradient(135deg, #8a681d, #3f2f10);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.16);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.email-template-create-option:before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.46)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.2), transparent 12rem);
    pointer-events: none;
}

.email-template-create-option span,
.email-template-create-option small {
    position: relative;
}

.email-template-create-option span {
    color: #fff;
    font-size: clamp(1.25rem, 3vw, 1.85rem);
    font-weight: 950;
    line-height: 1;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.email-template-create-option small {
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1.35;
}

.email-template-create-option.is-tone-2 {
    background: linear-gradient(135deg, #0f766e, #123f3b);
}

.email-template-create-option.is-tone-3 {
    background: linear-gradient(135deg, #2f7d50, #193f2b);
}

.email-template-create-option.is-tone-4 {
    background: linear-gradient(135deg, #765a82, #3b2c47);
}

.email-template-create-option:hover,
.email-template-create-option:focus {
    border-color: rgba(255, 255, 255, 0.82);
    box-shadow: 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-2px);
}

.email-subscriber-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.45rem;
}

.email-editor-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.85fr);
    align-items: start;
}

.email-template-editor-full {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.email-template-editor-full .cms-editor-bar {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    min-height: 3.65rem;
    border-radius: 8px;
    padding: 0.5rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 12px 34px rgba(138, 104, 29, 0.18);
}

.email-template-editor-full .cms-editor-back {
    color: #fff;
}

.email-template-editor-full .cms-preview-button {
    color: #fff;
}

.email-editor-head {
    margin-bottom: 0;
}

.email-editor-fields {
    display: grid;
    gap: 0.8rem;
}

.email-hidden-field {
    display: none;
}

.email-block-toolbar,
.email-block-card {
    display: grid;
    gap: 0.8rem;
    border: 1px solid color-mix(in srgb, var(--section-primary, var(--gold)) 20%, transparent);
    border-radius: 12px;
    padding: 1rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--section-primary, var(--gold)) 10%, #fff 90%), #fff);
}

.email-block-toolbar > div:first-child {
    display: grid;
    gap: 0.2rem;
}

.email-block-toolbar strong,
.email-block-card-head strong {
    color: var(--text);
    font-size: 1rem;
}

.email-block-add-row,
.email-block-card-head,
.email-autosave-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.email-block-add-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
}

.email-block-list,
.email-block-fields {
    display: grid;
    gap: 0.75rem;
}

.email-block-add-row button {
    position: relative;
    display: grid;
    min-height: 5.4rem;
    gap: 0.28rem;
    align-content: end;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.26);
    border-radius: 8px;
    padding: 0.85rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.85rem 1.8rem rgba(20, 17, 11, 0.13);
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.email-block-add-row button:before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.24), transparent 5.6rem),
        linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.32));
    pointer-events: none;
}

.email-block-add-row button:hover,
.email-block-add-row button:focus {
    transform: translateY(-0.12rem);
    box-shadow: 0 1.15rem 2.45rem rgba(20, 17, 11, 0.18);
}

.email-block-add-row button[data-add-email-block="text"] {
    background: linear-gradient(135deg, #475569, #111827);
}

.email-block-add-row button[data-add-email-block="image"] {
    background: linear-gradient(135deg, #1d4ed8, #111827);
}

.email-block-add-row button[data-add-email-block="button"] {
    background: linear-gradient(135deg, #a65a45, #5f470f);
}

.email-block-add-row button[data-add-email-block="divider"] {
    background: linear-gradient(135deg, #0f766e, #25322f);
}

.email-block-add-row button span,
.email-block-add-row button small {
    position: relative;
    z-index: 1;
}

.email-block-add-row button span {
    font-size: 1rem;
    font-weight: 950;
    line-height: 1;
    text-shadow: 0 0.12rem 0.3rem rgba(0, 0, 0, 0.45);
}

.email-block-add-row button small {
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.72rem;
    font-weight: 760;
}

.email-block-card {
    align-items: stretch;
    min-height: auto;
    overflow: hidden;
    padding: 0;
    background:
        var(--banner-gold-gradient),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.14);
}

.email-block-card.is-text {
    background: linear-gradient(135deg, #475569, #111827);
}

.email-block-card.is-image {
    background: linear-gradient(135deg, #1d4ed8, #111827);
}

.email-block-card.is-button {
    background: linear-gradient(135deg, #a65a45, #5f470f);
}

.email-block-card.is-divider {
    background: linear-gradient(135deg, #0f766e, #25322f);
}

.email-block-card.cms-block-visual-card:before {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.34)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.2), transparent 12rem);
}

.email-block-visual-head {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.42rem;
    min-height: 6.2rem;
    align-content: end;
    padding: 1rem 4rem 0.85rem 1rem;
}

.email-block-visual-head strong {
    color: #fff;
    font-size: clamp(1.08rem, 2.5vw, 1.48rem);
    line-height: 1;
    font-weight: 950;
    text-shadow:
        0 0.12rem 0.16rem rgba(0, 0, 0, 0.72),
        0 0.5rem 1.15rem rgba(0, 0, 0, 0.48);
}

.email-block-card .email-block-order.cms-block-order {
    border-radius: 999px;
}

.email-block-fields {
    position: relative;
    z-index: 1;
    margin: 0 0.85rem 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.52);
    border-radius: 10px;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 0.9rem 1.8rem rgba(20, 17, 11, 0.12);
    backdrop-filter: blur(14px);
}

.email-block-remove {
    position: absolute;
    right: 1rem;
    bottom: 0.82rem;
    z-index: 2;
    border: 1px solid rgba(17, 24, 39, 0.1);
    border-radius: 999px;
    padding: 0.36rem 0.58rem;
    background: rgba(255, 255, 255, 0.86);
    color: #9f1d1d;
    cursor: pointer;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 850;
}

.email-block-remove:hover,
.email-block-remove:focus {
    border-color: color-mix(in srgb, var(--section-primary, var(--gold)) 38%, transparent);
    background: #fff;
}

.email-block-card p {
    margin: 0;
    color: var(--muted);
}

.email-autosave-row {
    justify-content: space-between;
}

.email-autosave-row > span {
    border-radius: 999px;
    padding: 0.42rem 0.68rem;
    background: color-mix(in srgb, var(--section-primary, var(--gold)) 10%, #fff);
    color: color-mix(in srgb, var(--section-primary, var(--gold)) 62%, #111 38%);
    font-size: 0.82rem;
    font-weight: 850;
}

.email-autosave-row > span.is-saving {
    color: #5f470f;
    background: #fff7dc;
}

.email-autosave-row > span.is-saved {
    color: #0f766e;
    background: #e8fbf7;
}

.email-autosave-row > span.is-error {
    color: #9f1d1d;
    background: #fff1ef;
}

.email-html-export-panel {
    display: grid;
    gap: 0.75rem;
    border: 1px solid color-mix(in srgb, var(--section-primary, var(--gold)) 18%, transparent);
    border-radius: 12px;
    padding: 1rem;
    background: #fff;
    box-shadow: 0 0.9rem 1.8rem rgba(20, 17, 11, 0.08);
}

.email-html-export-panel[hidden] {
    display: none;
}

.email-html-export-panel > div:first-child {
    display: grid;
    gap: 0.2rem;
}

.email-html-export-panel strong {
    color: var(--text);
    font-size: 1rem;
}

.email-html-export-panel textarea {
    min-height: 18rem;
    resize: vertical;
    white-space: pre;
}

.email-quick-builder {
    display: grid;
    gap: 0.8rem;
    border: 1px solid color-mix(in srgb, var(--section-primary, var(--gold)) 20%, transparent);
    border-radius: 12px;
    padding: 1rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--section-primary, var(--gold)) 10%, #fff 90%), #fff);
}

.email-quick-builder > div:first-child {
    display: grid;
    gap: 0.2rem;
}

.email-quick-builder strong {
    color: var(--text);
    font-size: 1rem;
}

.email-editor-fields label,
.email-campaign-grid label {
    display: grid;
    gap: 0.35rem;
    font-weight: 800;
}

.code-input {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.email-token-row span {
    border-radius: 999px;
    padding: 0.35rem 0.55rem;
    background: color-mix(in srgb, var(--section-primary, var(--gold)) 12%, #fff);
    color: color-mix(in srgb, var(--section-primary, var(--gold)) 62%, #111 38%);
    font-size: 0.78rem;
    font-weight: 820;
}

.email-preview-shell {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 0.65rem;
}

.email-preview-head {
    display: grid;
    gap: 0.18rem;
    border: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 10px;
    padding: 0.75rem;
    background: #fff;
}

.email-preview-head span {
    color: var(--muted);
    font-size: 0.86rem;
}

.email-preview-frame {
    width: 100%;
    min-height: 38rem;
    border: 1px solid rgba(17, 24, 39, 0.1);
    border-radius: 12px;
    background: #fff;
}

.email-campaign-top,
.email-campaign-progress,
.email-campaign-metrics {
    display: grid;
    gap: 0.35rem;
}

.email-campaign-top span {
    width: max-content;
    border-radius: 999px;
    padding: 0.28rem 0.55rem;
    background: rgba(255, 255, 255, 0.72);
    color: color-mix(in srgb, var(--section-primary, var(--gold)) 70%, #111 30%);
    font-size: 0.74rem;
    font-weight: 880;
    text-transform: uppercase;
}

.email-campaign-progress i {
    display: block;
    overflow: hidden;
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.08);
}

.email-campaign-progress b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(135deg, color-mix(in srgb, var(--section-primary, var(--gold)) 76%, #000 24%), color-mix(in srgb, var(--section-primary, var(--gold)) 48%, #000 52%));
}

.email-campaign-progress span {
    color: inherit;
    font-size: 0.86rem;
    font-weight: 800;
}

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

.email-campaign-metrics span {
    border-radius: 9px;
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.72);
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 760;
}

.email-campaign-card.is-sending .email-campaign-metrics span,
.email-campaign-card.is-queued .email-campaign-metrics span {
    color: #111827;
}

.email-campaign-metrics b {
    display: block;
    margin-top: 0.15rem;
    font-size: 1rem;
}

@media (max-width: 980px) {
    .email-block-add-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .email-builder-layout,
    .email-campaign-grid,
    .email-editor-grid {
        grid-template-columns: 1fr;
    }

    .email-campaign-command-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .form-grid.two,
    .form-grid.three,
    .email-campaign-overview-grid,
    .email-delivery-grid {
        grid-template-columns: 1fr;
    }

    .email-preview-shell {
        position: static;
    }

    .email-template-create-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 900px) {
    .marketing-calendar-hero {
        grid-template-columns: 1fr;
    }

    .marketing-calendar-title-row {
        grid-template-columns: minmax(18rem, auto) minmax(20rem, 45rem);
    }

    .marketing-calendar-title-row .eyebrow {
        grid-column: 1 / -1;
    }

    .marketing-calendar-title-row p {
        align-self: end;
        padding-bottom: 0.45rem;
    }

    .marketing-calendar-actions {
        justify-self: start;
    }
}

@media (max-width: 680px) {
    .marketing-calendar-summary {
        grid-template-columns: 1fr;
    }

    .marketing-calendar-view-toggle {
        width: 100%;
    }

    .marketing-calendar-view-toggle a {
        flex: 1 1 0;
        justify-content: center;
    }
}

.meta-connect-panel {
    gap: 1rem;
}

.meta-connect-intro {
    margin: 0;
}

.social-approval-alert {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.32);
    border-radius: 8px;
    padding: clamp(1.05rem, 2vw, 1.35rem);
    color: #251806;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(255, 248, 225, 0.74)),
        linear-gradient(135deg, rgba(218, 165, 32, 0.35), rgba(138, 104, 29, 0.18));
    box-shadow: 0 1.2rem 2.5rem rgba(95, 69, 18, 0.16);
}

.social-approval-alert-mark {
    display: grid;
    width: 3.15rem;
    height: 3.15rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: #7b570f;
    font-size: 1.6rem;
    font-weight: 950;
    box-shadow: 0 0.85rem 1.7rem rgba(95, 69, 18, 0.26);
}

.social-approval-alert strong {
    display: block;
    max-width: 52rem;
    color: #15100a;
    font-size: clamp(1.28rem, 2.3vw, 1.75rem);
    line-height: 1.08;
    font-weight: 950;
}

.social-approval-alert p {
    max-width: 58rem;
    margin: 0.45rem 0 0;
    color: #4f4128;
    font-size: 0.98rem;
    line-height: 1.45;
    font-weight: 720;
}

:root[data-theme="dark"] .social-approval-alert {
    border-color: rgba(218, 165, 32, 0.34);
    color: #fff7df;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(218, 165, 32, 0.12)),
        #17140f;
}

:root[data-theme="dark"] .social-approval-alert strong {
    color: #fff7df;
}

:root[data-theme="dark"] .social-approval-alert p {
    color: #d9c99d;
}

@media (max-width: 680px) {
    .social-approval-alert {
        grid-template-columns: 1fr;
        align-items: start;
    }
}

.meta-channel-card-grid {
    margin-top: 0.15rem;
}

.meta-channel-card {
    min-height: 21rem;
}

.meta-channel-card .social-platform-link {
    margin-top: auto;
}

.meta-connected-details .section-head {
    margin-top: 0.8rem;
}

.social-connect-modal-card {
    width: min(38rem, 100%);
    gap: 1rem;
    padding-top: 4.6rem;
}

.social-connect-modal {
    align-items: center;
    justify-items: center;
    min-height: 100dvh;
    padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
}

.social-connect-modal .cms-modal-card {
    margin: auto;
}

.social-connect-modal-card .cms-editor-bar {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.social-connect-pane {
    display: grid;
    gap: 1rem;
}

.social-connect-modal-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: center;
}

.social-connect-modal-head .platform-avatar {
    width: 3.1rem;
    height: 3.1rem;
}

.social-connect-modal-head h2,
.social-connect-modal-head p {
    margin: 0;
}

.social-connect-modal-head h2 {
    color: var(--ink);
    font-size: 1.25rem;
    font-weight: 950;
}

.social-connect-modal-head p {
    color: var(--muted);
    line-height: 1.55;
}

.social-connect-steps {
    display: grid;
    gap: 0.55rem;
}

.social-connect-steps span {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.62rem;
    background: rgba(248, 245, 235, 0.58);
}

.social-connect-steps strong {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    font-weight: 950;
}

.social-connect-steps small {
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 850;
}

.social-connect-modal-actions {
    width: 100%;
    gap: 0.65rem;
    justify-content: flex-end;
}

.social-connect-modal-actions .button-primary,
.social-connect-modal-actions .button-quiet {
    width: auto;
    min-width: 0;
    min-height: 2.75rem;
    flex: 0 1 auto;
    padding: 0 1.1rem !important;
    font-size: 0.88rem !important;
    line-height: 1.1;
}

.social-connect-modal-actions .action-icon {
    display: none;
}

.cms-page-row a {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    min-width: 0;
    color: inherit;
}

.cms-page-row strong,
.cms-page-row .cms-page-subtitle {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-page-row .cms-page-subtitle {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
}

:root .cms-page-row.cms-page-row.cms-tree-root strong {
    color: #fff;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
}

:root .cms-page-row.cms-page-row.cms-tree-child strong {
    color: var(--ink);
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.cms-tree-child strong {
    color: #fff;
    text-shadow:
        0 0.12rem 0.16rem rgba(0, 0, 0, 0.72),
        0 0.5rem 1.15rem rgba(0, 0, 0, 0.62),
        0 0 1.7rem rgba(0, 0, 0, 0.58);
}

.cms-page-parent-icon {
    position: relative;
    display: inline-block;
    flex: 0 0 auto;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 0.45rem;
    color: currentColor;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
}

.cms-page-parent-icon:before {
    content: "";
    position: absolute;
    left: 0.35rem;
    top: 0.36rem;
    width: 0.44rem;
    height: 0.2rem;
    border-radius: 0.12rem 0.12rem 0 0;
    background: currentColor;
}

.cms-page-parent-icon:after {
    content: "";
    position: absolute;
    left: 0.3rem;
    right: 0.3rem;
    top: 0.56rem;
    bottom: 0.34rem;
    border: 0.14rem solid currentColor;
    border-radius: 0.16rem;
}

:root .cms-page-row.cms-page-row.cms-tree-child .cms-page-parent-icon {
    color: var(--cms-tree-colour);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 0 0 1px var(--cms-tree-line);
}

.cms-row-actions {
    display: grid;
}

.cms-order-control {
    display: grid;
    align-self: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 10px 20px rgba(31, 42, 68, 0.08);
}

.cms-order-control .cms-arrow-button {
    display: grid;
    width: 2.35rem;
    min-width: 2.35rem;
    min-height: 2rem;
    border: 0;
    border-radius: 0;
    padding: 0;
    place-items: center;
    color: var(--brand-deep);
    background: transparent;
}

.cms-order-control .cms-arrow-button + .cms-arrow-button {
    border-top: 1px solid var(--line);
}

.cms-order-control .cms-arrow-button:hover {
    background: rgba(138, 104, 29, 0.1);
}

.cms-arrow-icon {
    display: block;
    width: 0.65rem;
    height: 0.65rem;
    border-top: 0.14rem solid currentColor;
    border-left: 0.14rem solid currentColor;
}

.cms-arrow-icon.is-up {
    transform: translateY(0.16rem) rotate(45deg);
}

.cms-arrow-icon.is-down {
    transform: translateY(-0.16rem) rotate(225deg);
}

.cms-block-actions button,
.cms-block-palette button {
    min-height: 2.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 0.65rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.78);
    font-weight: 800;
}

.cms-editor-head {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.cms-editor-head h1 {
    margin: 0.35rem 0 0;
    font-size: clamp(1.6rem, 5vw, 2.7rem);
    line-height: 1;
}

.page-title-with-help {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.knowledge-video-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: clamp(3rem, 7vw, 4.25rem);
    height: clamp(2.35rem, 5.4vw, 3.25rem);
    gap: 0.55rem;
    border: 1px solid rgba(138, 104, 29, 0.22);
    border-radius: 12px;
    padding: 0 0.95rem;
    color: #8a681d;
    background:
        radial-gradient(circle at 25% 24%, rgba(57, 198, 128, 0.26), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 247, 222, 0.88));
    box-shadow: 0 0.55rem 1.2rem rgba(80, 60, 20, 0.12);
    cursor: pointer;
    padding: 0;
}

.knowledge-video-trigger:hover,
.knowledge-video-trigger:focus {
    border-color: rgba(57, 198, 128, 0.5);
    transform: translateY(-1px);
}

.knowledge-video-trigger-screen {
    position: relative;
    display: block;
    width: 1.7rem;
    height: 1.18rem;
    border: 0.2rem solid currentColor;
    border-radius: 0.36rem;
}

.knowledge-video-trigger-label {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}

.knowledge-video-trigger-screen::before,
.knowledge-video-trigger-screen::after {
    position: absolute;
    bottom: -0.55rem;
    left: 50%;
    content: "";
    background: currentColor;
    transform: translateX(-50%);
}

.knowledge-video-trigger-screen::before {
    width: 0.18rem;
    height: 0.42rem;
}

.knowledge-video-trigger-screen::after {
    width: 1.1rem;
    height: 0.16rem;
    border-radius: 999px;
}

.knowledge-video-trigger-screen span {
    position: absolute;
    top: 50%;
    left: 52%;
    width: 0;
    height: 0;
    border-top: 0.38rem solid transparent;
    border-bottom: 0.38rem solid transparent;
    border-left: 0.58rem solid #39c680;
    transform: translate(-42%, -50%);
}

.invoice-print-action,
.estimate-print-action {
    align-self: center;
    gap: 0.42rem;
    white-space: nowrap;
}

.estimate-view-icon,
.invoice-print-icon {
    position: relative;
    display: inline-block;
    flex: 0 0 auto;
    width: 1.05rem;
    height: 1.05rem;
}

.invoice-print-icon::before,
.invoice-print-icon::after {
    position: absolute;
    content: "";
    border: 0.13rem solid currentColor;
}

.invoice-print-icon::before {
    top: 0.05rem;
    right: 0.22rem;
    left: 0.22rem;
    height: 0.42rem;
    border-bottom: 0;
    border-radius: 0.12rem 0.12rem 0 0;
}

.invoice-print-icon::after {
    right: 0.04rem;
    bottom: 0.12rem;
    left: 0.04rem;
    height: 0.52rem;
    border-radius: 0.16rem;
    box-shadow: inset 0 -0.18rem 0 rgba(138, 104, 29, 0.16);
}

.estimate-view-icon::before {
    position: absolute;
    content: "";
    inset: 0.16rem 0.25rem 0.18rem 0.12rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.16rem;
}

.estimate-view-icon::after {
    position: absolute;
    top: 0.08rem;
    right: 0.05rem;
    width: 0.45rem;
    height: 0.45rem;
    content: "";
    border-top: 0.13rem solid currentColor;
    border-right: 0.13rem solid currentColor;
    transform: rotate(45deg);
}

.estimate-editor-actions,
.invoice-editor-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
}

.estimate-editor-actions .button-soft,
.estimate-editor-actions .button-danger,
.invoice-editor-actions .button-soft,
.invoice-editor-actions .button-danger {
    min-height: 2.35rem;
    padding: 0 0.85rem;
    font-size: 0.84rem;
}

.estimate-delete-action,
.invoice-delete-action {
    align-self: center;
    white-space: nowrap;
}

.row-print-action {
    min-height: 2rem;
    gap: 0.35rem;
    padding: 0 0.7rem;
    font-size: 0.74rem;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .estimate-editor-actions,
    .invoice-editor-actions {
        width: 100%;
        justify-content: stretch;
    }

    .estimate-editor-actions > *,
    .invoice-editor-actions > * {
        flex: 1 1 auto;
    }
}

.cms-page-settings-card {
    display: grid;
    width: 100%;
    gap: 0.85rem;
    margin: 0 0 1rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 1rem;
    background:
        radial-gradient(circle at 92% 8%, rgba(138, 104, 29, 0.1), transparent 10rem),
        rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
}

.cms-live-editor-layout {
    display: grid;
    gap: 1rem;
    align-items: start;
    min-width: 0;
}

.cms-live-editor-main {
    display: grid;
    gap: 0;
    min-width: 0;
}

.cms-live-preview-panel {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 10px;
    padding: 0.75rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(138, 104, 29, 0.12), transparent 10rem),
        rgba(255, 255, 255, 0.82);
    box-shadow: 0 1.2rem 2.6rem rgba(20, 17, 11, 0.12);
}

.cms-live-preview-head {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
}

.cms-live-preview-head div {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.cms-live-preview-head strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-live-preview-frame {
    display: block;
    width: 100%;
    min-height: 34rem;
    height: min(58rem, calc(100dvh - 11rem));
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45);
    transition: opacity 180ms ease, transform 180ms ease;
}

.cms-live-preview-frame.is-refreshing {
    opacity: 0.62;
    transform: scale(0.995);
}

.cms-section-card-head {
    display: grid;
    gap: 0.18rem;
}

.cms-section-card-head h3 {
    margin: 0;
    color: var(--ink);
    font-size: 1.18rem;
    line-height: 1.08;
    font-weight: 950;
}

.cms-page-settings {
    grid-template-columns: 1fr;
}

.cms-page-settings label,
.cms-modal-fields label,
.cms-page-settings .ai-assist-field,
.cms-modal-fields .ai-assist-field {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.cms-modal-fields [hidden] {
    display: none !important;
}

.cms-page-settings .wide {
    grid-column: 1 / -1;
}

.cms-block-tools {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
}

.website-pages-shell .cms-editor-panel .cms-block-tools {
    width: 100%;
}

.cms-block-tools-collapsible {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0;
    background:
        radial-gradient(circle at 96% 0%, rgba(138, 104, 29, 0.12), transparent 9rem),
        rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
    overflow: visible;
}

.cms-block-tools-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.18rem 0.85rem;
    align-items: center;
    min-height: 3.45rem;
    padding: 0.85rem 1rem;
    cursor: pointer;
    list-style: none;
}

.cms-block-tools-summary::-webkit-details-marker {
    display: none;
}

.cms-block-tools-summary .form-title {
    grid-column: 1;
}

.cms-block-tools-hint {
    grid-column: 1;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.cms-block-tools-toggle {
    position: relative;
    grid-column: 2;
    grid-row: 1 / span 2;
    display: inline-grid;
    width: 2.15rem;
    height: 2.15rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);
    color: var(--brand-deep);
    box-shadow: 0 0.45rem 1rem rgba(20, 17, 11, 0.08);
}

.cms-block-tools-toggle::before,
.cms-block-tools-toggle::after {
    content: "";
    position: absolute;
    width: 0.82rem;
    height: 0.14rem;
    border-radius: 999px;
    background: currentColor;
    transition: transform 180ms ease;
}

.cms-block-tools-toggle::after {
    transform: rotate(90deg);
}

.cms-block-tools-collapsible[open] .cms-block-tools-toggle::after {
    transform: rotate(0deg);
}

.cms-block-tools-panel {
    display: grid;
    gap: 0.65rem;
    padding: 0 1rem 1rem;
    animation: cmsBlockToolsOpen 190ms ease both;
}

@keyframes cmsBlockToolsOpen {
    from {
        opacity: 0;
        transform: translateY(-0.35rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.cms-block-palette {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.cms-block-palette button {
    position: relative;
    display: grid;
    width: 100%;
    min-height: 6.15rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.72rem;
    align-items: center;
    justify-content: start;
    overflow: visible;
    padding: 0.82rem;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 8px;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.85rem 1.8rem rgba(20, 17, 11, 0.13);
    font-size: 0.82rem;
    line-height: 1.12;
    text-align: left;
}

.cms-block-palette button:hover {
    z-index: 3;
    transform: translateY(-0.12rem);
    box-shadow: 0 1.15rem 2.45rem rgba(20, 17, 11, 0.18);
}

.cms-block-palette .is-hero {
    background: var(--banner-gold-gradient);
}

.cms-block-palette .is-text {
    background: linear-gradient(135deg, #475569, #111827);
}

.cms-block-palette .is-image {
    background: linear-gradient(135deg, #1d4ed8, #111827);
}

.cms-block-palette .is-image-text {
    background: linear-gradient(135deg, #8a681d, #a65a45);
}

.cms-block-palette .is-image-text-alt {
    background: linear-gradient(135deg, #a65a45, #5f4512);
}

.cms-block-palette .is-goal {
    background: linear-gradient(135deg, #a65a45, #8a681d);
}

.cms-block-palette .is-form {
    background: linear-gradient(135deg, #475569, #5f4512);
}

.cms-block-palette .is-contact-form {
    background: linear-gradient(135deg, #334155, #6b4f15);
}

.cms-block-palette .is-proof {
    background: linear-gradient(135deg, #77527a, #8a681d);
}

.cms-block-palette .is-simple-proof {
    background: linear-gradient(135deg, #6b5a3f, #111827);
}

.cms-block-palette .is-html {
    background: linear-gradient(135deg, #1f2937, #77527a);
}

.cms-add-icon-wrap {
    display: grid;
    width: 2.85rem;
    height: 2.85rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.22), 0 0.5rem 1.2rem rgba(0, 0, 0, 0.1);
}

.cms-block-add-copy {
    display: grid;
    min-width: 0;
    gap: 0.18rem;
}

.cms-block-add-copy strong {
    color: #fff;
    font-size: 1rem;
    font-weight: 950;
}

.cms-block-add-copy small {
    overflow: hidden;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.72rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-block-info {
    position: relative;
    display: inline-grid;
    width: 1.55rem;
    height: 1.55rem;
    place-items: center;
    align-self: start;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 950;
}

.cms-block-tooltip {
    position: absolute;
    right: 0;
    top: calc(100% + 0.45rem);
    z-index: 1002;
    width: min(20rem, 78vw);
    border: 1px solid rgba(20, 24, 32, 0.12);
    border-radius: 8px;
    padding: 0.62rem 0.68rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 1rem 2.1rem rgba(20, 24, 32, 0.16);
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.35;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-0.2rem);
    transition: opacity 160ms ease, transform 160ms ease;
}

.cms-block-palette button:hover .cms-block-tooltip,
.cms-block-palette button:focus-visible .cms-block-tooltip {
    opacity: 1;
    transform: translateY(0);
}

.franchise-page {
    display: grid;
    gap: 1rem;
}

.franchise-add-modal-card {
    max-width: 34rem;
}

.franchise-add-modal-fields {
    grid-template-columns: 1fr;
}

.franchise-settings-grid,
.franchisee-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pos-service-toggle {
    align-self: stretch;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    justify-items: start;
    gap: 0.8rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.95rem 1rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.65rem 1.4rem rgba(31, 42, 68, 0.08);
}

.pos-service-toggle span {
    font-size: 0.9rem;
    font-weight: 900;
    color: var(--ink);
}

.auto-save-note {
    margin: 0.75rem 0 0;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.franchisee-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.franchisee-card {
    display: grid;
    gap: 0.9rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
}

.franchisee-card-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
}

.franchisee-card-head strong,
.franchisee-card-head small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.franchisee-avatar {
    display: grid;
    width: 3.5rem;
    height: 3.5rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: linear-gradient(135deg, var(--brand), var(--aqua));
    color: #fff;
    font-weight: 950;
}

.franchisee-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.franchisee-card-meta,
.franchise-invoice-row,
.franchise-download-row {
    display: grid;
    gap: 0.55rem;
}

.franchisee-card-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    font-size: 0.78rem;
    color: var(--muted);
}

.franchise-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.franchise-history-card {
    grid-column: 1 / -1;
}

.franchise-invoice-list,
.franchise-download-list {
    display: grid;
    gap: 0.7rem;
}

.franchise-invoice-row,
.franchise-download-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.72);
}

.franchise-download-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.franchise-invoice-row strong,
.franchise-invoice-row span,
.franchise-download-row strong,
.franchise-download-row span {
    display: block;
    min-width: 0;
}

.franchise-invoice-row span,
.franchise-download-row span {
    color: var(--muted);
    font-size: 0.78rem;
}

.franchise-portal-body {
    min-height: 100vh;
    background: var(--surface);
}

.franchise-portal-shell {
    max-width: 74rem;
    margin: 0 auto;
    padding: clamp(1rem, 3vw, 2rem);
}

@media (max-width: 680px) {
    .franchise-settings-grid,
    .franchisee-fields,
    .franchisee-card-grid,
    .franchise-detail-grid,
    .franchisee-card-meta,
    .franchise-invoice-row,
    .franchise-download-row {
        grid-template-columns: 1fr;
    }
}

.cms-add-icon {
    position: relative;
    display: block;
    width: 1.34rem;
    height: 1.34rem;
    flex: 0 0 auto;
    color: #ffffff;
}

.cms-add-hero {
    border: 0.1rem solid currentColor;
    border-radius: 0.22rem;
}

.cms-add-hero:before {
    content: "";
    position: absolute;
    left: 0.12rem;
    right: 0.12rem;
    top: 0.14rem;
    height: 0.1rem;
    border-radius: 999px;
    background: currentColor;
}

.cms-add-hero:after {
    content: "";
    position: absolute;
    left: 0.13rem;
    right: 0.13rem;
    bottom: 0.14rem;
    height: 0.22rem;
    border-radius: 0.08rem;
    background: currentColor;
    opacity: 0.74;
}

.cms-add-text:before,
.cms-add-text:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0.11rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0.28rem 0 currentColor;
}

.cms-add-text:before {
    top: 0.12rem;
}

.cms-add-text:after {
    top: 0.67rem;
    right: 0.22rem;
}

.cms-add-image {
    border: 0.1rem solid currentColor;
    border-radius: 0.22rem;
}

.cms-add-image:before {
    content: "";
    position: absolute;
    top: 0.12rem;
    right: 0.13rem;
    width: 0.17rem;
    height: 0.17rem;
    border-radius: 999px;
    background: currentColor;
}

.cms-add-image:after {
    content: "";
    position: absolute;
    left: 0.1rem;
    right: 0.1rem;
    bottom: 0.12rem;
    height: 0.32rem;
    background: currentColor;
    clip-path: polygon(0 100%, 34% 35%, 54% 68%, 72% 45%, 100% 100%);
}

.cms-add-image-left,
.cms-add-image-right {
    border: 0.1rem solid currentColor;
    border-radius: 0.2rem;
}

.cms-add-image-left:before,
.cms-add-image-right:before {
    content: "";
    position: absolute;
    top: 0.16rem;
    width: 0.42rem;
    height: 0.72rem;
    border-radius: 0.1rem;
    background: currentColor;
}

.cms-add-image-left:after,
.cms-add-image-right:after {
    content: "";
    position: absolute;
    top: 0.22rem;
    width: 0.46rem;
    height: 0.09rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0.22rem 0 currentColor, 0 0.44rem 0 currentColor;
}

.cms-add-image-left:before {
    left: 0.14rem;
}

.cms-add-image-left:after {
    right: 0.14rem;
}

.cms-add-image-right:before {
    right: 0.14rem;
}

.cms-add-image-right:after {
    left: 0.14rem;
}

.cms-add-cta {
    border: 0.1rem solid currentColor;
    border-radius: 999px;
}

.cms-add-cta:before {
    content: "";
    position: absolute;
    left: 0.24rem;
    top: 0.19rem;
    width: 0.29rem;
    height: 0.29rem;
    border-top: 0.12rem solid currentColor;
    border-right: 0.12rem solid currentColor;
    transform: rotate(45deg);
}

.cms-add-cta:after {
    content: "";
    position: absolute;
    left: 0.18rem;
    top: 0.39rem;
    width: 0.45rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
}

.cms-add-form {
    border: 0.1rem solid currentColor;
    border-radius: 0.18rem;
}

.cms-add-form:before,
.cms-add-form:after {
    content: "";
    position: absolute;
    left: 0.15rem;
    right: 0.15rem;
    height: 0.1rem;
    border-radius: 999px;
    background: currentColor;
}

.cms-add-form:before {
    top: 0.22rem;
    box-shadow: 0 0.22rem 0 currentColor;
}

.cms-add-form:after {
    bottom: 0.18rem;
}

.cms-add-contact-form {
    border: 0.1rem solid currentColor;
    border-radius: 0.22rem;
}

.cms-add-contact-form:before {
    content: "";
    position: absolute;
    left: 0.16rem;
    right: 0.16rem;
    top: 0.22rem;
    height: 0.46rem;
    border: 0.1rem solid currentColor;
    border-radius: 0.08rem;
}

.cms-add-contact-form:after {
    content: "";
    position: absolute;
    left: 0.22rem;
    right: 0.22rem;
    top: 0.3rem;
    height: 0.26rem;
    border-bottom: 0.1rem solid currentColor;
    border-left: 0.1rem solid currentColor;
    transform: skewY(-28deg);
    opacity: 0.86;
}

.cms-add-testimonials {
    border: 0.1rem solid currentColor;
    border-radius: 999px;
}

.cms-add-testimonials:before {
    content: "";
    position: absolute;
    left: 0.17rem;
    top: 0.18rem;
    width: 0.18rem;
    height: 0.18rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0.32rem 0 0 currentColor;
}

.cms-add-testimonials:after {
    content: "";
    position: absolute;
    right: 0.15rem;
    bottom: 0.12rem;
    left: 0.15rem;
    height: 0.18rem;
    border-radius: 999px 999px 0.08rem 0.08rem;
    background: currentColor;
}

.cms-add-html:before,
.cms-add-html:after {
    content: "";
    position: absolute;
    top: 0.18rem;
    width: 0.34rem;
    height: 0.34rem;
    border-top: 0.11rem solid currentColor;
    border-left: 0.11rem solid currentColor;
}

.cms-add-html:before {
    left: 0.05rem;
    transform: rotate(-45deg);
}

.cms-add-html:after {
    right: 0.05rem;
    transform: rotate(135deg);
}

.cms-add-html {
    border-radius: 0.18rem;
}

.cms-block-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.45rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.42rem;
    background: #fff;
    box-shadow: 0 0.42rem 1.05rem rgba(31, 42, 68, 0.06);
    transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.website-pages-shell .cms-editor-panel .cms-block-list,
.landing-pages-shell .cms-editor-panel .cms-block-list {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
}

.website-pages-shell .cms-editor-panel .cms-block-card.cms-block-visual-card,
.landing-pages-shell .cms-editor-panel .cms-block-card.cms-block-visual-card {
    width: min(100%, 600px);
    justify-self: center;
}

.cms-block-card.cms-block-visual-card {
    position: relative;
    display: grid;
    min-height: 11.5rem;
    grid-template-columns: minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 0;
    color: #fff;
    background:
        var(--banner-gold-gradient),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.16);
    isolation: isolate;
}

.cms-block-card.cms-block-visual-card.is-image,
.cms-block-card.cms-block-visual-card.is-hero {
    background:
        linear-gradient(135deg, rgba(17, 24, 39, 0.94), rgba(138, 104, 29, 0.9)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
}

.cms-block-card.cms-block-visual-card.is-cta,
.cms-block-card.cms-block-visual-card.is-form,
.cms-block-card.cms-block-visual-card.is-contact-form {
    background:
        linear-gradient(135deg, rgba(166, 90, 69, 0.92), rgba(138, 104, 29, 0.88)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.22), transparent 12rem);
}

.cms-block-card.cms-block-visual-card.is-testimonials,
.cms-block-card.cms-block-visual-card.is-simple-testimonials {
    background:
        linear-gradient(135deg, rgba(118, 90, 130, 0.9), rgba(95, 69, 18, 0.9)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.22), transparent 12rem);
}

.cms-block-card.cms-block-visual-card:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.58)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.22), transparent 12rem);
    pointer-events: none;
}

.cms-block-card.cms-block-visual-card:hover {
    border-color: rgba(255, 255, 255, 0.82);
    box-shadow: 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-2px);
}

.cms-block-card.cms-block-visual-card .cms-block-order {
    position: absolute;
    top: 0.72rem;
    right: 0.72rem;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 0.16rem;
    background: rgba(0, 0, 0, 0.18);
    box-shadow: 0 0.65rem 1.4rem rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(12px);
}

.cms-block-card.cms-block-visual-card .cms-arrow-button {
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
}

.email-block-card.cms-block-card.cms-block-visual-card {
    min-height: auto;
    padding: 0;
    background:
        var(--banner-gold-gradient),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.24), transparent 12rem);
    box-shadow: 0 1.1rem 2.4rem rgba(20, 17, 11, 0.14);
}

.email-block-card.cms-block-card.cms-block-visual-card.is-text {
    background: linear-gradient(135deg, #475569, #111827);
}

.email-block-card.cms-block-card.cms-block-visual-card.is-image {
    background: linear-gradient(135deg, #1d4ed8, #111827);
}

.email-block-card.cms-block-card.cms-block-visual-card.is-button {
    background: linear-gradient(135deg, #a65a45, #5f470f);
}

.email-block-card.cms-block-card.cms-block-visual-card.is-divider {
    background: linear-gradient(135deg, #0f766e, #25322f);
}

.email-block-card.cms-block-card.cms-block-visual-card:before {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.34)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.2), transparent 12rem);
}

.cms-page-row {
    transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.cms-page-row.is-moving-up,
.cms-block-card.is-moving-up {
    transform: translateY(-0.55rem);
    box-shadow: 0 18px 38px rgba(138, 104, 29, 0.16);
}

.cms-page-row.is-moving-down,
.cms-block-card.is-moving-down {
    transform: translateY(0.55rem);
    box-shadow: 0 18px 38px rgba(138, 104, 29, 0.16);
}

.cms-page-row.is-new,
.cms-block-card.is-new,
.cms-image-tile.is-new,
.commerce-line-item.is-new {
    animation: cmsBloomIn 620ms cubic-bezier(0.18, 0.9, 0.22, 1.1) both;
}

.cms-block-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.45rem;
    align-items: center;
    min-width: 0;
}

.cms-block-card.cms-block-visual-card .cms-block-main {
    position: relative;
    z-index: 1;
    display: grid;
    min-height: 100%;
    grid-template-columns: minmax(0, 1fr);
    align-content: space-between;
    align-items: stretch;
    gap: 0.85rem;
    padding: 0.85rem;
}

.cms-block-preview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.12rem 0.5rem;
    align-items: center;
}

.cms-block-card.cms-block-visual-card .cms-block-preview {
    display: grid;
    min-width: 0;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    align-content: start;
    padding-right: 2.9rem;
}

.cms-block-preview strong {
    min-width: 0;
    overflow: hidden;
    font-size: 0.9rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-block-card.cms-block-visual-card .cms-block-preview strong {
    display: block;
    overflow: visible;
    color: #fff;
    font-size: clamp(1.08rem, 2.5vw, 1.55rem);
    line-height: 1;
    font-weight: 950;
    text-overflow: initial;
    white-space: normal;
    text-shadow:
        0 0.12rem 0.16rem rgba(0, 0, 0, 0.72),
        0 0.5rem 1.15rem rgba(0, 0, 0, 0.62),
        0 0 1.7rem rgba(0, 0, 0, 0.58);
}

.cms-block-preview p {
    display: -webkit-box;
    grid-column: 1;
    overflow: hidden;
    margin: 0;
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.cms-block-card.cms-block-visual-card .cms-block-preview p {
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.8rem;
    font-weight: 760;
    text-shadow: 0 0.14rem 0.35rem rgba(0, 0, 0, 0.42);
}

.cms-block-preview img {
    grid-row: 1 / span 3;
    grid-column: 2;
    width: 3.65rem;
    height: 2.55rem;
    object-fit: cover;
    border-radius: var(--radius);
}

.cms-block-card.cms-block-visual-card .cms-block-preview img {
    display: none;
}

.cms-block-type {
    width: max-content;
    border-radius: 999px;
    padding: 0.12rem 0.42rem;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.62rem;
    font-weight: 850;
    text-transform: uppercase;
}

.cms-block-card.cms-block-visual-card .cms-block-type {
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(10px);
}

.cms-block-actions {
    display: flex;
    gap: 0.35rem;
}

.cms-block-card.cms-block-visual-card .cms-block-actions {
    flex-wrap: wrap;
    align-items: center;
}

.cms-block-actions button {
    min-height: 1.9rem;
    padding: 0 0.55rem;
    font-size: 0.72rem;
}

.cms-block-card.cms-block-visual-card .cms-block-actions button {
    border-color: rgba(255, 255, 255, 0.26);
    color: #fff;
    background: rgba(0, 0, 0, 0.2);
    box-shadow: 0 0.55rem 1.2rem rgba(0, 0, 0, 0.14);
    backdrop-filter: blur(10px);
}

.cms-block-card.cms-block-visual-card .cms-block-actions button:hover {
    background: rgba(0, 0, 0, 0.3);
}

.website-pages-shell,
.website-pages-shell strong,
.website-pages-shell label,
.website-pages-shell button,
.website-pages-shell .eyebrow,
.website-pages-shell .form-title,
.website-pages-shell .cms-block-type,
.website-pages-shell .cms-page-home-mark,
.website-pages-shell .landing-page-status,
.website-pages-shell .cms-block-add-copy strong,
.website-pages-shell .cms-block-add-copy small,
.website-pages-shell .cms-subpage-accordion summary,
.website-pages-shell .cms-block-preview strong,
.website-pages-shell .cms-block-preview p,
.website-pages-shell .cms-block-actions button {
    font-weight: 400;
}

.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card strong,
.website-pages-shell:not(.is-editor-open) .cms-page-row.cms-page-visual-card.is-child strong,
.website-pages-shell .cms-block-card.cms-block-visual-card .cms-block-preview strong {
    font-weight: 400;
}

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

.cms-library-grid {
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 0.8rem;
}

.cms-image-tile {
    display: grid;
    gap: 0.35rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.45rem;
    background: rgba(255, 255, 255, 0.7);
    transform-origin: center;
}

.cms-library-tile {
    align-content: start;
    gap: 0.7rem;
    padding: 0.7rem;
}

.cms-image-tile img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: var(--radius);
    background: var(--surface);
}

.cms-image-tile span {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-image-details {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.cms-image-details strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-library-tile label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
}

.cms-image-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.45rem;
}

.commerce-editor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.5rem), 1fr));
    gap: 0.85rem;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) + 0.2rem);
    padding: 0.95rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.56)),
        rgba(255, 255, 255, 0.66);
    box-shadow: 0 1rem 2rem rgba(29, 31, 45, 0.055);
}

:root[data-theme="dark"] .commerce-editor-grid {
    border-color: rgba(222, 205, 158, 0.14);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(222, 205, 158, 0.07)),
        var(--panel);
}

.commerce-editor-grid label,
.commerce-editor-grid .ai-assist-field,
.commerce-line-item label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.social-hashtag-label {
    display: flex;
    min-height: 2.05rem;
    gap: 0.55rem;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.social-hashtag-ai-button {
    min-height: 2.35rem;
    padding: 0.52rem 0.82rem;
    border-radius: 8px;
    font-size: 0.76rem;
    line-height: 1;
    white-space: nowrap;
}

.social-hashtag-ai-button .action-icon {
    display: none;
}

.social-hashtag-ai-button .action-icon:before,
.social-hashtag-ai-button .action-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.input-control.is-saved {
    animation: savedFlash 980ms ease both;
}

.input-control.is-saving {
    opacity: 0.58;
    border-color: rgba(138, 104, 29, 0.55);
    box-shadow: 0 0 0 0.22rem rgba(138, 104, 29, 0.1);
}

.input-control.is-save-error {
    border-color: rgba(164, 62, 62, 0.62);
    box-shadow: 0 0 0 0.22rem rgba(164, 62, 62, 0.1);
}

.status-tag.is-muted {
    color: var(--muted);
    background: rgba(105, 112, 133, 0.1);
    box-shadow: 0 0 0 0.22rem rgba(105, 112, 133, 0.08);
}

.commerce-editor-grid .wide {
    grid-column: 1 / -1;
}

.policy-page {
    max-width: 96rem;
    margin: 0 auto;
}

.policy-layout {
    display: grid;
    grid-template-columns: minmax(14rem, 0.55fr) minmax(0, 1.45fr);
    gap: 1rem;
    align-items: start;
}

.policy-list-panel,
.policy-editor-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.66);
    box-shadow: var(--soft-shadow);
}

.policy-list {
    display: grid;
    gap: 0.55rem;
}

.policy-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: stretch;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.78);
}

.policy-row.is-selected {
    border-color: rgba(138, 104, 29, 0.34);
    background: rgba(138, 104, 29, 0.1);
}

.policy-row a {
    display: grid;
    gap: 0.18rem;
    padding: 0.72rem;
    color: var(--ink);
    text-decoration: none;
}

.policy-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.policy-row span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.tiny-move-buttons {
    display: grid;
    width: 2.4rem;
    border-left: 1px solid var(--line);
}

.tiny-move-buttons button {
    border: 0;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
    background: rgba(255, 255, 255, 0.4);
    font-weight: 900;
    cursor: pointer;
}

.tiny-move-buttons button:last-child {
    border-bottom: 0;
}

.policy-editor-grid {
    margin-top: 0.8rem;
}

.tall-textarea {
    min-height: 22rem;
    resize: vertical;
}

.code-textarea {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.82rem;
    line-height: 1.55;
}

.cloud-folder-page {
    max-width: 96rem;
    margin: 0 auto;
}

.cloud-toolbar {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) auto minmax(14rem, 1.2fr) auto;
    gap: 0.7rem;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: var(--soft-shadow);
}

.cloud-toolbar label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.cloud-browser {
    display: grid;
    gap: 0.75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
}

.cloud-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.cloud-breadcrumb a {
    color: var(--ink);
    text-decoration: none;
}

.cloud-list {
    display: grid;
    gap: 0.55rem;
}

.cloud-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.8);
}

.cloud-row a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.75rem;
    row-gap: 0.15rem;
    align-items: center;
    min-width: 0;
    color: var(--ink);
    text-decoration: none;
}

.cloud-file-icon {
    display: grid;
    grid-row: span 2;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border-radius: 8px;
    color: #ffffff;
    background: linear-gradient(135deg, #8a681d, #4f380d);
    font-size: 0.68rem;
    font-weight: 950;
}

.cloud-row.is-folder .cloud-file-icon {
    color: #4f380d;
    background: rgba(216, 179, 90, 0.28);
    font-size: 1.25rem;
}

.cloud-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cloud-row small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 750;
}

@media (max-width: 760px) {
    .policy-layout {
        grid-template-columns: 1fr;
    }

    .policy-layout.has-policy .policy-list-panel {
        display: none;
    }

    .cloud-toolbar {
        grid-template-columns: 1fr;
    }

    .cloud-row {
        grid-template-columns: 1fr;
    }
}

.workspace-panel {
    display: grid;
    gap: 1.4rem;
}

.todo-page {
    max-width: 88rem;
    margin: 0 auto;
}

.todo-page-intro {
    max-width: 48rem;
    margin: 0.45rem 0 0;
    color: var(--muted);
    font-size: 0.96rem;
    line-height: 1.55;
}

.todo-stat-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.todo-stat-strip > div,
.todo-compose-card,
.todo-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.76)),
        rgba(255, 255, 255, 0.62);
    box-shadow: var(--soft-shadow);
}

.todo-stat-strip > div {
    padding: 1rem 1.1rem;
}

.todo-stat-strip span {
    display: block;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
}

.todo-stat-strip strong {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink);
    font-size: 1.35rem;
    font-weight: 950;
}

.todo-compose-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.1rem;
}

.todo-compose-card label {
    display: grid;
    gap: 0.42rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 950;
}

.todo-compose-row {
    display: grid;
    grid-template-columns: minmax(12rem, 16rem) auto;
    gap: 0.75rem;
    align-items: end;
    justify-content: start;
}

.todo-list-form {
    display: grid;
    gap: 0.85rem;
}

.todo-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
    padding: 1rem;
    border-left: 0.28rem solid var(--accent);
}

.todo-card.is-done {
    opacity: 0.68;
}

.todo-card.is-done .todo-text {
    text-decoration: line-through;
}

.todo-card-main {
    min-width: 0;
    display: grid;
    gap: 0.7rem;
}

.todo-card-top {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: flex-start;
    justify-content: space-between;
}

.todo-text {
    min-width: min(100%, 18rem);
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 850;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.todo-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.85rem;
    padding: 0 0.72rem;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: 999px;
    background: rgba(138, 104, 29, 0.1);
    color: var(--accent);
    font-size: 0.72rem;
    font-weight: 950;
}

.todo-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.8rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.todo-smart-links {
    display: grid;
    gap: 0.42rem;
}

.todo-smart-links > span {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
}

.todo-smart-links > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.todo-link-chip {
    display: inline-grid;
    gap: 0.08rem;
    min-width: 8.5rem;
    max-width: 15rem;
    padding: 0.54rem 0.68rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.todo-link-chip:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.34);
    box-shadow: 0 0.8rem 1.8rem rgba(31, 28, 23, 0.08);
}

.todo-link-chip small {
    color: var(--accent);
    font-size: 0.66rem;
    font-weight: 950;
    text-transform: uppercase;
}

.todo-link-chip strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.todo-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .todo-stat-strip,
    .todo-compose-row,
    .todo-card {
        grid-template-columns: 1fr;
    }

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

    .todo-link-chip {
        width: 100%;
        max-width: none;
    }
}

.workspace-settings-grid {
    display: grid;
    gap: 1.2rem;
}

.workspace-danger-zone {
    max-width: 92rem;
    margin: 0 auto;
    border-color: rgba(166, 90, 69, 0.18);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.78)),
        rgba(166, 90, 69, 0.06);
}

.workspace-danger-grid {
    display: grid;
    gap: 0.9rem;
}

.workspace-danger-grid strong {
    display: block;
    color: #8b332d;
    font-size: 0.95rem;
    font-weight: 950;
}

.workspace-danger-grid p {
    max-width: 48rem;
    margin: 0.3rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.channel-panel {
    max-width: 78rem;
}

.channel-hero,
.channel-picker,
.channel-setup-notes,
.channel-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
}

.flow-builder-page {
    display: grid;
    gap: 1rem;
}

.flow-list-panel,
.flow-roadmap-panel {
    min-width: 0;
}

.flow-row {
    border-left: 0.24rem solid #8a681d;
}

.flow-row .commerce-status-pill {
    align-self: center;
    white-space: nowrap;
}

.flow-editor-head {
    align-items: center;
}

.flow-editor-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
}

.flow-test-button {
    min-height: 2.05rem;
    padding: 0 0.9rem;
}

.flow-settings {
    display: grid;
    gap: 0.65rem;
    margin-bottom: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.58);
}

.flow-settings label,
.flow-step-fields label,
.flow-step-top label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.flow-settings .wide {
    grid-column: 1 / -1;
}

.flow-roadmap {
    position: relative;
    display: grid;
    gap: 0.75rem;
}

.flow-roadmap:before {
    content: "";
    position: absolute;
    top: 1rem;
    bottom: 1rem;
    left: 1.05rem;
    width: 0.12rem;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(138, 104, 29, 0.32), rgba(95, 69, 18, 0.24));
}

.flow-step-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    margin-left: min(calc(var(--flow-depth, 0) * 1.35rem), 5.4rem);
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 0.72rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.06), transparent 42%),
        rgba(255, 255, 255, 0.82);
    box-shadow: 0 0.7rem 1.8rem rgba(31, 42, 68, 0.08);
}

.flow-step-card.is-child:before {
    content: "";
    position: absolute;
    top: 1.1rem;
    left: -1rem;
    width: 0.82rem;
    height: 0.1rem;
    border-radius: 999px;
    background: rgba(138, 104, 29, 0.24);
}

.flow-step-card.is-new {
    animation: cmsBloomIn 560ms cubic-bezier(0.18, 0.9, 0.22, 1.1) both;
}

.flow-step-marker {
    position: relative;
    z-index: 1;
    display: grid;
    width: 2.15rem;
    justify-items: center;
}

.flow-step-marker span {
    display: grid;
    width: 2.15rem;
    height: 2.15rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.7rem 1.5rem rgba(138, 104, 29, 0.18);
    font-size: 0.82rem;
    font-weight: 950;
}

.flow-step-main {
    display: grid;
    gap: 0.72rem;
    min-width: 0;
}

.flow-step-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: start;
}

.flow-step-type {
    display: inline-flex;
    width: max-content;
    min-height: 1.55rem;
    align-items: center;
    margin-bottom: 0.45rem;
    border-radius: 999px;
    padding: 0 0.6rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.7rem;
    font-weight: 900;
}

.flow-step-fields {
    display: grid;
    gap: 0.65rem;
}

.flow-step-fields textarea {
    min-height: 5.8rem;
    resize: vertical;
}

.flow-step-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
}

.flow-step-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.flow-choice-panel {
    display: grid;
    gap: 0.5rem;
    border: 1px solid rgba(95, 81, 64, 0.16);
    border-radius: var(--radius);
    padding: 0.7rem;
    background: rgba(95, 81, 64, 0.06);
}

.flow-choice-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto;
    gap: 0.55rem;
    align-items: end;
    border-radius: calc(var(--radius) - 0.2rem);
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.72);
}

.flow-choice-empty {
    min-height: 3rem;
    border-radius: calc(var(--radius) - 0.2rem);
    padding: 0.75rem;
}

.chatflow-choice-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.65rem;
}

.chatflow-choice-button {
    min-height: 2rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    padding: 0 0.85rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.08);
    box-shadow: 0 0.45rem 1rem rgba(138, 104, 29, 0.08);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 900;
    cursor: pointer;
    transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.chatflow-choice-button:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.32);
    background: rgba(138, 104, 29, 0.13);
}

.flow-active-toggle {
    align-self: center;
    justify-items: start;
}

.flow-add-step {
    width: 100%;
    margin-top: 0.85rem;
}

.chatflow-builder {
    min-height: calc(100vh - 2.2rem);
}

.chatflow-builder:not(.is-editor-open) {
    grid-template-columns: minmax(0, 1fr);
}

.chatflow-builder.is-editor-open {
    grid-template-columns: minmax(0, 1fr);
}

.chatflow-builder.is-editor-open .chatflow-tile-panel {
    display: none;
}

.chatflow-tile-panel {
    min-height: calc(100vh - 2.2rem);
}

.chatflow-list-head {
    margin-bottom: 1rem;
}

.chatflow-tile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
    gap: 0.75rem;
}

.chatflow-tile {
    display: grid;
    min-height: 9rem;
    align-content: start;
    gap: 0.55rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.85rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.07), transparent 48%),
        rgba(255, 255, 255, 0.82);
    box-shadow: 0 0.7rem 1.8rem rgba(31, 42, 68, 0.07);
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.chatflow-tile:hover {
    transform: translateY(-2px);
    border-color: rgba(138, 104, 29, 0.26);
    box-shadow: 0 1rem 2.2rem rgba(31, 42, 68, 0.1);
}

.chatflow-tile-top {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-width: 0;
    gap: 0.55rem;
    align-items: start;
}

.chatflow-tile-icon {
    position: relative;
    display: grid;
    width: 2.05rem;
    height: 2.05rem;
    place-items: center;
    border-radius: 999px;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.6rem 1.2rem rgba(138, 104, 29, 0.16);
}

.chatflow-tile-icon:before {
    content: "";
    width: 0.82rem;
    height: 0.62rem;
    border: 0.13rem solid #fff;
    border-radius: 0.22rem;
    box-sizing: border-box;
}

.chatflow-tile-icon:after {
    content: "";
    position: absolute;
    right: 0.52rem;
    bottom: 0.5rem;
    width: 0.32rem;
    height: 0.32rem;
    border-right: 0.13rem solid #fff;
    border-bottom: 0.13rem solid #fff;
    transform: rotate(45deg);
}

.chatflow-tile-title {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.chatflow-tile-top strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.98rem;
    line-height: 1.2;
}

.chatflow-tile-title small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chatflow-tile-top .commerce-status-pill {
    flex: 0 0 auto;
}

.chatflow-tile-meta,
.chatflow-tile-mode {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
}

.chatflow-tile-mode {
    color: #5f4512;
}

.chatflow-empty-state {
    justify-items: start;
    text-align: left;
}

.chatflow-empty-state strong {
    color: var(--ink);
    font-size: 0.98rem;
    font-weight: 900;
}

.chatflow-empty-state span {
    max-width: 28rem;
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 520;
    line-height: 1.5;
}

.chatflow-tile p {
    display: -webkit-box;
    margin: 0.1rem 0 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.email-responder-layout {
    display: grid;
    grid-template-columns: minmax(13rem, 0.35fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.email-responder-list,
.email-responder-editor {
    display: grid;
    gap: 0.8rem;
}

.email-responder-editor {
    min-width: 0;
}

.email-responder-toolbar,
.email-responder-card {
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 1rem 2.4rem rgba(31, 42, 68, 0.07);
}

.email-responder-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem;
}

.email-responder-card {
    display: grid;
    gap: 0.85rem;
    padding: 0.95rem;
}

.email-responder-card h2 {
    margin: 0;
    font-size: 0.95rem;
}

.email-responder-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.email-responder-fields label,
.email-trigger-row label {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 800;
}

.email-responder-fields label.wide {
    grid-column: 1 / -1;
}

.email-trigger-list {
    display: grid;
    gap: 0.65rem;
}

.email-trigger-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.65rem;
    align-items: end;
    padding: 0.62rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: 8px;
    background: rgba(248, 246, 239, 0.78);
}

.email-trigger-add {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
}

.suggestion-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.suggestion-chip {
    display: inline-flex;
    min-height: 2.15rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0.38rem 0.78rem;
    color: #35290d;
    background: linear-gradient(135deg, rgba(138, 104, 29, 0.14), rgba(138, 104, 29, 0.05));
    font-size: 0.78rem;
    font-weight: 850;
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.suggestion-chip:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.35);
    box-shadow: 0 0.65rem 1.3rem rgba(138, 104, 29, 0.12);
}

.email-send-once {
    align-self: end;
    min-height: 3.15rem;
    justify-content: flex-start;
}

@media (max-width: 900px) {
    .email-responder-layout {
        grid-template-columns: 1fr;
    }

    .email-responder-fields,
    .email-trigger-row,
    .email-trigger-add {
        grid-template-columns: 1fr;
    }
}

.cta-library-panel {
    min-height: calc(100vh - 2.2rem);
}

.cta-library-intro {
    max-width: 48rem;
    margin: 0.45rem 0 0;
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.55;
}

.cta-library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr));
    gap: 1rem;
}

@media (min-width: 980px) {
    .cta-library-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.cta-library-tile {
    position: relative;
    display: grid;
    min-height: 11rem;
    align-content: start;
    gap: 0.72rem;
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-left: 0.24rem solid var(--cta-color, #8a681d);
    border-radius: 8px;
    padding: 1rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.84);
    box-shadow: 0 0.7rem 1.8rem rgba(31, 42, 68, 0.07);
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.cta-library-tile .cta-tile-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
}

.cta-type-icon {
    position: relative;
    display: inline-grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    flex: 0 0 auto;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--cta-color, #8a681d) 26%, #ffffff 74%);
    border-radius: 8px;
    color: #fff;
    background:
        linear-gradient(135deg, var(--cta-color, #8a681d), color-mix(in srgb, var(--cta-color, #8a681d) 54%, #050505 46%));
    box-shadow: 0 0.65rem 1.35rem color-mix(in srgb, var(--cta-color, #8a681d) 18%, transparent);
}

.cta-type-icon:before,
.cta-type-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.cta-type-icon:before {
    width: 0.9rem;
    height: 0.9rem;
    border-top: 0.15rem solid currentColor;
    border-right: 0.15rem solid currentColor;
    transform: rotate(45deg);
}

.cta-type-icon:after {
    width: 0.98rem;
    height: 0.15rem;
    border-radius: 999px;
    background: currentColor;
}

.cta-type-icon.is-calendar:before {
    width: 1.05rem;
    height: 0.92rem;
    border: 0.14rem solid currentColor;
    border-top-width: 0.28rem;
    border-radius: 0.16rem;
    transform: none;
}

.cta-type-icon.is-calendar:after {
    width: 0.6rem;
    height: 0.12rem;
    transform: translateY(0.1rem);
}

.cta-type-icon.is-mail:before {
    width: 1.16rem;
    height: 0.82rem;
    border: 0.14rem solid currentColor;
    border-radius: 0.14rem;
    transform: none;
}

.cta-type-icon.is-mail:after {
    width: 0.72rem;
    height: 0.72rem;
    border-right: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    background: transparent;
    transform: translateY(-0.12rem) rotate(45deg);
}

.cta-type-icon.is-payment:before {
    width: 1.16rem;
    height: 0.82rem;
    border: 0.14rem solid currentColor;
    border-radius: 0.16rem;
    transform: none;
}

.cta-type-icon.is-payment:after {
    width: 0.76rem;
    height: 0.14rem;
    transform: translateY(-0.16rem);
}

.cta-type-icon.is-quote:before,
.cta-type-icon.is-contact:before,
.cta-type-icon.is-team:before,
.cta-type-icon.is-register:before,
.cta-type-icon.is-message:before {
    width: 1.05rem;
    height: 1.05rem;
    border: 0.14rem solid currentColor;
    border-radius: 999px;
    transform: none;
}

.cta-type-icon.is-quote:after,
.cta-type-icon.is-contact:after,
.cta-type-icon.is-team:after,
.cta-type-icon.is-register:after,
.cta-type-icon.is-message:after {
    width: 0.68rem;
    height: 0.14rem;
    transform: translateY(0.56rem);
}

.cta-tile-title {
    display: grid;
    min-width: 0;
    gap: 0.18rem;
}

.cta-tile-title small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.28;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cta-library-tile:hover,
.cta-library-tile.is-selected {
    transform: translateY(-2px);
    border-color: rgba(138, 104, 29, 0.24);
    border-left-color: var(--cta-color, #8a681d);
    box-shadow: 0 1rem 2.2rem rgba(31, 42, 68, 0.1);
}

.cta-library-tile:after {
    content: "";
    position: absolute;
    right: -1.7rem;
    bottom: -1.9rem;
    width: 5.2rem;
    height: 5.2rem;
    border-radius: 999px;
    background: var(--cta-color, #8a681d);
    opacity: 0.08;
}

.cta-library-tile .chatflow-tile-top,
.cta-library-tile .cta-type-label,
.cta-library-tile .cta-tile-meta-row,
.cta-library-tile .cta-click-count,
.cta-library-tile p {
    position: relative;
    z-index: 1;
}

.cta-tile-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}

.cta-type-label {
    color: var(--cta-color, #8a681d);
    font-size: 0.76rem;
    font-weight: 650;
}

.cta-click-count {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: baseline;
    gap: 0.25rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 8px;
    padding: 0.38rem 0.52rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.45rem 1rem rgba(31, 42, 68, 0.06);
}

.cta-click-count b {
    color: var(--cta-color, #8a681d);
    font-size: 1rem;
    line-height: 1;
    font-weight: 950;
}

.cta-click-count small {
    color: var(--muted);
    font-size: 0.66rem;
    font-weight: 850;
}

:root[data-theme="dark"] .cta-click-count {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
}

.cta-library-tile p {
    display: -webkit-box;
    margin: 0.1rem 0 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.cta-editor-panel .cms-editor-bar .danger {
    min-height: 2.4rem;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.14);
}

.cta-editor-grid .wide {
    grid-column: 1 / -1;
}

.cta-preview-card {
    display: grid;
    gap: 0.55rem;
    margin-top: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 8px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), transparent 48%),
        rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.8rem 1.8rem rgba(31, 42, 68, 0.07);
}

.cta-preview-card span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cta-preview-card .cta-type-icon {
    color: #fff;
    font-size: 1rem;
    letter-spacing: 0;
    text-transform: none;
}

.cta-preview-title {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.cta-preview-card strong {
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 600;
}

.cta-preview-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.cta-preview-card button {
    justify-self: start;
    min-height: 2.6rem;
    border: 0;
    border-radius: 8px;
    padding: 0 1rem;
    color: #fff;
    background: var(--cta-color, #8a681d);
    font: inherit;
    font-size: 0.84rem;
    font-weight: 650;
}

.forms-library-panel,
.forms-editor-panel {
    min-height: calc(100vh - 2.2rem);
}

.forms-library-grid {
    grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
}

.forms-overview-panel {
    display: grid;
    gap: 0.8rem;
    border: 1px solid rgba(118, 90, 130, 0.15);
    border-radius: 0.9rem;
    padding: 0.9rem;
    background:
        radial-gradient(circle at top right, rgba(118, 90, 130, 0.12), transparent 9rem),
        rgba(255, 255, 255, 0.72);
}

.forms-overview-panel strong {
    display: block;
    color: var(--ink);
    font-size: 1.05rem;
}

.forms-overview-panel p {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.45;
}

.forms-overview-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(4.4rem, 1fr));
    gap: 0.45rem;
}

.forms-overview-stats span {
    display: grid;
    gap: 0.08rem;
    border: 1px solid rgba(118, 90, 130, 0.12);
    border-radius: 0.72rem;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.74);
}

.forms-overview-stats strong {
    font-size: 1.15rem;
}

.forms-overview-stats small {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.form-library-tile {
    border-left-color: #765a82;
}

.form-library-row {
    display: grid;
    gap: 0.55rem;
}

.form-preview-button {
    display: inline-flex;
    min-height: 2.35rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(118, 90, 130, 0.2);
    border-radius: 8px;
    padding: 0 0.78rem;
    color: #3f2f48;
    background: rgba(118, 90, 130, 0.1);
    box-shadow: 0 0.55rem 1.2rem rgba(31, 42, 68, 0.06);
    font-size: 0.78rem;
    font-weight: 920;
    text-decoration: none;
}

.form-preview-button:hover {
    transform: translateY(-1px);
    background: rgba(118, 90, 130, 0.16);
}

.form-card-icon {
    position: relative;
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border-radius: 0.8rem;
    color: #fff;
    background: linear-gradient(135deg, #765a82, #422948);
    box-shadow: 0 0.55rem 1.15rem rgba(118, 90, 130, 0.18);
}

.form-card-icon::before,
.form-card-icon::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    background: currentColor;
}

.form-card-icon::before {
    width: 1.05rem;
    height: 0.12rem;
    box-shadow: 0 0.36rem 0 currentColor, 0 0.72rem 0 currentColor;
}

.form-card-icon::after {
    right: 0.56rem;
    top: 0.61rem;
    width: 0.28rem;
    height: 0.28rem;
}

.form-card-meta {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.38rem;
}

.form-card-meta span {
    display: inline-flex;
    min-height: 1.65rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.6rem;
    color: #513a60;
    background: rgba(118, 90, 130, 0.1);
    font-size: 0.72rem;
    font-weight: 820;
}

.forms-editor-top-actions {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    justify-content: end;
}

.forms-builder-layout,
.forms-builder-main,
.forms-builder-preview {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.forms-builder-main .forms-editor-grid,
.forms-builder-main .forms-field-section,
.forms-builder-main .forms-delivery-card {
    max-width: none;
}

.forms-editor-grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 54rem;
}

.forms-field-section {
    display: grid;
    gap: 0.7rem;
    max-width: 62rem;
    margin-top: 1rem;
}

.forms-field-head {
    align-items: center;
    margin-bottom: 0;
}

.form-field-type-picker {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
    gap: 0.55rem;
}

.form-field-type-option {
    position: relative;
    display: grid;
    min-height: 6rem;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.16rem 0.62rem;
    align-content: center;
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(118, 90, 130, 0.14);
    border-radius: 8px;
    padding: 0.7rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(118, 90, 130, 0.07), transparent 48%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.65rem 1.45rem rgba(31, 42, 68, 0.055);
    text-align: left;
    cursor: pointer;
}

.form-field-type-option:hover,
.form-field-type-option:focus-visible {
    border-color: rgba(118, 90, 130, 0.28);
    box-shadow: 0 0.95rem 1.9rem rgba(31, 42, 68, 0.09);
    transform: translateY(-1px);
}

.form-field-option-icon {
    position: relative;
    display: grid;
    grid-row: 1 / span 2;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(135deg, #765a82, #4b344f);
    box-shadow: 0 0.55rem 1.1rem rgba(118, 90, 130, 0.18);
}

.form-field-option-icon:before,
.form-field-option-icon:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.form-field-option-icon:before {
    width: 1.05rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0.34rem 0 currentColor, 0 0.68rem 0 currentColor;
}

.form-field-type-option.is-text .form-field-option-icon:after,
.form-field-type-option.is-textarea .form-field-option-icon:after {
    width: 0.9rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateY(-0.54rem);
}

.form-field-type-option.is-multiple-choice .form-field-option-icon:before,
.form-field-type-option.is-select .form-field-option-icon:before {
    left: 0.55rem;
    width: 0.25rem;
    height: 0.25rem;
    border-radius: 999px;
    box-shadow: 0 0.42rem 0 currentColor, 0 0.84rem 0 currentColor;
}

.form-field-type-option.is-multiple-choice .form-field-option-icon:after,
.form-field-type-option.is-select .form-field-option-icon:after {
    right: 0.54rem;
    width: 0.72rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0.42rem 0 currentColor, 0 0.84rem 0 currentColor;
}

.form-field-type-option.is-file-upload .form-field-option-icon:before,
.form-field-type-option.is-photo-capture .form-field-option-icon:before {
    width: 1.05rem;
    height: 0.82rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.16rem;
    background: transparent;
    box-shadow: none;
}

.form-field-type-option.is-file-upload .form-field-option-icon:after,
.form-field-type-option.is-photo-capture .form-field-option-icon:after {
    width: 0.5rem;
    height: 0.5rem;
    border-top: 0.13rem solid currentColor;
    border-right: 0.13rem solid currentColor;
    transform: translateY(-0.02rem) rotate(-45deg);
}

.form-field-type-option.is-email .form-field-option-icon:before {
    width: 1.14rem;
    height: 0.82rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.15rem;
    background: transparent;
    box-shadow: none;
}

.form-field-type-option.is-email .form-field-option-icon:after {
    width: 0.72rem;
    height: 0.72rem;
    border-right: 0.13rem solid currentColor;
    border-bottom: 0.13rem solid currentColor;
    transform: translateY(-0.12rem) rotate(45deg);
}

.form-field-type-option.is-phone .form-field-option-icon:before {
    width: 0.72rem;
    height: 1.18rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.18rem;
    background: transparent;
    box-shadow: none;
}

.form-field-type-option.is-phone .form-field-option-icon:after {
    width: 0.18rem;
    height: 0.18rem;
    border-radius: 999px;
    background: currentColor;
    transform: translateY(0.42rem);
}

.form-field-type-option.is-checkbox .form-field-option-icon:before {
    width: 1rem;
    height: 1rem;
    border: 0.13rem solid currentColor;
    border-radius: 0.18rem;
    background: transparent;
    box-shadow: none;
}

.form-field-type-option.is-checkbox .form-field-option-icon:after {
    width: 0.58rem;
    height: 0.32rem;
    border-left: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    transform: translateY(-0.05rem) rotate(-45deg);
}

.form-field-type-option strong,
.form-field-type-option small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-field-type-option strong {
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 650;
    white-space: nowrap;
}

.form-field-type-option small {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.22;
}

.form-field-stack {
    display: grid;
    gap: 0.65rem;
}

.form-field-card {
    display: grid;
    gap: 0.7rem;
    border: 1px solid rgba(118, 90, 130, 0.14);
    border-left: 0.24rem solid #765a82;
    border-radius: 8px;
    padding: 0.82rem;
    background:
        linear-gradient(135deg, rgba(118, 90, 130, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.06);
}

.form-field-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
}

.form-field-card-head > span:last-child {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 500;
}

.form-field-type-badge {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 0.68rem;
    color: #513a60;
    background: rgba(118, 90, 130, 0.1);
    font-size: 0.74rem;
    font-weight: 650;
}

.form-delivery-note {
    position: relative;
    z-index: 1;
    color: #513a60;
    font-size: 0.74rem;
    font-weight: 850;
}

.forms-delivery-card {
    display: grid;
    gap: 0.72rem;
    max-width: 62rem;
    margin-top: 1rem;
    border: 1px solid rgba(118, 90, 130, 0.14);
    border-radius: 8px;
    padding: 0.9rem;
    background:
        linear-gradient(135deg, rgba(118, 90, 130, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.76);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.06);
}

.forms-delivery-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.72rem;
    align-items: center;
    justify-content: space-between;
}

.forms-delivery-head h2 {
    margin: 0.22rem 0 0;
    font-size: 1rem;
}

.forms-delivery-grid {
    display: grid;
    gap: 0.62rem;
}

.forms-delivery-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.form-email-toggle {
    min-width: 8rem;
}

.forms-editor-empty {
    display: grid;
    place-items: center;
    gap: 1rem;
    min-height: clamp(26rem, 62vh, 38rem);
    border: 1px dashed rgba(118, 90, 130, 0.24);
    border-radius: 1.1rem;
    padding: clamp(1.2rem, 3vw, 2.4rem);
    text-align: center;
    background:
        radial-gradient(circle at top left, rgba(118, 90, 130, 0.14), transparent 38%),
        rgba(255, 255, 255, 0.72);
}

.forms-empty-mark {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 1.25rem;
    color: #fff;
    background: linear-gradient(135deg, #765a82, #3d253f);
    box-shadow: 0 1rem 2.4rem rgba(118, 90, 130, 0.2);
}

.forms-empty-mark::before,
.forms-empty-mark::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.forms-empty-mark::before {
    width: 1.5rem;
    height: 1.85rem;
    border: 0.15rem solid currentColor;
    border-radius: 0.18rem;
}

.forms-empty-mark::after {
    width: 0.82rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0.44rem 0 currentColor;
    transform: translateY(-0.18rem);
}

.forms-editor-empty h1 {
    margin: 0.1rem 0 0;
}

.forms-editor-empty p {
    max-width: 42rem;
    margin: 0.35rem auto 0;
    color: var(--muted);
    line-height: 1.65;
}

.forms-editor-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}

.forms-submissions-page {
    display: grid;
    gap: 1rem;
    max-width: 88rem;
}

.forms-submission-toolbar {
    display: grid;
    gap: 0.65rem;
}

.submission-sort-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.submission-sort-link {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(118, 90, 130, 0.16);
    border-radius: 999px;
    padding: 0 0.78rem;
    color: #513a60;
    background: rgba(118, 90, 130, 0.08);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.submission-sort-link:hover,
.submission-sort-link.is-active {
    transform: translateY(-1px);
    border-color: rgba(118, 90, 130, 0.3);
    color: #fff;
    background: #765a82;
}

.form-submission-table {
    display: grid;
    gap: 0.55rem;
}

.form-submission-row {
    display: grid;
    gap: 0.65rem;
    border: 1px solid rgba(118, 90, 130, 0.14);
    border-left: 0.24rem solid #765a82;
    border-radius: 8px;
    padding: 0.78rem;
    background:
        linear-gradient(135deg, rgba(118, 90, 130, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.06);
}

.form-submission-row.is-heading {
    display: none;
}

.form-submission-cell {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.form-submission-cell strong,
.form-submission-cell span,
.form-submission-cell small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-submission-cell strong,
.form-submission-cell span {
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 900;
}

.form-submission-cell small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 760;
}

.form-submission-detail {
    min-width: 0;
}

.form-submission-detail summary {
    display: inline-flex;
    min-height: 2.1rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.72rem;
    color: #513a60;
    background: rgba(118, 90, 130, 0.09);
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 900;
}

.form-submission-detail pre {
    overflow: auto;
    max-height: 16rem;
    margin: 0.6rem 0 0;
    border-radius: 8px;
    padding: 0.72rem;
    color: var(--ink);
    background: rgba(246, 248, 255, 0.82);
    font: inherit;
    font-size: 0.78rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.form-submission-detail em {
    display: block;
    margin-top: 0.5rem;
    color: #8b332d;
    font-size: 0.76rem;
    font-style: normal;
    font-weight: 800;
}

@media (min-width: 980px) {
    .forms-submission-toolbar {
        grid-template-columns: minmax(0, 0.7fr) auto;
        align-items: center;
    }

    .submission-sort-nav {
        justify-content: flex-end;
    }

    .form-submission-row {
        grid-template-columns: minmax(8.5rem, 0.7fr) minmax(10rem, 0.85fr) minmax(12rem, 1fr) minmax(9rem, 0.75fr) minmax(4.5rem, 0.4fr);
        align-items: start;
    }

    .form-submission-row.is-heading {
        display: grid;
        border-left-color: transparent;
        padding-top: 0.35rem;
        padding-bottom: 0.35rem;
        color: var(--muted);
        background: transparent;
        box-shadow: none;
        font-size: 0.72rem;
        font-weight: 950;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }
}

.form-field-main {
    display: grid;
    gap: 0.55rem;
}

.form-field-main label,
.forms-editor-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 500;
}

@media (min-width: 880px) {
    .forms-builder-layout {
        grid-template-columns: minmax(0, 1.45fr) minmax(19rem, 0.78fr);
        align-items: start;
    }

    .forms-builder-preview {
        position: sticky;
        top: 1rem;
    }

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

@media (min-width: 1120px) {
    .cms-live-editor-layout {
        grid-template-columns: minmax(0, 1.18fr) minmax(22rem, 0.82fr);
    }

    .cms-live-preview-panel {
        position: sticky;
        top: 0.75rem;
    }
}

@media (max-width: 720px) {
    .forms-editor-empty-actions {
        width: 100%;
    }

    .forms-editor-empty-actions > * {
        flex: 1 1 100%;
    }
}

.form-field-options {
    grid-column: 1 / -1;
}

.form-field-options textarea {
    min-height: 4.8rem;
    resize: vertical;
}

.form-field-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    justify-content: space-between;
}

.form-required-toggle {
    min-width: 8.5rem;
}

.form-preview-card {
    max-width: 34rem;
}

.form-live-preview-card {
    width: 100%;
    max-width: none;
    align-content: start;
    border-color: rgba(118, 90, 130, 0.16);
    background:
        radial-gradient(circle at 90% 4%, rgba(118, 90, 130, 0.12), transparent 9rem),
        rgba(255, 255, 255, 0.86);
}

.form-live-preview-fields {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.2rem;
}

.form-live-preview-field {
    display: grid;
    gap: 0.36rem;
    color: var(--ink);
    font-size: 0.8rem;
    font-weight: 600;
}

.form-live-preview-field > span:first-child {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.38rem;
}

.form-live-preview-field em {
    display: inline-flex;
    min-height: 1.15rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.38rem;
    color: #513a60;
    background: rgba(118, 90, 130, 0.1);
    font-size: 0.58rem;
    font-style: normal;
    font-weight: 600;
}

.form-live-preview-field input,
.form-live-preview-field textarea,
.form-live-select,
.form-live-upload {
    width: 100%;
    border: 1px solid rgba(20, 17, 11, 0.12);
    border-radius: 8px;
    padding: 0.7rem 0.78rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.88);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 500;
}

.form-live-preview-field textarea {
    resize: none;
}

.form-live-choice-list {
    display: grid;
    gap: 0.42rem;
}

.form-live-choice-list span,
.form-live-checkbox,
.form-live-upload,
.form-live-select {
    display: flex;
    align-items: center;
    gap: 0.52rem;
    min-height: 2.45rem;
}

.form-live-choice-list i,
.form-live-checkbox i {
    display: block;
    width: 0.88rem;
    height: 0.88rem;
    flex: 0 0 auto;
    border: 1px solid rgba(118, 90, 130, 0.36);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.9);
}

.form-live-checkbox i {
    border-radius: 0.22rem;
}

.form-live-checkbox b {
    font-weight: 500;
}

.form-live-select {
    justify-content: space-between;
}

.form-live-select i {
    width: 0.5rem;
    height: 0.5rem;
    border-right: 0.12rem solid currentColor;
    border-bottom: 0.12rem solid currentColor;
    transform: translateY(-0.12rem) rotate(45deg);
}

.form-live-upload {
    justify-content: center;
    border-style: dashed;
    color: #513a60;
    background: rgba(118, 90, 130, 0.07);
}

.form-live-upload i {
    position: relative;
    width: 1rem;
    height: 1rem;
}

.form-live-upload i:before,
.form-live-upload i:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 999px;
    background: currentColor;
    transform: translate(-50%, -50%);
}

.form-live-upload i:before {
    width: 0.14rem;
    height: 0.9rem;
}

.form-live-upload i:after {
    width: 0.9rem;
    height: 0.14rem;
}

.form-live-preview-empty {
    border: 1px dashed rgba(118, 90, 130, 0.22);
    border-radius: 8px;
    padding: 0.85rem;
    color: var(--muted);
    background: rgba(118, 90, 130, 0.06);
    font-size: 0.82rem;
    font-weight: 500;
    text-align: center;
}

:root[data-theme="dark"] .form-live-preview-card,
:root[data-theme="dark"] .form-field-type-option,
:root[data-theme="dark"] .form-field-card,
:root[data-theme="dark"] .forms-delivery-card,
:root[data-theme="dark"] .forms-overview-panel,
:root[data-theme="dark"] .forms-overview-stats span,
:root[data-theme="dark"] .forms-editor-empty {
    border-color: rgba(222, 205, 158, 0.13);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(222, 205, 158, 0.06)),
        var(--panel);
}

:root[data-theme="dark"] .form-live-preview-field input,
:root[data-theme="dark"] .form-live-preview-field textarea,
:root[data-theme="dark"] .form-live-select,
:root[data-theme="dark"] .form-live-upload {
    border-color: rgba(222, 205, 158, 0.14);
    background: rgba(255, 255, 255, 0.07);
}

.form-preview-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 10% 5%, rgba(118, 90, 130, 0.12), transparent 18rem),
        #f6f4ef;
}

.form-preview-public-card {
    width: min(100%, 40rem);
    margin: 0 auto;
}

.form-preview-choice-list {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.35rem;
}

.form-preview-choice-list span,
.form-preview-checkbox {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    color: var(--ink);
    font-weight: 780;
}

.form-submission-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
}

.seo-page {
    display: grid;
    gap: 1rem;
    max-width: 92rem;
}

.seo-mini-grid,
.seo-setup-grid {
    display: grid;
    gap: 0.72rem;
}

.seo-mini-grid {
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}

.seo-mini-card,
.seo-settings-card,
.seo-location-card,
.seo-check-row,
.seo-sitemap-row,
.seo-ai-row,
.seo-ai-actions-panel,
.seo-ai-opportunities {
    border: 1px solid rgba(47, 125, 80, 0.14);
    border-left: 0.24rem solid #2f7d50;
    border-radius: 8px;
    padding: 0.86rem;
    background:
        linear-gradient(135deg, rgba(47, 125, 80, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.06);
}

.seo-mini-card {
    display: grid;
    gap: 0.28rem;
}

.seo-mini-card span,
.seo-sitemap-date {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.seo-mini-card strong {
    color: #1f5f3d;
    font-size: 1.75rem;
    line-height: 1;
}

.seo-mini-card small,
.seo-check-row small,
.seo-sitemap-row small,
.seo-ai-row small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.seo-form-grid,
.seo-location-main {
    display: grid;
    gap: 0.62rem;
}

.seo-form-grid label,
.seo-location-main label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.seo-form-grid .wide {
    grid-column: 1 / -1;
}

.seo-toggle {
    min-width: 9.5rem;
}

.seo-favicon-box {
    display: grid;
    gap: 0.72rem;
}

.seo-favicon-preview {
    display: grid;
    width: 4.2rem;
    height: 4.2rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
}

.seo-favicon-preview img {
    width: 2.8rem;
    height: 2.8rem;
    object-fit: contain;
}

.seo-favicon-empty {
    padding: 0.3rem;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 850;
    text-align: center;
}

.seo-action-grid .quiet-feature-card {
    --module-color: #2f7d50;
}

.seo-location-list,
.seo-check-list,
.seo-sitemap-list,
.seo-ai-list {
    display: grid;
    gap: 0.62rem;
}

.seo-location-card,
.seo-check-row,
.seo-sitemap-row,
.seo-ai-row {
    display: grid;
    gap: 0.68rem;
}

.seo-check-row,
.seo-sitemap-row,
.seo-ai-row {
    align-items: center;
}

.seo-check-row h2,
.seo-sitemap-row h2,
.seo-row-title {
    margin: 0.12rem 0;
    overflow: hidden;
    font-size: 0.98rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.seo-check-row .button-soft {
    min-height: 2.25rem;
}

.seo-ai-hero-grid {
    display: grid;
    gap: 0.72rem;
}

.seo-ai-intro {
    min-height: 100%;
}

.seo-ai-actions-panel {
    display: grid;
    gap: 0.62rem;
}

.seo-ai-actions-panel h2,
.seo-ai-opportunities h2 {
    margin: 0;
    font-size: clamp(1.2rem, 2.6vw, 1.85rem);
}

.seo-ai-actions-panel p,
.seo-ai-row p,
.seo-sitemap-row p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.seo-ai-row-main {
    min-width: 0;
}

.seo-ai-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}

.seo-ai-opportunities {
    display: grid;
    gap: 0.72rem;
}

.seo-ai-opportunities ul {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding-left: 1.1rem;
    color: var(--ink);
    line-height: 1.55;
}

.seo-opportunity-panel {
    display: grid;
    gap: 0.78rem;
    padding: 1rem;
    border: 1px solid rgba(47, 125, 80, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(47, 125, 80, 0.1), transparent 45%),
        rgba(255, 255, 255, 0.68);
}

.seo-opportunity-grid {
    display: grid;
    gap: 0.72rem;
}

.seo-opportunity-card {
    display: grid;
    gap: 0.58rem;
    align-content: start;
    min-height: 100%;
    padding: 0.86rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 0.24rem solid #2f7d50;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 0.8rem 1.7rem rgba(31, 42, 68, 0.06);
}

.seo-opportunity-card.is-strong {
    border-left-color: var(--accent);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.12), transparent 48%),
        rgba(255, 255, 255, 0.86);
}

.seo-opportunity-label {
    width: fit-content;
    padding: 0.28rem 0.54rem;
    border: 1px solid rgba(47, 125, 80, 0.18);
    border-radius: 999px;
    color: #1f5f3d;
    background: rgba(47, 125, 80, 0.08);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.seo-opportunity-card.is-strong .seo-opportunity-label {
    border-color: rgba(138, 104, 29, 0.24);
    color: #6b4b08;
    background: rgba(138, 104, 29, 0.1);
}

.seo-opportunity-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.2;
}

.seo-opportunity-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 680;
    line-height: 1.5;
}

.seo-opportunity-card .button-soft {
    justify-self: start;
    margin-top: 0.1rem;
}

.seo-opportunity-empty {
    display: grid;
    gap: 0.28rem;
    padding: 0.9rem;
    border: 1px solid rgba(47, 125, 80, 0.14);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.seo-opportunity-empty strong {
    color: #1f5f3d;
    font-size: 1rem;
}

.seo-opportunity-empty span {
    color: var(--muted);
    line-height: 1.5;
}

.seo-health-page {
    gap: 1rem;
}

.seo-health-grid {
    display: grid;
    gap: 0.72rem;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}

.seo-health-card,
.seo-tool-panel,
.seo-health-row {
    border: 1px solid rgba(47, 125, 80, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(47, 125, 80, 0.08), transparent 46%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.75rem 1.7rem rgba(31, 42, 68, 0.06);
}

.seo-health-card {
    display: grid;
    gap: 0.28rem;
    padding: 0.86rem;
}

.seo-health-card span,
.seo-opportunity-label {
    color: #1f5f3d;
}

.seo-health-card span {
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.seo-health-card strong {
    color: #1f5f3d;
    font-size: 1.8rem;
    line-height: 1;
}

.seo-health-card small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 760;
}

.seo-tool-panel {
    display: grid;
    gap: 0.72rem;
    padding: 0.92rem;
}

.seo-basics-list,
.seo-indexing-list,
.seo-phrase-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.seo-basic-item,
.seo-indexing-list span,
.seo-phrase-cloud span {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.38rem 0.62rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.seo-basic-item.is-ok,
.seo-indexing-list .is-ok {
    border-color: rgba(47, 125, 80, 0.2);
    color: #1f5f3d;
    background: rgba(47, 125, 80, 0.08);
}

.seo-basic-item.needs-work,
.seo-indexing-list .needs-work {
    border-color: rgba(138, 104, 29, 0.26);
    color: #6b4b08;
    background: rgba(138, 104, 29, 0.12);
}

.seo-local-grid {
    display: grid;
    gap: 0.72rem;
}

.seo-tool-card {
    display: grid;
    gap: 0.58rem;
    min-width: 0;
}

.seo-tool-card small {
    color: var(--muted);
    font-weight: 750;
}

.seo-gap-grid {
    display: grid;
    gap: 0.62rem;
}

.seo-gap-grid article,
.seo-broken-list article {
    display: grid;
    gap: 0.25rem;
    padding: 0.72rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.seo-gap-grid strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.seo-gap-grid p,
.seo-broken-list p,
.seo-tool-empty span {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.seo-tool-empty {
    padding: 0.85rem;
    border: 1px dashed rgba(15, 23, 42, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.58);
}

.seo-image-alt-list,
.seo-broken-list {
    display: grid;
    gap: 0.62rem;
}

.seo-image-alt-list article {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    padding: 0.62rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.seo-image-alt-list img {
    width: 4.5rem;
    aspect-ratio: 1;
    border-radius: 7px;
    object-fit: cover;
    background: rgba(15, 23, 42, 0.08);
}

.seo-image-alt-list article > div {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.seo-image-alt-list strong,
.seo-image-alt-list small,
.seo-image-alt-list span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.seo-image-alt-list small,
.seo-image-alt-list span {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 760;
}

.seo-health-row {
    display: grid;
    gap: 0.8rem;
    padding: 0.86rem;
}

.seo-score-ring {
    --score: 0;
    display: grid;
    width: 4.6rem;
    aspect-ratio: 1;
    place-items: center;
    justify-self: start;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, var(--surface) 0 57%, transparent 58%),
        conic-gradient(var(--accent) calc(var(--score) * 1%), rgba(15, 23, 42, 0.1) 0);
    color: var(--ink);
}

.seo-score-ring strong {
    margin-top: 0.3rem;
    font-size: 1.2rem;
    line-height: 1;
}

.seo-score-ring span {
    margin-top: -1.35rem;
    color: var(--muted);
    font-size: 0.64rem;
    font-weight: 850;
}

.seo-health-main {
    display: grid;
    gap: 0.7rem;
    min-width: 0;
}

.seo-health-title {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.seo-health-title h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.04rem;
    line-height: 1.2;
}

.seo-google-preview {
    display: grid;
    gap: 0.12rem;
    max-width: 43rem;
    padding: 0.72rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    background: #fff;
}

.seo-google-preview span {
    color: #1a0dab;
    font-size: 1.02rem;
    font-weight: 500;
    line-height: 1.25;
}

.seo-google-preview small {
    overflow: hidden;
    color: #006621;
    font-size: 0.76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.seo-google-preview p {
    margin: 0;
    color: #545454;
    font-size: 0.84rem;
    line-height: 1.35;
}

.seo-focus-line {
    display: grid;
    gap: 0.42rem;
}

.seo-focus-line label {
    display: grid;
    gap: 0.28rem;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
}

.seo-issue-list {
    display: grid;
    gap: 0.32rem;
    margin: 0;
    padding-left: 1.1rem;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 720;
    line-height: 1.42;
}

.seo-health-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
}

@media (min-width: 860px) {
    .seo-setup-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 0.8fr);
        align-items: start;
    }

    .seo-form-grid {
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: end;
    }

    .seo-location-card {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
    }

    .seo-location-main {
        grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 1.2fr) minmax(8rem, 0.65fr) minmax(5rem, 0.38fr);
        align-items: end;
    }

    .seo-check-row,
    .seo-sitemap-row,
    .seo-ai-row {
        grid-template-columns: minmax(0, 1fr) auto auto auto;
    }

    .seo-ai-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.85fr);
        align-items: stretch;
    }

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

    .seo-local-grid {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    }

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

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

    .seo-focus-line {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
    }
}

@media (min-width: 1180px) {
    .seo-opportunity-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.quiet-feature-page {
    max-width: 70rem;
}

.admin-price-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.82rem;
}

.admin-price-card {
    width: 100%;
}

.admin-price-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.72rem;
    align-items: stretch;
}

.admin-price-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
    min-width: 0;
}

.admin-price-grid .wide {
    grid-column: auto;
}

.admin-price-status {
    min-width: 0;
}

.admin-price-status .input-control {
    min-width: 0;
}

.startup-settings-page {
    max-width: 82rem;
}

.startup-settings-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
    margin: 0 0 1rem;
}

.startup-settings-summary span {
    display: grid;
    gap: 0.12rem;
    padding: 0.82rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.68);
}

.startup-settings-summary strong {
    color: var(--ink);
    font-size: 1.28rem;
    line-height: 1;
}

.startup-settings-summary small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 820;
}

.startup-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.startup-business-card {
    display: grid;
    gap: 0.82rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(248, 245, 235, 0.72)),
        rgba(255, 255, 255, 0.74);
    box-shadow: 0 1rem 2rem rgba(52, 35, 6, 0.08);
}

.startup-business-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.startup-business-head h2 {
    margin: 0.12rem 0 0;
    color: var(--ink);
    font-size: 1.12rem;
    line-height: 1.15;
}

.startup-business-head p {
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.startup-module-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.startup-module-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-width: 0;
    min-height: 3.75rem;
    padding: 0.62rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.62);
    cursor: pointer;
}

.startup-module-toggle.is-on,
.startup-module-toggle:has(input:checked) {
    border-color: rgba(47, 125, 80, 0.2);
    background: rgba(47, 125, 80, 0.08);
}

.startup-module-toggle.is-required {
    cursor: default;
}

.startup-module-toggle > span:first-child {
    display: grid;
    gap: 0.14rem;
    min-width: 0;
}

.startup-module-toggle strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.86rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.startup-module-toggle small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 980px) {
    .startup-settings-grid,
    .startup-module-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .startup-settings-summary {
        grid-template-columns: 1fr;
    }

    .startup-business-head {
        display: grid;
    }
}

.quiet-feature-grid {
    display: grid;
    gap: 0.72rem;
}

.quiet-feature-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.35rem;
    min-height: 5.45rem;
    align-content: center;
    align-items: center;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.95rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.quiet-feature-card:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.22);
    box-shadow: var(--shadow);
}

.quiet-feature-card > div {
    display: grid;
    gap: 0.35rem;
}

.quiet-feature-card > div > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.quiet-feature-card .quiet-feature-icon {
    width: 1.4rem;
    height: 1.4rem;
    color: var(--module-color, #8a681d);
}

.quiet-feature-card h2,
.quiet-feature-card strong {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 950;
}

.support-route-page {
    max-width: 76rem;
}

.support-route-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    margin: 0 0 1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 14px;
    padding: 1.15rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(248, 245, 235, 0.78)),
        rgba(255, 255, 255, 0.84);
    box-shadow: var(--soft-shadow);
}

.support-route-hero h2,
.support-route-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.14rem;
    line-height: 1.18;
}

.support-route-hero p,
.support-route-card p {
    margin: 0.48rem 0 0;
    color: var(--muted);
    font-size: 0.94rem;
    line-height: 1.55;
}

.support-route-hero a,
.support-route-card a:not(.button-soft) {
    color: var(--brand-strong);
    font-weight: 850;
}

.support-route-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.9rem;
}

.support-route-card {
    display: grid;
    gap: 0.7rem;
    align-content: start;
    min-height: 13rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 12px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.support-route-card.is-primary {
    border-color: rgba(138, 104, 29, 0.18);
    background:
        linear-gradient(145deg, rgba(138, 104, 29, 0.12), rgba(255, 255, 255, 0.82)),
        rgba(255, 255, 255, 0.86);
}

.support-route-card .button-primary,
.support-route-card .button-soft {
    align-self: end;
    justify-self: start;
}

@media (max-width: 860px) {
    .support-route-hero {
        grid-template-columns: 1fr;
    }

    .support-route-grid {
        grid-template-columns: 1fr;
    }
}

.community-page {
    max-width: 76rem;
}

.community-compose-card {
    display: grid;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 10px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 235, 0.72)),
        rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.community-compose-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.community-compose-head h2 {
    margin: 0.2rem 0 0;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    line-height: 1.05;
}

.community-form-grid {
    display: grid;
    grid-template-columns: minmax(10rem, 0.42fr) minmax(0, 1fr);
    gap: 0.85rem;
}

.community-form-grid label {
    display: grid;
    min-width: 0;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
}

.community-form-grid label > span {
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.community-form-wide {
    grid-column: 1 / -1;
}

.community-feed-grid,
.community-match-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
}

.community-feed-grid > .empty-state,
.community-match-grid > .empty-state {
    grid-column: 1 / -1;
}

.community-feed-card,
.community-win-card {
    position: relative;
    display: grid;
    gap: 0.8rem;
    overflow: hidden;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 10px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--soft-shadow);
}

.community-feed-card:before,
.community-win-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.22rem;
    background: var(--banner-gold-gradient);
}

.community-feed-card.is-recommendation:before {
    background: linear-gradient(90deg, #0f766e, #38bdf8);
}

.community-feed-card.is-availability:before {
    background: linear-gradient(90deg, #635bff, #8b5cf6);
}

.community-feed-card.is-help:before {
    background: linear-gradient(90deg, #2f7d50, #a3e635);
}

.community-feed-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.community-feed-meta small {
    color: rgba(89, 96, 112, 0.82);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: none;
}

.community-feed-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.2rem, 1.8vw, 1.55rem);
    line-height: 1.08;
}

.community-feed-card p,
.community-win-part p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
    white-space: pre-wrap;
}

.community-feed-card footer,
.community-win-card footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem 0.8rem;
    border-top: 1px solid rgba(18, 21, 33, 0.08);
    padding-top: 0.8rem;
    color: var(--muted);
    font-size: 0.8rem;
}

button.seo-basic-item {
    border: 0;
    cursor: pointer;
    font: inherit;
}

button.seo-basic-item:hover,
button.seo-basic-item:focus,
button.seo-basic-item.is-active {
    transform: translateY(-1px);
    box-shadow: 0 0.85rem 1.7rem rgba(31, 42, 68, 0.14);
    outline: none;
}

button.seo-basic-item.is-active {
    outline: 2px solid rgba(138, 104, 29, 0.38);
    outline-offset: 2px;
}

.seo-check-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
}

.seo-active-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0.35rem 0.4rem 0.35rem 0.75rem;
    color: var(--brand-deep);
    background: rgba(248, 245, 235, 0.82);
    box-shadow: 0 0.75rem 1.6rem rgba(31, 42, 68, 0.08);
    font-size: 0.78rem;
    font-weight: 900;
    white-space: nowrap;
}

.seo-active-filter[hidden] {
    display: none;
}

.seo-active-filter .button-soft {
    min-height: 2rem;
    padding: 0 0.7rem;
}

.seo-health-row.is-seo-filtered-out {
    display: none;
}

@media (max-width: 720px) {
    .seo-check-toolbar {
        grid-template-columns: 1fr;
    }

    .seo-active-filter {
        justify-content: space-between;
        white-space: normal;
    }
}

.community-feed-card footer strong,
.community-win-card footer strong {
    color: var(--ink);
    font-weight: 950;
}

.community-win-part {
    display: grid;
    gap: 0.38rem;
    border: 1px solid rgba(138, 104, 29, 0.1);
    border-radius: 8px;
    padding: 0.75rem;
    background: rgba(248, 245, 235, 0.48);
}

.community-win-part span {
    color: var(--gold-dark);
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.community-match-card {
    position: relative;
    display: grid;
    min-height: 18rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    padding: 1rem;
    color: var(--directory-text);
    background:
        radial-gradient(circle at 18% 8%, rgba(255, 255, 255, 0.24), transparent 32%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.2)),
        var(--directory-primary);
    box-shadow: var(--soft-shadow);
}

.community-match-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.24rem;
    background: var(--directory-accent);
}

.community-match-logo {
    display: grid;
    width: 4rem;
    height: 4rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14);
}

.community-match-logo img {
    display: block;
    max-width: 84%;
    max-height: 84%;
    object-fit: contain;
}

.community-match-logo span {
    color: #111827;
    font-size: 1.32rem;
    font-weight: 950;
}

.community-match-copy {
    display: grid;
    gap: 0.5rem;
    align-self: end;
}

.community-match-copy span {
    color: currentColor;
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.05em;
    opacity: 0.72;
    text-transform: uppercase;
}

.community-match-copy h2 {
    margin: 0;
    color: currentColor;
    font-size: clamp(1.35rem, 2.1vw, 2rem);
    line-height: 0.98;
    font-weight: 950;
}

.community-match-copy p {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: currentColor;
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0.86;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.community-match-actions {
    display: grid;
    align-self: end;
}

.community-match-muted {
    display: inline-flex;
    min-height: 2.85rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 0 1rem;
    color: currentColor;
    background: rgba(0, 0, 0, 0.16);
    font-size: 0.8rem;
    font-weight: 950;
}

.community-directory-page {
    max-width: 92rem;
    margin: 0 auto;
}

.community-directory-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.95rem;
}

.community-directory-card {
    position: relative;
    display: grid;
    min-height: 20rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    padding: 1rem;
    color: var(--directory-text);
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.18)),
        var(--directory-primary);
    box-shadow: var(--soft-shadow);
}

.community-directory-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.24rem;
    background: var(--directory-accent);
}

.community-directory-logo {
    display: grid;
    width: 4.4rem;
    height: 4.4rem;
    place-items: center;
    align-self: start;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14);
}

.community-directory-logo img {
    display: block;
    max-width: 84%;
    max-height: 84%;
    object-fit: contain;
}

.community-directory-logo span {
    color: #111827;
    font-size: 1.45rem;
    font-weight: 950;
}

.community-directory-copy {
    display: grid;
    gap: 0.55rem;
    align-self: end;
}

.community-directory-copy span {
    color: currentColor;
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.05em;
    opacity: 0.72;
    text-transform: uppercase;
}

.community-directory-copy h2 {
    margin: 0;
    color: currentColor;
    font-size: clamp(1.35rem, 2.1vw, 2rem);
    line-height: 0.98;
    font-weight: 950;
}

.community-directory-copy p {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: currentColor;
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0.86;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.community-directory-link {
    display: inline-flex;
    width: 100%;
    min-height: 2.85rem;
    align-items: center;
    justify-content: center;
    align-self: end;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 999px;
    color: var(--directory-text);
    background: rgba(0, 0, 0, 0.18);
    font-size: 0.82rem;
    font-weight: 950;
    text-decoration: none;
    transition: transform 180ms ease, background 180ms ease;
}

.community-directory-link:hover {
    background: rgba(0, 0, 0, 0.28);
    transform: translateY(-1px);
}

.community-directory-link.is-muted {
    cursor: default;
    opacity: 0.72;
}

.community-directory-link.is-muted:hover {
    background: rgba(0, 0, 0, 0.18);
    transform: none;
}

@media (max-width: 980px) {
    .community-directory-grid,
    .community-feed-grid,
    .community-match-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .community-directory-grid,
    .community-feed-grid,
    .community-match-grid,
    .community-form-grid {
        grid-template-columns: 1fr;
    }

    .community-directory-card {
        min-height: 17rem;
    }

    .community-compose-head .button-primary {
        width: 100%;
    }
}

.integration-hub-page {
    max-width: 74rem;
}

.integration-hub-page.community-page {
    max-width: 76rem;
}

.integration-overview-strip {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    margin-bottom: 1rem;
}

.integration-overview-card {
    display: grid;
    gap: 0.72rem;
    align-content: start;
    --integration-overview-ink: #141820;
    --integration-overview-muted: rgba(20, 24, 32, 0.72);
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--soft-shadow);
    color: var(--integration-overview-ink);
}

.integration-overview-card.is-live {
    border-color: rgba(138, 104, 29, 0.18);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(138, 104, 29, 0.1));
}

.integration-overview-card.is-review {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(48, 55, 70, 0.08));
}

.integration-overview-card h2 {
    margin: 0;
    color: var(--integration-overview-ink);
    font-size: 1.05rem;
    font-weight: 850;
    line-height: 1.2;
    text-shadow: none;
}

.integration-overview-card p {
    margin: 0;
    color: var(--integration-overview-muted);
    font-size: 0.9rem;
    line-height: 1.5;
    text-shadow: none;
}

.integration-overview-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-self: end;
}

.integration-overview-card .integration-status {
    color: #3d2c0a;
    background: rgba(255, 255, 255, 0.82);
    border-color: rgba(138, 104, 29, 0.18);
    text-shadow: none;
}

.integration-overview-card .integration-status.is-live,
.integration-overview-card .integration-status.is-ready {
    color: #1b5a35;
}

.integration-overview-card .button-secondary {
    color: #21180b;
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(138, 104, 29, 0.18);
}

.integration-section-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0.2rem 0 0.72rem;
    border-top: 1px solid rgba(18, 21, 33, 0.08);
    padding-top: 0.85rem;
}

.integration-section-label span {
    color: var(--gold-strong);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.integration-section-label strong {
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 650;
}

.integration-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.integration-card {
    --integration-ink: #111827;
    --integration-muted: #596070;
    position: relative;
    display: grid;
    gap: 0.82rem;
    min-height: 14.2rem;
    align-content: start;
    overflow: visible;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 1.05rem;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.62));
    color: var(--integration-ink);
    box-shadow: var(--soft-shadow);
    scroll-margin-top: 1.2rem;
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.integration-card:hover {
    transform: translateY(-1px);
    border-color: rgba(138, 104, 29, 0.2);
    box-shadow: var(--shadow);
}

.integration-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.18rem;
    background: var(--integration-color, var(--gold));
}

.integration-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}

.integration-logo {
    width: 1.45rem;
    height: 1.45rem;
    color: var(--integration-color, var(--gold));
}

.brand-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.75rem;
    min-height: 1.55rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    padding: 0 0.62rem;
    color: #fff;
    background: var(--integration-color, #69490c);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 0.7rem 1.4rem rgba(18, 21, 33, 0.12);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.01em;
    line-height: 1;
    white-space: nowrap;
}

.brand-logo-google {
    border-color: rgba(66, 133, 244, 0.18);
    color: #1f2937;
    background: linear-gradient(135deg, #fff 0 55%, rgba(251, 188, 5, 0.22));
    box-shadow: inset 0 0 0 2px rgba(66, 133, 244, 0.08), 0 0.7rem 1.4rem rgba(18, 21, 33, 0.1);
}

.brand-logo-gmail {
    background: linear-gradient(135deg, #ea4335, #fbbc05 48%, #34a853);
}

.brand-logo-mailchimp {
    color: #241c15;
    background: linear-gradient(135deg, #ffe01b, #f7c948);
}

.brand-logo-mailgun {
    background: linear-gradient(135deg, #f06a3d, #721b63);
}

.brand-logo-microsoft {
    background: linear-gradient(135deg, #f25022 0 48%, #7fba00 48% 52%, #00a4ef 52% 76%, #ffb900 76%);
}

.brand-logo-apple {
    background: linear-gradient(135deg, #111827, #3f4551);
}

.brand-logo-stripe {
    background: linear-gradient(135deg, #635bff, #3d36b8);
}

.brand-logo-paypal {
    background: linear-gradient(135deg, #003087, #009cde);
}

.brand-logo-xero {
    background: linear-gradient(135deg, #13b5ea, #0c7fb5);
}

.brand-logo-sage {
    color: #062812;
    background: linear-gradient(135deg, #00dc06, #9be15d);
}

.brand-logo-quickbooks {
    background: linear-gradient(135deg, #2ca01c, #108000);
}

.brand-logo-freeagent {
    background: linear-gradient(135deg, #2151a1, #1c2c54);
}

.brand-logo-ai {
    background: linear-gradient(135deg, #111827, #6f5f46);
}

.brand-logo-social {
    background: linear-gradient(135deg, #1877f2, #833ab4 48%, #e60023);
}

.integration-status {
    display: inline-flex;
    align-items: center;
    min-height: 1.55rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 999px;
    padding: 0 0.62rem;
    color: var(--integration-muted);
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.7rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.integration-status.is-ready {
    border-color: rgba(105, 73, 12, 0.22);
    color: #69490c;
    background: rgba(138, 104, 29, 0.12);
}

.integration-status.is-live {
    border-color: rgba(47, 125, 80, 0.22);
    color: #1f5f3d;
    background: rgba(47, 125, 80, 0.12);
}

.integration-status.is-error {
    border-color: rgba(166, 90, 69, 0.24);
    color: #743a2c;
    background: rgba(166, 90, 69, 0.12);
}

.integration-status.is-warning {
    border-color: rgba(138, 104, 29, 0.26);
    color: #69490c;
    background: rgba(138, 104, 29, 0.14);
}

.integration-card h2 {
    margin: 0;
    color: var(--integration-ink);
    font-size: 1.1rem;
    font-weight: 950;
}

.integration-card p {
    max-width: 34rem;
    margin: 0;
    color: var(--integration-muted);
    font-size: 0.92rem;
    line-height: 1.55;
}

.integration-use-row {
    display: grid;
    gap: 0.2rem;
    border-top: 1px solid rgba(18, 21, 33, 0.08);
    padding-top: 0.78rem;
}

.integration-use-row span {
    color: var(--integration-muted);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.integration-use-row strong {
    color: var(--integration-ink);
    font-size: 0.94rem;
}

.integration-card label,
.integration-card .module-eyebrow {
    color: var(--integration-ink);
}

.integration-card .button-secondary,
.integration-card .integration-disabled-action {
    border-color: rgba(17, 24, 39, 0.12);
    color: var(--integration-ink);
    background: rgba(255, 255, 255, 0.84);
}

.integration-card .input-control {
    border-color: rgba(17, 24, 39, 0.14);
    color: var(--integration-ink);
    background: rgba(255, 255, 255, 0.9);
}

.integration-card .button-primary,
.integration-card .button-secondary,
.integration-card .integration-disabled-action {
    align-self: end;
    justify-self: start;
}

.integration-disabled-action {
    pointer-events: none;
    cursor: default;
    opacity: 0.72;
}

.payment-status-stack {
    display: grid;
    gap: 0.48rem;
    border-top: 1px solid rgba(18, 21, 33, 0.08);
    padding-top: 0.78rem;
}

.payment-status-stack span {
    display: grid;
    gap: 0.16rem;
}

.payment-status-stack em {
    color: var(--integration-muted);
    font-size: 0.66rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.payment-status-stack strong {
    color: var(--integration-ink);
    font-size: 0.82rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.payment-webhook-guide {
    display: grid;
    gap: 0.4rem;
    margin-top: 1rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: var(--soft-shadow);
}

.payment-webhook-guide strong {
    color: var(--ink);
    font-size: 0.95rem;
    overflow-wrap: anywhere;
}

.payment-webhook-guide p {
    max-width: 46rem;
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.payment-event-list {
    display: grid;
    gap: 0.28rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.78rem;
    background: rgba(248, 247, 242, 0.82);
}

.payment-event-list span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.payment-event-list strong {
    color: var(--ink);
    font-size: 0.78rem;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.integration-card.is-meta {
    --integration-color: #8a681d;
}

.integration-card.is-mailchimp {
    --integration-color: #b8942a;
}

.integration-card.is-gmail {
    --integration-color: #a65a45;
}

.integration-card.is-microsoft {
    --integration-color: #6f5fc6;
}

.integration-card.is-imap {
    --integration-color: #0f766e;
}

.integration-card.is-apple {
    --integration-color: #111827;
}

.integration-card.is-payments {
    --integration-color: #7f5f18;
}

.integration-card.is-accounting,
.integration-card.is-xero {
    --integration-color: #3c8f7c;
}

.integration-card.is-sage {
    --integration-color: #5a9460;
}

.integration-card.is-quickbooks {
    --integration-color: #417f54;
}

.integration-card.is-freeagent {
    --integration-color: #7b6f55;
}

.integration-card.is-stripe {
    --integration-color: #6f5fc6;
}

.integration-card.is-paypal {
    --integration-color: #2d6f9f;
}

.integration-card.is-calendar {
    --integration-color: #6f4a63;
}

.integration-card.is-google-calendar {
    --integration-color: #8a681d;
}

.integration-card.is-social,
.integration-card.is-mailbox {
    --integration-color: #8a681d;
}

.integration-card.is-automation {
    --integration-color: #7d4f45;
}

.integration-card.is-ai {
    --integration-color: #6f5f46;
}

.integration-admin-test {
    display: grid;
    gap: 0.85rem;
    margin-top: 1rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: var(--soft-shadow);
}

.integration-test-output {
    display: grid;
    gap: 0.35rem;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(138, 104, 29, 0.08);
}

.integration-test-output strong {
    color: var(--ink);
    font-size: 0.76rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.integration-test-output p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.ai-assist-page {
    display: grid;
    gap: 1rem;
}

.ai-assist-card {
    max-width: 58rem;
}

.ai-model-choice-wrap {
    display: grid;
    gap: 0.55rem;
}

.ai-model-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.ai-model-choice {
    position: relative;
    display: grid;
    gap: 0.35rem;
    min-height: 9rem;
    border: 1px solid rgba(105, 73, 12, 0.22);
    border-radius: 8px;
    padding: 0.9rem;
    background: #fff;
    color: var(--ink);
    box-shadow: 0 0.85rem 1.6rem rgba(25, 20, 12, 0.07);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.ai-model-choice:hover,
.ai-model-choice:focus-within,
.ai-model-choice:has(input:checked),
.ai-model-choice.is-selected {
    transform: translateY(-1px);
    border-color: rgba(148, 107, 20, 0.58);
    box-shadow: 0 1rem 2rem rgba(105, 73, 12, 0.15);
}

.ai-model-choice:has(input:checked),
.ai-model-choice.is-selected {
    border-color: #0b6f66;
    background: linear-gradient(145deg, #0b6f66, #063f3b);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.18), 0 1rem 2rem rgba(11, 122, 112, 0.22);
}

.ai-model-choice input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.ai-model-choice strong,
.ai-model-choice span,
.ai-model-choice small {
    position: relative;
    z-index: 1;
}

.ai-model-choice strong {
    color: var(--brand-deep);
    font-size: 0.95rem;
    line-height: 1.2;
}

.ai-model-choice span {
    color: #323846;
    font-size: 0.86rem;
    line-height: 1.45;
}

.ai-model-choice:has(input:checked) strong,
.ai-model-choice:has(input:checked) span,
.ai-model-choice.is-selected strong,
.ai-model-choice.is-selected span {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.ai-model-choice small {
    align-self: end;
    width: fit-content;
    border-radius: 999px;
    padding: 0.32rem 0.55rem;
    background: rgba(105, 73, 12, 0.09);
    color: var(--brand-deep);
    font-size: 0.72rem;
    font-weight: 900;
}

.ai-model-choice:has(input:checked) small,
.ai-model-choice.is-selected small {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}

.ai-model-choice:has(input:checked):after,
.ai-model-choice.is-selected:after {
    content: "Selected";
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: auto;
    height: auto;
    border-radius: 999px;
    padding: 0.22rem 0.48rem;
    background: #fff;
    color: #063f3b;
    font-size: 0.66rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 0.5rem 1rem rgba(11, 122, 112, 0.22);
}

.ai-usage-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0.8rem 0 0.55rem;
}

.ai-usage-card {
    display: grid;
    gap: 0.25rem;
    border: 1px solid rgba(105, 73, 12, 0.15);
    border-radius: 8px;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.65rem 1.4rem rgba(25, 20, 12, 0.06);
}

.ai-usage-card span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ai-usage-card strong {
    color: var(--ink);
    font-size: clamp(1.1rem, 2vw, 1.55rem);
    line-height: 1.1;
}

.ai-usage-card small {
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.ai-usage-line {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    margin: 0.25rem 0 0.35rem;
    border: 1px solid rgba(105, 73, 12, 0.16);
    border-radius: 999px;
    padding: 0.45rem 0.75rem;
    background: rgba(105, 73, 12, 0.07);
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.ai-history-list {
    display: grid;
    gap: 1rem;
}

.ai-history-card h2 {
    text-transform: capitalize;
}

.ai-history-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.ai-history-grid section {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.68);
}

.ai-history-grid strong {
    color: var(--brand-deep);
    font-size: 0.76rem;
    text-transform: uppercase;
}

.ai-history-grid p {
    max-height: 11rem;
    margin: 0;
    overflow: auto;
    color: var(--ink);
    line-height: 1.5;
    white-space: pre-wrap;
}

.ask-thea-page {
    max-width: 76rem;
}

.ask-thea-shell {
    display: grid;
    gap: 1rem;
}

.ask-thea-portrait-card {
    display: grid;
    grid-template-columns: minmax(13rem, 18rem) minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    align-items: stretch;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 12px;
    padding: clamp(1rem, 2vw, 1.35rem);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(247, 244, 236, 0.92)),
        #fff;
    box-shadow: 0 1rem 2.6rem rgba(35, 28, 18, 0.1);
}

.ask-thea-portrait-card img {
    width: 100%;
    min-height: 17rem;
    max-height: 23rem;
    border-radius: 10px;
    object-fit: cover;
    object-position: center;
    box-shadow: 0 1rem 2rem rgba(20, 18, 15, 0.18);
}

.ask-thea-portrait-card > div {
    display: grid;
    align-content: center;
    gap: 0.85rem;
    min-width: 0;
}

.ask-thea-portrait-card h2 {
    max-width: 18ch;
    margin: 0;
    color: var(--ink);
    font-size: clamp(2rem, 4vw, 4.1rem);
    line-height: 0.96;
}

.ask-thea-portrait-card p {
    max-width: 48rem;
    margin: 0;
    color: var(--muted);
    font-size: clamp(1rem, 1.3vw, 1.12rem);
    font-weight: 650;
    line-height: 1.58;
}

.ask-thea-access {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
}

.ask-thea-access small {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.35;
}

.ask-thea-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    border: 1px solid rgba(105, 73, 12, 0.18);
    border-radius: 999px;
    padding: 0.35rem 0.78rem;
    background: rgba(105, 73, 12, 0.09);
    color: var(--brand-deep);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ask-thea-status.is-ready {
    border-color: rgba(21, 118, 94, 0.25);
    background: rgba(21, 118, 94, 0.12);
    color: #0f5f4d;
}

.ask-thea-form,
.ask-thea-answer {
    display: grid;
    gap: 0.75rem;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 12px;
    padding: clamp(1rem, 2vw, 1.25rem);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--soft-shadow);
}

.ask-thea-form label {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 950;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.ask-thea-form textarea {
    width: 100%;
    min-height: 12rem;
    border: 1px solid rgba(105, 73, 12, 0.16);
    border-radius: 10px;
    padding: 1rem;
    background: #fff;
    color: var(--ink);
    box-shadow: inset 0 0.1rem 0.35rem rgba(30, 24, 14, 0.04);
    font: inherit;
    font-size: 1rem;
    line-height: 1.55;
    resize: vertical;
}

.ask-thea-form textarea::placeholder {
    color: #747984;
}

.ask-thea-form.is-busy {
    border-color: rgba(21, 118, 94, 0.25);
    box-shadow: 0 0.9rem 2rem rgba(21, 118, 94, 0.1);
}

.ask-thea-form .ask-thea-button:disabled {
    cursor: wait;
    opacity: 0.78;
}

.ask-thea-form-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
}

.ask-thea-form-foot small {
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 800;
}

.ask-thea-button {
    min-width: 8.5rem;
}

.ask-thea-answer {
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.08), rgba(138, 104, 29, 0.08)),
        #fff;
}

.ask-thea-answer-copy {
    color: var(--ink);
    font-size: clamp(1rem, 1.2vw, 1.08rem);
    font-weight: 650;
    line-height: 1.72;
    white-space: pre-wrap;
}

.ask-thea-stream-status {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    border: 1px solid rgba(21, 118, 94, 0.16);
    border-radius: 999px;
    padding: 0.45rem 0.75rem;
    background: rgba(21, 118, 94, 0.08);
    color: #0f5f4d;
    font-size: 0.82rem;
    font-weight: 900;
}

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

.ai-output-panel {
    display: grid;
    gap: 0.75rem;
    max-width: 58rem;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 8px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--soft-shadow);
}

.ai-output-copy {
    color: var(--ink);
    font-size: 0.98rem;
    line-height: 1.7;
}

.ai-landing-builder-page {
    max-width: 72rem;
}

.ai-landing-builder-page .status-pill {
    display: inline-flex;
    min-height: 1.35rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.28);
    border-radius: 999px;
    padding: 0 0.5rem;
    color: #5f4512;
    background: rgba(138, 104, 29, 0.12);
    font-size: 0.64rem;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
}

.ai-landing-builder-card,
.ai-landing-success {
    max-width: 62rem;
}

.ai-landing-success h2 {
    margin: 0;
    color: var(--ink);
}

.ai-landing-success-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.18rem;
}

.ai-landing-wizard {
    display: grid;
    gap: 1rem;
    max-width: 62rem;
    border: 1px solid rgba(105, 73, 12, 0.14);
    border-radius: 10px;
    padding: clamp(1rem, 2vw, 1.35rem);
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--soft-shadow);
}

.ai-landing-progress {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
}

.ai-landing-progress span {
    border: 1px solid rgba(105, 73, 12, 0.12);
    border-radius: 999px;
    padding: 0.55rem 0.7rem;
    background: rgba(255, 255, 255, 0.7);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-align: center;
    text-transform: uppercase;
}

.ai-landing-progress span.is-active {
    background: linear-gradient(135deg, var(--gold), var(--gold-dark));
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.ai-landing-guidance {
    margin: 0;
    border: 1px solid rgba(105, 73, 12, 0.12);
    border-radius: 8px;
    padding: 0.72rem 0.85rem;
    color: var(--muted);
    background: rgba(138, 104, 29, 0.07);
    font-size: 0.86rem;
    font-weight: 760;
    line-height: 1.48;
}

.ai-landing-step {
    display: grid;
    gap: 1rem;
}

.ai-landing-step[hidden],
.ai-landing-step.is-hidden {
    display: none !important;
}

.ai-landing-step.is-active {
    display: grid;
}

.ai-landing-step-head {
    display: grid;
    gap: 0.15rem;
}

.ai-landing-step-head h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.45rem, 3vw, 2.25rem);
    line-height: 1.05;
}

.ai-landing-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.ai-landing-field-grid label {
    display: grid;
    gap: 0.4rem;
    align-content: start;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ai-landing-field-grid textarea {
    min-height: 7.2rem;
    resize: vertical;
    text-transform: none;
    letter-spacing: 0;
}

.ai-landing-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    border-top: 1px solid rgba(105, 73, 12, 0.1);
    padding-top: 1rem;
}

.ai-landing-actions [hidden] {
    display: none !important;
}

:root[data-theme="dark"] .ai-landing-wizard,
:root[data-theme="dark"] .ai-landing-progress span,
:root[data-theme="dark"] .ai-usage-card,
:root[data-theme="dark"] .ai-output-panel,
:root[data-theme="dark"] .ai-landing-guidance {
    background: rgba(20, 18, 15, 0.86);
}

:root[data-theme="dark"] .landing-start-panel,
:root[data-theme="dark"] .landing-launch-checklist,
:root[data-theme="dark"] .landing-launch-item {
    border-color: rgba(191, 149, 63, 0.22);
    background: rgba(20, 18, 15, 0.82);
}

:root[data-theme="dark"] .landing-start-actions,
:root[data-theme="dark"] .landing-editor-head-actions,
:root[data-theme="dark"] .landing-launch-actions,
:root[data-theme="dark"] .ai-landing-success-actions {
    border-color: rgba(216, 179, 90, 0.2);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.92), rgba(31, 41, 55, 0.7)),
        rgba(15, 23, 35, 0.78);
    box-shadow: 0 0.8rem 1.8rem rgba(0, 0, 0, 0.18), inset 0 0.08rem 0 rgba(255, 255, 255, 0.06);
}

@media (max-width: 759px) {
    .ai-landing-progress,
    .ai-landing-field-grid {
        grid-template-columns: 1fr;
    }

    .ai-history-grid {
        grid-template-columns: 1fr;
    }

    .ask-thea-portrait-card {
        grid-template-columns: 1fr;
    }

    .ask-thea-portrait-card img {
        min-height: 14rem;
        max-height: 18rem;
    }

    .ask-thea-portrait-card h2 {
        max-width: none;
    }

    .ask-thea-form-foot {
        align-items: stretch;
        flex-direction: column;
    }

    .ask-thea-button {
        width: 100%;
    }

    .ai-model-choice-grid {
        grid-template-columns: 1fr;
    }

    .ai-landing-actions {
        justify-content: stretch;
    }

    .ai-landing-actions > * {
        flex: 1;
    }
}

@media (max-width: 759px) {
    .integration-overview-strip {
        grid-template-columns: 1fr;
    }

    .integration-section-label {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.25rem;
    }

    .integration-card-grid {
        grid-template-columns: 1fr;
    }

    .integration-card {
        min-height: 0;
    }

    .ai-usage-grid {
        grid-template-columns: 1fr;
    }
}

.mail-integration-grid {
    align-items: stretch;
}

.mail-setup-form {
    display: grid;
    gap: 0.55rem;
}

.mail-settings-modal .cms-modal-card {
    width: min(46rem, 100%);
}

.mail-settings-modal .mail-setup-form {
    gap: 0.65rem;
}

.mail-setup-form .wide {
    grid-column: 1 / -1;
}

.mail-form-note {
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 8px;
    padding: 0.72rem 0.82rem;
    color: #59481b;
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.82rem;
    line-height: 1.45;
}

.mail-account-panel {
    margin-top: 1rem;
}

.mail-account-list {
    display: grid;
    gap: 0.65rem;
}

.mail-account-row {
    --mail-row-ink: #111827;
    --mail-row-muted: #596070;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.7);
    color: var(--mail-row-ink);
    box-shadow: 0 0.75rem 1.8rem rgba(31, 42, 68, 0.06);
}

.mail-account-row strong {
    display: block;
    color: var(--mail-row-ink);
    font-weight: 950;
}

.mail-account-row p {
    margin: 0.2rem 0 0;
    color: var(--mail-row-muted);
    font-size: 0.82rem;
}

.mail-account-row .module-eyebrow,
.mail-account-row .integration-status {
    color: var(--mail-row-muted);
}

.mail-account-row .integration-status.is-ready {
    color: #69490c;
}

.mail-account-row .integration-status.is-warning {
    color: #69490c;
}

.mail-account-row .button-secondary {
    border-color: rgba(17, 24, 39, 0.12);
    color: var(--mail-row-ink);
    background: rgba(255, 255, 255, 0.84);
}

.mail-account-error {
    color: #8b332d !important;
}

.mail-account-warning {
    color: #69490c !important;
}

.mail-account-ready {
    color: #486252 !important;
}

.mail-account-actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
}

.mail-connected-form .mail-account-row {
    align-items: start;
}

.mail-account-row .mail-action-button,
.mail-account-row .mail-action-button.button-secondary {
    min-width: max-content;
    min-height: 2.34rem;
    gap: 0.48rem;
    border-color: rgba(17, 24, 39, 0.14);
    border-radius: 999px;
    padding: 0 0.78rem !important;
    color: #17120a;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0.55rem 1.25rem rgba(31, 42, 68, 0.08);
    font-size: 0.78rem;
    font-weight: 900;
}

.mail-account-row .mail-action-button > span {
    position: relative;
    width: 0.92rem;
    height: 0.92rem;
    flex: 0 0 auto;
    color: var(--brand-deep);
}

.mail-account-row .mail-action-button.is-edit > span:before {
    content: "";
    position: absolute;
    inset: 0.15rem 0.08rem 0.12rem 0.12rem;
    border: 0.12rem solid currentColor;
    border-radius: 0.18rem;
}

.mail-account-row .mail-action-button.is-edit > span:after {
    content: "";
    position: absolute;
    right: 0.02rem;
    top: 0.02rem;
    width: 0.42rem;
    height: 0.12rem;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(-38deg);
}

.mail-account-row .mail-action-button.is-sync > span:before,
.mail-account-row .mail-action-button.is-sync > span:after {
    content: "";
    position: absolute;
    inset: 0.12rem;
    border: 0.12rem solid currentColor;
    border-left-color: transparent;
    border-radius: 999px;
}

.mail-account-row .mail-action-button.is-sync > span:after {
    inset: auto 0.02rem 0.09rem auto;
    width: 0;
    height: 0;
    border: 0.2rem solid transparent;
    border-left-color: currentColor;
    border-radius: 0;
    transform: rotate(24deg);
}

.mail-account-row .mail-action-button.is-disconnect,
.mail-account-row .mail-action-button.is-disconnect.button-secondary {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.1);
}

.mail-account-row .mail-action-button.is-disconnect > span:before,
.mail-account-row .mail-action-button.is-disconnect > span:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.78rem;
    height: 0.13rem;
    border-radius: 999px;
    background: currentColor;
}

.mail-account-row .mail-action-button.is-disconnect > span:before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.mail-account-row .mail-action-button.is-disconnect > span:after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.integration-development-banner {
    --development-ink: #111827;
    --development-muted: #596070;
    display: grid;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: 8px;
    margin: 0 0 1rem;
    padding: 0.9rem 1rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.14), rgba(127, 95, 24, 0.08)),
        rgba(255, 255, 255, 0.72);
    color: var(--development-ink);
    box-shadow: 0 0.85rem 1.8rem rgba(31, 42, 68, 0.07);
}

.integration-development-banner strong {
    display: block;
    color: var(--development-ink);
    font-size: 1rem;
    font-weight: 950;
}

.integration-development-banner p {
    margin: 0.25rem 0 0;
    color: var(--development-muted);
    font-size: 0.86rem;
}

.integration-development-banner .module-eyebrow {
    color: var(--brand-deep);
}

@media (max-width: 760px) {
    .mail-account-row,
    .mail-account-actions {
        grid-template-columns: 1fr;
        justify-items: start;
    }
}

.chatflow-editor-panel {
    min-height: calc(100vh - 2.2rem);
}

.chatflow-editor-head {
    position: sticky;
    top: 0;
    z-index: 24;
    margin: -0.15rem -0.15rem 1rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.78rem;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0.85rem 1.8rem rgba(31, 42, 68, 0.08);
    backdrop-filter: blur(18px);
}

.chatflow-editor-head > div:first-child {
    display: grid;
    gap: 0.2rem;
}

.chatflow-editor-back {
    display: inline-grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.76);
}

.chatflow-welcome-settings {
    margin-bottom: 0.85rem;
}

.chatflow-setup-stack {
    display: grid;
    gap: 0.8rem;
    margin-bottom: 0.85rem;
}

.chatflow-setup-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0.8rem 1.9rem rgba(31, 42, 68, 0.06);
}

.chatflow-trigger-card {
    border-color: rgba(138, 104, 29, 0.22);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.07)),
        rgba(255, 255, 255, 0.82);
}

.chatflow-step-badge {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    font-size: 0.86rem;
    font-weight: 950;
    box-shadow: 0 0.65rem 1.2rem rgba(138, 104, 29, 0.18);
}

.chatflow-setup-copy {
    display: grid;
    gap: 0.25rem;
    align-self: center;
    min-width: 0;
}

.chatflow-setup-copy h2,
.chatflow-setup-copy .form-title,
.chatflow-setup-copy p {
    margin: 0;
}

.chatflow-setup-copy h2,
.chatflow-setup-copy .form-title {
    font-size: 1.05rem;
    line-height: 1.2;
}

.chatflow-setup-copy p {
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.chatflow-trigger-label,
.chatflow-message-grid label,
.chatflow-default-cta-label,
.chatflow-admin-settings label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.chatflow-trigger-label,
.chatflow-message-grid,
.chatflow-default-cta-label,
.chatflow-trigger-input,
.chatflow-status-card > label {
    grid-column: 1 / -1;
}

.chatflow-ai-fallback-toggle {
    grid-column: 1 / -1;
    justify-self: start;
    align-self: center;
    grid-auto-flow: column;
    align-items: center;
    gap: 0.65rem;
}

.field-label-line {
    display: inline-flex;
    width: fit-content;
    gap: 0.35rem;
    align-items: center;
}

h1.field-label-line,
.form-title.field-label-line,
strong.field-label-line {
    position: relative;
    padding-bottom: 0.34rem;
}

h1.field-label-line:after,
.form-title.field-label-line:after,
strong.field-label-line:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: min(4.65rem, 68%);
    height: 0.16rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--banner-gold-end), var(--banner-gold-start));
    box-shadow: 0 0.35rem 0.8rem rgba(138, 104, 29, 0.16);
}

.info-tip {
    position: relative;
    display: inline-grid;
    width: 1.05rem;
    height: 1.05rem;
    place-items: center;
    border: 1px solid rgba(138, 104, 29, 0.22);
    border-radius: 999px;
    color: #8a681d;
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    outline: none;
    z-index: 1000;
}

.module-card h2 .info-tip,
.onboarding-module-card strong .info-tip {
    margin-left: 0.35rem;
    vertical-align: 0.08rem;
}

.info-tip:before,
.info-tip:after {
    position: absolute;
    left: 50%;
    z-index: 1001;
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, 0.35rem);
    transition: opacity 160ms ease, transform 160ms ease;
}

.info-tip:before {
    content: attr(data-tooltip);
    top: calc(100% + 0.55rem);
    width: max-content;
    max-width: min(18rem, 78vw);
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.62rem 0.72rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 0.85rem 1.8rem rgba(31, 42, 68, 0.16);
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1.4;
    text-transform: none;
}

.info-tip:after {
    content: "";
    top: calc(100% + 0.25rem);
    width: 0.55rem;
    height: 0.55rem;
    border-top: 1px solid rgba(138, 104, 29, 0.14);
    border-left: 1px solid rgba(138, 104, 29, 0.14);
    background: rgba(255, 255, 255, 0.96);
    transform: translate(-50%, 0.35rem) rotate(45deg);
}

.info-tip:hover:before,
.info-tip:hover:after,
.info-tip:focus:before,
.info-tip:focus:after {
    opacity: 1;
}

.info-tip:hover:before,
.info-tip:focus:before {
    transform: translate(-50%, 0);
}

.info-tip:hover:after,
.info-tip:focus:after {
    transform: translate(-50%, 0) rotate(45deg);
}

.chatflow-trigger-input {
    min-height: 3.1rem;
    font-size: 1.16rem;
    font-weight: 900;
}

.chatflow-message-grid {
    display: grid;
    gap: 0.65rem;
}

.chatflow-message-grid .wide {
    grid-column: 1 / -1;
}

.chatflow-admin-details {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.42);
}

.chatflow-admin-details summary {
    cursor: pointer;
    padding: 0.75rem 0.85rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
}

.chatflow-admin-settings {
    margin: 0 0.75rem 0.75rem;
    background: rgba(255, 255, 255, 0.46);
}

.chatflow-choice-builder {
    display: grid;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.58);
}

.chatflow-choice-builder-head {
    display: grid;
    gap: 0.75rem;
    align-items: start;
}

.chatflow-choice-builder-head h2,
.chatflow-choice-builder-head .form-title,
.chatflow-choice-builder-head p {
    margin: 0;
}

.chatflow-choice-builder-head p {
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.chatflow-choice-pair-grid {
    display: grid;
    gap: 0.75rem;
}

.chatflow-map {
    display: grid;
    gap: 0.9rem;
}

.chatflow-map-start,
.chatflow-route-tile {
    position: relative;
    display: grid;
    min-width: 0;
    gap: 0.35rem;
    border: 1px solid rgba(138, 104, 29, 0.13);
    border-radius: 8px;
    padding: 0.85rem;
    text-align: left;
    box-shadow: 0 0.75rem 1.55rem rgba(31, 42, 68, 0.07);
}

.chatflow-map-start {
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.06)),
        rgba(255, 255, 255, 0.82);
}

.chatflow-route-grid {
    display: grid;
    gap: 0.85rem;
}

.chatflow-route-grid:before {
    content: "";
    width: 0.12rem;
    height: 1.1rem;
    justify-self: center;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(138, 104, 29, 0.34), rgba(95, 69, 18, 0.3));
}

.chatflow-route-tile {
    min-height: 6.4rem;
    border-color: rgba(255, 255, 255, 0.28);
    appearance: none;
    cursor: pointer;
    font: inherit;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 48%),
        var(--banner-gold-gradient);
    transition: transform 170ms ease, box-shadow 170ms ease;
}

.chatflow-route-tile.is-keyword {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 48%),
        var(--banner-gold-gradient);
}

.chatflow-route-tile.is-route-a {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 48%),
        var(--banner-gold-gradient);
}

.chatflow-route-tile.is-route-b {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 48%),
        var(--banner-gold-gradient);
}

.chatflow-route-tile.is-route-c {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 48%),
        linear-gradient(135deg, #8a4d39, #5f4512);
}

.chatflow-route-tile.is-route-d {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 48%),
        linear-gradient(135deg, #5f5140, #272114);
}

.chatflow-route-tile:hover,
.chatflow-route-tile:focus {
    transform: translateY(-2px);
    box-shadow: 0 1rem 2rem rgba(31, 42, 68, 0.14);
}

.chatflow-map-start span,
.chatflow-route-tile span {
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.chatflow-map-start span {
    color: var(--muted);
}

.chatflow-route-tile span {
    color: rgba(255, 255, 255, 0.78);
}

.chatflow-map-start strong,
.chatflow-route-tile strong {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.03rem;
    line-height: 1.18;
    white-space: normal;
}

.chatflow-map-start strong {
    color: var(--ink);
}

.chatflow-route-tile strong {
    color: #fff;
}

.chatflow-map-start em,
.chatflow-route-tile em {
    display: -webkit-box;
    overflow: hidden;
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 760;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.chatflow-map-start em {
    color: var(--muted);
}

.chatflow-route-tile em {
    color: rgba(255, 255, 255, 0.82);
}

.chatflow-route-modal .cms-modal-card {
    width: min(38rem, 100%);
    max-height: min(46rem, 92vh);
}

.chatflow-route-fields {
    gap: 0.75rem;
}

.chatflow-choice-pair {
    display: grid;
    gap: 0.65rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.7rem 1.5rem rgba(31, 42, 68, 0.06);
}

.chatflow-option-tile,
.chatflow-response-tile {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.chatflow-option-tile span,
.chatflow-response-tile span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.chatflow-option-tile label,
.chatflow-response-tile label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.chatflow-response-tile textarea {
    min-height: 5.2rem;
    resize: vertical;
}

.chatflow-choice-remove {
    justify-self: start;
}

.chatflow-preview-panel {
    display: grid;
    gap: 0.7rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 8px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.62);
}

.chatflow-welcome-preview {
    display: grid;
    gap: 0.55rem;
    max-width: 34rem;
    border-radius: 8px;
    padding: 0.9rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 1rem 2.4rem rgba(138, 104, 29, 0.18);
}

.chatflow-welcome-preview span {
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.74rem;
    font-weight: 900;
}

.chatflow-welcome-preview strong {
    font-size: 0.95rem;
    line-height: 1.45;
    white-space: pre-line;
}

.chatflow-choice-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.chatflow-choice-preview em {
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 999px;
    padding: 0.38rem 0.65rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 850;
}

.channel-hero {
    display: grid;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
}

.channel-hero > div {
    display: grid;
    gap: 0.45rem;
}

.channel-hero h2,
.channel-picker h2,
.channel-setup-notes h2,
.compact-head h2,
.channel-card h2,
.channel-card strong {
    display: block;
    margin: 0;
    color: var(--ink);
    font-weight: 950;
}

.channel-hero p,
.channel-card p {
    margin: 0;
    color: var(--muted);
}

.channel-logo {
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: #8a681d;
    font-size: 1.55rem;
    font-weight: 950;
}

.channel-picker,
.channel-setup-notes {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
}

.channel-tools summary,
.channel-setup-notes summary {
    display: flex;
    gap: 0.45rem;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    color: var(--ink);
    font-size: 0.95rem;
    font-weight: 900;
    list-style: none;
}

.channel-tools summary::-webkit-details-marker,
.channel-setup-notes summary::-webkit-details-marker {
    display: none;
}

.channel-tools[open] summary,
.channel-setup-notes[open] summary {
    margin-bottom: 0.15rem;
}

.channel-option-grid,
.channel-list {
    display: grid;
    gap: 0.7rem;
}

.channel-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.78);
}

.channel-option strong,
.channel-option small {
    display: block;
}

.channel-option small {
    color: var(--muted);
}

.channel-page-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.channel-page-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(12, 18, 30, 0.46);
    backdrop-filter: blur(14px);
}

.channel-page-modal-card {
    position: relative;
    z-index: 1;
    display: grid;
    width: min(100%, 34rem);
    max-height: min(42rem, calc(100vh - 2rem));
    gap: 1rem;
    overflow: auto;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 8px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 255, 0.94)),
        #fff;
    box-shadow: 0 2rem 5rem rgba(12, 18, 30, 0.22);
}

.channel-page-modal-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
}

.channel-page-modal-head h2,
.channel-page-modal-head .form-title,
.channel-page-modal-head p {
    margin: 0;
}

.channel-page-modal-head p {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.45;
}

.channel-page-options {
    max-height: 18rem;
    overflow: auto;
    padding-right: 0.1rem;
}

.channel-page-option {
    cursor: pointer;
}

.channel-page-option input {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: #8a681d;
}

.channel-page-modal-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.65rem;
}

.channel-page-modal-actions .button-primary,
.channel-page-modal-actions .button-quiet {
    width: 100%;
    justify-content: center;
}

.channel-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.9rem;
}

.channel-card .button-quiet {
    grid-column: 1 / -1;
}

.webhook-log-card.profile-log-card {
    border-color: rgba(66, 103, 178, 0.28);
    background: rgba(245, 248, 255, 0.86);
}

.webhook-log-card.attention-log-card {
    border-color: rgba(166, 90, 69, 0.36);
    background: rgba(255, 247, 241, 0.9);
}

.channel-setup-notes ol {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding-left: 1.2rem;
    color: var(--muted);
}

.channel-setup-notes code {
    overflow-wrap: anywhere;
    color: var(--ink);
    font-weight: 800;
}

.workspace-logo-panel {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.workspace-logo-preview {
    display: grid;
    min-height: 12rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), rgba(95, 69, 18, 0.07)),
        rgba(255, 255, 255, 0.78);
}

.workspace-logo-preview img {
    display: block;
    max-width: 80%;
    max-height: 9rem;
    object-fit: contain;
}

.workspace-logo-preview span {
    display: grid;
    width: 5.5rem;
    height: 5.5rem;
    place-items: center;
    border-radius: 8px;
    color: #ffffff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 1rem 2.2rem rgba(138, 104, 29, 0.18);
    font-size: 2.35rem;
    font-weight: 900;
}

.team-add-panel {
    display: grid;
    gap: 0.55rem;
    margin: 0.8rem 0;
    padding: 0.75rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.6);
}

.team-add-panel .input-control {
    min-height: 2.65rem;
    padding: 0.62rem 0.72rem;
}

.team-seat-count-panel {
    display: grid;
    gap: 0.7rem;
    margin: 0.8rem 0;
    padding: 0.75rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), rgba(95, 69, 18, 0.05)),
        rgba(255, 255, 255, 0.7);
}

.team-seat-counter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 5.5rem;
    gap: 0.75rem;
    align-items: center;
    color: var(--text-strong);
    font-size: 0.8rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.team-seat-counter .input-control {
    min-height: 2.55rem;
    padding: 0.5rem 0.62rem;
    text-align: center;
}

.team-seat-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 0.3rem 0.45rem;
    align-items: baseline;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.team-seat-summary strong {
    color: var(--brand-deep);
    font-size: 1rem;
}

.team-seat-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: stretch;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.7rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.55rem 1.2rem rgba(31, 42, 68, 0.06);
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.team-seat-row.is-selected {
    border-color: rgba(138, 104, 29, 0.35);
    background: rgba(138, 104, 29, 0.09);
}

.team-seat-row.is-locked {
    opacity: 0.72;
    background:
        linear-gradient(135deg, rgba(90, 92, 103, 0.08), rgba(255, 255, 255, 0.68)),
        rgba(255, 255, 255, 0.7);
}

.team-seat-row.is-new {
    animation: bloomIn 560ms ease both;
}

.team-seat-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.team-seat-fields label {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.team-seat-fields .input-control {
    min-height: 2.45rem;
    padding: 0.52rem 0.62rem;
}

.team-seat-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    justify-content: flex-end;
}

.team-seat-module-strip {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.55rem;
    margin-top: 0.1rem;
    padding: 0.62rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.07), rgba(255, 255, 255, 0.62)),
        rgba(255, 255, 255, 0.72);
}

.team-seat-module-strip-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.65rem;
}

.team-seat-module-strip-head span {
    color: var(--text-strong);
    font-size: 0.78rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.team-seat-module-strip-head small,
.team-seat-module-strip p {
    margin: 0;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 780;
}

.team-seat-module-toggle-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: 0.45rem;
}

.team-seat-module-toggle {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.5rem;
    align-items: center;
    min-height: 3rem;
    border: 1px solid rgba(105, 112, 133, 0.18);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    background: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.team-seat-module-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.team-seat-module-toggle i {
    position: relative;
    width: 2.3rem;
    height: 1.28rem;
    border-radius: 999px;
    background: rgba(105, 112, 133, 0.18);
    box-shadow: inset 0 0 0 1px rgba(105, 112, 133, 0.16);
    transition: background 180ms ease, box-shadow 180ms ease;
}

.team-seat-module-toggle i:after {
    content: "";
    position: absolute;
    top: 0.17rem;
    left: 0.17rem;
    width: 0.94rem;
    height: 0.94rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0.22rem 0.65rem rgba(21, 26, 48, 0.16);
    transition: transform 180ms ease;
}

.team-seat-module-toggle span {
    display: grid;
    gap: 0.06rem;
    min-width: 0;
}

.team-seat-module-toggle strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-seat-module-toggle small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 780;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-seat-module-toggle:has(input:checked) {
    border-color: rgba(138, 104, 29, 0.34);
    background: rgba(138, 104, 29, 0.09);
    box-shadow: 0 0.45rem 1rem rgba(138, 104, 29, 0.11);
}

.team-seat-module-toggle:has(input:checked) i {
    background: var(--banner-gold-gradient);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.team-seat-module-toggle:has(input:checked) i:after {
    transform: translateX(1.02rem);
}

.team-seat-module-toggle input:focus-visible + i {
    outline: 2px solid rgba(138, 104, 29, 0.35);
    outline-offset: 3px;
}

.team-seat-module-toggle.is-saved {
    animation: savedFlash 980ms ease both;
}

.team-security-panel {
    margin-top: 1rem;
}

.team-password-row {
    display: grid;
    gap: 0.75rem;
}

.team-module-access-list {
    display: grid;
    gap: 0.62rem;
}

.team-module-access-summary {
    margin-top: 0.75rem;
    padding: 0.75rem 0.88rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius);
    background: rgba(138, 104, 29, 0.07);
    color: var(--text-strong);
    font-size: 0.88rem;
    font-weight: 700;
}

.team-module-access {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.68);
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.team-module-access.is-muted {
    opacity: 0.66;
}

.team-module-access.is-module-off {
    border-style: dashed;
    background: rgba(255, 255, 255, 0.52);
}

.team-module-access.is-module-off small {
    color: rgba(86, 93, 114, 0.82);
}

.team-module-access input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.team-module-access span {
    display: grid;
    gap: 0.15rem;
}

.team-module-access strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.team-module-access small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 760;
}

.team-module-access i {
    position: relative;
    width: 2.55rem;
    height: 1.42rem;
    border-radius: 999px;
    background: rgba(105, 112, 133, 0.18);
    box-shadow: inset 0 0 0 1px rgba(105, 112, 133, 0.16);
    transition: background 180ms ease, box-shadow 180ms ease;
}

.team-module-access i:after {
    content: "";
    position: absolute;
    top: 0.18rem;
    left: 0.18rem;
    width: 1.06rem;
    height: 1.06rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0.25rem 0.7rem rgba(21, 26, 48, 0.16);
    transition: transform 180ms ease;
}

.team-module-access:has(input:checked) {
    border-color: rgba(138, 104, 29, 0.34);
    background: rgba(138, 104, 29, 0.08);
}

.team-module-access:has(input:checked) i {
    background: var(--banner-gold-gradient);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16), 0 0.5rem 1rem rgba(138, 104, 29, 0.18);
}

.team-module-access:has(input:checked) i:after {
    transform: translateX(1.13rem);
}

.team-module-access.is-saved {
    animation: savedFlash 980ms ease both;
}

.team-schedule-page {
    max-width: 96rem;
    margin: 0 auto;
}

.team-availability-grid {
    display: grid;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
}

.team-availability-day,
.team-holiday-card,
.team-rate-row,
.team-schedule-admin-row,
.team-clock-admin-row {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.45rem 1rem rgba(31, 42, 68, 0.05);
}

.team-availability-day {
    display: grid;
    gap: 0.65rem;
    padding: 0.82rem;
}

.team-availability-day strong,
.team-rate-row strong,
.team-schedule-admin-row strong,
.team-clock-admin-row strong {
    color: var(--ink);
    font-size: 0.94rem;
    font-weight: 950;
}

.team-availability-day label,
.team-holiday-form label,
.team-shift-form label,
.team-clock-admin-row label {
    display: grid;
    gap: 0.25rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.team-availability-times,
.team-holiday-form,
.team-shift-form {
    display: grid;
    gap: 0.65rem;
}

.team-holiday-list,
.team-rate-list,
.team-schedule-admin-list {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.8rem;
}

.team-holiday-card,
.team-rate-row,
.team-schedule-admin-row {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    padding: 0.76rem 0.82rem;
}

.team-holiday-card div,
.team-rate-row span,
.team-schedule-admin-row div {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.team-holiday-card small,
.team-rate-row small,
.team-schedule-admin-row small,
.team-schedule-admin-row em,
.team-clock-admin-row small {
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 760;
}

.team-rate-row .input-control {
    width: 7.5rem;
    min-height: 2.4rem;
    text-align: right;
}

.team-shift-form {
    align-items: end;
}

.team-schedule-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    align-items: center;
    justify-content: space-between;
    margin: 0.85rem 0;
}

.team-schedule-toolbar > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.segmented-control {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.68);
}

.segmented-control a {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    padding: 0 0.86rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
}

.segmented-control a.is-active {
    color: #fff;
    background: var(--banner-gold-gradient);
}

.team-calendar-scroll {
    overflow-x: auto;
    padding-bottom: 0.35rem;
}

.team-calendar-grid {
    min-width: 62rem;
}

.team-schedule-item {
    display: grid;
    gap: 0.12rem;
    border: 1px solid rgba(138, 104, 29, 0.24);
    border-left: 0.28rem solid #8a681d;
    border-radius: 8px;
    padding: 0.5rem 0.55rem;
    background: linear-gradient(90deg, rgba(138, 104, 29, 0.12), rgba(255, 255, 255, 0.72));
}

.team-schedule-item.is-holiday {
    border-color: rgba(180, 35, 24, 0.22);
    border-left-color: #b42318;
    background: linear-gradient(90deg, rgba(180, 35, 24, 0.1), rgba(255, 255, 255, 0.72));
}

.team-schedule-item span,
.team-schedule-item em,
.team-schedule-item small {
    color: var(--muted);
    font-size: 0.66rem;
    font-style: normal;
    font-weight: 850;
    text-transform: uppercase;
}

.team-schedule-item strong {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 950;
    line-height: 1.2;
}

.team-clock-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.team-clock-admin-row {
    display: grid;
    gap: 0.55rem;
    padding: 0.76rem 0.82rem;
}

.team-clock-admin-row > div {
    display: grid;
    gap: 0.18rem;
}

.commerce-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.7rem;
    border-radius: 999px;
    padding: 0 0.65rem;
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: capitalize;
}

.commerce-status-pill.is-live {
    color: var(--green);
    background: rgba(47, 125, 80, 0.1);
}

.commerce-status-pill.is-draft {
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
}

.commerce-status-pill.is-pending {
    color: #6b510f;
    background: rgba(138, 104, 29, 0.14);
}

.commerce-status-pill.is-danger {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.12);
}

.commerce-status-pill.is-muted {
    color: var(--muted);
    background: rgba(105, 112, 133, 0.1);
}

.contact-overview-panel {
    display: grid;
    gap: 0.8rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 0.9rem;
    padding: 0.9rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(15, 118, 110, 0.05)),
        rgba(255, 255, 255, 0.72);
}

.contact-overview-panel strong {
    display: block;
    color: var(--ink);
    font-size: 1.05rem;
}

.contact-overview-panel p {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.45;
}

.contact-overview-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(4.4rem, 1fr));
    gap: 0.45rem;
}

.contact-overview-stats span {
    display: grid;
    gap: 0.08rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 0.72rem;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.74);
}

.contact-overview-stats strong {
    font-size: 1.15rem;
}

.contact-overview-stats small {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.contact-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
    border-left-width: 0.24rem;
}

.contact-row-link {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.contact-avatar {
    display: inline-grid;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.85rem;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 850;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.contact-row-main {
    display: grid;
    min-width: 0;
    gap: 0.1rem;
}

.contact-row-main strong,
.contact-row-main span,
.contact-row-main small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contact-row-main strong {
    color: var(--ink);
    font-size: 0.95rem;
}

.contact-row-main span,
.contact-row-main small {
    color: var(--muted);
}

.contact-row-main span {
    font-size: 0.8rem;
    font-weight: 760;
}

.contact-row-main small {
    font-size: 0.72rem;
    font-weight: 680;
}

.contact-row-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
    padding-left: 3rem;
}

.contact-row.type-customer {
    border-left-color: var(--brand);
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-row.type-supplier {
    border-left-color: var(--gold);
    background:
        linear-gradient(90deg, rgba(185, 138, 44, 0.13), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-row.type-prospect {
    border-left-color: var(--coral);
    background:
        linear-gradient(90deg, rgba(166, 90, 69, 0.11), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-row.type-partner {
    border-left-color: var(--aqua);
    background:
        linear-gradient(90deg, rgba(15, 118, 110, 0.11), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-row.type-internal {
    border-left-color: var(--green);
    background:
        linear-gradient(90deg, rgba(47, 125, 80, 0.1), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-row.type-other {
    border-left-color: var(--muted);
    background:
        linear-gradient(90deg, rgba(105, 112, 133, 0.09), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.contact-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.7rem;
    border-radius: 999px;
    padding: 0 0.65rem;
    font-size: 0.72rem;
    font-weight: 850;
}

.contact-editor-empty {
    display: grid;
    place-items: center;
    gap: 1rem;
    min-height: clamp(26rem, 62vh, 38rem);
    border: 1px dashed rgba(138, 104, 29, 0.26);
    border-radius: 1.1rem;
    padding: clamp(1.2rem, 3vw, 2.4rem);
    text-align: center;
    background:
        radial-gradient(circle at top left, rgba(138, 104, 29, 0.13), transparent 36%),
        rgba(255, 255, 255, 0.72);
}

.contact-empty-mark {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 1.25rem;
    background: linear-gradient(135deg, var(--brand), #3e2a06);
    box-shadow: 0 1rem 2.4rem rgba(138, 104, 29, 0.22);
}

.contact-empty-mark::before,
.contact-empty-mark::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    background: #fff;
}

.contact-empty-mark::before {
    width: 1rem;
    height: 1rem;
    top: 0.95rem;
}

.contact-empty-mark::after {
    width: 2.15rem;
    height: 1rem;
    bottom: 0.9rem;
}

.contact-editor-empty h1 {
    margin: 0.1rem 0 0;
}

.contact-editor-empty p {
    max-width: 42rem;
    margin: 0.35rem auto 0;
    color: var(--muted);
    line-height: 1.65;
}

.contact-editor-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}

html[data-theme="dark"] .contact-overview-panel,
html[data-theme="dark"] .contact-overview-stats span,
html[data-theme="dark"] .contact-editor-empty {
    border-color: rgba(212, 189, 132, 0.16);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 720px) {
    .contact-overview-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .contact-row-badges {
        padding-left: 0;
    }

    .contact-editor-empty-actions {
        width: 100%;
    }

    .contact-editor-empty-actions > * {
        flex: 1 1 100%;
    }
}

.contact-type-manager {
    max-width: 58rem;
}

.appointment-type-manager {
    max-width: 78rem;
}

.contact-type-list {
    display: grid;
    gap: 0.65rem;
}

.contact-type-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1.35fr) minmax(7rem, 0.45fr) minmax(5.5rem, 0.35fr) auto;
    gap: 0.7rem;
    align-items: end;
    border: 1px solid var(--line);
    border-left-width: 0.28rem;
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.8rem 1.8rem rgba(31, 42, 68, 0.06);
}

.contact-type-card label {
    display: grid;
    gap: 0.32rem;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 850;
}

.contact-type-swatch {
    width: 2.45rem;
    height: 2.45rem;
    align-self: center;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: var(--radius);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.45), 0 0.7rem 1.5rem rgba(31, 42, 68, 0.1);
}

.contact-colour-input {
    min-height: 2.75rem;
    padding: 0.25rem;
}

.contact-type-meta {
    display: grid;
    gap: 0.35rem;
    justify-items: end;
}

.contact-type-meta span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.availability-type-card {
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) minmax(7rem, 0.45fr) minmax(5.5rem, 0.35fr) auto auto;
}

.appointment-type-card {
    grid-template-columns: auto minmax(8rem, 1fr) minmax(10rem, 1.2fr) minmax(5rem, 0.38fr) minmax(7rem, 0.55fr) minmax(4.8rem, 0.34fr) minmax(4.8rem, 0.34fr) auto auto;
}

.calendar-type-card.availability-type-card,
.calendar-type-card.appointment-type-card {
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.85rem;
    padding: 0.9rem;
}

.calendar-type-main {
    display: grid;
    gap: 0.58rem;
    min-width: 0;
}

.calendar-type-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
    gap: 0.55rem;
}

.calendar-type-name input {
    font-weight: 850;
}

.calendar-type-description input {
    color: var(--ink);
}

.calendar-type-switches {
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 0.7rem;
    align-items: end;
}

.calendar-type-actions {
    gap: 0.5rem;
    align-self: stretch;
    align-content: center;
}

.calendar-type-actions span {
    max-width: 9rem;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-type-card .contact-type-meta {
    align-self: center;
}

.appointment-type-card .contact-type-meta {
    align-self: center;
}

.availability-active-toggle {
    position: relative;
    align-self: end;
    display: grid;
    gap: 0.36rem;
    justify-items: center;
}

.availability-active-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.availability-active-toggle i {
    position: relative;
    display: block;
    width: 2.28rem;
    height: 1.34rem;
    border: 1px solid rgba(121, 131, 153, 0.28);
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.18);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.availability-active-toggle i:before {
    content: "";
    position: absolute;
    top: 0.18rem;
    left: 0.18rem;
    width: 0.88rem;
    height: 0.88rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0.25rem 0.55rem rgba(31, 42, 68, 0.16);
    transition: transform 180ms ease;
}

.availability-active-toggle input:checked + i {
    border-color: rgba(47, 125, 80, 0.34);
    background: rgba(47, 125, 80, 0.28);
    box-shadow: 0 0.55rem 1.2rem rgba(47, 125, 80, 0.12), inset 0 0.08rem 0 rgba(255, 255, 255, 0.6);
}

.availability-active-toggle input:checked + i:before {
    transform: translateX(0.94rem);
}

.availability-active-toggle input:focus-visible + i {
    outline: 2px solid rgba(138, 104, 29, 0.45);
    outline-offset: 3px;
}

@media (max-width: 759px) {
    .team-seat-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .team-seat-row .cms-order-control {
        order: 2;
    }

    .team-seat-fields,
    .team-seat-actions {
        grid-column: 1 / -1;
    }

    .team-seat-fields {
        grid-template-columns: 1fr;
    }

    .contact-type-card,
    .availability-type-card,
    .appointment-type-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .contact-type-meta {
        justify-items: stretch;
    }

    .availability-active-toggle {
        justify-items: start;
    }

    .calendar-type-switches {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .calendar-type-actions {
        justify-items: stretch;
    }

    .calendar-type-actions span {
        max-width: none;
        text-align: left;
    }

    .flow-step-card {
        grid-template-columns: auto minmax(0, 1fr);
        margin-left: 0;
        padding: 0.62rem;
    }

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

    .flow-step-top .cms-order-control {
        width: 100%;
        grid-template-columns: 1fr 1fr;
    }

    .flow-step-top .cms-order-control .cms-arrow-button {
        width: 100%;
    }

    .flow-step-top .cms-order-control .cms-arrow-button + .cms-arrow-button {
        border-top: 0;
        border-left: 1px solid var(--line);
    }

    .flow-step-footer .button-quiet {
        width: 100%;
    }

    .chatflow-editor-head {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
        margin-right: 0;
        margin-left: 0;
    }

    .flow-choice-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .flow-step-actions,
    .flow-editor-actions {
        width: 100%;
        justify-content: stretch;
    }

    .flow-step-actions > *,
    .flow-editor-actions > * {
        flex: 1 1 auto;
    }
}

.contact-type-pill.type-customer {
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
}

.contact-type-pill.type-supplier {
    color: #8b6421;
    background: rgba(185, 138, 44, 0.18);
}

.contact-type-pill.type-prospect {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.13);
}

.contact-type-pill.type-partner {
    color: #0b5752;
    background: rgba(15, 118, 110, 0.12);
}

.contact-type-pill.type-internal {
    color: var(--green);
    background: rgba(47, 125, 80, 0.11);
}

.contact-type-pill.type-other {
    color: var(--muted);
    background: rgba(105, 112, 133, 0.1);
}

.commerce-product-row {
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    border-left-width: 0.24rem;
}

.commerce-product-row.is-service {
    border-left-color: var(--brand);
}

.commerce-product-row.is-physical {
    border-left-color: var(--aqua);
}

.commerce-product-row.is-digital {
    border-left-color: #765a82;
}

.commerce-product-row.is-subscription {
    border-left-color: var(--green);
}

.commerce-product-order {
    align-self: center;
}

.commerce-product-link {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
    color: inherit;
    text-decoration: none;
}

.commerce-product-link strong,
.commerce-product-link span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commerce-product-link strong {
    color: var(--ink);
    font-size: 0.96rem;
}

.commerce-product-link span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 760;
}

.commerce-product-meta {
    grid-column: 3 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.product-type-pill,
.commerce-price-pill,
.commerce-offer-pill,
.commerce-stock-pill,
.commerce-public-pill,
.commerce-featured-pill {
    display: inline-flex;
    min-height: 1.65rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 0.62rem;
    font-size: 0.72rem;
    font-weight: 850;
    white-space: nowrap;
}

.product-type-pill {
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
}

.product-type-pill.is-physical {
    color: #0b5752;
    background: rgba(15, 118, 110, 0.12);
}

.product-type-pill.is-digital {
    color: #513a60;
    background: rgba(118, 90, 130, 0.12);
}

.product-type-pill.is-subscription {
    color: var(--green);
    background: rgba(47, 125, 80, 0.12);
}

.commerce-price-pill {
    color: #3d2b08;
    background: rgba(138, 104, 29, 0.12);
}

.commerce-offer-pill {
    color: #8b332d;
    background: rgba(166, 90, 69, 0.12);
}

.commerce-stock-pill,
.commerce-public-pill,
.commerce-featured-pill {
    color: var(--muted);
    background: rgba(105, 112, 133, 0.1);
}

.commerce-row-image {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: var(--radius);
    object-fit: cover;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.16), rgba(95, 69, 18, 0.12)),
        rgba(255, 255, 255, 0.8);
}

.commerce-row-image.is-empty {
    display: block;
}

.commerce-image-preview {
    margin-top: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.62);
}

.commerce-image-preview img {
    display: block;
    width: 100%;
    max-height: 22rem;
    object-fit: cover;
    border-radius: var(--radius);
}

.products-overview-panel {
    display: grid;
    gap: 0.8rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 0.9rem;
    padding: 0.9rem;
    background:
        radial-gradient(circle at top right, rgba(138, 104, 29, 0.12), transparent 9rem),
        rgba(255, 255, 255, 0.72);
}

.products-overview-panel strong {
    display: block;
    color: var(--ink);
    font-size: 1.05rem;
}

.products-overview-panel p {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.45;
}

.products-overview-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(4.2rem, 1fr));
    gap: 0.45rem;
}

.products-overview-stats span {
    display: grid;
    gap: 0.08rem;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 0.72rem;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.74);
}

.products-overview-stats strong {
    font-size: 1.15rem;
}

.products-overview-stats small {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.product-editor-section {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}

.product-editor-section:first-of-type {
    margin-top: 0;
}

.product-editor-section-head h2 {
    margin: 0.18rem 0 0;
    color: var(--ink);
    font-size: 1.05rem;
}

.products-editor-empty {
    display: grid;
    place-items: center;
    gap: 1rem;
    min-height: clamp(26rem, 62vh, 38rem);
    border: 1px dashed rgba(138, 104, 29, 0.26);
    border-radius: 1.1rem;
    padding: clamp(1.2rem, 3vw, 2.4rem);
    text-align: center;
    background:
        radial-gradient(circle at top left, rgba(138, 104, 29, 0.14), transparent 38%),
        rgba(255, 255, 255, 0.72);
}

.products-empty-mark {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 1.25rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), #3e2a06);
    box-shadow: 0 1rem 2.4rem rgba(138, 104, 29, 0.22);
}

.products-empty-mark::before,
.products-empty-mark::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.products-empty-mark::before {
    width: 1.75rem;
    height: 1.35rem;
    border: 0.15rem solid currentColor;
    border-radius: 0.18rem;
}

.products-empty-mark::after {
    width: 0.72rem;
    height: 0.72rem;
    border-top: 0.15rem solid currentColor;
    border-right: 0.15rem solid currentColor;
    transform: translate(0.2rem, -0.08rem) rotate(45deg);
}

.products-editor-empty h1 {
    margin: 0.1rem 0 0;
}

.products-editor-empty p {
    max-width: 42rem;
    margin: 0.35rem auto 0;
    color: var(--muted);
    line-height: 1.65;
}

.products-editor-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}

:root[data-theme="dark"] .products-overview-panel,
:root[data-theme="dark"] .products-overview-stats span,
:root[data-theme="dark"] .products-editor-empty {
    border-color: rgba(222, 205, 158, 0.14);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(222, 205, 158, 0.06)),
        var(--panel);
}

@media (max-width: 720px) {
    .commerce-product-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .commerce-product-order {
        grid-row: 1 / span 2;
    }

    .commerce-product-meta {
        grid-column: 1 / -1;
    }

    .products-editor-empty-actions {
        width: 100%;
    }

    .products-editor-empty-actions > * {
        flex: 1 1 100%;
    }
}

.commerce-items-panel,
.commerce-total-panel {
    margin-top: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.58);
}

.commerce-items-panel .panel-head {
    margin-bottom: 0.75rem;
}

.commerce-line-items,
.commerce-line-list {
    display: grid;
    gap: 0.65rem;
}

.commerce-line-item {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.75rem;
    background: #fff;
    box-shadow: 0 10px 24px rgba(31, 42, 68, 0.08);
}

.commerce-total-panel {
    display: grid;
    gap: 0.6rem;
}

.commerce-total-panel div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: var(--muted);
    font-weight: 800;
}

.commerce-total-panel strong {
    color: var(--ink);
    font-size: 1.08rem;
}

.cms-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    place-items: center;
    padding: 1rem;
}

.cms-modal.is-open {
    display: grid;
}

.cms-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(18, 21, 33, 0.42);
}

.cms-modal-card {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1rem;
    width: min(42rem, 100%);
    max-height: min(46rem, 92vh);
    overflow: auto;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: var(--radius);
    padding: 1rem;
    background: #fff;
    box-shadow: var(--shadow);
}

.cms-modal-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.cms-modal-head strong {
    display: block;
    margin-top: 0.15rem;
    color: var(--ink);
    font-size: 1.12rem;
    font-weight: 950;
}

.cms-modal-close {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    font-weight: 950;
}

.cms-modal-close:hover {
    color: #fff;
    background: var(--banner-gold-gradient);
}

.cms-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
}

.calendar-event-modal-card {
    width: min(44rem, 100%);
}

.calendar-event-fields {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.calendar-event-fields .wide {
    grid-column: 1 / -1;
}

.calendar-all-day-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.55rem;
    min-height: 3.25rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.65rem 0.75rem;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-weight: 900;
}

.calendar-all-day-row input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--brand);
}

.calendar-event-delete {
    margin-right: auto;
}

.team-workspace-page {
    display: grid;
    gap: 1rem;
}

.team-workspace-intro {
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}

.team-workspace-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: 0.85rem;
}

.team-workspace-card {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: var(--radius);
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.78)),
        rgba(138, 104, 29, 0.06);
    box-shadow: 0 0.9rem 2rem rgba(25, 28, 40, 0.07);
}

.team-workspace-card.is-important,
.team-workspace-card.is-open {
    border-color: rgba(138, 104, 29, 0.28);
}

.team-workspace-card.is-urgent {
    border-color: rgba(180, 35, 24, 0.34);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.8)),
        rgba(180, 35, 24, 0.08);
}

.team-workspace-card.is-resolved {
    border-color: rgba(47, 125, 80, 0.24);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.8)),
        rgba(47, 125, 80, 0.08);
}

.team-workspace-card-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.75rem;
}

.team-workspace-kicker,
.team-workspace-card footer span {
    display: block;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.team-workspace-card strong {
    display: block;
    margin-top: 0.1rem;
    color: var(--ink);
    font-size: 1.08rem;
    font-weight: 950;
    line-height: 1.2;
}

.team-workspace-card p {
    margin: 0;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.55;
}

.team-workspace-badges,
.team-card-actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}

.team-workspace-badges span {
    display: inline-flex;
    min-height: 1.65rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 999px;
    padding: 0 0.55rem;
    color: #6f5018;
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-workspace-card footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.2rem;
}

.team-workspace-modal-card {
    width: min(46rem, 100%);
}

.team-workspace-form-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.team-workspace-form-grid .wide {
    grid-column: 1 / -1;
}

.team-workspace-check {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 3.25rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.65rem 0.75rem;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-weight: 900;
}

.team-workspace-check input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--brand);
}

.team-workspace-delete {
    margin-right: auto;
}

@media (max-width: 680px) {
    .week-toolbar {
        align-items: stretch;
        grid-template-columns: 1fr;
    }

    .week-toolbar-actions,
    .week-toolbar-actions .button-primary {
        width: 100%;
    }

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

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

    .team-workspace-card footer {
        align-items: stretch;
        flex-direction: column;
    }

    .team-card-actions,
    .team-card-actions .button-primary,
    .team-card-actions .button-soft {
        width: 100%;
    }
}

.new-email-modal-card {
    width: min(46rem, 100%);
}

.inbox-search-modal-card {
    width: min(48rem, 100%);
    height: min(42rem, calc(100vh - 2rem));
    max-height: calc(100vh - 2rem);
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.inbox-search-body {
    display: grid;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0.8rem;
}

.inbox-search-field {
    position: relative;
    display: grid;
    align-items: center;
}

.inbox-search-field .inbox-search-icon {
    position: absolute;
    left: 0.92rem;
    z-index: 1;
    width: 0.88rem;
    height: 0.88rem;
    color: var(--brand-deep);
    pointer-events: none;
}

.inbox-search-field .input-control {
    min-height: 3.2rem;
    padding-left: 2.65rem;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 750;
}

.inbox-search-results {
    display: grid;
    min-height: 0;
    gap: 0.55rem;
    align-content: start;
    max-height: none;
    overflow-y: auto;
    padding: 0.1rem 0.35rem 0.25rem 0.15rem;
    overscroll-behavior: contain;
}

.inbox-search-empty {
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 12px;
    padding: 1rem;
    color: var(--muted);
    background: rgba(248, 246, 239, 0.78);
    font-size: 0.92rem;
    font-weight: 750;
}

.inbox-search-empty.is-loading:before {
    content: "";
    display: inline-block;
    width: 0.72rem;
    height: 0.72rem;
    margin-right: 0.52rem;
    border: 0.12rem solid rgba(138, 104, 29, 0.22);
    border-top-color: var(--brand);
    border-radius: 999px;
    vertical-align: -0.08rem;
    animation: aiButtonSpin 760ms linear infinite;
}

.inbox-search-result {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
    gap: 0.72rem;
    align-items: center;
    width: 100%;
    border: 1px solid rgba(18, 23, 34, 0.08);
    border-radius: 12px;
    padding: 0.58rem 0.72rem;
    color: var(--ink);
    background:
        linear-gradient(90deg, rgba(15, 118, 110, 0.1) 0 0.24rem, transparent 0.24rem),
        rgba(255, 255, 255, 0.96);
    box-shadow: 0 0.55rem 1.35rem rgba(31, 42, 68, 0.08);
    cursor: pointer;
    text-align: left;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.inbox-search-result:hover,
.inbox-search-result:focus-visible {
    border-color: rgba(15, 118, 110, 0.34);
    box-shadow: 0 0.95rem 2rem rgba(31, 42, 68, 0.14);
    outline: none;
    transform: translateY(-1px);
}

.inbox-search-result-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 8px;
}

.inbox-search-result-copy {
    display: grid;
    min-width: 0;
    gap: 0.13rem;
}

.inbox-search-result-copy strong {
    overflow: hidden;
    font-size: 0.98rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inbox-search-result-copy small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inbox-search-result-snippet {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    color: rgba(18, 23, 34, 0.82);
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.35;
}

.inbox-search-result-snippet b {
    border-radius: 0.24rem;
    padding: 0.02rem 0.12rem;
    color: #14110b;
    background: rgba(238, 196, 83, 0.32);
    font-weight: 950;
}

.inbox-search-result-meta {
    align-self: start;
    border-radius: 999px;
    padding: 0.22rem 0.45rem;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.68rem;
    font-weight: 900;
    white-space: nowrap;
}

.new-email-fields {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.new-email-fields .wide {
    grid-column: 1 / -1;
}

.new-email-fields textarea {
    min-height: 12rem;
    resize: vertical;
}

.new-email-warning {
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 8px;
    margin: 0;
    padding: 0.75rem 0.85rem;
    color: #59481b;
    background: rgba(138, 104, 29, 0.09);
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.4;
}

@media (max-width: 640px) {
    .inbox-search-modal-card {
        width: calc(100vw - 1rem);
        height: min(38rem, calc(100vh - 1rem));
        height: min(38rem, calc(100dvh - 1rem));
        max-height: calc(100vh - 1rem);
        max-height: calc(100dvh - 1rem);
    }

    .inbox-search-result {
        grid-template-columns: 2.35rem minmax(0, 1fr);
        gap: 0.58rem;
    }

    .inbox-search-result-meta {
        grid-column: 1;
        justify-self: center;
        margin-top: -0.25rem;
        padding: 0;
        background: transparent;
        font-size: 0.62rem;
    }

    .inbox-search-result-icon {
        width: 2.1rem;
        height: 2.1rem;
    }

    .new-email-fields {
        grid-template-columns: 1fr;
    }
}

.image-library-native-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

.image-library-picker {
    display: grid;
    gap: 0.45rem;
}

.image-library-picker-button {
    display: grid;
    grid-template-columns: 4.25rem minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    width: 100%;
    min-height: 5rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.55rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(248, 245, 235, 0.66)),
        rgba(255, 255, 255, 0.74);
    box-shadow: 0 0.5rem 1.2rem rgba(31, 42, 68, 0.07);
    text-align: left;
}

.image-library-picker-button:hover {
    border-color: rgba(138, 104, 29, 0.3);
    transform: translateY(-1px);
}

.image-library-picker-preview {
    display: grid;
    width: 4.25rem;
    height: 3.35rem;
    overflow: hidden;
    place-items: center;
    border: 0.35rem solid #fff;
    border-bottom-width: 0.68rem;
    border-radius: 0.18rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), rgba(95, 69, 18, 0.05)),
        rgba(239, 237, 231, 0.76);
    box-shadow: 0 0.55rem 1rem rgba(20, 17, 11, 0.12);
}

.image-library-picker-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-library-picker-preview:empty:before {
    content: "";
    width: 1.05rem;
    height: 0.82rem;
    border: 0.14rem solid currentColor;
    border-radius: 0.12rem;
    color: rgba(138, 104, 29, 0.54);
}

.image-library-picker-copy {
    display: grid;
    min-width: 0;
    gap: 0.16rem;
}

.image-library-picker-copy strong,
.image-library-picker-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-library-picker-copy strong {
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 900;
}

.image-library-picker-copy small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.image-library-modal {
    background: rgba(18, 21, 33, 0.42);
}

.image-library-modal-card {
    width: min(58rem, 100%);
    max-height: min(48rem, 92vh);
}

.image-library-modal-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    justify-content: flex-end;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: var(--radius);
    padding: 0.65rem;
    background: rgba(138, 104, 29, 0.06);
}

.image-library-modal-body {
    min-height: 18rem;
    overflow-y: auto;
    padding-right: 0.2rem;
}

.image-library-polaroid-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    gap: 0.95rem;
    align-items: start;
}

.image-library-polaroid {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.12);
    border-radius: 0.22rem;
    padding: 0.55rem 0.55rem 0.8rem;
    color: var(--ink);
    background: #fff;
    box-shadow: 0 0.9rem 1.8rem rgba(20, 17, 11, 0.12);
    text-align: left;
    transform: rotate(var(--polaroid-tilt, -0.5deg));
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.image-library-polaroid:nth-child(2n) {
    --polaroid-tilt: 0.6deg;
}

.image-library-polaroid:nth-child(3n) {
    --polaroid-tilt: -0.9deg;
}

.image-library-polaroid:hover,
.image-library-polaroid.is-selected {
    border-color: rgba(138, 104, 29, 0.38);
    box-shadow: 0 1.15rem 2.2rem rgba(20, 17, 11, 0.16);
    transform: translateY(-2px) rotate(0deg);
}

.image-library-polaroid.is-selected {
    outline: 0.16rem solid rgba(138, 104, 29, 0.24);
}

.image-library-polaroid-media {
    display: grid;
    aspect-ratio: 1 / 0.78;
    overflow: hidden;
    place-items: center;
    border-radius: 0.12rem;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), rgba(95, 69, 18, 0.06)),
        rgba(239, 237, 231, 0.84);
}

.image-library-polaroid-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-library-polaroid-media span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
}

.image-library-polaroid strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.8rem;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-library-empty {
    margin-top: 0.85rem;
}

.image-library-upload-modal {
    z-index: 92;
    background: rgba(18, 21, 33, 0.5);
}

.image-library-upload-card {
    width: min(34rem, 100%);
}

.image-library-upload-panel {
    display: grid;
    gap: 0.8rem;
}

.image-library-upload-panel .image-dropzone {
    min-height: 10rem;
}

.image-library-upload-panel label {
    display: grid;
    gap: 0.38rem;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.image-library-upload-notice {
    display: none;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius);
    padding: 0.72rem 0.85rem;
    color: var(--brand-deep);
    background: rgba(218, 190, 112, 0.12);
    font-size: 0.82rem;
    font-weight: 850;
}

.image-library-upload-notice.is-visible {
    display: block;
}

.image-library-upload-notice.is-error {
    color: #7f1d1d;
    border-color: rgba(164, 62, 62, 0.28);
    background: rgba(164, 62, 62, 0.1);
}

.chatflow-route-modal {
    align-items: center;
    justify-items: center;
    overflow-y: auto;
    padding-top: max(1rem, env(safe-area-inset-top));
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
}

.chatflow-route-modal .cms-modal-card {
    margin-top: 0;
}

@media (max-width: 759px) {
    .chatflow-route-modal {
        align-items: stretch;
        padding: 0;
    }

    .chatflow-route-modal .cms-modal-card {
        width: 100%;
        min-height: 100dvh;
        border-radius: 0;
    }
}

@media (min-width: 760px) {
    .team-availability-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .team-holiday-form {
        grid-template-columns: minmax(9rem, 0.8fr) minmax(9rem, 0.8fr) minmax(0, 1.4fr) auto;
        align-items: end;
    }

    .team-shift-form {
        grid-template-columns: minmax(12rem, 1.2fr) minmax(9rem, 0.75fr) minmax(7rem, 0.55fr) minmax(7rem, 0.55fr) minmax(10rem, 1fr) minmax(0, 1.2fr) auto;
    }

    .team-clock-admin-row {
        grid-template-columns: minmax(13rem, 1fr) minmax(12rem, 0.8fr) minmax(12rem, 0.8fr) minmax(12rem, 1fr) auto;
        align-items: end;
    }

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

    .team-seat-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.65rem;
    }

    .team-seat-fields {
        grid-template-columns: minmax(9rem, 1fr) minmax(11rem, 1.2fr) minmax(6.5rem, 0.55fr) minmax(8rem, 0.8fr);
        align-items: end;
    }

    .team-seat-actions {
        grid-column: auto;
        flex-wrap: nowrap;
        justify-content: flex-end;
        align-self: end;
        min-width: max-content;
    }

    .team-seat-actions .button-soft,
    .team-seat-actions .button-primary {
        min-height: 2.45rem;
        padding-inline: 0.72rem;
    }

    .commerce-editor-grid {
        grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr));
    }

    .workspace-settings-grid {
        grid-template-columns: minmax(15rem, 0.58fr) minmax(0, 1.42fr);
        align-items: start;
    }

    .team-password-row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    .cms-block-palette {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1180px) {
    .cms-block-palette {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 980px) {
    .flow-builder-page {
        grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
        align-items: start;
    }

    .flow-list-panel {
        position: sticky;
        top: 1.25rem;
    }

    .flow-settings {
        grid-template-columns: minmax(0, 1.1fr) minmax(8rem, 0.45fr) minmax(0, 1fr);
    }

    .chatflow-builder.is-editor-open {
        justify-items: center;
    }

    .chatflow-builder.is-editor-open .chatflow-editor-panel {
        width: 80%;
        max-width: 78rem;
    }

    .chatflow-setup-card {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .chatflow-setup-stack {
        grid-template-columns: minmax(15rem, 0.72fr) minmax(0, 1.28fr);
        align-items: stretch;
    }

    .chatflow-trigger-card,
    .chatflow-fallback-card,
    .chatflow-status-card {
        grid-column: 1;
    }

    .chatflow-welcome-card {
        grid-column: 2;
        grid-row: 1 / span 3;
        align-content: start;
    }

    .chatflow-welcome-card textarea {
        min-height: 10rem;
    }

    .chatflow-trigger-label,
    .chatflow-message-grid,
    .chatflow-trigger-input {
        grid-column: 1 / -1;
    }

    .chatflow-choice-builder-head {
        grid-template-columns: minmax(0, 1fr);
    }

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

    .chatflow-route-grid:before {
        grid-column: 1 / -1;
    }

    .chatflow-choice-pair {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .chatflow-admin-settings {
        grid-template-columns: minmax(0, 1fr);
    }

    .flow-step-fields {
        grid-template-columns: minmax(10rem, 0.65fr) minmax(0, 1.35fr);
    }

    .commerce-line-item {
        grid-template-columns: minmax(10rem, 0.9fr) minmax(14rem, 1.6fr) minmax(6rem, 0.5fr) minmax(7rem, 0.6fr) auto;
    }

    .form-field-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: end;
    }

    .forms-delivery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .form-submission-badges {
        justify-content: end;
    }

    .quiet-feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .blog-cover-editor {
        grid-template-columns: minmax(18rem, 0.82fr) minmax(0, 1fr);
    }
}

@media (min-width: 1180px) {
    .cms-shell {
        grid-template-columns: minmax(13.5rem, 16rem) minmax(0, 1fr);
        align-items: start;
    }

    .team-shell.is-editor-open {
        grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
        align-items: start;
    }
}

.cms-editor-open,
.chatflow-editor-open {
    overflow: hidden;
}

.cms-editor-open .mobile-topbar,
.cms-editor-open .sidebar,
.chatflow-editor-open .mobile-topbar,
.chatflow-editor-open .sidebar {
    display: none !important;
}

.cms-editor-open .main-content,
.chatflow-editor-open .main-content {
    margin-left: 0;
    padding: 0;
}

.chatflow-editor-open .main-content {
    position: fixed;
    inset: 0;
    z-index: 68;
    width: 100vw;
    max-width: none;
    min-height: 100dvh;
    overflow: hidden;
    animation: none;
    transform: none;
    transition: none;
}

.chatflow-builder.is-editor-open {
    position: fixed;
    inset: 0;
    z-index: 69;
    display: block;
    width: 100vw;
    max-width: none;
    min-height: 100dvh;
    margin: 0;
    overflow: hidden;
}

.chatflow-builder.is-editor-open .chatflow-editor-panel {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: block;
    width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100dvh;
    height: 100dvh;
    margin: 0 !important;
    box-sizing: border-box;
    overflow-y: auto;
    border: 0;
    border-radius: 0;
    padding: 5.5rem max(1rem, env(safe-area-inset-right)) 2rem max(1rem, env(safe-area-inset-left));
    background:
        linear-gradient(180deg, rgba(246, 248, 255, 0.98), rgba(255, 255, 255, 0.98)),
        var(--surface);
    box-shadow: none;
}

.chatflow-builder.is-editor-open .chatflow-editor-head {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 76;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    min-height: 4.4rem;
    width: 100vw;
    box-sizing: border-box;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding: max(0.6rem, env(safe-area-inset-top)) max(0.9rem, env(safe-area-inset-right)) 0.6rem max(0.9rem, env(safe-area-inset-left));
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 12px 34px rgba(138, 104, 29, 0.22);
    backdrop-filter: blur(18px);
}

.chatflow-builder.is-editor-open .chatflow-editor-head > div:first-child {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0.08rem 0.65rem;
    align-items: center;
    min-width: 0;
}

.chatflow-builder.is-editor-open .chatflow-editor-back {
    grid-row: 1 / span 2;
}

.chatflow-builder.is-editor-open .chatflow-editor-head .eyebrow,
.chatflow-builder.is-editor-open .chatflow-editor-head .editor-heading-text {
    grid-column: 2;
    overflow: hidden;
    color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chatflow-builder.is-editor-open .chatflow-editor-head .eyebrow {
    opacity: 0.74;
}

.chatflow-builder.is-editor-open .chatflow-editor-head .editor-heading-text {
    margin-top: 0;
    font-size: clamp(0.98rem, 2.4vw, 1.18rem);
}

.chatflow-builder.is-editor-open .chatflow-editor-back {
    border-color: rgba(255, 255, 255, 0.24);
    color: #fff;
    background: rgba(255, 255, 255, 0.13);
    box-shadow: none;
}

.chatflow-builder.is-editor-open .flow-editor-actions {
    width: auto;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.chatflow-builder.is-editor-open .flow-editor-actions > * {
    flex: 0 0 auto;
}

.chatflow-builder.is-editor-open .flow-editor-actions .commerce-status-pill {
    flex: 0 0 auto;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.chatflow-builder.is-editor-open .flow-test-button {
    color: var(--brand-deep);
    background: rgba(255, 255, 255, 0.92);
}

.chatflow-builder.is-editor-open .chatflow-setup-stack,
.chatflow-builder.is-editor-open .chatflow-choice-builder,
.chatflow-builder.is-editor-open .chatflow-map {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
}

.cms-shell.is-editor-open {
    display: block;
    min-height: 100dvh;
}

.cms-shell.is-editor-open .cms-editor-panel {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: block;
    overflow-y: auto;
    border: 0;
    border-radius: 0;
    padding: 5.15rem 1rem 6rem;
    padding: 5.15rem 1rem max(6rem, calc(2.5rem + env(safe-area-inset-bottom)));
    scroll-padding-bottom: max(6rem, calc(2.5rem + env(safe-area-inset-bottom)));
    background:
        linear-gradient(180deg, rgba(246, 248, 255, 0.98), rgba(255, 255, 255, 0.98)),
        var(--surface);
    box-shadow: none;
}

.cms-shell.is-editor-open .cms-editor-bar {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 76;
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
    gap: 0.55rem;
    align-items: center;
    min-height: 4.15rem;
    padding: max(0.55rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right)) 0.55rem max(0.75rem, env(safe-area-inset-left));
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 12px 34px rgba(138, 104, 29, 0.22);
}

.website-pages-shell.is-editor-open .cms-editor-bar {
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
}

.cms-shell.is-editor-open .cta-editor-panel .cms-editor-bar {
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
}

.landing-pages-shell.is-editor-open .cms-editor-bar {
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
}

.blog-shell.is-editor-open .cms-editor-bar {
    grid-template-columns: 2.65rem minmax(0, 1fr) auto;
}

.cms-editor-bar strong {
    overflow: hidden;
    font-size: 1rem;
    font-weight: 900;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cms-editor-back {
    color: #fff;
}

.cms-preview-button {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 999px;
    padding: 0 0.85rem;
    color: #fff;
    background: rgba(0, 0, 0, 0.18);
    box-shadow: 0 0.55rem 1.4rem rgba(0, 0, 0, 0.12);
    font-size: 0.78rem;
    font-weight: 950;
    text-decoration: none;
}

.cms-preview-button:hover {
    transform: translateY(-1px);
    background: rgba(0, 0, 0, 0.26);
}

:root[data-theme="dark"] .login-metrics div,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .home-card,
:root[data-theme="dark"] .module-card,
:root[data-theme="dark"] .onboarding-card,
:root[data-theme="dark"] .onboarding-module-card,
:root[data-theme="dark"] .onboarding-choice,
:root[data-theme="dark"] .onboarding-branding-card,
:root[data-theme="dark"] .conversation-item,
:root[data-theme="dark"] .thread-panel,
:root[data-theme="dark"] .financial-metric,
:root[data-theme="dark"] .financial-status-row,
:root[data-theme="dark"] .financial-list-row,
:root[data-theme="dark"] .momentum-item,
:root[data-theme="dark"] .quick-actions a,
:root[data-theme="dark"] .week-day-card,
:root[data-theme="dark"] .week-event,
:root[data-theme="dark"] .availability-slot-card,
:root[data-theme="dark"] .cms-page-row,
:root[data-theme="dark"] .cms-block-card,
:root[data-theme="dark"] .cms-block-actions button,
:root[data-theme="dark"] .commerce-list-row,
:root[data-theme="dark"] .commerce-editor-panel,
:root[data-theme="dark"] .workspace-logo-panel,
:root[data-theme="dark"] .channel-hero,
:root[data-theme="dark"] .channel-picker,
:root[data-theme="dark"] .channel-setup-notes,
:root[data-theme="dark"] .channel-card,
:root[data-theme="dark"] .flow-step-card,
:root[data-theme="dark"] .contact-type-card,
:root[data-theme="dark"] .cta-library-tile,
:root[data-theme="dark"] .cta-preview-card,
:root[data-theme="dark"] .form-field-card,
:root[data-theme="dark"] .forms-delivery-card,
:root[data-theme="dark"] .form-submission-row,
:root[data-theme="dark"] .seo-mini-card,
:root[data-theme="dark"] .seo-settings-card,
:root[data-theme="dark"] .seo-location-card,
:root[data-theme="dark"] .seo-check-row,
:root[data-theme="dark"] .seo-sitemap-row,
:root[data-theme="dark"] .seo-ai-row,
:root[data-theme="dark"] .seo-ai-actions-panel,
:root[data-theme="dark"] .seo-ai-opportunities,
:root[data-theme="dark"] .seo-opportunity-panel,
:root[data-theme="dark"] .seo-opportunity-card,
:root[data-theme="dark"] .seo-opportunity-empty,
:root[data-theme="dark"] .seo-health-card,
:root[data-theme="dark"] .seo-tool-panel,
:root[data-theme="dark"] .seo-health-row,
:root[data-theme="dark"] .seo-google-preview,
:root[data-theme="dark"] .seo-gap-grid article,
:root[data-theme="dark"] .seo-image-alt-list article,
:root[data-theme="dark"] .seo-broken-list article,
:root[data-theme="dark"] .quiet-feature-card,
:root[data-theme="dark"] .billing-seat-panel,
:root[data-theme="dark"] .billing-offer-panel,
:root[data-theme="dark"] .billing-confidence-panel,
:root[data-theme="dark"] .billing-plan-summary,
:root[data-theme="dark"] .billing-module-card,
:root[data-theme="dark"] .billing-reassurance-strip span,
:root[data-theme="dark"] .billing-route-strip span,
:root[data-theme="dark"] .billing-success-next span,
:root[data-theme="dark"] .trial-countdown-panel,
:root[data-theme="dark"] .trial-countdown-card,
:root[data-theme="dark"] .public-sales-step-strip span,
:root[data-theme="dark"] .email-responder-toolbar,
:root[data-theme="dark"] .email-responder-card,
:root[data-theme="dark"] .email-trigger-row,
:root[data-theme="dark"] .workspace-danger-zone {
    border-color: var(--line);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.94), rgba(15, 23, 35, 0.74)),
        rgba(20, 29, 42, 0.8);
    box-shadow: var(--soft-shadow);
}

:root[data-theme="dark"] .cms-rich-editor.is-ready:not(.is-plain-text) .cms-rich-toolbar {
    border-color: rgba(185, 141, 43, 0.28);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.94), rgba(15, 23, 35, 0.72)),
        rgba(20, 29, 42, 0.8);
}

:root[data-theme="dark"] .cms-rich-button {
    border-color: rgba(185, 141, 43, 0.3);
    background: rgba(255, 255, 255, 0.08);
    color: var(--ink);
}

:root[data-theme="dark"] .form-submission-row.is-heading {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

:root[data-theme="dark"] .onboarding-card.is-step-flow {
    border-color: rgba(216, 179, 90, 0.18);
    background:
        linear-gradient(145deg, rgba(24, 35, 53, 0.94), rgba(15, 23, 35, 0.82)),
        radial-gradient(circle at 12% 0%, rgba(99, 199, 189, 0.1), transparent 18rem),
        radial-gradient(circle at 96% 14%, rgba(209, 132, 112, 0.1), transparent 19rem),
        rgba(20, 29, 42, 0.82);
}

:root[data-theme="dark"] .onboarding-progress {
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.86), rgba(15, 23, 35, 0.66)),
        rgba(20, 29, 42, 0.74);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.08), 0 0.75rem 1.6rem rgba(0, 0, 0, 0.14);
}

:root[data-theme="dark"] .onboarding-progress span:hover,
:root[data-theme="dark"] .onboarding-progress span:focus-visible {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.08);
}

:root[data-theme="dark"] .onboarding-feature-chips small {
    border-color: rgba(218, 190, 112, 0.24);
    color: #f5e8c7;
    background: rgba(218, 190, 112, 0.12);
}

:root[data-theme="dark"] .onboarding-included-strip span,
:root[data-theme="dark"] .onboarding-quick-addons {
    border-color: rgba(218, 190, 112, 0.2);
    color: #f5e8c7;
    background: rgba(218, 190, 112, 0.1);
}

:root[data-theme="dark"] .login-card .register-selected-module {
    border-color: rgba(216, 179, 90, 0.18);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.94), rgba(15, 23, 35, 0.72)),
        rgba(20, 29, 42, 0.8);
}

:root[data-theme="dark"] .login-card .register-selected-module strong {
    color: var(--ink);
}

:root[data-theme="dark"] .form-submission-detail pre {
    background: rgba(18, 27, 40, 0.8);
}

:root[data-theme="dark"] .home-card:before,
:root[data-theme="dark"] .module-card:before,
:root[data-theme="dark"] .onboarding-module-card:before,
:root[data-theme="dark"] .financial-metric {
    opacity: 0.96;
}

:root[data-theme="dark"] .notice-panel,
:root[data-theme="dark"] .empty-state {
    color: #ffd2cc;
    border-color: rgba(255, 143, 130, 0.22);
    background: rgba(24, 35, 53, 0.82);
}

:root[data-theme="dark"] .notice-panel.success-panel {
    color: #b8f2ce;
    border-color: rgba(99, 215, 151, 0.24);
    background: rgba(24, 48, 40, 0.78);
}

:root[data-theme="dark"] .empty-state {
    color: var(--muted);
}

:root[data-theme="dark"] .conversation-item.is-selected {
    border-color: rgba(216, 179, 90, 0.88);
    color: #fff;
    background: linear-gradient(135deg, #090d14 0%, #1b2430 52%, #3a2c0f 100%);
    box-shadow:
        inset 0.32rem 0 0 rgba(255, 255, 255, 0.95),
        inset 0.58rem 0 0 var(--brand),
        0 0 0 0.14rem rgba(13, 20, 31, 0.98),
        0 0 0 0.34rem rgba(216, 179, 90, 0.58),
        0 0.95rem 2rem rgba(0, 0, 0, 0.32);
}

:root[data-theme="dark"] .conversation-item.is-resolved {
    border-color: rgba(255, 255, 255, 0.08);
    color: rgba(242, 235, 220, 0.72);
    background: rgba(24, 35, 53, 0.86);
    box-shadow: none;
}

:root[data-theme="dark"] .conversation-item.is-open.is-owned:not(.is-unread):not(.is-resolved) {
    border-color: rgba(255, 255, 255, 0.08);
    color: rgba(242, 235, 220, 0.76);
    background: rgba(24, 35, 53, 0.86);
    box-shadow: none;
}

:root[data-theme="dark"] .conversation-item.is-unowned:not(.is-unread):not(.is-resolved) {
    border-color: rgba(231, 132, 102, 0.78);
    color: #fff;
    background: linear-gradient(135deg, #a65a45, #5a2a24);
    box-shadow: 0 0.75rem 1.6rem rgba(231, 132, 102, 0.16);
}

:root[data-theme="dark"] .conversation-item.is-deleted {
    border-color: rgba(148, 163, 184, 0.3);
    color: #fff;
    background: linear-gradient(135deg, #475569, #1e293b);
    box-shadow: none;
}

:root[data-theme="dark"] .conversation-item.is-unread {
    border-color: rgba(216, 179, 90, 0.9);
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
    box-shadow: 0 0.9rem 2rem rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .inbox-search-empty,
:root[data-theme="dark"] .inbox-search-result {
    border-color: rgba(216, 179, 90, 0.2);
    background:
        linear-gradient(90deg, rgba(15, 118, 110, 0.16) 0 0.24rem, transparent 0.24rem),
        rgba(24, 35, 53, 0.92);
}

:root[data-theme="dark"] .inbox-search-result-snippet {
    color: rgba(242, 235, 220, 0.78);
}

:root[data-theme="dark"] .inbox-search-result-snippet b {
    color: #fff5d6;
    background: rgba(216, 179, 90, 0.24);
}

:root[data-theme="dark"] .inbox-search-field .inbox-search-icon,
:root[data-theme="dark"] .inbox-search-result-meta {
    color: var(--brand);
}

:root[data-theme="dark"] .conversation-item.is-selected .conversation-primary {
    color: inherit;
}

:root[data-theme="dark"] .input-control,
:root[data-theme="dark"] .button-soft,
:root[data-theme="dark"] .button-quiet,
:root[data-theme="dark"] .chip-button {
    color: var(--ink);
    border-color: var(--line);
    background: var(--input-bg);
}

:root[data-theme="dark"] .cms-shell.is-editor-open .cms-editor-panel {
    background:
        linear-gradient(180deg, rgba(15, 23, 35, 0.98), rgba(13, 20, 31, 0.98)),
        var(--surface);
}

:root[data-theme="dark"] .cms-live-preview-panel {
    border-color: rgba(191, 149, 63, 0.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(191, 149, 63, 0.14), transparent 10rem),
        rgba(15, 23, 35, 0.92);
    box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.26);
}

:root[data-theme="dark"] .composer,
:root[data-theme="dark"] .mobile-thread-open .thread-panel .composer {
    background: rgba(13, 20, 31, 0.94);
}

:root[data-theme="dark"] .chatflow-tile,
:root[data-theme="dark"] .chatflow-setup-card,
:root[data-theme="dark"] .chatflow-admin-details,
:root[data-theme="dark"] .chatflow-admin-settings,
:root[data-theme="dark"] .chatflow-choice-builder,
:root[data-theme="dark"] .chatflow-map-start,
:root[data-theme="dark"] .chatflow-choice-pair,
:root[data-theme="dark"] .chatflow-preview-panel,
:root[data-theme="dark"] .chatflow-route-modal .cms-modal-card {
    border-color: var(--line);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.12), transparent 48%),
        rgba(20, 29, 42, 0.82);
}

:root[data-theme="dark"] .chatflow-editor-back {
    background: rgba(18, 27, 40, 0.78);
}

:root[data-theme="dark"] .chatflow-editor-head {
    border-color: var(--line);
    background: rgba(16, 25, 37, 0.9);
    box-shadow: 0 0.85rem 1.8rem rgba(0, 0, 0, 0.18);
}

:root[data-theme="dark"] .chatflow-builder.is-editor-open .chatflow-editor-panel {
    background:
        linear-gradient(180deg, rgba(15, 23, 35, 0.98), rgba(13, 20, 31, 0.98)),
        var(--surface);
}

:root[data-theme="dark"] .chatflow-builder.is-editor-open .chatflow-editor-head {
    background: var(--banner-gold-gradient);
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.28);
}

:root[data-theme="dark"] .info-tip:before,
:root[data-theme="dark"] .info-tip:after {
    border-color: var(--line);
    background: rgba(20, 29, 42, 0.98);
}

:root[data-theme="dark"] .info-tip:before {
    color: var(--ink);
}

:root[data-theme="dark"] .channel-page-modal-card,
:root[data-theme="dark"] .channel-page-option {
    border-color: var(--line);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.96), rgba(15, 23, 35, 0.9)),
        rgba(20, 29, 42, 0.86);
}

body.login-page-minimal {
    position: relative;
    display: grid;
    place-items: center;
    color: #f3eee4;
    background:
        radial-gradient(circle at 16% 14%, rgba(15, 118, 110, 0.24), transparent 24rem),
        radial-gradient(circle at 84% 10%, rgba(166, 90, 69, 0.22), transparent 23rem),
        radial-gradient(circle at 72% 92%, rgba(138, 104, 29, 0.28), transparent 26rem),
        linear-gradient(138deg, #080b0f 0%, #15140d 42%, #231609 100%);
    isolation: isolate;
}

body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.76) 0%, rgba(7, 10, 15, 0.48) 48%, rgba(7, 10, 15, 0.82) 100%),
        url("../images/dogwalkr.jpg") center center / cover no-repeat;
}

body.login-page-minimal.register-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.78) 0%, rgba(7, 10, 15, 0.38) 48%, rgba(7, 10, 15, 0.82) 100%),
        url("../images/marketing/real-kitchen-table-consultant.jpg") center center / cover no-repeat;
}

html[data-register-bg="glitter"] body.login-page-minimal.register-page,
html[data-register-bg="glitter"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.72) 0%, rgba(7, 10, 15, 0.44) 48%, rgba(7, 10, 15, 0.82) 100%),
        url("../images/glitter.jpeg") center center / cover no-repeat;
}

html[data-register-bg="goldbeams"] body.login-page-minimal.register-page,
html[data-register-bg="goldbeams"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.74) 0%, rgba(7, 10, 15, 0.46) 48%, rgba(7, 10, 15, 0.84) 100%),
        url("../images/goldbeams.jpeg") center center / cover no-repeat;
}

html[data-register-bg="goldwater"] body.login-page-minimal.register-page,
html[data-register-bg="goldwater"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.72) 0%, rgba(7, 10, 15, 0.46) 48%, rgba(7, 10, 15, 0.82) 100%),
        url("../images/goldwater.jpeg") center center / cover no-repeat;
}

html[data-register-bg="revcounter"] body.login-page-minimal.register-page,
html[data-register-bg="revcounter"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(7, 10, 15, 0.76) 0%, rgba(7, 10, 15, 0.5) 48%, rgba(7, 10, 15, 0.86) 100%),
        url("../images/revcounter.jpeg") center center / cover no-repeat;
}

body.login-page-minimal:before,
body.login-page-minimal:after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

body.login-page-minimal:before {
    background-image:
        radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.22) 0 1px, transparent 1.35px),
        radial-gradient(circle at 13px 17px, rgba(0, 0, 0, 0.24) 0 0.8px, transparent 1.2px),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 9px);
    background-size: 18px 18px, 31px 31px, 100% 100%;
    opacity: 0.34;
    mix-blend-mode: soft-light;
}

body.login-page-minimal:after {
    background:
        linear-gradient(118deg, transparent 0 24%, rgba(255, 255, 255, 0.12) 39%, transparent 56%),
        radial-gradient(circle at 48% 0%, rgba(255, 255, 255, 0.12), transparent 22rem);
    opacity: 0.46;
}

body.login-page-minimal.register-page:after,
body.login-page-minimal.auth-background-page:after {
    background:
        radial-gradient(circle at 22% 20%, rgba(255, 255, 255, 0.2), transparent 18rem),
        radial-gradient(circle at 78% 76%, rgba(255, 214, 142, 0.22), transparent 19rem),
        linear-gradient(118deg, transparent 0 22%, rgba(255, 255, 255, 0.13) 39%, transparent 58%);
    opacity: 0.78;
    animation: registerLightSweep 16s ease-in-out infinite alternate;
}

.login-page-minimal form {
    position: relative;
    z-index: 1;
    width: 100%;
}

.login-page-minimal .login-shell {
    min-height: 100vh;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    place-items: center;
    padding: 1rem;
}

.login-page-minimal .register-shell {
    grid-template-columns: minmax(20rem, 0.9fr) minmax(21rem, 27rem);
    gap: clamp(1rem, 3.4vw, 2.35rem);
    align-items: center;
    justify-content: center;
    perspective: 80rem;
}

.register-page .register-shell > * {
    animation: registerPanelIn 0.72s cubic-bezier(0.2, 0.78, 0.26, 1) both;
}

.register-page .register-shell > .login-card {
    animation-delay: 0.12s;
}

.login-page-minimal .login-card {
    max-width: 25.5rem;
    gap: 1.15rem;
    padding: 1.35rem;
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.93);
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(18px);
}

.login-page-minimal .register-shell .login-card {
    max-width: 27rem;
    border-color: rgba(255, 255, 255, 0.42);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(250, 253, 252, 0.86)),
        rgba(255, 255, 255, 0.82);
    box-shadow:
        0 2.1rem 5rem rgba(0, 0, 0, 0.38),
        0 0 0 1px rgba(255, 255, 255, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

.register-value-panel {
    position: relative;
    display: grid;
    gap: 1rem;
    max-width: 40rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 8px;
    padding: clamp(1.2rem, 3.2vw, 2.15rem);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.18)),
        rgba(255, 255, 255, 0.18);
    box-shadow:
        0 2.4rem 5.5rem rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(255, 255, 255, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.38);
    backdrop-filter: blur(20px) saturate(1.18);
}

.register-value-panel:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.26rem;
    background: linear-gradient(180deg, #f7ead0, #8a681d 52%, #2f2210);
    box-shadow: 0 0 2rem rgba(138, 104, 29, 0.4);
    z-index: 1;
}

.register-value-panel:after {
    content: "";
    position: absolute;
    inset: -30% -16% auto auto;
    width: 18rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0) 64%);
    opacity: 0.8;
    pointer-events: none;
    z-index: 0;
}

.register-value-panel > * {
    position: relative;
    z-index: 1;
}

.register-value-logo {
    justify-self: start;
}

.register-value-panel h1 {
    max-width: 34rem;
    margin: 0;
    color: #fff;
    text-shadow: 0 0.18rem 1.3rem rgba(0, 0, 0, 0.42);
    font-size: clamp(2.35rem, 5vw, 4.35rem);
    line-height: 0.96;
    font-weight: 950;
}

.register-value-panel p {
    max-width: 35rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    text-shadow: 0 0.12rem 0.7rem rgba(0, 0, 0, 0.32);
    font-size: 1.02rem;
    line-height: 1.55;
    font-weight: 720;
}

.register-startup-banner {
    display: grid;
    gap: 0.18rem;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 8px;
    padding: 0.82rem 0.9rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.1)),
        rgba(255, 255, 255, 0.12);
    box-shadow:
        0 0.85rem 1.6rem rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
    color: #141820;
}

.register-startup-banner strong {
    color: #141820;
    font-size: 1rem;
    line-height: 1.2;
    font-weight: 950;
    text-shadow: none;
}

.register-startup-banner span {
    color: rgba(20, 24, 32, 0.76);
    font-size: 0.84rem;
    line-height: 1.38;
    font-weight: 780;
    text-shadow: none;
}

.register-value-list {
    display: grid;
    gap: 0.75rem;
}

.register-value-list span,
.register-selected-module {
    display: grid;
    gap: 0.2rem;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    padding: 0.85rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.14)),
        rgba(255, 255, 255, 0.13);
    box-shadow:
        0 0.85rem 1.6rem rgba(0, 0, 0, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.24);
    backdrop-filter: blur(12px);
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.register-value-list span:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.36);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.18)),
        rgba(255, 255, 255, 0.16);
}

.register-value-list strong,
.register-selected-module strong {
    color: #141820;
    text-shadow: none;
    font-size: 0.98rem;
    line-height: 1.18;
    font-weight: 950;
}

.register-value-list small,
.register-selected-module small {
    color: rgba(20, 24, 32, 0.72);
    font-size: 0.82rem;
    line-height: 1.42;
    font-weight: 720;
}

.register-selected-module {
    border-color: rgba(138, 104, 29, 0.2);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), rgba(95, 69, 18, 0.08)),
        rgba(255, 255, 255, 0.84);
}

.register-selected-module span {
    width: max-content;
    max-width: 100%;
    border-radius: 999px;
    padding: 0.2rem 0.52rem;
    background: rgba(138, 104, 29, 0.12);
    color: #5f4512;
    font-size: 0.72rem;
    font-weight: 950;
}

.login-card .register-selected-module {
    border-color: rgba(138, 104, 29, 0.2);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.74)),
        rgba(138, 104, 29, 0.08);
    box-shadow: 0 0.65rem 1.3rem rgba(31, 42, 68, 0.08);
}

.login-card .register-selected-module strong {
    color: var(--ink);
    text-shadow: none;
}

.login-card .register-selected-module small {
    color: var(--muted);
}

.login-wordmark-link {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    width: max-content;
    max-width: 100%;
    justify-self: center;
}

.login-mark {
    display: block;
    width: 2.1rem;
    height: 2.1rem;
    object-fit: contain;
}

.login-wordmark {
    display: block;
    width: auto;
    height: auto;
    max-width: 9.6rem;
    max-height: 1.95rem;
    object-fit: contain;
}

.login-page-minimal .login-card-head {
    text-align: center;
}

.login-page-minimal .login-card h1 {
    margin: 0;
    color: var(--ink);
    font-size: 1.35rem;
    line-height: 1.2;
}

.login-page-minimal .login-card-head p {
    margin: 0.45rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.42;
    font-weight: 720;
}

.login-page-minimal .auth-grid,
.login-page-minimal .form-stack {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
}

.login-page-minimal .auth-divider {
    text-transform: none;
    font-size: 0.78rem;
    font-weight: 750;
}

.login-page-minimal .meta-auth-button {
    min-height: 2.85rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: none;
}

.login-page-minimal .input-control {
    min-height: 2.9rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
}

.register-password-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.register-password-field {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.login-page-minimal .button-primary {
    width: 100%;
    min-height: 2.95rem;
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.22), transparent 38%),
        var(--banner-gold-gradient);
    box-shadow:
        0 1rem 2rem rgba(var(--brand-rgb), 0.24),
        0 0 0 1px rgba(255, 255, 255, 0.14) inset;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.login-page-minimal .button-primary:hover,
.login-page-minimal .button-primary:focus {
    transform: translateY(-1px);
    box-shadow:
        0 1.2rem 2.4rem rgba(var(--brand-rgb), 0.3),
        0 0 0 1px rgba(255, 255, 255, 0.18) inset;
}

.login-page-minimal .helper-copy {
    text-align: center;
}

.login-page-minimal .auth-secondary-link {
    margin: -0.15rem 0 0.1rem;
    font-size: 0.83rem;
    font-weight: 820;
}

.login-page-minimal .auth-secondary-link a {
    color: var(--brand-deep);
}

.login-page-minimal .auth-secondary-link a:hover {
    color: var(--brand);
}

.login-page-minimal .login-signup-prompt {
    display: grid;
    gap: 0.55rem;
    margin-top: 0.2rem;
    border: 1px solid rgba(138, 104, 29, 0.2);
    border-radius: 8px;
    padding: 0.78rem;
    background:
        linear-gradient(135deg, rgba(var(--brand-rgb), 0.1), rgba(var(--brand-deep-rgb), 0.07)),
        rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.7rem 1.6rem rgba(31, 42, 68, 0.08);
}

.login-page-minimal .login-signup-prompt span {
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 780;
}

.login-page-minimal .login-signup-prompt a {
    display: inline-flex;
    min-height: 2.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    padding: 0 0.9rem;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 38%),
        var(--banner-gold-gradient);
    box-shadow:
        0 0.85rem 1.8rem rgba(var(--brand-rgb), 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
    font-size: 0.88rem;
    font-weight: 950;
}

.login-page-minimal .login-signup-prompt a:hover {
    transform: translateY(-1px);
    box-shadow:
        0 1rem 2.1rem rgba(var(--brand-rgb), 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.register-terms-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.75rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.register-terms-check input {
    width: 1rem;
    height: 1rem;
    margin-top: 0.12rem;
    accent-color: var(--brand);
}

.register-terms-check a {
    color: var(--brand-deep);
    font-weight: 850;
}

html[data-theme="dark"] body.login-page-minimal {
    background:
        radial-gradient(circle at 16% 14%, rgba(99, 199, 189, 0.18), transparent 24rem),
        radial-gradient(circle at 84% 10%, rgba(209, 132, 112, 0.16), transparent 23rem),
        radial-gradient(circle at 72% 92%, rgba(216, 179, 90, 0.2), transparent 26rem),
        linear-gradient(138deg, #07090d 0%, #10130f 42%, #1b1208 100%);
}

html[data-theme="dark"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.86) 0%, rgba(4, 7, 12, 0.6) 48%, rgba(4, 7, 12, 0.9) 100%),
        url("../images/dogwalkr.jpg") center center / cover no-repeat;
}

html[data-theme="dark"] body.login-page-minimal.register-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.88) 0%, rgba(4, 7, 12, 0.5) 48%, rgba(4, 7, 12, 0.92) 100%),
        url("../images/marketing/real-kitchen-table-consultant.jpg") center center / cover no-repeat;
}

html[data-theme="dark"][data-register-bg="glitter"] body.login-page-minimal.register-page,
html[data-theme="dark"][data-register-bg="glitter"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.82) 0%, rgba(4, 7, 12, 0.56) 48%, rgba(4, 7, 12, 0.9) 100%),
        url("../images/glitter.jpeg") center center / cover no-repeat;
}

html[data-theme="dark"][data-register-bg="goldbeams"] body.login-page-minimal.register-page,
html[data-theme="dark"][data-register-bg="goldbeams"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.84) 0%, rgba(4, 7, 12, 0.58) 48%, rgba(4, 7, 12, 0.91) 100%),
        url("../images/goldbeams.jpeg") center center / cover no-repeat;
}

html[data-theme="dark"][data-register-bg="goldwater"] body.login-page-minimal.register-page,
html[data-theme="dark"][data-register-bg="goldwater"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.82) 0%, rgba(4, 7, 12, 0.58) 48%, rgba(4, 7, 12, 0.9) 100%),
        url("../images/goldwater.jpeg") center center / cover no-repeat;
}

html[data-theme="dark"][data-register-bg="revcounter"] body.login-page-minimal.register-page,
html[data-theme="dark"][data-register-bg="revcounter"] body.login-page-minimal.auth-background-page {
    background:
        linear-gradient(115deg, rgba(4, 7, 12, 0.86) 0%, rgba(4, 7, 12, 0.62) 48%, rgba(4, 7, 12, 0.92) 100%),
        url("../images/revcounter.jpeg") center center / cover no-repeat;
}

html[data-theme="dark"] body.login-page-minimal .login-card {
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(20, 29, 42, 0.9);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.24);
}

html[data-theme="dark"] body.login-page-minimal .login-signup-prompt {
    border-color: rgba(216, 179, 90, 0.18);
    background:
        linear-gradient(135deg, rgba(216, 179, 90, 0.12), rgba(99, 199, 189, 0.08)),
        rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] body.login-page-minimal .register-value-panel,
html[data-theme="dark"] body.login-page-minimal .register-value-list span,
html[data-theme="dark"] body.login-page-minimal .register-selected-module {
    border-color: rgba(255, 255, 255, 0.08);
    background:
        linear-gradient(135deg, rgba(24, 35, 53, 0.68), rgba(15, 23, 35, 0.46)),
        rgba(20, 29, 42, 0.34);
}

html[data-theme="dark"] body.login-page-minimal .register-value-list span,
html[data-theme="dark"] body.login-page-minimal .register-selected-module {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06)),
        rgba(15, 23, 35, 0.28);
}

@keyframes registerPanelIn {
    from {
        opacity: 0;
        transform: translate3d(0, 1.2rem, 0) rotateX(3deg);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotateX(0);
    }
}

@keyframes registerLightSweep {
    from {
        transform: translate3d(-1.2rem, -0.4rem, 0) scale(1);
    }

    to {
        transform: translate3d(1rem, 0.6rem, 0) scale(1.04);
    }
}

@media (prefers-reduced-motion: reduce) {
    .register-page .register-shell > *,
    body.login-page-minimal.register-page:after,
    body.login-page-minimal.auth-background-page:after {
        animation: none;
    }
}

html[data-theme="dark"] .login-wordmark {
    filter: brightness(0) invert(1) saturate(0.2) opacity(0.92);
}

html[data-theme="dark"] .login-mark {
    filter: brightness(0) invert(1) saturate(0.2) opacity(0.94);
}

@media (max-width: 26rem) {
    .login-wordmark-link {
        gap: 0;
    }

    .login-wordmark-link .login-wordmark {
        display: none;
    }

    .login-mark {
        width: 2.35rem;
        height: 2.35rem;
    }

}

@media (max-width: 58rem) {
    body.login-page-minimal.register-page,
    body.login-page-minimal.auth-background-page,
    html[data-theme="dark"] body.login-page-minimal.register-page,
    html[data-theme="dark"] body.login-page-minimal.auth-background-page {
        background-position: 58% center;
    }

    .login-page-minimal .register-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .register-value-panel {
        display: none;
    }
}

@media (max-width: 36rem) {
    .register-password-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

.growth-page {
    display: grid;
    gap: 1rem;
}

.growth-settings-grid {
    display: grid;
    gap: 1rem;
}

.growth-settings-card,
.analytics-metric,
.testimonial-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1rem;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: var(--soft-shadow);
}

html[data-theme="dark"] .growth-settings-card,
html[data-theme="dark"] .analytics-metric,
html[data-theme="dark"] .testimonial-card {
    background: rgba(20, 29, 42, 0.74);
}

.elearning-course-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.elearning-course-grid .empty-state {
    grid-column: 1 / -1;
}

.elearning-course-card {
    display: grid;
    min-height: 12rem;
    gap: 1rem;
    align-content: space-between;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 1rem;
    background:
        radial-gradient(circle at 92% 8%, rgba(15, 118, 110, 0.16), transparent 9rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.66));
    box-shadow: var(--soft-shadow);
}

.elearning-course-card.is-selected {
    border-color: rgba(138, 104, 29, 0.42);
    box-shadow: 0 0 0 2px rgba(138, 104, 29, 0.16), var(--soft-shadow);
}

.elearning-course-card-main {
    display: grid;
    gap: 0.65rem;
    min-width: 0;
}

.elearning-course-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.15rem, 2.2vw, 1.55rem);
    line-height: 1.04;
    font-weight: 950;
}

.elearning-course-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.elearning-course-card-meta span {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 999px;
    padding: 0 0.62rem;
    color: var(--muted);
    background: rgba(138, 104, 29, 0.08);
    font-size: 0.72rem;
    font-weight: 880;
}

.elearning-course-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.elearning-course-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.15rem;
}

.elearning-settings-card,
.elearning-elements-section {
    border: 1px solid var(--line);
    border-radius: 8px;
    background:
        radial-gradient(circle at 92% 8%, rgba(138, 104, 29, 0.1), transparent 10rem),
        rgba(255, 255, 255, 0.72);
    box-shadow: var(--soft-shadow);
}

.elearning-settings-card {
    display: grid;
    align-content: start;
    gap: 0.9rem;
    padding: 1rem;
}

.elearning-settings-card-head {
    display: grid;
    gap: 0.18rem;
}

.elearning-settings-card-head h3 {
    margin: 0;
    color: var(--ink);
    font-size: 1.18rem;
    line-height: 1.08;
    font-weight: 950;
}

.elearning-course-details {
    margin: 0;
}

.elearning-course-details.form-grid {
    gap: 0.75rem;
}

.elearning-course-details .toggle-field {
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 8px;
    padding: 0.72rem 0.78rem;
    color: var(--ink);
    background: rgba(138, 104, 29, 0.06);
    font-weight: 880;
}

.elearning-elements-section {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.58)),
        var(--panel);
}

.elearning-pages-bar {
    margin-top: 0;
}

.elearning-template-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0 0 1rem;
}

.elearning-template-card {
    display: grid;
    gap: 0.35rem;
    min-height: 7rem;
    align-content: end;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: var(--radius);
    padding: 1rem;
    text-align: left;
    color: #fff;
    box-shadow: var(--soft-shadow);
    cursor: pointer;
}

.elearning-template-card span {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    opacity: 0.78;
}

.elearning-template-card strong {
    font-size: 1rem;
    line-height: 1.2;
}

.elearning-template-card em {
    justify-self: start;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 999px;
    padding: 0.32rem 0.58rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    box-shadow: 0 0.55rem 1.15rem rgba(0, 0, 0, 0.12);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 950;
}

.elearning-template-card.is-text {
    background: linear-gradient(135deg, #1d4ed8, #0f766e);
}

.elearning-template-card.is-quiz {
    background: linear-gradient(135deg, #6d28d9, #be185d);
}

.elearning-template-card.is-essay {
    background: linear-gradient(135deg, #92400e, #b45309);
}

.elearning-page-list {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.elearning-page-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.7)),
        var(--panel);
    box-shadow: var(--soft-shadow);
    overflow: hidden;
    min-height: 11rem;
}

.elearning-page-card-button {
    display: grid;
    gap: 0.9rem;
    width: 100%;
    height: 100%;
    min-height: 11rem;
    padding: 1rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.elearning-page-card-button .button-soft {
    justify-self: start;
    align-self: end;
    pointer-events: none;
}

.elearning-page-card.is-text {
    border-left: 0.35rem solid #0f766e;
}

.elearning-page-card.is-quiz {
    border-left: 0.35rem solid #be185d;
}

.elearning-page-card.is-essay {
    border-left: 0.35rem solid #b45309;
}

.elearning-page-card-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 0.8rem;
}

.elearning-page-card-head h3 {
    margin: 0.1rem 0 0.15rem;
    font-size: 1.2rem;
}

.elearning-page-card-head small {
    display: block;
    color: var(--muted);
    font-weight: 750;
}

.elearning-page-fields {
    margin-bottom: 0.8rem;
}

.elearning-page-modal-card {
    max-width: min(48rem, calc(100vw - 2rem));
}

html[data-theme="dark"] .elearning-page-card {
    background:
        linear-gradient(135deg, rgba(20, 29, 42, 0.84), rgba(20, 29, 42, 0.68)),
        var(--panel);
}

html[data-theme="dark"] .elearning-course-card {
    background:
        radial-gradient(circle at 92% 8%, rgba(15, 118, 110, 0.18), transparent 9rem),
        linear-gradient(135deg, rgba(20, 29, 42, 0.86), rgba(20, 29, 42, 0.68));
}

html[data-theme="dark"] .elearning-settings-card,
html[data-theme="dark"] .elearning-elements-section {
    background:
        radial-gradient(circle at 92% 8%, rgba(138, 104, 29, 0.12), transparent 10rem),
        rgba(20, 29, 42, 0.74);
}

@media (max-width: 900px) {
    .elearning-course-grid,
    .elearning-course-settings-grid {
        grid-template-columns: 1fr;
    }

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

    .elearning-page-card-head {
        display: grid;
    }
}

.compact-head {
    margin-bottom: 0.8rem;
}

.brand-control-grid,
.testimonial-grid {
    display: grid;
    gap: 0.7rem;
}

.brand-control-grid label,
.testimonial-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.brand-control-grid input[type="color"] {
    height: 2.8rem;
    padding: 0.25rem;
}

.brand-preview-card {
    display: grid;
    align-content: start;
    gap: 0.75rem;
}

.brand-preview-surface {
    display: grid;
    gap: 0.6rem;
    min-height: 18rem;
    align-content: end;
    border-radius: var(--radius);
    padding: 1rem;
    color: #141820;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.16), transparent 42%),
        var(--preview-surface);
}

.brand-preview-surface.is-dark {
    color: #f4f7fb;
    background:
        linear-gradient(135deg, rgba(216, 179, 90, 0.3), transparent 48%),
        #111722;
}

.brand-preview-surface small {
    color: currentColor;
    font-size: 0.74rem;
    font-weight: 900;
    opacity: 0.68;
    text-transform: uppercase;
}

.brand-preview-surface strong {
    max-width: 22rem;
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: 1;
}

.brand-preview-surface p {
    max-width: 24rem;
    margin: 0;
    color: currentColor;
    line-height: 1.55;
    opacity: 0.72;
}

.brand-preview-surface > span {
    display: inline-flex;
    width: max-content;
    min-height: 2.65rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 1rem;
    color: #fff;
    background: linear-gradient(135deg, var(--preview-primary), var(--preview-accent));
    font-weight: 900;
}

.brand-preview-surface.is-rounded > span {
    border-radius: 8px;
}

.brand-preview-surface.is-minimal > span {
    min-height: auto;
    border-radius: 0;
    padding: 0 0 0.12rem;
    color: currentColor;
    background: transparent;
    box-shadow: inset 0 -0.12rem 0 currentColor;
}

.website-settings-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.website-settings-card {
    position: relative;
    display: grid;
    min-height: 9.5rem;
    align-content: space-between;
    gap: 1rem;
    overflow: hidden;
}

.website-settings-card.is-active {
    border-color: rgba(138, 104, 29, 0.28);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.1), transparent 38%),
        rgba(255, 255, 255, 0.76);
}

.website-settings-card.is-coming {
    min-height: 8rem;
    color: var(--muted);
}

.tracking-meta-card {
    grid-column: 1 / -1;
}

.product-shop-settings-grid {
    align-items: start;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-shop-intro-card {
    grid-column: 1 / -1;
}

.tracking-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.tracking-meta-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.tracking-meta-grid .wide {
    grid-column: 1 / -1;
}

.tracking-url-parameters {
    min-height: 6.4rem;
}

.tracking-event-map {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.9rem;
}

.tracking-event-map span {
    display: inline-flex;
    min-height: 2.2rem;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid rgba(24, 119, 242, 0.18);
    border-radius: 999px;
    padding: 0 0.75rem;
    color: #1b4f92;
    background: rgba(24, 119, 242, 0.08);
    font-size: 0.78rem;
    font-weight: 850;
}

.tracking-event-map strong {
    color: #0f2f68;
    font-weight: 950;
}

html[data-theme="dark"] .tracking-event-map span {
    color: #b7cffc;
    background: rgba(79, 140, 255, 0.14);
}

html[data-theme="dark"] .tracking-event-map strong {
    color: #e5efff;
}

.settings-status-pill {
    display: inline-flex;
    width: max-content;
    min-height: 1.8rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 0.7rem;
    color: var(--brand-deep);
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.72rem;
    font-weight: 900;
}

.website-settings-grid {
    grid-template-columns: 1fr;
}

.website-preview-stage {
    position: relative;
    isolation: isolate;
    margin: 0 -1rem -1rem;
    overflow: hidden;
    border-radius: 0 0 var(--radius) var(--radius);
    padding: 3.3rem clamp(1rem, 2vw, 1.35rem) 1.35rem;
    background:
        radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.18), transparent 15rem),
        linear-gradient(135deg, #9a7524 0%, #745313 48%, #31240b 100%);
    box-shadow: inset 0 22px 55px rgba(21, 16, 5, 0.18);
}

.website-preview-stage:before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 2.65rem;
    background: var(--panel-strong);
    clip-path: polygon(0 0, 100% 0, 100% 48%, 96% 62%, 92% 43%, 87% 66%, 82% 46%, 77% 68%, 71% 42%, 66% 60%, 60% 45%, 54% 70%, 48% 47%, 42% 64%, 36% 43%, 30% 68%, 24% 47%, 19% 62%, 13% 45%, 7% 67%, 0 50%);
    filter: drop-shadow(0 14px 16px rgba(36, 25, 5, 0.24));
}

.website-preview-stage:after {
    content: "";
    position: absolute;
    inset: 2.2rem 0 auto 0;
    z-index: 0;
    height: 8rem;
    pointer-events: none;
    background:
        linear-gradient(105deg, transparent 0 18%, rgba(255, 255, 255, 0.12) 18.4% 19%, transparent 19.4% 39%, rgba(255, 255, 255, 0.09) 39.4% 40%, transparent 40.4%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent);
    opacity: 0.55;
}

.website-preview-stage .website-font-preview-card {
    position: relative;
    z-index: 1;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.16);
    box-shadow: 0 28px 70px rgba(26, 18, 3, 0.22);
    backdrop-filter: blur(18px);
}

.website-preview-stage .eyebrow {
    color: rgba(255, 255, 255, 0.82);
}

.website-font-preview {
    display: grid;
    min-height: 18rem;
    align-content: end;
    gap: 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: var(--radius);
    padding: 1.1rem;
    color: #141820;
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.15), transparent 44%),
        #fbfbf8;
    font-family: var(--settings-body-font);
}

.website-font-preview small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.website-font-preview strong {
    max-width: 28rem;
    font-family: var(--settings-heading-font);
    font-size: clamp(2.1rem, 4vw, 4rem);
    line-height: 0.98;
    letter-spacing: 0;
}

.website-font-preview p {
    max-width: 30rem;
    margin: 0;
    color: rgba(20, 24, 32, 0.7);
    line-height: 1.65;
}

.website-font-preview > span {
    display: inline-flex;
    width: max-content;
    min-height: 2.5rem;
    align-items: center;
    border-radius: 999px;
    padding: 0 1rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    font-weight: 900;
}

html[data-theme="dark"] .website-preview-stage:before {
    background: var(--panel-strong);
}

html[data-theme="dark"] .website-font-preview {
    color: #f4f7fb;
    background:
        linear-gradient(135deg, rgba(216, 179, 90, 0.24), transparent 48%),
        #111722;
}

html[data-theme="dark"] .website-font-preview p {
    color: rgba(244, 247, 251, 0.7);
}

@media (max-width: 760px) {
    .website-settings-overview {
        grid-template-columns: 1fr;
    }

    .website-settings-grid {
        grid-template-columns: 1fr;
    }

    .product-shop-intro-card {
        grid-column: auto;
    }

    .website-preview-stage {
        margin-right: -1rem;
        margin-left: -1rem;
        padding-top: 3rem;
    }
}

.testimonial-list,
.analytics-list {
    display: grid;
    gap: 0.75rem;
}

.testimonial-card-head {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0.85rem;
}

.testimonial-card-head strong {
    display: block;
    margin-top: 0.15rem;
    font-size: 1rem;
}

.review-card {
    position: relative;
    overflow: hidden;
}

.review-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    background: var(--banner-gold-gradient);
}

.review-card-head {
    position: relative;
    align-items: center;
}

.review-avatar {
    display: grid;
    width: 3.4rem;
    height: 3.4rem;
    flex: 0 0 auto;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.8rem 1.8rem rgba(138, 104, 29, 0.16);
    font-size: 1.15rem;
    font-weight: 950;
}

.review-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.review-title {
    min-width: 0;
    flex: 1 1 auto;
}

.review-title small,
.review-stars {
    display: block;
}

.review-title small {
    margin-top: 0.18rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.review-stars {
    margin-top: 0.28rem;
    color: var(--brand);
    font-size: 0.92rem;
    letter-spacing: 0;
}

.testimonial-grid label.wide {
    grid-column: 1 / -1;
}

.review-upload-row {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.7rem;
    margin-top: 0.85rem;
    border-top: 1px solid rgba(138, 104, 29, 0.12);
    padding-top: 0.85rem;
}

.review-upload-field {
    display: grid;
    min-width: min(100%, 18rem);
    flex: 1 1 18rem;
    gap: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}

.analytics-metric-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.analytics-metric {
    display: grid;
    gap: 0.18rem;
}

.analytics-metric span,
.analytics-metric small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.analytics-metric strong {
    font-size: clamp(1.8rem, 6vw, 3rem);
    line-height: 1;
}

.analytics-row {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.62);
}

.admin-company-row {
    color: inherit;
    text-decoration: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.admin-company-row:hover,
.admin-company-row:focus-visible {
    border-color: rgba(138, 104, 29, 0.34);
    box-shadow: 0 1rem 2.5rem rgba(31, 24, 12, 0.12);
    transform: translateY(-1px);
    outline: none;
}

.admin-company-row-meta {
    display: grid;
    justify-items: end;
    gap: 0.12rem;
    text-align: right;
}

.admin-account-page {
    max-width: 96rem;
    margin: 0 auto;
}

.admin-account-warning {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    border: 1px solid rgba(180, 35, 24, 0.22);
    border-radius: 8px;
    padding: 0.75rem 0.85rem;
    color: #7a271a;
    background: rgba(255, 251, 250, 0.86);
    font-size: 0.86rem;
    font-weight: 820;
}

.admin-account-warning strong {
    font-weight: 950;
}

.admin-account-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
    margin-top: 0.95rem;
}

.admin-account-card {
    position: relative;
    display: grid;
    min-height: 30rem;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    padding: 1rem;
    color: var(--directory-text);
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.22)),
        var(--directory-primary);
    box-shadow: var(--soft-shadow);
}

.admin-account-card > * {
    min-width: 0;
}

.admin-account-card:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 0.24rem;
    background: var(--directory-accent);
}

.admin-account-card.is-locked {
    box-shadow: 0 1rem 2.5rem rgba(75, 17, 17, 0.22);
}

.admin-account-copy {
    display: grid;
    gap: 0.5rem;
    align-self: end;
    min-width: 0;
}

.admin-account-copy span,
.admin-account-facts span {
    color: currentColor;
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.045em;
    opacity: 0.76;
    text-transform: uppercase;
}

.admin-account-copy h2 {
    overflow: hidden;
    margin: 0;
    color: currentColor;
    font-size: clamp(1.35rem, 2vw, 1.95rem);
    line-height: 0.98;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-account-copy p {
    overflow: hidden;
    margin: 0;
    color: currentColor;
    font-size: 0.9rem;
    line-height: 1.45;
    opacity: 0.88;
    overflow-wrap: anywhere;
}

.admin-account-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.42rem;
    align-self: end;
}

.admin-account-facts span {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    padding: 0.45rem 0.5rem;
    background: rgba(0, 0, 0, 0.14);
    letter-spacing: 0;
    opacity: 0.92;
    overflow-wrap: anywhere;
    text-transform: none;
}

.admin-account-activity {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    align-items: center;
}

.admin-account-activity span {
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0.38rem 0.55rem;
    color: currentColor;
    background: rgba(0, 0, 0, 0.14);
    font-size: 0.74rem;
    font-weight: 900;
}

.admin-account-activity .admin-activity-pill {
    background: rgba(255, 255, 255, 0.18);
    font-weight: 950;
}

.admin-module-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-content: start;
}

.admin-module-chip {
    display: inline-flex;
    max-width: 100%;
    min-height: 1.8rem;
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0.32rem 0.55rem;
    color: currentColor;
    background: rgba(0, 0, 0, 0.14);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-module-chip.is-paid {
    background: rgba(255, 255, 255, 0.24);
}

.admin-module-chip.is-trial {
    border-style: dashed;
}

.admin-module-chip.is-empty {
    opacity: 0.78;
}

.admin-expired-modules {
    display: grid;
    gap: 0.46rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    padding: 0.58rem;
    background: rgba(0, 0, 0, 0.18);
}

.admin-expired-heading {
    color: currentColor;
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    opacity: 0.84;
    text-transform: uppercase;
}

.admin-expired-module-list {
    display: grid;
    gap: 0.42rem;
}

.admin-expired-module {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    padding: 0.48rem;
    color: currentColor;
    background: rgba(255, 255, 255, 0.1);
}

.admin-expired-module > span {
    display: grid;
    gap: 0.08rem;
    min-width: 0;
}

.admin-expired-module strong {
    overflow: hidden;
    color: currentColor;
    font-size: 0.82rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-expired-module small {
    color: currentColor;
    font-size: 0.68rem;
    font-weight: 850;
    opacity: 0.78;
}

.admin-expired-module .button-soft {
    min-height: 2.1rem;
    padding-inline: 0.78rem;
    white-space: nowrap;
}

.admin-usage-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.38rem;
}

.admin-usage-grid span {
    display: grid;
    gap: 0.08rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    padding: 0.48rem 0.5rem;
    color: currentColor;
    background: rgba(0, 0, 0, 0.12);
    font-size: 0.66rem;
    font-weight: 850;
    opacity: 0.94;
}

.admin-usage-grid strong {
    color: currentColor;
    font-size: 1.05rem;
    font-weight: 950;
    line-height: 1;
}

.admin-account-actions {
    display: grid;
    gap: 0.5rem;
    align-self: end;
}

.admin-account-actions .button-primary,
.admin-account-actions .button-soft,
.admin-account-actions .button-danger {
    width: 100%;
    justify-content: center;
}

.admin-account-protected {
    display: inline-flex;
    min-height: 2.45rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    color: currentColor;
    background: rgba(0, 0, 0, 0.16);
    font-size: 0.78rem;
    font-weight: 950;
}

.admin-account-delete {
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    padding: 0.6rem;
    background: rgba(0, 0, 0, 0.14);
}

.admin-account-delete summary {
    cursor: pointer;
    color: currentColor;
    font-size: 0.78rem;
    font-weight: 950;
    list-style: none;
}

.admin-account-delete summary::-webkit-details-marker {
    display: none;
}

.admin-account-delete label {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.55rem;
}

.admin-account-delete label span {
    color: currentColor;
    font-size: 0.74rem;
    font-weight: 850;
    line-height: 1.35;
    opacity: 0.84;
}

.admin-account-delete .input-control {
    min-height: 2.4rem;
    background: rgba(255, 255, 255, 0.92);
}

.admin-account-delete .button-danger {
    margin-top: 0.5rem;
}

html[data-theme="dark"] .analytics-row {
    background: rgba(255, 255, 255, 0.06);
}

.analytics-row h2,
.analytics-title {
    display: block;
    margin: 0.22rem 0 0;
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.2;
}

.analytics-row strong {
    font-size: 1.35rem;
}

.admin-event-row {
    align-items: flex-start;
}

.admin-event-row .commerce-status-pill {
    flex: 0 0 auto;
    font-size: 0.72rem;
    margin-top: 0.08rem;
}

.admin-event-row .admin-company-row-meta {
    justify-items: start;
    text-align: left;
    margin-top: 0.45rem;
}

.admin-event-row .admin-company-row-meta span {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 780;
}

.visible-error-row {
    align-items: flex-start;
}

.visible-error-copy {
    min-width: 0;
}

.visible-error-row p {
    margin: 0.52rem 0 0;
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 740;
    line-height: 1.48;
}

.visible-error-details {
    margin-top: 0.65rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 0.55rem 0.65rem;
    background: rgba(255, 255, 255, 0.56);
}

.visible-error-details summary {
    cursor: pointer;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
}

.visible-error-details pre {
    overflow: auto;
    max-height: 14rem;
    margin: 0.55rem 0 0;
    border-radius: 8px;
    padding: 0.65rem;
    color: #271f14;
    background: rgba(250, 247, 239, 0.92);
    font-size: 0.78rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.visible-error-details span {
    display: block;
    margin-top: 0.45rem;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 760;
    overflow-wrap: anywhere;
}

.visible-error-row .commerce-status-pill {
    flex: 0 0 auto;
    font-size: 0.72rem;
    margin-top: 0.08rem;
}

.visible-error-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-end;
    gap: 0.55rem;
    flex-direction: column;
}

.visible-error-clear-button {
    min-height: 2.1rem;
    padding: 0.45rem 0.75rem;
    font-size: 0.76rem;
    white-space: nowrap;
}

.visible-error-row .admin-company-row-meta {
    justify-items: start;
    text-align: left;
    margin-top: 0.55rem;
}

@media (max-width: 720px) {
    .visible-error-actions {
        width: 100%;
        align-items: stretch;
    }

    .visible-error-clear-button {
        width: 100%;
    }
}

.analytics-row small {
    color: var(--muted);
    font-weight: 750;
}

.analytics-attribution-row {
    align-items: flex-start;
}

.analytics-attribution-copy {
    min-width: 0;
}

.analytics-mini-metrics {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
    max-width: 23rem;
}

.analytics-mini-metrics span {
    display: grid;
    min-width: 3.4rem;
    gap: 0.08rem;
    border: 1px solid rgba(138, 104, 29, 0.13);
    border-radius: 8px;
    padding: 0.38rem 0.5rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.5);
}

.analytics-mini-metrics strong {
    font-size: 1rem;
    line-height: 1;
}

.analytics-mini-metrics small {
    font-size: 0.68rem;
}

html[data-theme="dark"] .analytics-mini-metrics span {
    background: rgba(255, 255, 255, 0.06);
}

@media (max-width: 640px) {
    .analytics-attribution-row {
        display: grid;
    }

    .analytics-mini-metrics {
        justify-content: stretch;
        max-width: none;
    }

    .analytics-mini-metrics span {
        flex: 1 1 4rem;
    }
}

.admin-company-modal:target {
    display: grid;
    z-index: 1200;
}

.admin-company-modal-card {
    width: min(78rem, 100%);
}

.admin-company-summary-grid,
.admin-company-detail-grid {
    display: grid;
    gap: 0.75rem;
}

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

.admin-company-summary-grid article,
.admin-company-detail-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.64);
}

.admin-company-summary-grid span,
.admin-company-detail-row span,
.admin-company-detail-note {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.admin-company-summary-grid strong {
    display: block;
    margin-top: 0.18rem;
    font-size: 1.02rem;
    line-height: 1.25;
}

.admin-company-detail-card {
    display: grid;
    align-content: start;
    gap: 0.55rem;
}

.admin-company-detail-card h3 {
    margin: 0 0 0.15rem;
    font-size: 1rem;
    line-height: 1.2;
}

.admin-company-detail-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    border-top: 1px solid rgba(138, 104, 29, 0.12);
    padding-top: 0.48rem;
}

.admin-company-detail-row strong {
    text-align: right;
}

.admin-company-detail-note {
    display: block;
    margin-top: -0.25rem;
}

html[data-theme="dark"] .admin-company-summary-grid article,
html[data-theme="dark"] .admin-company-detail-card {
    background: rgba(255, 255, 255, 0.06);
}

@media (min-width: 820px) {
    .growth-settings-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .admin-company-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-company-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-company-detail-grid.two-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .testimonial-grid label.wide {
        grid-column: 1 / -1;
    }
}

@media (max-width: 680px) {
    .admin-account-grid,
    .admin-account-facts,
    .admin-usage-grid {
        grid-template-columns: 1fr;
    }

    .admin-account-card {
        min-height: 22rem;
    }
}

.live-chat-settings-grid {
    align-items: stretch;
}

.live-chat-toggle {
    align-self: center;
}

.live-chat-control-grid {
    margin-top: 1rem;
}

.pos-status-grid,
.pos-layout-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.pos-status-card strong {
    display: block;
    margin-top: 0.35rem;
    font-size: clamp(1.7rem, 4vw, 3rem);
    line-height: 1;
}

.pos-layout-preview {
    position: relative;
    min-height: 24rem;
    border: 1px solid rgba(var(--theme-accent-rgb), 0.18);
    border-radius: 0.8rem;
    background:
        linear-gradient(rgba(var(--theme-accent-rgb), 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--theme-accent-rgb), 0.08) 1px, transparent 1px),
        linear-gradient(135deg, rgba(var(--theme-accent-rgb), 0.06), rgba(255, 255, 255, 0.72));
    background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, auto;
    overflow: hidden;
}

.pos-layout-map-card {
    margin-bottom: 1rem;
}

.pos-layout-add-modal-card {
    width: min(38rem, 100%);
}

.pos-layout-edit-modal-card {
    width: min(42rem, 100%);
}

.pos-layout-preview.is-till {
    min-height: 32rem;
}

.pos-layout-table {
    position: absolute;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 6.5rem;
    min-height: 4.5rem;
    padding: 0.7rem;
    border: 1px solid rgba(var(--theme-accent-rgb), 0.35);
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1rem 2.2rem rgba(15, 23, 42, 0.12);
    color: var(--ink);
    transform: translate(-50%, -50%);
    text-align: center;
}

.pos-layout-table.is-kitchen {
    border-color: rgba(214, 121, 65, 0.55);
    background: #fff7ed;
}

.pos-layout-table.is-bar {
    border-color: rgba(20, 184, 166, 0.5);
    background: #f0fdfa;
}

.pos-layout-table.is-inactive {
    opacity: 0.58;
    filter: grayscale(0.7);
}

button.pos-layout-table,
a.pos-layout-table {
    cursor: pointer;
    text-decoration: none;
}

button.pos-layout-table:hover,
a.pos-layout-table:hover {
    transform: translate(-50%, -50%) scale(1.03);
}

.pos-layout-table strong {
    font-size: 0.95rem;
}

.pos-layout-table small {
    color: var(--muted);
    font-weight: 800;
}

.pos-table-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

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

.pos-admin-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.pos-admin-stack,
.pos-menu-editor-list,
.pos-order-ticket-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.pos-admin-row {
    padding: 1rem;
}

.pos-edit-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.pos-edit-summary strong,
.pos-edit-summary small {
    display: block;
}

.pos-edit-summary strong {
    margin-top: 0.18rem;
    color: var(--ink);
    font-size: 1.02rem;
    font-weight: 950;
}

.pos-edit-summary small {
    margin-top: 0.18rem;
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 800;
}

.pos-setup-modal-card {
    width: min(38rem, 100%);
}

.pos-setup-modal-card.is-wide {
    width: min(58rem, 100%);
}

.pos-menu-item-fields {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pos-menu-description {
    grid-column: 1 / -1;
}

.pos-allergen-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    margin: 1rem 0;
}

.pos-allergen-checks > .module-eyebrow {
    flex-basis: 100%;
}

.pos-allergen-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(var(--theme-accent-rgb), 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.8rem;
    font-weight: 850;
}

.pos-order-screen {
    display: grid;
    gap: 1rem;
}

.pos-table-modal-card {
    width: min(58rem, 100%);
}

.pos-layout-table[data-pos-open="1"] {
    box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.22), 0 1rem 2.2rem rgba(15, 23, 42, 0.18);
}

.pos-order-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.pos-order-head h2 {
    margin: 0;
    font-size: clamp(1.8rem, 4vw, 3.2rem);
}

.pos-order-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.pos-order-summary article {
    padding: 1rem;
    border: 1px solid rgba(var(--theme-accent-rgb), 0.14);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.78);
}

.pos-order-summary span {
    display: block;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 950;
    text-transform: uppercase;
}

.pos-order-summary strong {
    display: block;
    margin-top: 0.35rem;
    font-size: clamp(1.4rem, 3vw, 2.4rem);
    line-height: 1;
}

.pos-order-notes {
    display: grid;
    gap: 0.65rem;
}

.pos-order-ticket {
    border: 1px solid rgba(var(--theme-accent-rgb), 0.16);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.84);
    overflow: hidden;
}

.pos-order-ticket.is-draft {
    border-color: rgba(217, 119, 6, 0.34);
    background: #fffbeb;
}

.pos-order-ticket.is-in_preparation {
    border-color: rgba(14, 116, 144, 0.3);
    background: #ecfeff;
}

.pos-order-ticket.is-done {
    opacity: 0.72;
}

.pos-order-ticket-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.pos-order-ticket-head strong,
.pos-order-ticket-head span {
    font-weight: 900;
}

.pos-order-ticket ul,
.pos-kitchen-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pos-order-ticket li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.pos-order-ticket li:last-child {
    border-bottom: 0;
}

.pos-order-line-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex-wrap: wrap;
    text-align: right;
}

.pos-order-ticket small,
.pos-kitchen-items span {
    display: block;
    margin-top: 0.2rem;
    color: var(--muted);
    font-weight: 750;
}

.pos-send-row {
    justify-content: flex-end;
}

.pos-menu-modal-card {
    width: min(96vw, 90rem);
    max-height: 92vh;
}

.pos-menu-accordion {
    display: grid;
    gap: 0.85rem;
    overflow: auto;
    padding-right: 0.2rem;
}

.pos-menu-group {
    border: 1px solid rgba(var(--theme-accent-rgb), 0.16);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.82);
    overflow: hidden;
}

.pos-menu-group summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    cursor: pointer;
    font-size: 1.15rem;
    font-weight: 950;
}

.pos-menu-group summary span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: rgba(var(--theme-accent-rgb), 0.12);
    color: var(--theme-accent);
    font-size: 0.85rem;
}

.pos-menu-item-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
    padding: 0 1rem 1rem;
}

.pos-menu-choice {
    min-height: 8rem;
    padding: 1rem;
    border: 0;
    border-radius: 0.85rem;
    color: #fff;
    text-align: left;
    box-shadow: 0 1rem 2rem rgba(15, 23, 42, 0.14);
    cursor: pointer;
}

.pos-menu-choice.is-sold-out {
    cursor: not-allowed;
    filter: grayscale(0.95);
    opacity: 0.56;
}

.pos-menu-choice strong {
    display: block;
    font-size: clamp(1.2rem, 2.2vw, 1.85rem);
    line-height: 1.05;
}

.pos-menu-choice span {
    display: block;
    margin-top: 0.8rem;
    font-size: 1rem;
    font-weight: 950;
    opacity: 0.88;
}

.pos-menu-choice.is-gold { background: linear-gradient(135deg, #8a681d, #c59a36); }
.pos-menu-choice.is-blue { background: linear-gradient(135deg, #0f5f6f, #1d93a8); }
.pos-menu-choice.is-green { background: linear-gradient(135deg, #166534, #22a35a); }
.pos-menu-choice.is-rose { background: linear-gradient(135deg, #9f1239, #e05278); }
.pos-menu-choice.is-slate { background: linear-gradient(135deg, #1f2937, #64748b); }

.pos-item-modal-card {
    width: min(92vw, 36rem);
}

.pos-item-modal-description,
.pos-item-allergen-line,
.pos-item-route-line {
    color: var(--muted);
    font-weight: 750;
}

.pos-kitchen-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(138, 104, 29, 0.16), transparent 34rem),
        linear-gradient(135deg, #f7f4ec, #ffffff);
    color: var(--ink);
}

.pos-kitchen-shell {
    width: min(96vw, 100rem);
    margin: 0 auto;
    padding: 1.5rem;
}

.pos-kitchen-top,
.pos-kitchen-ticket header,
.pos-kitchen-grid {
    display: grid;
    gap: 1rem;
}

.pos-kitchen-top {
    grid-template-columns: 1fr auto;
    align-items: center;
    margin-bottom: 1rem;
}

.pos-kitchen-top h1 {
    margin: 0;
    font-size: clamp(2.4rem, 6vw, 5rem);
}

.pos-kitchen-grid {
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
    align-items: start;
}

.pos-kitchen-current {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.pos-kitchen-ticket,
.pos-kitchen-complete {
    border: 1px solid rgba(var(--theme-accent-rgb), 0.18);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 1.2rem 3rem rgba(15, 23, 42, 0.12);
}

.pos-kitchen-ticket {
    padding: 1rem;
}

.pos-kitchen-ticket header {
    grid-template-columns: 1.2fr 1fr auto;
    align-items: start;
    margin-bottom: 1rem;
}

.pos-kitchen-ticket header span {
    display: block;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 950;
    text-transform: uppercase;
}

.pos-kitchen-ticket header strong {
    display: block;
    font-size: clamp(1.4rem, 4vw, 2.7rem);
    line-height: 1;
}

.pos-kitchen-items li {
    padding: 0.9rem 0;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.pos-kitchen-items strong {
    font-size: clamp(1.2rem, 2.4vw, 1.8rem);
}

.pos-kitchen-complete {
    padding: 1rem;
    position: sticky;
    top: 1rem;
}

.pos-kitchen-complete h2 {
    margin-top: 0;
}

.pos-kitchen-done {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 0;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    font-weight: 900;
}

.empty-state.is-small {
    min-height: auto;
    padding: 1rem;
}

@media (max-width: 900px) {
    .pos-status-grid,
    .pos-layout-editor-grid,
    .pos-table-list,
    .pos-layout-fields,
    .pos-admin-grid,
    .pos-menu-item-fields,
    .pos-order-head,
    .pos-order-summary,
    .pos-kitchen-top,
    .pos-kitchen-grid,
    .pos-kitchen-current,
    .pos-kitchen-ticket header {
        grid-template-columns: 1fr;
    }

    .pos-layout-preview,
    .pos-layout-preview.is-till {
        min-height: 24rem;
    }

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

@media (max-width: 560px) {
    .pos-menu-item-grid {
        grid-template-columns: 1fr;
    }

    .pos-order-ticket li {
        flex-direction: column;
    }
}

@media print {
    .pos-page .page-hero,
    .pos-order-head .button-row,
    .pos-send-row,
    .pos-order-notes .button-row,
    .site-sidebar,
    .topbar {
        display: none !important;
    }

    .pos-order-screen,
    .pos-order-ticket {
        box-shadow: none !important;
        border-color: #111827 !important;
    }
}

.live-chat-preview-card {
    align-content: start;
}

.live-chat-mini-preview {
    display: grid;
    gap: 0.7rem;
    align-content: end;
    min-height: 18rem;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(248, 245, 235, 0.92)),
        var(--surface);
}

.live-chat-mini-bubble,
.live-chat-mini-reply {
    display: inline-flex;
    max-width: 82%;
    border-radius: 16px 16px 16px 5px;
    padding: 0.62rem 0.74rem;
    background: #fff;
    box-shadow: var(--soft-shadow);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.35;
}

.live-chat-mini-reply {
    justify-self: end;
    border-radius: 16px 16px 5px 16px;
    color: #fff;
    background: var(--banner-gold-start);
}

.live-chat-mini-preview button {
    justify-self: end;
    min-height: 2.45rem;
    border: 0;
    border-radius: 999px;
    padding: 0 1rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.9rem 1.8rem rgba(138, 104, 29, 0.22);
    font: inherit;
    font-size: 0.84rem;
    font-weight: 950;
}

html[data-theme="dark"] .live-chat-mini-preview {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(138, 104, 29, 0.08)),
        var(--surface);
}

html[data-theme="dark"] .live-chat-mini-bubble {
    background: rgba(255, 255, 255, 0.08);
}

.welcome-prompt-mini-preview {
    position: relative;
    display: grid;
    gap: 0.75rem;
    min-height: 18rem;
    align-content: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 1.25rem;
    background:
        radial-gradient(circle at 86% 8%, rgba(138, 104, 29, 0.18), transparent 9rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 235, 0.88));
    box-shadow: var(--soft-shadow);
}

.welcome-prompt-mini-dot {
    width: 2.1rem;
    height: 0.36rem;
    border-radius: 999px;
    background: var(--banner-gold-gradient);
}

.welcome-prompt-mini-preview strong {
    max-width: 12ch;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 4vw, 3.2rem);
    line-height: 0.95;
}

.welcome-prompt-mini-preview p {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
    font-weight: 650;
    line-height: 1.45;
}

.welcome-prompt-mini-preview button {
    justify-self: start;
    min-height: 2.45rem;
    border: 0;
    border-radius: 999px;
    padding: 0 1rem;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.9rem 1.8rem rgba(138, 104, 29, 0.22);
    font: inherit;
    font-size: 0.84rem;
    font-weight: 950;
}

.welcome-prompt-mini-preview.is-disabled {
    opacity: 0.62;
}

html[data-theme="dark"] .welcome-prompt-mini-preview {
    background:
        radial-gradient(circle at 86% 8%, rgba(199, 156, 62, 0.16), transparent 9rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(138, 104, 29, 0.08));
}

.improvements-grid {
    align-items: start;
    margin-top: 1rem;
}

.improvement-term-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.62rem;
}

.improvement-term-card {
    display: flex;
    min-height: 4.2rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 12px;
    padding: 0.78rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.13) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.72);
    box-shadow: 0 0.8rem 1.9rem rgba(31, 42, 68, 0.06);
}

.improvement-term-card strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.95rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.improvement-term-card span {
    display: inline-flex;
    min-width: 2.1rem;
    height: 2.1rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #5f4714;
    background: rgba(138, 104, 29, 0.12);
    font-size: 0.82rem;
    font-weight: 950;
}

.improvement-miss-row {
    align-items: flex-start;
}

.improvement-miss-row small {
    flex: 0 0 auto;
    color: var(--muted);
    font-weight: 850;
}

html[data-theme="dark"] .improvement-term-card {
    background:
        linear-gradient(90deg, rgba(216, 179, 90, 0.2) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .improvement-term-card span {
    color: #f4d78d;
    background: rgba(216, 179, 90, 0.14);
}

@media (max-width: 680px) {
    .home-setup-summary {
        grid-template-columns: 1fr;
        border-radius: var(--radius);
    }

    .home-setup-summary span {
        justify-content: center;
    }

    .home-attention-item,
    .home-suggestion-item {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .home-attention-item b,
    .home-suggestion-item b,
    .home-suggestion-toggle .home-auto-toggle {
        grid-column: 2;
        justify-self: start;
        margin-top: 0.18rem;
    }

    .home-setup-step {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .home-setup-step b {
        grid-column: 2;
        justify-self: start;
        margin-top: 0.18rem;
    }

    .improvement-term-grid {
        grid-template-columns: 1fr;
    }
}

.backup-grid {
    align-items: stretch;
}

.deployment-grid {
    align-items: stretch;
}

.deployment-key-card {
    align-content: start;
}

.deployment-key-list {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
    border-top: 1px solid var(--line);
    padding-top: 1rem;
}

.deployment-code-grid {
    display: grid;
    gap: 0.7rem;
    margin: 0.75rem 0 1rem;
}

.deployment-code-grid label {
    display: grid;
    gap: 0.28rem;
}

.deployment-code-grid code,
.success-panel code {
    display: block;
    overflow-x: auto;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 12px;
    padding: 0.68rem 0.76rem;
    color: var(--ink);
    background: rgba(248, 245, 235, 0.86);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.4;
    white-space: nowrap;
}

.deployment-download-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.deployment-download-button {
    --platform-color: var(--brand);
    --platform-color-strong: var(--brand-strong);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    min-height: 5rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 18px;
    padding: 0.9rem;
    color: var(--ink);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(248, 245, 235, 0.72)),
        radial-gradient(circle at 15% 12%, color-mix(in srgb, var(--platform-color) 17%, transparent), transparent 10rem);
    box-shadow: 0 1rem 2rem rgba(36, 25, 7, 0.08);
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.deployment-download-button:hover,
.deployment-download-button:focus-visible {
    border-color: color-mix(in srgb, var(--platform-color) 48%, rgba(138, 104, 29, 0.18));
    box-shadow: 0 1.25rem 2.4rem rgba(36, 25, 7, 0.14);
    transform: translateY(-2px);
}

.deployment-download-button.is-windows {
    --platform-color: #2563eb;
    --platform-color-strong: #1d4ed8;
}

.deployment-download-button.is-linux {
    --platform-color: #111827;
    --platform-color-strong: #8a681d;
}

.deployment-platform-icon,
.deployment-download-glyph {
    position: relative;
    display: inline-grid;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--platform-color), var(--platform-color-strong));
    box-shadow: 0 0.78rem 1.55rem color-mix(in srgb, var(--platform-color) 24%, transparent);
}

.deployment-platform-icon.is-windows-logo:before {
    content: "";
    width: 1.28rem;
    height: 1.28rem;
    background:
        linear-gradient(currentColor 0 0) 0 0 / 0.57rem 0.57rem no-repeat,
        linear-gradient(currentColor 0 0) 100% 0 / 0.57rem 0.57rem no-repeat,
        linear-gradient(currentColor 0 0) 0 100% / 0.57rem 0.57rem no-repeat,
        linear-gradient(currentColor 0 0) 100% 100% / 0.57rem 0.57rem no-repeat;
}

.deployment-platform-icon.is-linux-logo span {
    position: absolute;
    left: 50%;
    top: 0.38rem;
    width: 1.03rem;
    height: 1.42rem;
    border-radius: 52% 52% 44% 44%;
    background: #111827;
    transform: translateX(-50%);
}

.deployment-platform-icon.is-linux-logo span:before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0.16rem;
    width: 0.58rem;
    height: 0.7rem;
    border-radius: 999px 999px 46% 46%;
    background: #fff;
    transform: translateX(-50%);
}

.deployment-platform-icon.is-linux-logo span:after {
    content: "";
    position: absolute;
    left: 0.27rem;
    top: 0.28rem;
    width: 0.13rem;
    height: 0.13rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0.36rem 0 0 #fff, 0.18rem 1.04rem 0 0.1rem #d8b35a;
}

.deployment-download-copy {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.deployment-download-copy strong {
    color: var(--ink);
    font-size: 1.02rem;
    font-weight: 950;
    line-height: 1.18;
}

.deployment-download-copy small {
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 820;
    line-height: 1.35;
}

.deployment-download-glyph {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 999px;
    color: var(--platform-color);
    background: #fff;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--platform-color) 18%, transparent), 0 0.65rem 1.35rem rgba(36, 25, 7, 0.08);
}

.deployment-download-glyph:before,
.deployment-download-glyph:after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.deployment-download-glyph:before {
    left: 50%;
    top: 0.46rem;
    width: 0.16rem;
    height: 0.72rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: -0.36rem 0.76rem 0 -0.03rem currentColor, 0.36rem 0.76rem 0 -0.03rem currentColor;
    transform: translateX(-50%);
}

.deployment-download-glyph:after {
    left: 50%;
    top: 0.88rem;
    width: 0.48rem;
    height: 0.48rem;
    border-left: 0.16rem solid currentColor;
    border-bottom: 0.16rem solid currentColor;
    transform: translateX(-50%) rotate(-45deg);
}

.deployment-token-row {
    align-items: flex-start;
}

.deployment-token-row .button-secondary {
    flex: 0 0 auto;
}

.deployment-guide-card {
    overflow: hidden;
    padding: 0;
}

.deployment-guide-card summary {
    display: flex;
    min-height: 4.25rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    cursor: pointer;
    list-style: none;
}

.deployment-guide-card summary::-webkit-details-marker {
    display: none;
}

.deployment-guide-card summary:after {
    content: "";
    display: block;
    width: 0.55rem;
    height: 0.55rem;
    flex: 0 0 auto;
    border-right: 0.14rem solid currentColor;
    border-bottom: 0.14rem solid currentColor;
    color: var(--gold-dark);
    transform: translateY(-0.12rem) rotate(45deg);
    transition: transform 180ms ease;
}

.deployment-guide-card[open] summary:after {
    transform: translateY(0.12rem) rotate(225deg);
}

.deployment-guide-card summary strong {
    display: block;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.deployment-guide-body {
    display: grid;
    gap: 1rem;
    border-top: 1px solid var(--line);
    padding: 0 1.1rem 1.15rem;
    animation: cmsAccordionOpen 180ms ease both;
}

.deployment-guide-body p {
    margin: 0;
    max-width: 58rem;
    color: var(--muted);
    line-height: 1.6;
}

.deployment-steps {
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 0;
    counter-reset: deploymentStep;
    list-style: none;
}

.deployment-steps li {
    position: relative;
    display: grid;
    gap: 0.22rem;
    min-height: 3.4rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 12px;
    padding: 0.86rem 0.95rem 0.86rem 3.35rem;
    background: rgba(248, 245, 235, 0.68);
}

.deployment-steps li:before {
    counter-increment: deploymentStep;
    content: counter(deploymentStep);
    position: absolute;
    top: 0.84rem;
    left: 0.9rem;
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: var(--gold-dark);
    font-size: 0.8rem;
    font-weight: 950;
}

.deployment-steps strong {
    color: var(--ink);
    font-weight: 950;
}

.deployment-steps span,
.deployment-guide-note span {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.deployment-steps code {
    border-radius: 8px;
    padding: 0.12rem 0.32rem;
    color: var(--ink);
    background: rgba(138, 104, 29, 0.1);
    font-size: 0.84em;
    font-weight: 850;
}

.deployment-guide-note {
    display: grid;
    gap: 0.18rem;
    border-left: 0.24rem solid var(--gold-dark);
    border-radius: 10px;
    padding: 0.78rem 0.9rem;
    background: rgba(138, 104, 29, 0.1);
}

.deployment-guide-note strong {
    color: var(--ink);
    font-weight: 950;
}

html[data-theme="dark"] .deployment-code-grid code,
html[data-theme="dark"] .success-panel code,
html[data-theme="dark"] .deployment-steps li {
    background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .deployment-download-button {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.04)),
        radial-gradient(circle at 15% 12%, color-mix(in srgb, var(--platform-color) 20%, transparent), transparent 10rem);
}

html[data-theme="dark"] .deployment-steps code {
    background: rgba(255, 255, 255, 0.08);
}

@media (max-width: 760px) {
    .deployment-download-actions {
        grid-template-columns: 1fr;
    }
}

.contact-import-grid {
    align-items: stretch;
}

.contact-import-page input[type="file"].input-control {
    padding: 0.72rem;
    cursor: pointer;
}

.import-toggle-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin: 0.85rem 0 1rem;
}

.import-toggle {
    flex: 1 1 11rem;
    min-height: 3.1rem;
    justify-content: space-between;
    border: 1px solid rgba(138, 104, 29, 0.15);
    border-radius: 14px;
    padding: 0.64rem 0.72rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.11) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.62);
}

.import-sample-card {
    display: grid;
    gap: 0.9rem;
    align-content: start;
}

.import-sample-card code {
    display: block;
    overflow-x: auto;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 12px;
    padding: 0.8rem;
    color: var(--ink);
    background: rgba(248, 245, 235, 0.86);
    font-size: 0.8rem;
    font-weight: 800;
    line-height: 1.45;
    white-space: nowrap;
}

.import-result-card {
    margin-top: 0.1rem;
}

.import-message-list {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.9rem;
}

html[data-theme="dark"] .import-toggle,
html[data-theme="dark"] .import-sample-card code {
    background:
        linear-gradient(90deg, rgba(216, 179, 90, 0.18) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.06);
}

.backup-toggle {
    justify-items: start;
    margin: 0.4rem 0 1rem;
}

.backup-summary-card {
    margin-top: 1rem;
}

.backup-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.62rem;
}

.backup-summary-row {
    display: flex;
    min-height: 3.4rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 12px;
    padding: 0.7rem 0.78rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.12) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.7);
}

.backup-summary-row span {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 850;
}

.backup-summary-row strong {
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 950;
}

html[data-theme="dark"] .backup-summary-row {
    background:
        linear-gradient(90deg, rgba(216, 179, 90, 0.18) 0 0.18rem, transparent 0.18rem),
        rgba(255, 255, 255, 0.06);
}

@media (max-width: 680px) {
    .backup-summary-grid {
        grid-template-columns: 1fr;
    }
}

.button-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.automation-head-actions .action-control-button,
.mail-account-row .action-control-button,
.mail-account-row .action-control-button.button-secondary,
.mail-account-row .action-control-button.button-quiet,
.mail-account-row .action-control-button.button-soft,
.mail-account-row .action-control-button.button-primary {
    width: 2.32rem;
    min-width: 2.32rem;
    height: 2.32rem;
    min-height: 2.32rem;
    border: 0;
    padding: 0 !important;
    color: var(--brand-deep);
    background: transparent;
    box-shadow: none;
}

.mail-account-row .action-control-button.button-primary {
    color: #fff;
    background: var(--banner-gold-gradient);
}

.toggle-field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 3.15rem;
}

.mini-switch {
    position: relative;
    display: inline-flex;
    width: 2.45rem;
    height: 1.35rem;
    flex: 0 0 auto;
}

.mini-switch input {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.mini-switch i {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(138, 104, 29, 0.22);
    border-radius: 999px;
    background: rgba(20, 24, 36, 0.1);
    transition: background 0.18s ease, border-color 0.18s ease;
}

.mini-switch i:before {
    content: "";
    position: absolute;
    top: 0.18rem;
    left: 0.18rem;
    width: 0.95rem;
    height: 0.95rem;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 3px 10px rgba(20, 24, 36, 0.2);
    transition: transform 0.18s ease;
}

.mini-switch input:checked + i {
    border-color: rgba(138, 104, 29, 0.45);
    background: var(--brand);
}

.mini-switch input:checked + i:before {
    transform: translateX(1.08rem);
}

.mini-switch input:focus-visible + i {
    outline: 2px solid rgba(138, 104, 29, 0.35);
    outline-offset: 3px;
}

.module-expired-page {
    min-height: calc(100vh - 5rem);
    display: grid;
    place-items: center;
    padding: clamp(1rem, 4vw, 3rem);
}

.module-expired-panel {
    width: min(100%, 34rem);
    display: grid;
    gap: 1.1rem;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: var(--radius-lg);
    padding: clamp(1.35rem, 4vw, 2.2rem);
    background:
        linear-gradient(135deg, rgba(138, 104, 29, 0.08), rgba(255, 255, 255, 0.72)),
        var(--panel);
    box-shadow: var(--shadow);
}

.module-expired-panel h1 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.7rem, 4vw, 2.35rem);
    letter-spacing: 0;
}

.module-expired-panel h1:after {
    content: "";
    display: block;
    width: 4rem;
    height: 0.22rem;
    margin-top: 0.7rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gold), rgba(138, 104, 29, 0.22));
}

.module-expired-panel p {
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.module-expired-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.7);
}

.module-expired-price span {
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 800;
}

.module-expired-price strong {
    color: var(--ink);
    font-size: 1rem;
}

.module-expired-actions {
    display: grid;
    gap: 0.7rem;
}

.trial-feedback-page {
    min-height: calc(100vh - 3rem);
    display: grid;
    place-items: center;
    padding: clamp(1rem, 5vw, 3.5rem);
    background:
        radial-gradient(circle at top left, rgba(216, 179, 90, 0.22), transparent 34rem),
        linear-gradient(135deg, rgba(248, 245, 235, 0.92), rgba(255, 255, 255, 0.95));
}

.trial-feedback-card {
    width: min(100%, 46rem);
    display: grid;
    gap: 1rem;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: var(--radius-lg);
    padding: clamp(1.3rem, 4vw, 2.3rem);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow);
}

.trial-feedback-card h1 {
    max-width: 12ch;
    margin: 0;
    color: var(--ink);
    font-size: clamp(2rem, 6vw, 3.5rem);
    line-height: 0.96;
    letter-spacing: 0;
}

.trial-feedback-card h1:after {
    content: "";
    display: block;
    width: 4.2rem;
    height: 0.24rem;
    margin-top: 0.8rem;
    border-radius: 999px;
    background: var(--brand);
}

.trial-feedback-card p {
    margin: 0;
    color: var(--muted);
    font-weight: 720;
    line-height: 1.65;
}

.trial-feedback-form {
    display: grid;
    gap: 0.7rem;
}

.score-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 5.5rem;
    gap: 1rem;
    align-items: center;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 16px;
    padding: 0.85rem 0.9rem;
    background:
        linear-gradient(90deg, rgba(138, 104, 29, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(248, 245, 235, 0.54);
}

.score-field strong,
.score-field small {
    display: block;
}

.score-field strong {
    color: var(--ink);
    font-size: 0.96rem;
    font-weight: 950;
}

.score-field small {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 720;
    line-height: 1.45;
}

.score-field input {
    width: 100%;
    border: 1px solid rgba(138, 104, 29, 0.22);
    border-radius: 12px;
    padding: 0.7rem 0.45rem;
    color: var(--ink);
    background: #fff;
    font-size: 1.15rem;
    font-weight: 950;
    text-align: center;
}

.trial-feedback-comment {
    display: grid;
    gap: 0.45rem;
    color: var(--ink);
    font-weight: 900;
}

.trial-feedback-comment textarea {
    width: 100%;
    min-height: 8rem;
    resize: vertical;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 16px;
    padding: 0.95rem;
    color: var(--ink);
    background: #fff;
    font: inherit;
    line-height: 1.55;
}

.trial-feedback-contact {
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 14px;
    padding: 0.8rem 0.9rem;
    background: rgba(248, 245, 235, 0.62);
    color: var(--ink);
    font-weight: 850;
}

.trial-feedback-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    align-items: center;
    justify-content: flex-start;
    padding-top: 0.4rem;
}

.admin-feedback-sort {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin: 1rem 0;
}

.admin-feedback-sort .is-active {
    background: var(--brand);
    color: #fff;
}

.admin-feedback-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.admin-feedback-card {
    align-content: start;
}

.admin-feedback-card h3 {
    margin: 0.4rem 0 0;
    color: var(--ink);
    font-size: 1.25rem;
}

.admin-feedback-card blockquote {
    margin: 0.9rem 0 0;
    border-left: 0.22rem solid var(--brand);
    padding: 0.1rem 0 0.1rem 0.8rem;
    color: var(--ink);
    font-weight: 750;
    line-height: 1.55;
}

.feedback-score-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.4rem;
    border-radius: 999px;
    padding: 0.38rem 0.68rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-strong));
    font-size: 0.82rem;
    font-weight: 950;
}

.trial-feedback-score-list {
    display: grid;
    gap: 0.48rem;
    margin-top: 0.85rem;
}

.trial-feedback-score-list span {
    display: grid;
    grid-template-columns: 8.8rem minmax(0, 1fr) 2rem;
    gap: 0.55rem;
    align-items: center;
}

.trial-feedback-score-list b,
.trial-feedback-score-list strong {
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
}

.trial-feedback-score-list i {
    position: relative;
    overflow: hidden;
    height: 0.48rem;
    border-radius: 999px;
    background: rgba(138, 104, 29, 0.13);
}

.trial-feedback-score-list em {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: inherit;
    background: var(--brand);
}

@media (max-width: 760px) {
    .score-field {
        grid-template-columns: 1fr;
    }

    .admin-feedback-grid {
        grid-template-columns: 1fr;
    }

    .trial-feedback-score-list span {
        grid-template-columns: 1fr;
        gap: 0.3rem;
    }
}

.support-dot {
    display: inline-block;
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    background: #6b7280;
    box-shadow: 0 0 0 0.28rem rgba(107, 114, 128, 0.14);
}

.support-dot.is-online {
    background: #16a34a;
    box-shadow: 0 0 0 0.28rem rgba(22, 163, 74, 0.16);
}

.support-admin-alert {
    position: fixed;
    right: 1.2rem;
    bottom: 1.2rem;
    z-index: 1390;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    padding: 0.52rem 0.68rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-strong));
    box-shadow: 0 12px 28px rgba(36, 25, 7, 0.22);
    text-decoration: none;
    font-weight: 950;
    font-size: 0.78rem;
    line-height: 1;
}

.support-admin-alert[hidden] {
    display: none !important;
}

.support-admin-alert strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
    color: var(--ink);
    background: #fff;
    font-size: 0.72rem;
}

.support-chat-widget {
    position: fixed;
    right: 1.2rem;
    bottom: 1.2rem;
    z-index: 1400;
    display: grid;
    justify-items: end;
    gap: 0.65rem;
    max-width: min(24rem, calc(100vw - 1.4rem));
}

.support-chat-widget[hidden],
.support-chat-panel[hidden],
.support-admin-business[hidden],
.support-admin-reply[hidden] {
    display: none !important;
}

.support-chat-launcher {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    min-height: 2.45rem;
    padding: 0.5rem 0.68rem;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-strong));
    box-shadow: 0 12px 28px rgba(36, 25, 7, 0.22);
    font: inherit;
    font-weight: 950;
    font-size: 0.82rem;
    line-height: 1;
    cursor: pointer;
}

.support-chat-launcher .support-dot,
.support-admin-alert .support-dot {
    width: 0.54rem;
    height: 0.54rem;
    box-shadow: 0 0 0 0.18rem rgba(107, 114, 128, 0.14);
}

.support-chat-launcher .support-dot.is-online,
.support-admin-alert .support-dot.is-online {
    box-shadow: 0 0 0 0.18rem rgba(22, 163, 74, 0.16);
}

.support-chat-panel {
    width: min(24rem, calc(100vw - 1.4rem));
    overflow: hidden;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 30px 80px rgba(36, 25, 7, 0.28);
    backdrop-filter: blur(18px);
}

.support-chat-head,
.support-admin-list-head,
.support-admin-thread-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.support-chat-head {
    padding: 1.05rem 1.1rem 0.8rem;
    border-bottom: 1px solid rgba(138, 104, 29, 0.12);
}

.support-chat-head h2,
.support-admin-list-head h2,
.support-admin-thread-head h2 {
    margin: 0.12rem 0 0;
    color: var(--ink);
    font-size: 1.18rem;
    font-weight: 950;
}

.support-chat-body {
    display: grid;
    align-content: start;
    gap: 0.7rem;
    max-height: 19rem;
    overflow-y: auto;
    padding: 1rem;
    background:
        radial-gradient(circle at 12% 10%, rgba(138, 104, 29, 0.08), transparent 28%),
        rgba(248, 245, 235, 0.56);
}

.support-chat-intro {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 760;
    line-height: 1.5;
}

.support-chat-notice {
    margin: 0;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 14px;
    padding: 0.7rem 0.78rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.78);
    font-size: 0.82rem;
    font-weight: 850;
    line-height: 1.42;
}

.support-chat-notice.is-error {
    border-color: rgba(180, 35, 24, 0.22);
    color: #7a271a;
    background: rgba(254, 243, 242, 0.94);
}

.support-chat-message,
.support-admin-message {
    display: grid;
    gap: 0.22rem;
    max-width: 86%;
    border-radius: 16px;
    padding: 0.74rem 0.82rem;
}

.support-chat-message.is-user,
.support-admin-message.is-support {
    justify-self: end;
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-strong));
}

.support-chat-message.is-support,
.support-admin-message.is-user {
    justify-self: start;
    color: var(--ink);
    background: #fff;
    border: 1px solid rgba(138, 104, 29, 0.14);
}

.support-chat-message-meta {
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    opacity: 0.72;
}

.support-chat-message p,
.support-admin-message p {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-weight: 780;
    line-height: 1.42;
}

.support-chat-compose {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    padding: 0.9rem;
    border-top: 1px solid rgba(138, 104, 29, 0.12);
    background: #fff;
}

.support-chat-compose textarea,
.support-admin-input {
    width: 100%;
    resize: vertical;
    border: 1px solid rgba(138, 104, 29, 0.18);
    border-radius: 16px;
    padding: 0.82rem 0.9rem;
    color: var(--ink);
    background: #fff;
    font: inherit;
    font-weight: 740;
    line-height: 1.45;
}

.support-admin-status {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid rgba(22, 163, 74, 0.2);
    border-radius: 999px;
    padding: 0.58rem 0.82rem;
    background: rgba(22, 163, 74, 0.08);
    color: var(--ink);
    font-size: 0.84rem;
    font-weight: 900;
}

.support-admin-layout {
    display: grid;
    grid-template-columns: minmax(18rem, 0.9fr) minmax(0, 1.7fr);
    gap: 1rem;
    align-items: stretch;
}

.support-admin-list-card,
.support-admin-thread-card {
    min-width: 0;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 18px 42px rgba(36, 25, 7, 0.08);
}

.support-admin-list-card {
    padding: 1rem;
}

.support-admin-thread-card {
    display: grid;
    grid-template-rows: auto auto minmax(20rem, 1fr) auto;
    overflow: hidden;
}

.support-admin-list {
    display: grid;
    gap: 0.7rem;
    margin-top: 0.9rem;
    max-height: 42rem;
    overflow-y: auto;
}

.support-admin-conversation {
    position: relative;
    display: grid;
    gap: 0.24rem;
    width: 100%;
    border: 1px solid rgba(138, 104, 29, 0.16);
    border-radius: 16px;
    padding: 0.9rem;
    color: var(--ink);
    background: rgba(248, 245, 235, 0.62);
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.support-admin-conversation.is-selected {
    border-color: rgba(138, 104, 29, 0.44);
    background: #fff;
    box-shadow: inset 0.22rem 0 0 var(--brand), 0 16px 32px rgba(36, 25, 7, 0.08);
}

.support-admin-conversation strong {
    padding-right: 2rem;
    font-size: 0.98rem;
    font-weight: 950;
}

.support-admin-conversation span,
.support-admin-conversation small {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 760;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.support-unread-pill {
    position: absolute;
    top: 0.72rem;
    right: 0.72rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.55rem;
    height: 1.55rem;
    border-radius: 999px;
    color: #fff;
    background: #b42318;
    font-size: 0.76rem;
    font-style: normal;
    font-weight: 950;
}

.support-admin-thread-head {
    padding: 1.1rem;
    border-bottom: 1px solid rgba(138, 104, 29, 0.12);
    background: rgba(255, 255, 255, 0.78);
}

.support-admin-thread-head p {
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-weight: 750;
    line-height: 1.5;
}

.support-admin-business {
    display: grid;
    gap: 0.24rem;
    margin: 1rem 1rem 0;
    border: 1px solid rgba(138, 104, 29, 0.14);
    border-radius: 16px;
    padding: 0.9rem;
    background: rgba(248, 245, 235, 0.62);
}

.support-admin-business strong {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.support-admin-business small {
    color: var(--muted);
    font-weight: 760;
    overflow-wrap: anywhere;
}

.support-admin-messages {
    display: grid;
    align-content: start;
    gap: 0.75rem;
    overflow-y: auto;
    padding: 1rem;
    background:
        radial-gradient(circle at 88% 8%, rgba(138, 104, 29, 0.08), transparent 28%),
        rgba(248, 245, 235, 0.44);
}

.support-admin-message {
    max-width: min(36rem, 88%);
}

.support-admin-reply {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border-top: 1px solid rgba(138, 104, 29, 0.12);
    background: #fff;
}

.support-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
}

.icon-refresh {
    position: relative;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 0.16rem solid currentColor;
    border-left-color: transparent;
    border-radius: 999px;
}

.icon-refresh::after {
    content: "";
    position: absolute;
    right: -0.16rem;
    top: -0.2rem;
    width: 0;
    height: 0;
    border-left: 0.34rem solid currentColor;
    border-top: 0.24rem solid transparent;
    border-bottom: 0.24rem solid transparent;
    transform: rotate(18deg);
}

@media (max-width: 980px) {
    .support-admin-layout {
        grid-template-columns: 1fr;
    }

    .support-admin-thread-card {
        min-height: 36rem;
    }
}

@media (max-width: 640px) {
    .support-admin-alert,
    .support-chat-widget {
        right: 0.7rem;
        bottom: 0.7rem;
        max-width: calc(100vw - 1.4rem);
    }

    .support-chat-panel {
        width: calc(100vw - 1.4rem);
    }

    .support-chat-compose {
        grid-template-columns: 1fr;
    }

    .support-admin-status {
        width: 100%;
        justify-content: center;
    }
}

/* Final contrast guardrails: light button surfaces must never inherit white text. */
:root:not([data-theme="dark"]) .app-shell :is(a, button).button-soft:not(.danger),
:root:not([data-theme="dark"]) .app-shell :is(a, button).button-quiet:not(.danger),
:root:not([data-theme="dark"]) .app-shell :is(a, button).button-secondary:not(.danger),
:root:not([data-theme="dark"]) .app-shell :is(a, button).chip-button:not(.danger) {
    color: #17120a !important;
    text-shadow: none !important;
}

:root:not([data-theme="dark"]) .app-shell :is(a, button).button-soft:not(.danger) *,
:root:not([data-theme="dark"]) .app-shell :is(a, button).button-quiet:not(.danger) *,
:root:not([data-theme="dark"]) .app-shell :is(a, button).button-secondary:not(.danger) *,
:root:not([data-theme="dark"]) .app-shell :is(a, button).chip-button:not(.danger) * {
    color: inherit !important;
    text-shadow: inherit !important;
}

.module-settings-page .module-billing-link.button-soft,
.module-settings-page .module-billing-link.button-secondary {
    color: #17120a !important;
    background: rgba(255, 255, 255, 0.94) !important;
    text-shadow: none !important;
}

.module-settings-page .module-billing-link.button-soft *,
.module-settings-page .module-billing-link.button-secondary * {
    color: inherit !important;
    text-shadow: inherit !important;
}

.module-settings-page .module-billing-link.button-primary,
.module-settings-page .module-billing-link.button-primary * {
    color: #ffffff !important;
}

.module-settings-page .module-status,
.module-settings-page .module-price-chip,
.module-settings-page .module-card.is-paid .module-status {
    color: #17120a !important;
    background: rgba(255, 255, 255, 0.94) !important;
    text-shadow: none !important;
}

.module-settings-page .module-card.is-pos {
    border-color: rgba(255, 255, 255, 0.24);
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.18), transparent 32%),
        linear-gradient(135deg, #0f5f6f, #083946) !important;
}

.module-settings-page .module-card.is-pos .module-eyebrow,
.module-settings-page .module-card.is-pos > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-pos strong,
.module-settings-page .module-card.is-pos p,
.module-settings-page .module-card.is-pos .module-toggle span {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.42) !important;
}

.module-settings-page .module-card.is-helpdesk,
.module-settings-page .module-card.is-events,
.module-settings-page .module-card.is-franchisees,
.module-settings-page .module-card.is-projects,
.module-settings-page .module-card.is-cloudfolder,
.module-settings-page .module-card.is-automation,
.module-settings-page .module-card.is-team {
    border-color: rgba(255, 255, 255, 0.24);
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.18), transparent 32%),
        linear-gradient(135deg, var(--card-accent), var(--card-accent-deep)) !important;
}

.module-settings-page .module-card.is-helpdesk .module-eyebrow,
.module-settings-page .module-card.is-helpdesk > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-helpdesk strong,
.module-settings-page .module-card.is-helpdesk p,
.module-settings-page .module-card.is-helpdesk .module-toggle span,
.module-settings-page .module-card.is-events .module-eyebrow,
.module-settings-page .module-card.is-events > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-events strong,
.module-settings-page .module-card.is-events p,
.module-settings-page .module-card.is-events .module-toggle span,
.module-settings-page .module-card.is-franchisees .module-eyebrow,
.module-settings-page .module-card.is-franchisees > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-franchisees strong,
.module-settings-page .module-card.is-franchisees p,
.module-settings-page .module-card.is-franchisees .module-toggle span,
.module-settings-page .module-card.is-projects .module-eyebrow,
.module-settings-page .module-card.is-projects > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-projects strong,
.module-settings-page .module-card.is-projects p,
.module-settings-page .module-card.is-projects .module-toggle span,
.module-settings-page .module-card.is-cloudfolder .module-eyebrow,
.module-settings-page .module-card.is-cloudfolder > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-cloudfolder strong,
.module-settings-page .module-card.is-cloudfolder p,
.module-settings-page .module-card.is-cloudfolder .module-toggle span,
.module-settings-page .module-card.is-automation .module-eyebrow,
.module-settings-page .module-card.is-automation > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-automation strong,
.module-settings-page .module-card.is-automation p,
.module-settings-page .module-card.is-automation .module-toggle span,
.module-settings-page .module-card.is-team .module-eyebrow,
.module-settings-page .module-card.is-team > div:not(.module-card-foot) > span,
.module-settings-page .module-card.is-team strong,
.module-settings-page .module-card.is-team p,
.module-settings-page .module-card.is-team .module-toggle span {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.42) !important;
}

/* Module setup panels sit on pale surfaces inside coloured cards. Keep their text dark. */
.module-settings-page .module-card .module-setup-checklist,
.module-settings-page .module-card.is-pos .module-setup-checklist,
.module-settings-page .module-card.is-helpdesk .module-setup-checklist,
.module-settings-page .module-card.is-events .module-setup-checklist,
.module-settings-page .module-card.is-franchisees .module-setup-checklist,
.module-settings-page .module-card.is-projects .module-setup-checklist,
.module-settings-page .module-card.is-cloudfolder .module-setup-checklist,
.module-settings-page .module-card.is-automation .module-setup-checklist,
.module-settings-page .module-card.is-team .module-setup-checklist {
    border-color: rgba(255, 255, 255, 0.5) !important;
    background: rgba(255, 255, 255, 0.94) !important;
}

.module-settings-page .module-card .module-setup-head span,
.module-settings-page .module-card .module-setup-head b,
.module-settings-page .module-card .module-setup-item strong,
.module-settings-page .module-card .module-setup-complete strong {
    color: #17120a !important;
    text-shadow: none !important;
}

.module-settings-page .module-card .module-setup-item small,
.module-settings-page .module-card .module-setup-complete small {
    color: rgba(23, 18, 10, 0.66) !important;
    text-shadow: none !important;
}

.module-settings-page .module-card .module-setup-complete {
    color: #17120a !important;
    background: rgba(255, 255, 255, 0.94) !important;
    text-shadow: none !important;
}

/* Final module-card guardrail: every module card must keep a coloured surface and readable text. */
.module-settings-page .module-card {
    border-color: rgba(255, 255, 255, 0.24) !important;
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.18), transparent 32%),
        linear-gradient(135deg, var(--card-accent, #8a681d), var(--card-accent-deep, #5f4512)) !important;
}

.module-settings-page .module-card.is-muted {
    opacity: 1 !important;
}

.module-settings-page .module-card > .module-card-copy > .module-eyebrow,
.module-settings-page .module-card > .module-card-copy > span,
.module-settings-page .module-card > .module-card-copy > strong,
.module-settings-page .module-card > .module-card-copy > p,
.module-settings-page .module-card .module-toggle > span {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.42) !important;
}

.conversation-settings-page .cms-editor-head {
    align-items: center;
}

.auto-reply-settings-stack {
    display: grid;
    gap: 1rem;
}

.auto-reply-master-card,
.auto-reply-platform-card {
    display: grid;
    gap: 1rem;
}

.auto-reply-card-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.auto-reply-card-main h2 {
    margin: 0.18rem 0 0;
    color: var(--ink);
    font-size: 1.35rem;
    font-weight: 950;
    letter-spacing: 0;
}

.auto-reply-card-main p,
.auto-reply-platform-card .panel-head p {
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-weight: 760;
    line-height: 1.48;
}

.auto-reply-toggle-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr));
    gap: 0.85rem;
}

.auto-reply-toggle-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: center;
    min-height: 6.6rem;
    border: 1px solid rgba(121, 131, 153, 0.2);
    border-radius: 18px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.72);
}

html[data-theme="dark"] .auto-reply-toggle-card {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.62);
}

.auto-reply-toggle-card strong {
    display: block;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.25;
}

.auto-reply-toggle-card span:not(.auto-reply-toggle-state) {
    display: block;
    margin-top: 0.28rem;
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 740;
    line-height: 1.42;
}

.auto-reply-large-toggle {
    position: relative;
    display: grid;
    gap: 0.38rem;
    justify-items: center;
    min-width: 5.8rem;
    color: var(--muted);
    font-weight: 900;
    cursor: pointer;
    user-select: none;
}

.auto-reply-large-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.auto-reply-large-toggle i {
    position: relative;
    display: block;
    width: 4.35rem;
    height: 2.34rem;
    border: 1px solid rgba(121, 131, 153, 0.28);
    border-radius: 999px;
    background: rgba(121, 131, 153, 0.18);
    box-shadow: inset 0 0.08rem 0 rgba(255, 255, 255, 0.58);
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.auto-reply-large-toggle i:before {
    content: "";
    position: absolute;
    top: 0.25rem;
    left: 0.25rem;
    width: 1.72rem;
    height: 1.72rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0.32rem 0.68rem rgba(31, 42, 68, 0.18);
    transition: transform 180ms ease;
}

.auto-reply-large-toggle input:checked + i {
    border-color: rgba(47, 125, 80, 0.38);
    background: rgba(47, 125, 80, 0.3);
    box-shadow: 0 0.55rem 1.2rem rgba(47, 125, 80, 0.12), inset 0 0.08rem 0 rgba(255, 255, 255, 0.58);
}

.auto-reply-large-toggle input:checked + i:before {
    transform: translateX(1.98rem);
}

.auto-reply-large-toggle input:focus-visible + i {
    outline: 2px solid rgba(138, 104, 29, 0.45);
    outline-offset: 3px;
}

.auto-reply-large-toggle.is-saving i {
    opacity: 0.72;
    box-shadow: 0 0.55rem 1.2rem rgba(138, 104, 29, 0.18), inset 0 0.08rem 0 rgba(255, 255, 255, 0.58);
}

.auto-reply-toggle-state {
    display: inline-flex;
    min-height: 1.3rem;
    align-items: center;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
}

.auto-reply-toggle-state:before {
    content: "Off";
}

.auto-reply-large-toggle input:checked ~ .auto-reply-toggle-state {
    color: rgba(47, 125, 80, 0.96);
}

.auto-reply-large-toggle input:checked ~ .auto-reply-toggle-state:before {
    content: "On";
}

.auto-reply-large-toggle.is-saving .auto-reply-toggle-state:before {
    content: "Saving";
}

@media (max-width: 640px) {
    .auto-reply-card-main,
    .auto-reply-toggle-card {
        grid-template-columns: 1fr;
    }

    .auto-reply-large-toggle {
        justify-items: start;
    }
}

.lead-score-card {
    display: grid;
    gap: 1rem;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 20px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.62)),
        rgba(255, 255, 255, 0.7);
    box-shadow: 0 1rem 2.4rem rgba(31, 42, 68, 0.08);
}

.lead-score-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.lead-score-main h2 {
    margin: 0.25rem 0 0;
    color: var(--ink);
    font-size: 1.2rem;
    font-weight: 950;
    letter-spacing: 0;
}

.lead-score-main p {
    margin: 0.4rem 0 0;
    color: var(--muted);
    font-weight: 760;
    line-height: 1.46;
}

.lead-score-ring {
    display: grid;
    place-items: center;
    width: 5.6rem;
    height: 5.6rem;
    border: 0.55rem solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    text-align: center;
}

.lead-score-ring strong {
    display: block;
    color: var(--ink);
    font-size: 1.52rem;
    font-weight: 950;
    line-height: 1;
}

.lead-score-ring span {
    display: block;
    margin-top: 0.16rem;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
}

.lead-score-reasons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 0.65rem;
}

.lead-score-reasons article {
    position: relative;
    display: grid;
    gap: 0.2rem;
    min-height: 6.4rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 16px;
    padding: 0.8rem 3.2rem 0.8rem 0.8rem;
    background: rgba(255, 255, 255, 0.62);
}

.lead-score-reasons span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.lead-score-reasons strong {
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 950;
    line-height: 1.25;
}

.lead-score-reasons small {
    color: var(--muted);
    font-weight: 720;
    line-height: 1.35;
}

.lead-score-reasons em {
    position: absolute;
    top: 0.72rem;
    right: 0.72rem;
    display: inline-flex;
    min-width: 2.05rem;
    min-height: 1.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-style: normal;
    font-size: 0.76rem;
    font-weight: 950;
}

.lead-score-reasons em.is-positive {
    color: #276749;
    background: rgba(47, 125, 80, 0.14);
}

.lead-score-reasons em.is-negative {
    color: #9f1f17;
    background: rgba(180, 35, 24, 0.12);
}

.lead-score-card.is-hot .lead-score-ring,
.lead-score-mini.is-hot {
    border-color: rgba(47, 125, 80, 0.4);
    background: rgba(240, 253, 244, 0.8);
}

.lead-score-card.is-warm .lead-score-ring,
.lead-score-mini.is-warm {
    border-color: rgba(76, 165, 181, 0.36);
    background: rgba(236, 254, 255, 0.8);
}

.lead-score-card.is-nurture .lead-score-ring,
.lead-score-mini.is-nurture {
    border-color: rgba(249, 194, 88, 0.42);
    background: rgba(255, 251, 235, 0.85);
}

.lead-score-card.is-cold .lead-score-ring,
.lead-score-mini.is-cold {
    border-color: rgba(121, 131, 153, 0.28);
}

.lead-score-mini {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    padding: 0.32rem 0.58rem;
}

.lead-score-mini strong {
    color: var(--ink);
    font-size: 0.95rem;
    font-weight: 950;
    line-height: 1;
}

.lead-score-mini span {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
}

.deal-page {
    display: grid;
    gap: 1rem;
}

.deal-page .cms-editor-head {
    align-items: center;
}

.deal-page-actions,
.deal-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: flex-end;
}

.deal-forecast-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.deal-forecast-card {
    display: grid;
    gap: 0.3rem;
    min-height: 7rem;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 18px;
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.68)),
        rgba(255, 255, 255, 0.72);
    box-shadow: 0 1.1rem 2.6rem rgba(31, 42, 68, 0.08);
}

.deal-forecast-card span,
.deal-forecast-card small,
.deal-card-customer,
.deal-stage-head span,
.deal-detail-subline,
.deal-activity span,
.deal-empty-detail p {
    color: var(--muted);
    font-weight: 760;
    line-height: 1.42;
}

.deal-forecast-card strong {
    color: var(--ink);
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 950;
    line-height: 1;
}

.deal-create-panel,
.deal-detail-panel {
    display: grid;
    gap: 1rem;
}

.deal-create-grid,
.deal-editor-grid,
.deal-activity-create {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 0.8rem;
}

.deal-field {
    display: grid;
    gap: 0.38rem;
    min-width: 0;
    color: var(--ink);
    font-size: 0.84rem;
    font-weight: 880;
}

.deal-field span {
    padding-left: 0.1rem;
}

.deal-field-wide {
    grid-column: 1 / -1;
}

.deal-field textarea.input-control {
    min-height: 8rem;
    resize: vertical;
}

.deal-pipeline-scroll {
    overflow-x: auto;
    padding: 0.15rem 0 0.35rem;
}

.deal-pipeline-board {
    display: grid;
    grid-auto-columns: minmax(18.5rem, 21rem);
    grid-auto-flow: column;
    gap: 0.9rem;
    min-height: 18rem;
}

.deal-stage-column {
    display: grid;
    align-content: start;
    gap: 0.75rem;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 20px;
    padding: 0.78rem;
    background: rgba(255, 255, 255, 0.52);
}

.deal-stage-column.is-won-stage {
    border-color: rgba(47, 125, 80, 0.24);
    background: rgba(240, 253, 244, 0.65);
}

.deal-stage-column.is-lost-stage {
    border-color: rgba(180, 35, 24, 0.18);
    background: rgba(255, 245, 242, 0.65);
}

.deal-stage-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.25rem 0.18rem;
}

.deal-stage-head strong {
    display: block;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 950;
}

.deal-stage-head small {
    color: var(--ink);
    font-weight: 950;
    white-space: nowrap;
}

.deal-stage-empty {
    border: 1px dashed rgba(121, 131, 153, 0.25);
    border-radius: 16px;
    padding: 1rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.48);
    font-weight: 760;
    text-align: center;
}

.deal-card {
    display: grid;
    gap: 0.68rem;
    border: 1px solid rgba(121, 131, 153, 0.2);
    border-radius: 18px;
    padding: 0.86rem;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 0.9rem 1.8rem rgba(31, 42, 68, 0.08);
}

.deal-card.is-selected {
    border-color: rgba(138, 104, 29, 0.45);
    box-shadow: 0 1rem 2rem rgba(138, 104, 29, 0.14);
}

.deal-card.is-won {
    border-color: rgba(47, 125, 80, 0.28);
}

.deal-card.is-lost {
    opacity: 0.82;
}

.deal-card-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.6rem;
    align-items: start;
}

.deal-card-top a {
    color: var(--ink);
    font-weight: 950;
    line-height: 1.25;
    text-decoration: none;
}

.deal-card-top a:hover {
    color: var(--gold-deep);
}

.deal-status-badge {
    display: inline-flex;
    min-height: 1.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 0.55rem;
    color: #644818;
    background: rgba(249, 194, 88, 0.2);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}

.deal-status-badge.is-won {
    color: #276749;
    background: rgba(47, 125, 80, 0.16);
}

.deal-status-badge.is-lost {
    color: #9f1f17;
    background: rgba(180, 35, 24, 0.12);
}

.deal-card-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
}

.deal-card-metrics span {
    min-height: 2.35rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 12px;
    padding: 0.48rem;
    color: var(--ink);
    background: rgba(248, 250, 252, 0.78);
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

.deal-next-activity {
    border-radius: 12px;
    padding: 0.52rem 0.62rem;
    color: #365314;
    background: rgba(132, 204, 22, 0.14);
    font-size: 0.78rem;
    font-weight: 860;
}

.deal-next-activity.is-overdue,
.deal-activity.is-overdue {
    color: #9f1f17;
    background: rgba(180, 35, 24, 0.1);
}

.deal-related-links,
.deal-detail-related div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.deal-related-links a,
.deal-detail-related a {
    display: inline-flex;
    min-height: 1.85rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    padding: 0 0.65rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.75rem;
    font-weight: 860;
    text-decoration: none;
}

.deal-card-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.45rem;
    align-items: center;
}

.deal-card-actions .input-control {
    min-height: 2.45rem;
    border-radius: 12px;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    font-size: 0.78rem;
}

.deal-detail-head {
    margin-bottom: 0;
}

.deal-detail-subline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    margin-top: 0.55rem;
}

.deal-detail-related {
    display: grid;
    gap: 0.5rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 16px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.58);
}

.deal-detail-related strong {
    color: var(--ink);
    font-weight: 950;
}

.deal-activity-panel {
    display: grid;
    gap: 0.85rem;
    border-top: 1px solid rgba(121, 131, 153, 0.16);
    padding-top: 1rem;
}

.deal-activity-list {
    display: grid;
    gap: 0.55rem;
}

.deal-activity {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 16px;
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.72);
}

.deal-activity strong,
.deal-activity span,
.deal-activity p {
    display: block;
}

.deal-activity strong {
    color: var(--ink);
    font-weight: 950;
}

.deal-activity p {
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-weight: 720;
}

.deal-activity.is-complete {
    opacity: 0.72;
}

html[data-theme="dark"] .deal-forecast-card,
html[data-theme="dark"] .lead-score-card,
html[data-theme="dark"] .lead-score-ring,
html[data-theme="dark"] .lead-score-reasons article,
html[data-theme="dark"] .lead-score-mini,
html[data-theme="dark"] .deal-stage-column,
html[data-theme="dark"] .deal-card,
html[data-theme="dark"] .deal-stage-empty,
html[data-theme="dark"] .deal-card-metrics span,
html[data-theme="dark"] .deal-detail-related,
html[data-theme="dark"] .deal-activity,
html[data-theme="dark"] .deal-related-links a,
html[data-theme="dark"] .deal-detail-related a {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 1100px) {
    .deal-forecast-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .deal-page-actions,
    .deal-detail-actions {
        justify-content: stretch;
    }

    .deal-page-actions > *,
    .deal-detail-actions > * {
        flex: 1 1 100%;
    }

    .deal-forecast-grid {
        grid-template-columns: 1fr;
    }

    .deal-pipeline-board {
        grid-auto-columns: minmax(17rem, 88vw);
    }

    .deal-card-actions,
    .deal-activity {
        grid-template-columns: 1fr;
    }

    .deal-card-actions .button-soft {
        width: 100%;
    }

    .lead-score-main {
        grid-template-columns: 1fr;
    }

    .lead-score-ring {
        width: 5rem;
        height: 5rem;
    }
}

.sales-sequences-page {
    display: grid;
    gap: 1rem;
}

.sales-sequence-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.sales-sequence-stats article {
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 8px;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 252, 0.78));
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.sales-sequence-stats span,
.sales-sequence-stats small {
    display: block;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
}

.sales-sequence-stats strong {
    display: block;
    margin: 0.15rem 0;
    color: var(--ink);
    font-size: 1.75rem;
    font-weight: 950;
}

.sales-sequence-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

.sales-sequence-list-panel,
.sales-sequence-editor,
.sales-sequence-enrol-panel,
.sales-sequence-queue {
    display: grid;
    gap: 0.85rem;
}

.sales-sequence-list-panel {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.85rem;
    position: static;
}

.sales-sequence-list-panel .panel-head {
    grid-column: 1 / -1;
}

.sales-sequence-tile {
    position: relative;
    display: grid;
    min-height: 11rem;
    align-content: end;
    gap: 0.5rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    padding: 0.95rem;
    color: #fff;
    background: linear-gradient(135deg, #8a681d, #3f2f10);
    text-decoration: none;
    box-shadow: 0 1rem 2.2rem rgba(20, 17, 11, 0.14);
    isolation: isolate;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.sales-sequence-tile:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.48)),
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.22), transparent 12rem);
}

.sales-sequence-tile.is-tone-2 {
    background: linear-gradient(135deg, #0f766e, #123f3b);
}

.sales-sequence-tile.is-tone-3 {
    background: linear-gradient(135deg, #2f7d50, #193f2b);
}

.sales-sequence-tile.is-tone-4 {
    background: linear-gradient(135deg, #765a82, #3b2c47);
}

.sales-sequence-tile.is-tone-5 {
    background: linear-gradient(135deg, #a65a45, #4f281f);
}

.sales-sequence-tile.is-tone-6 {
    background: linear-gradient(135deg, #3f5f86, #172436);
}

.sales-sequence-tile:hover,
.sales-sequence-tile.is-selected {
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 3px rgba(138, 104, 29, 0.22), 0 1.35rem 3rem rgba(20, 17, 11, 0.22);
    transform: translateY(-1px);
}

.sales-sequence-tile strong {
    color: #fff;
    font-size: clamp(1.1rem, 2.5vw, 1.55rem);
    line-height: 1.02;
    font-weight: 950;
    text-shadow: 0 0.14rem 0.18rem rgba(0, 0, 0, 0.38), 0 0.85rem 1.9rem rgba(0, 0, 0, 0.42);
}

.sales-sequence-tile span,
.sales-sequence-tile small {
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.78rem;
    font-weight: 820;
}

.sales-sequence-tile span {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.sales-sequence-main {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.sales-sequence-form-grid,
.sales-sequence-step-grid,
.sales-sequence-add-step {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.sales-sequence-field {
    display: grid;
    gap: 0.34rem;
    min-width: 0;
}

.sales-sequence-field span {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.sales-sequence-field.is-wide {
    grid-column: 1 / -1;
}

.sales-sequence-steps {
    display: grid;
    gap: 0.75rem;
    border-top: 1px solid rgba(121, 131, 153, 0.16);
    padding-top: 1rem;
}

.sales-sequence-step {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 12px;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.68);
}

.sales-sequence-step-rail {
    display: grid;
    gap: 0.35rem;
    align-content: start;
    justify-items: center;
}

.sales-sequence-step-rail .cms-arrow-button {
    width: 2.1rem;
    height: 2.1rem;
}

.sales-sequence-step-rail .cms-arrow-button:disabled {
    cursor: not-allowed;
    opacity: 0.35;
}

.sales-sequence-step-number {
    display: inline-flex;
    width: 2.2rem;
    height: 2.2rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #5b3b05;
    background: rgba(249, 194, 88, 0.22);
    font-weight: 950;
}

.sales-sequence-step-actions,
.sales-sequence-row-actions,
.sales-sequence-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.sales-sequence-step-actions {
    grid-column: 2;
    justify-content: flex-end;
}

.sales-sequence-add-step {
    border: 1px dashed rgba(121, 131, 153, 0.26);
    border-radius: 12px;
    padding: 0.85rem;
    background: rgba(248, 250, 252, 0.62);
}

.sales-sequence-action-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sales-sequence-action-panel p {
    max-width: 48rem;
    margin: 0.35rem 0 0;
    color: var(--muted);
    line-height: 1.45;
}

.sales-sequence-modal-card {
    width: min(64rem, 100%);
}

.sales-sequence-save-status {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    border-radius: 999px;
    padding: 0.32rem 0.55rem;
    color: color-mix(in srgb, var(--section-primary, var(--gold)) 62%, #111 38%);
    background: color-mix(in srgb, var(--section-primary, var(--gold)) 10%, #fff);
    font-size: 0.76rem;
    font-weight: 850;
}

.sales-sequence-save-status.is-saving {
    color: #5f470f;
    background: #fff7dc;
}

.sales-sequence-save-status.is-saved {
    color: #0f766e;
    background: #e8fbf7;
}

.sales-sequence-save-status.is-error {
    color: #9f1d1d;
    background: #fff1ef;
}

.sales-sequence-queue-list {
    display: grid;
    gap: 0.75rem;
}

.sales-sequence-queue-row {
    display: grid;
    gap: 0.75rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-left: 4px solid rgba(121, 131, 153, 0.32);
    border-radius: 18px;
    padding: 0.95rem;
    background: rgba(255, 255, 255, 0.74);
}

.sales-sequence-queue-row.is-due {
    border-left-color: var(--gold-deep);
}

.sales-sequence-queue-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: start;
}

.sales-sequence-queue-main strong,
.sales-sequence-context strong,
.sales-sequence-template strong {
    display: block;
    color: var(--ink);
    font-weight: 950;
}

.sales-sequence-queue-main small,
.sales-sequence-context span,
.sales-sequence-template p {
    display: block;
    margin: 0.2rem 0 0;
    color: var(--muted);
    font-weight: 760;
}

.sales-sequence-step-type {
    display: inline-flex;
    margin-bottom: 0.28rem;
    border-radius: 999px;
    padding: 0.18rem 0.48rem;
    color: #365314;
    background: rgba(132, 204, 22, 0.14);
    font-size: 0.68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.sales-sequence-template {
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 14px;
    padding: 0.65rem 0.75rem;
    background: rgba(248, 250, 252, 0.72);
}

.sales-sequence-template summary {
    cursor: pointer;
    color: var(--ink);
    font-weight: 900;
}

.sales-sequence-links a {
    display: inline-flex;
    min-height: 1.8rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    padding: 0 0.65rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    font-size: 0.75rem;
    font-weight: 860;
    text-decoration: none;
}

html[data-theme="dark"] .sales-sequence-stats article,
html[data-theme="dark"] .sales-sequence-step,
html[data-theme="dark"] .sales-sequence-add-step,
html[data-theme="dark"] .sales-sequence-queue-row,
html[data-theme="dark"] .sales-sequence-template,
html[data-theme="dark"] .sales-sequence-links a {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 1100px) {
    .sales-sequence-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .sales-sequence-list-panel {
        position: static;
    }
}

@media (max-width: 760px) {
    .sales-sequence-stats,
    .sales-sequence-form-grid,
    .sales-sequence-step-grid,
    .sales-sequence-add-step,
    .sales-sequence-queue-main {
        grid-template-columns: 1fr;
    }

    .sales-sequence-step {
        grid-template-columns: 1fr;
    }

    .sales-sequence-step-number {
        width: 2rem;
        height: 2rem;
    }

    .sales-sequence-step-actions {
        grid-column: auto;
        justify-content: stretch;
    }

    .sales-sequence-action-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .sales-sequence-step-actions > *,
    .sales-sequence-row-actions > * {
        flex: 1 1 100%;
    }
}

.message-ticket-link {
    display: inline-flex;
    width: fit-content;
    margin-top: 0.45rem;
    border: 1px solid rgba(121, 131, 153, 0.2);
    border-radius: 999px;
    padding: 0.22rem 0.55rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.68);
    font-size: 0.72rem;
    font-weight: 850;
    text-decoration: none;
}

.message-ticket-link:hover {
    color: var(--ink);
    border-color: rgba(217, 159, 54, 0.45);
}

.knowledge-page,
.knowledge-admin-page,
.knowledge-frame-page {
    display: grid;
    gap: 1rem;
}

.knowledge-hero,
.knowledge-frame-head {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.knowledge-hero h1,
.knowledge-frame-head h1 {
    margin: 0.1rem 0 0;
    color: var(--ink);
    letter-spacing: 0;
}

.knowledge-hero p {
    max-width: 44rem;
    margin: 0.5rem 0 0;
    color: var(--muted);
    font-weight: 760;
    line-height: 1.5;
}

.knowledge-search {
    display: flex;
    gap: 0.5rem;
    width: min(28rem, 100%);
}

.knowledge-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.knowledge-tab {
    display: inline-flex;
    min-height: 2.4rem;
    align-items: center;
    gap: 0.45rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 999px;
    padding: 0 0.85rem;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
}

.knowledge-tab span {
    color: var(--ink);
}

.knowledge-tab.is-active {
    color: #5f4512;
    border-color: rgba(217, 159, 54, 0.34);
    background: rgba(217, 159, 54, 0.16);
}

.knowledge-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.knowledge-card-grid.is-frame {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.knowledge-video-menu-list {
    display: grid;
    gap: 0.75rem;
}

.knowledge-video-menu-item {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 14px;
    padding: 0.65rem;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0.65rem 1.4rem rgba(15, 23, 42, 0.06);
}

.knowledge-video-menu-thumb {
    display: grid;
    min-height: 3.7rem;
    place-items: center;
    border-radius: 11px;
    background-position: center;
    background-size: cover;
    text-decoration: none;
}

.knowledge-video-menu-thumb.is-empty {
    color: #8a681d;
    background:
        radial-gradient(circle at 24% 22%, rgba(57, 198, 128, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(217, 159, 54, 0.13), rgba(138, 104, 29, 0.06)),
        rgba(248, 250, 252, 0.94);
}

.knowledge-video-menu-thumb .knowledge-video-trigger-screen {
    width: 2.4rem;
    height: 1.55rem;
}

.knowledge-video-menu-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.knowledge-video-menu-title {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.2;
    text-decoration: none;
}

.knowledge-video-menu-title:hover,
.knowledge-video-menu-title:focus {
    color: #8a681d;
    text-decoration: underline;
}

.knowledge-video-menu-copy p {
    margin: 0;
    color: var(--muted);
    font-size: 0.85rem;
    line-height: 1.42;
}

.knowledge-video-menu-copy small {
    color: #8a681d;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.knowledge-card {
    display: grid;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.knowledge-card-media {
    min-height: 9.5rem;
    background-position: center;
    background-size: cover;
}

.knowledge-card-media.is-empty {
    display: grid;
    place-items: center;
    background:
        linear-gradient(135deg, rgba(217, 159, 54, 0.14), rgba(138, 104, 29, 0.06)),
        rgba(248, 250, 252, 0.9);
}

.knowledge-card-body {
    display: grid;
    gap: 0.6rem;
    padding: 1rem;
}

.knowledge-card-body h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.08rem;
    line-height: 1.2;
    letter-spacing: 0;
}

.knowledge-card-body p,
.knowledge-instructions p {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 760;
    line-height: 1.55;
}

.knowledge-card-actions {
    display: flex;
    justify-content: flex-end;
}

.knowledge-video-modal:target {
    display: grid;
    z-index: 1200;
}

.knowledge-video-card {
    grid-template-rows: auto minmax(0, auto) auto;
    width: min(58rem, 100%);
}

.knowledge-frame-body .knowledge-video-modal:target {
    padding: 0.5rem;
    place-items: stretch;
}

.knowledge-frame-body .knowledge-video-card {
    position: relative;
    align-content: start;
    width: 100%;
    height: 100%;
    max-height: none;
    gap: 0.45rem;
    border-radius: 14px;
    padding: 0.5rem;
    overflow: auto;
}

.knowledge-video-frame,
.knowledge-video-player,
.knowledge-help-frame {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 16px;
    background: #0f172a;
}

.knowledge-video-frame,
.knowledge-video-player {
    aspect-ratio: 16 / 9;
}

.knowledge-frame-body .knowledge-video-frame,
.knowledge-frame-body .knowledge-video-player {
    max-height: calc(100vh - 7rem);
    border-radius: 12px;
}

.knowledge-video-placeholder {
    display: grid;
    min-height: 16rem;
    place-items: center;
    border-radius: 16px;
    color: var(--muted);
    background: rgba(121, 131, 153, 0.1);
    font-weight: 850;
}

.knowledge-instructions {
    display: grid;
    gap: 0.8rem;
}

.knowledge-help-card {
    grid-template-rows: minmax(0, 1fr);
    width: min(76rem, calc(100vw - 2rem));
    height: min(52rem, calc(100vh - 2rem));
    max-height: calc(100vh - 2rem);
    gap: 0.55rem;
    padding: 0.75rem;
    overflow: hidden;
}

.knowledge-help-card .cms-editor-bar,
.knowledge-video-card .cms-editor-bar {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
    gap: 0.55rem;
    align-items: center;
}

.knowledge-help-card .cms-editor-bar {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    left: 0.75rem;
    z-index: 3;
    pointer-events: none;
}

.knowledge-help-card .cms-editor-bar strong {
    display: none;
}

.knowledge-help-card .cms-editor-bar > * {
    pointer-events: auto;
}

.knowledge-help-card .cms-editor-bar .button-soft.compact {
    justify-self: end;
    min-height: 2.05rem;
    padding: 0.25rem 0.75rem;
    background: rgba(255, 255, 255, 0.86);
}

.knowledge-help-card .cms-editor-back,
.knowledge-video-card .cms-editor-back {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    color: #fff;
    background: var(--banner-gold-gradient);
    box-shadow: 0 0.8rem 1.8rem rgba(43, 33, 14, 0.22), 0 0 0 1px rgba(43, 33, 14, 0.12);
    opacity: 1;
    text-decoration: none;
}

.knowledge-help-card .cms-editor-back:hover,
.knowledge-help-card .cms-editor-back:focus,
.knowledge-video-card .cms-editor-back:hover,
.knowledge-video-card .cms-editor-back:focus {
    color: #fff;
    background: linear-gradient(135deg, #6f5012, #15110a);
    box-shadow: 0 1rem 2.2rem rgba(43, 33, 14, 0.32), 0 0 0 3px rgba(217, 159, 54, 0.2);
    transform: translateY(-1px);
}

.knowledge-frame-body .knowledge-video-card .cms-editor-bar {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
    z-index: 2;
    width: auto;
    min-height: 0;
}

.knowledge-frame-body .knowledge-video-card .cms-editor-bar strong {
    display: none;
}

.knowledge-frame-body .knowledge-video-card .cms-editor-bar > span {
    display: none;
}

.knowledge-help-frame {
    grid-row: 1 / -1;
    align-self: stretch;
    min-height: 0;
    height: 100%;
    flex: 1 1 auto;
    background: rgba(248, 250, 252, 0.96);
}

.knowledge-frame-body {
    min-height: 100vh;
    margin: 0;
    background: var(--background);
}

.knowledge-frame-page {
    min-height: 100vh;
    padding: 0.65rem;
}

.knowledge-frame-body .knowledge-frame-page {
    display: block;
    min-height: 0;
    padding: 0.35rem;
}

.knowledge-frame-body .knowledge-frame-head {
    display: none;
}

.knowledge-admin-layout {
    display: grid;
    grid-template-columns: minmax(16rem, 0.32fr) minmax(0, 1fr);
    gap: 1rem;
}

.knowledge-admin-list,
.knowledge-admin-editor {
    display: grid;
    align-content: start;
    gap: 0.75rem;
}

.knowledge-admin-row {
    display: grid;
    gap: 0.35rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 16px;
    padding: 0.85rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.72);
    text-decoration: none;
}

.knowledge-admin-row.is-selected {
    border-color: rgba(217, 159, 54, 0.38);
    box-shadow: 0 14px 34px rgba(217, 159, 54, 0.16);
}

.knowledge-admin-row small {
    color: var(--muted);
    font-weight: 800;
}

.knowledge-admin-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.knowledge-admin-grid .is-wide {
    grid-column: 1 / -1;
}

.knowledge-instruction-input {
    min-height: 15rem;
}

.action-icon.is-help::before {
    content: "?";
    display: grid;
    width: 1.15rem;
    height: 1.15rem;
    place-items: center;
    border: 2px solid currentColor;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 950;
    line-height: 1;
}

html[data-theme="dark"] .knowledge-card,
html[data-theme="dark"] .knowledge-admin-row,
html[data-theme="dark"] .knowledge-tab {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 1180px) {
    .knowledge-card-grid,
    .knowledge-card-grid.is-frame {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

@media (max-width: 720px) {
    .knowledge-search,
    .knowledge-search > *,
    .knowledge-card-actions > *,
    .knowledge-frame-head > * {
        width: 100%;
    }

    .knowledge-card-grid,
    .knowledge-card-grid.is-frame,
    .knowledge-admin-grid {
        grid-template-columns: 1fr;
    }

    .knowledge-help-card {
        width: calc(100vw - 1rem);
        height: calc(100vh - 1rem);
        max-height: calc(100vh - 1rem);
        border-radius: 18px;
    }
}

.hygiene-page {
    display: grid;
    gap: 1rem;
}

.hygiene-stats {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.75rem;
}

.hygiene-stats article {
    display: grid;
    gap: 0.18rem;
    min-height: 7rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 18px;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 252, 0.72));
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.hygiene-stats span,
.hygiene-stats small,
.hygiene-guide li,
.hygiene-match-head p,
.hygiene-contact-card dt,
.hygiene-contact-card dd {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.42;
}

.hygiene-stats strong {
    color: var(--ink);
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 950;
    line-height: 1;
}

.hygiene-guide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.42fr);
    gap: 1rem;
    align-items: start;
    border-color: rgba(217, 159, 54, 0.22);
    background:
        linear-gradient(90deg, rgba(217, 159, 54, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(255, 255, 255, 0.74);
}

.hygiene-guide h2 {
    margin: 0.16rem 0 0;
    color: var(--ink);
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    letter-spacing: 0;
}

.hygiene-guide p {
    max-width: 48rem;
    margin: 0.4rem 0 0;
    color: var(--muted);
    font-weight: 760;
    line-height: 1.5;
}

.hygiene-guide ol {
    display: grid;
    gap: 0.44rem;
    margin: 0;
    padding-left: 1.2rem;
}

.hygiene-guide li {
    padding-left: 0.2rem;
}

.hygiene-review-section,
.hygiene-match-list {
    display: grid;
    gap: 0.85rem;
}

.hygiene-cleanup-section {
    display: grid;
    gap: 0.85rem;
}

.hygiene-cleanup-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.hygiene-cleanup-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 18px;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.05);
}

.hygiene-cleanup-item span {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hygiene-cleanup-item h3 {
    margin: 0.2rem 0 0;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 0;
}

.hygiene-cleanup-item p {
    margin: 0.3rem 0 0;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.4;
}

.hygiene-cleanup-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.48rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.hygiene-cleanup-meta strong,
.hygiene-cleanup-meta small {
    min-width: 0;
    overflow-wrap: anywhere;
    font: inherit;
}

.hygiene-match-card {
    display: grid;
    gap: 0.9rem;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 20px;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.hygiene-match-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: start;
}

.hygiene-match-head h2 {
    margin: 0.42rem 0 0;
    color: var(--ink);
    font-size: 1.15rem;
    line-height: 1.15;
    letter-spacing: 0;
}

.hygiene-match-head p {
    margin: 0.32rem 0 0;
}

.hygiene-match-head > strong {
    display: grid;
    width: 3.4rem;
    height: 3.4rem;
    place-items: center;
    border-radius: 999px;
    color: #5f4512;
    background: rgba(217, 159, 54, 0.18);
    font-size: 1.02rem;
    font-weight: 950;
}

.hygiene-record-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.hygiene-contact-card {
    display: grid;
    gap: 0.68rem;
    min-width: 0;
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 18px;
    padding: 0.9rem;
    background: rgba(248, 250, 252, 0.72);
}

.hygiene-contact-card.is-recommended {
    border-color: rgba(47, 125, 80, 0.26);
    background:
        linear-gradient(90deg, rgba(47, 125, 80, 0.12) 0 0.22rem, transparent 0.22rem),
        rgba(240, 253, 244, 0.62);
}

.hygiene-contact-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
}

.hygiene-contact-title span {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hygiene-contact-title a {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    padding: 0 0.58rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.7);
    font-size: 0.72rem;
    font-weight: 900;
    text-decoration: none;
}

.hygiene-contact-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 0;
}

.hygiene-contact-card dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    margin: 0;
}

.hygiene-contact-card dl div {
    min-width: 0;
    border: 1px solid rgba(121, 131, 153, 0.12);
    border-radius: 12px;
    padding: 0.52rem;
    background: rgba(255, 255, 255, 0.66);
}

.hygiene-contact-card dt {
    margin: 0 0 0.12rem;
    text-transform: uppercase;
}

.hygiene-contact-card dd {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--ink);
    font-weight: 900;
}

.hygiene-match-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

html[data-theme="dark"] .hygiene-stats article,
html[data-theme="dark"] .hygiene-guide,
html[data-theme="dark"] .hygiene-cleanup-item,
html[data-theme="dark"] .hygiene-match-card,
html[data-theme="dark"] .hygiene-contact-card,
html[data-theme="dark"] .hygiene-contact-card dl div,
html[data-theme="dark"] .hygiene-contact-title a {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 1180px) {
    .hygiene-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

@media (max-width: 820px) {
    .hygiene-stats,
    .hygiene-guide,
    .hygiene-cleanup-list,
    .hygiene-cleanup-item,
    .hygiene-record-grid,
    .hygiene-contact-card dl {
        grid-template-columns: 1fr;
    }

    .hygiene-match-head {
        grid-template-columns: 1fr;
    }

    .hygiene-match-head > strong {
        width: auto;
        height: auto;
        min-height: 2.3rem;
        padding: 0 0.8rem;
    }

    .hygiene-match-actions,
    .hygiene-match-actions > * {
        width: 100%;
    }
}

.helpdesk-page {
    display: grid;
    gap: 1rem;
}

.helpdesk-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.helpdesk-stats article {
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 18px;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 252, 0.72));
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.helpdesk-stats span,
.helpdesk-stats small {
    display: block;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
}

.helpdesk-stats strong {
    display: block;
    margin: 0.12rem 0;
    color: var(--ink);
    font-size: 1.75rem;
    font-weight: 950;
}

.helpdesk-layout {
    display: grid;
    grid-template-columns: minmax(17rem, 0.34fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.helpdesk-list-panel,
.helpdesk-detail,
.helpdesk-updates,
.helpdesk-tasks,
.helpdesk-watchers,
.helpdesk-sources {
    display: grid;
    gap: 0.85rem;
}

.helpdesk-list-panel {
    position: sticky;
    top: 6rem;
}

.helpdesk-filters {
    display: grid;
    gap: 0.55rem;
}

.helpdesk-ticket-card {
    display: grid;
    gap: 0.3rem;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 16px;
    padding: 0.85rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    text-decoration: none;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.helpdesk-ticket-card:hover,
.helpdesk-ticket-card.is-selected {
    border-color: rgba(217, 159, 54, 0.52);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.helpdesk-ticket-top,
.helpdesk-detail-subline,
.helpdesk-related-links,
.helpdesk-task-new,
.helpdesk-watcher-new {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.helpdesk-ticket-card b {
    color: var(--ink);
    font-weight: 950;
    line-height: 1.2;
}

.helpdesk-ticket-card small,
.helpdesk-ticket-meta {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 820;
}

.ticket-priority,
.ticket-status {
    display: inline-flex;
    min-height: 1.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 0.55rem;
    color: #644818;
    background: rgba(249, 194, 88, 0.18);
    font-size: 0.7rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}

.ticket-priority.is-urgent,
.ticket-status.is-escalated {
    color: #9f1f17;
    background: rgba(180, 35, 24, 0.12);
}

.ticket-priority.is-high {
    color: #9a3412;
    background: rgba(251, 146, 60, 0.16);
}

.ticket-priority.is-low,
.ticket-status.is-resolved,
.ticket-status.is-closed {
    color: #276749;
    background: rgba(47, 125, 80, 0.14);
}

.helpdesk-main {
    min-width: 0;
}

.helpdesk-detail-head {
    margin-bottom: 0;
}

.helpdesk-related-links a {
    display: inline-flex;
    min-height: 1.85rem;
    align-items: center;
    border: 1px solid rgba(121, 131, 153, 0.18);
    border-radius: 999px;
    padding: 0 0.65rem;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.74);
    font-size: 0.75rem;
    font-weight: 860;
    text-decoration: none;
}

.helpdesk-editor-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.helpdesk-field {
    display: grid;
    gap: 0.34rem;
    min-width: 0;
}

.helpdesk-field span {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.helpdesk-field.is-wide {
    grid-column: 1 / -1;
}

.helpdesk-sources {
    border-top: 1px solid rgba(121, 131, 153, 0.16);
    padding-top: 1rem;
}

.helpdesk-sources article,
.helpdesk-timeline article,
.helpdesk-task-list article,
.helpdesk-watch-list span {
    border: 1px solid rgba(121, 131, 153, 0.16);
    border-radius: 16px;
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.7);
}

.helpdesk-sources article strong,
.helpdesk-timeline article span,
.helpdesk-task-list strong,
.helpdesk-watch-list strong {
    display: block;
    color: var(--ink);
    font-weight: 950;
}

.helpdesk-sources article p,
.helpdesk-timeline article p,
.helpdesk-task-list span {
    margin: 0.25rem 0 0;
    color: var(--muted);
    font-weight: 760;
}

.helpdesk-work-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.34fr);
    gap: 1rem;
    align-items: start;
}

.helpdesk-side-stack,
.helpdesk-timeline,
.helpdesk-task-list,
.helpdesk-watch-list {
    display: grid;
    gap: 0.65rem;
}

.helpdesk-update-composer {
    display: grid;
    grid-template-columns: minmax(8rem, 0.2fr) minmax(10rem, 0.28fr) minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: start;
}

.helpdesk-task-new {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 0.36fr) auto auto;
    align-items: start;
}

.helpdesk-task-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
}

.helpdesk-task-list article.is-done {
    opacity: 0.68;
}

.helpdesk-task-list article.is-done strong {
    text-decoration: line-through;
}

.helpdesk-watcher-new {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
}

.helpdesk-watch-list span {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
}

html[data-theme="dark"] .message-ticket-link,
html[data-theme="dark"] .helpdesk-stats article,
html[data-theme="dark"] .helpdesk-ticket-card,
html[data-theme="dark"] .helpdesk-related-links a,
html[data-theme="dark"] .helpdesk-sources article,
html[data-theme="dark"] .helpdesk-timeline article,
html[data-theme="dark"] .helpdesk-task-list article,
html[data-theme="dark"] .helpdesk-watch-list span {
    border-color: rgba(212, 189, 132, 0.14);
    background: rgba(20, 29, 42, 0.64);
}

@media (max-width: 1120px) {
    .helpdesk-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .helpdesk-layout,
    .helpdesk-work-grid {
        grid-template-columns: 1fr;
    }

    .helpdesk-list-panel {
        position: static;
    }
}

@media (max-width: 760px) {
    .quick-scheduler-hero,
    .quick-scheduler-grid {
        grid-template-columns: 1fr;
    }

    .quick-scheduler-hero {
        display: grid;
    }

    .quick-scheduler-hero .button-secondary {
        width: 100%;
        justify-content: center;
    }

    .batch-scheduler-topline,
    .batch-scheduler-footer,
    .batch-scheduler-row,
    .batch-settings-panel,
    .batch-row-timing {
        grid-template-columns: 1fr;
    }

    .batch-scheduler-topline,
    .batch-scheduler-footer {
        display: grid;
        border-radius: 8px;
    }

    .helpdesk-stats,
    .helpdesk-editor-grid,
    .helpdesk-update-composer,
    .helpdesk-task-new,
    .helpdesk-watcher-new {
        grid-template-columns: 1fr;
    }

    .helpdesk-task-list article,
    .helpdesk-watch-list span {
        grid-template-columns: 1fr;
    }
}

/* Hub-card treatment carried into admin list surfaces. */
@keyframes adminHubCardIn {
    from {
        opacity: 0;
        transform: translateY(14px) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.chatflow-tile-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
    gap: 1rem;
}

.chatflow-tile,
.cta-library-tile,
.integration-card {
    --admin-card-a: #8a681d;
    --admin-card-b: #21180b;
    --admin-card-text-shadow: 0 0.35rem 1.25rem rgba(0, 0, 0, 0.48);
    min-height: 14.5rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px;
    color: #fff;
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.25), transparent 10rem),
        linear-gradient(135deg, var(--admin-card-a), var(--admin-card-b));
    box-shadow: 0 1.45rem 4rem rgba(25, 20, 12, 0.18);
    animation: adminHubCardIn 560ms cubic-bezier(0.2, 0.78, 0.2, 1) both;
}

.chatflow-tile:nth-child(2),
.cta-library-tile:nth-child(2),
.integration-card:nth-child(2) {
    animation-delay: 55ms;
}

.chatflow-tile:nth-child(3),
.cta-library-tile:nth-child(3),
.integration-card:nth-child(3) {
    animation-delay: 110ms;
}

.chatflow-tile:nth-child(4),
.cta-library-tile:nth-child(4),
.integration-card:nth-child(4) {
    animation-delay: 165ms;
}

.chatflow-tile:nth-child(5),
.cta-library-tile:nth-child(5),
.integration-card:nth-child(5) {
    animation-delay: 220ms;
}

.chatflow-tile:nth-child(6),
.cta-library-tile:nth-child(6),
.integration-card:nth-child(6) {
    animation-delay: 275ms;
}

.chatflow-tile:nth-child(6n + 1),
.cta-library-tile:nth-child(6n + 1),
.integration-overview-card:nth-child(1) {
    --admin-card-a: #9a7727;
    --admin-card-b: #21180b;
}

.chatflow-tile:nth-child(6n + 2),
.cta-library-tile:nth-child(6n + 2),
.integration-overview-card:nth-child(2) {
    --admin-card-a: #0f766e;
    --admin-card-b: #083f3d;
}

.chatflow-tile:nth-child(6n + 3),
.cta-library-tile:nth-child(6n + 3),
.integration-overview-card:nth-child(3) {
    --admin-card-a: #a9465b;
    --admin-card-b: #4b1d27;
}

.chatflow-tile:nth-child(6n + 4),
.cta-library-tile:nth-child(6n + 4) {
    --admin-card-a: #3658a8;
    --admin-card-b: #161c4a;
}

.chatflow-tile:nth-child(6n + 5),
.cta-library-tile:nth-child(6n + 5) {
    --admin-card-a: #2f7d50;
    --admin-card-b: #123821;
}

.chatflow-tile:nth-child(6n + 6),
.cta-library-tile:nth-child(6n + 6) {
    --admin-card-a: #794c8b;
    --admin-card-b: #2c1737;
}

.cta-library-tile {
    --admin-card-a: var(--cta-color, #8a681d);
    --admin-card-b: color-mix(in srgb, var(--cta-color, #8a681d) 52%, #050505 48%);
    border-left-width: 1px;
}

.integration-card {
    --admin-card-a: color-mix(in srgb, var(--integration-color, #8a681d) 88%, #ffffff 12%);
    --admin-card-b: color-mix(in srgb, var(--integration-color, #8a681d) 48%, #050505 52%);
}

.integration-card:before,
.cta-library-tile:after {
    display: none;
}

.chatflow-tile:hover,
.chatflow-tile:focus-visible,
.cta-library-tile:hover,
.cta-library-tile:focus-visible,
.cta-library-tile.is-selected,
.integration-card:hover,
.integration-card:focus-within,
.integration-overview-card:hover,
.integration-overview-card:focus-within {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 1.9rem 5.2rem rgba(25, 20, 12, 0.26);
    filter: saturate(1.04);
}

.chatflow-tile-top strong,
.chatflow-tile-title small,
.chatflow-tile-meta,
.chatflow-tile-mode,
.chatflow-tile p,
.cta-library-tile .cta-tile-title strong,
.cta-library-tile .cta-tile-title small,
.cta-library-tile .cta-type-label,
.cta-library-tile p,
.integration-card h2,
.integration-card p,
.integration-card label,
.integration-card .module-eyebrow,
.integration-use-row span,
.integration-use-row strong {
    color: #fff;
    text-shadow: var(--admin-card-text-shadow);
}

.chatflow-tile-title small,
.chatflow-tile-meta,
.chatflow-tile-mode,
.chatflow-tile p,
.cta-library-tile .cta-tile-title small,
.cta-library-tile .cta-type-label,
.cta-library-tile p,
.integration-card p,
.integration-use-row span {
    color: rgba(255, 255, 255, 0.86);
}

.chatflow-tile .chatflow-tile-icon,
.cta-library-tile .cta-type-icon {
    border-color: rgba(255, 255, 255, 0.24);
    background: rgba(17, 19, 24, 0.2);
    box-shadow: none;
    backdrop-filter: blur(12px);
}

.chatflow-tile .commerce-status-pill,
.cta-library-tile .commerce-status-pill,
.integration-card .integration-status,
.cta-library-tile .cta-click-count {
    border: 1px solid rgba(255, 255, 255, 0.24);
    color: #fff;
    background: rgba(17, 19, 24, 0.22);
    box-shadow: none;
    text-shadow: var(--admin-card-text-shadow);
}

.cta-library-tile .cta-click-count b,
.cta-library-tile .cta-click-count small {
    color: #fff;
}

.integration-use-row,
.payment-status-stack {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.integration-card .button-secondary,
.integration-card .integration-disabled-action,
.chatflow-tile em,
.cta-library-tile em {
    border-color: rgba(255, 255, 255, 0.2);
    color: #21180b;
    background: rgba(255, 255, 255, 0.92);
    text-shadow: none;
}

.integration-card .button-primary {
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    background: rgba(17, 19, 24, 0.34);
    text-shadow: var(--admin-card-text-shadow);
}

.integration-card .input-control {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.94);
}

.email-responder-tile .chatflow-tile-top {
    grid-template-columns: minmax(0, 1fr) auto;
}

.email-responder-layout {
    grid-template-columns: minmax(16rem, 0.38fr) minmax(0, 1fr);
}

@media (prefers-reduced-motion: reduce) {
    .chatflow-tile,
    .cta-library-tile,
    .integration-card,
    .integration-overview-card {
        animation: none;
    }
}

.integration-overview-strip .integration-overview-card {
    min-height: 0;
    border: 1px solid rgba(18, 21, 33, 0.08);
    border-radius: 8px;
    color: #141820;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--soft-shadow);
    animation: none;
    filter: none;
}

.integration-overview-strip .integration-overview-card.is-live {
    border-color: rgba(138, 104, 29, 0.18);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(138, 104, 29, 0.1));
}

.integration-overview-strip .integration-overview-card.is-review {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(48, 55, 70, 0.08));
}

.integration-overview-strip .integration-overview-card h2 {
    color: #141820;
    text-shadow: none;
}

.integration-overview-strip .integration-overview-card p {
    color: rgba(20, 24, 32, 0.72);
    text-shadow: none;
}

.integration-overview-strip .integration-overview-card .integration-status {
    color: #3d2c0a;
    background: rgba(255, 255, 255, 0.82);
    border-color: rgba(138, 104, 29, 0.18);
    text-shadow: none;
}

.integration-overview-strip .integration-overview-card .integration-status.is-live,
.integration-overview-strip .integration-overview-card .integration-status.is-ready {
    color: #1b5a35;
}

.integration-overview-strip .integration-overview-card .button-secondary {
    color: #21180b;
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(138, 104, 29, 0.18);
}

.integration-overview-strip .integration-overview-card .button-primary {
    color: #ffffff;
}