:root {
    /* Neutrals tuned for LeadSense coral + navy */
    --bg: #f3f5f8;
    --bg-wash-start: #e8eef5;
    --bg-wash-mid: #f6eef0;
    --bg-wash-end: #f2f0eb;
    --panel: #ffffff;
    --text: #0f1729;
    --muted: #64748b;
    --line: #d8dee8;

    /* LeadSense primary: #E9555C — CTAs, selected chrome, brand accents */
    --accent: #e9555c;
    --accent-hover: #d6454c;
    --accent-ink: #b4232c;
    --accent-soft: #fef1f2;
    --accent-ring: color-mix(in srgb, var(--accent) 30%, white);

    /* LeadSense link: #0F4E80 — links, people chips, secondary emphasis */
    --link: #0f4e80;
    --link-hover: #0c3d66;
    --link-soft: #e8f1f8;
    --link-ring: color-mix(in srgb, var(--link) 28%, white);

    --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.05);
    --font-sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
    --font-display: "Space Grotesk", "Source Sans 3", system-ui, sans-serif;

    /* Semantic status (unchanged roles) */
    --pass: #166534;
    --pass-bg: #dcfce7;
    --warn: #92400e;
    --warn-bg: #fef3c7;
    --edited: #c2410c;
    --edited-bg: #ffedd5;
    --fail: #991b1b;
    --fail-bg: #fee2e2;
    --review: #5b21b6;
    --review-bg: #ede9fe;
}

html {
    color-scheme: light;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--font-sans);
    color: var(--text);
    color-scheme: light;
    background-color: var(--bg);
    background-image:
        linear-gradient(165deg, var(--bg-wash-start) 0%, var(--bg-wash-mid) 48%, var(--bg-wash-end) 100%),
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: auto, 28px 28px, 28px 28px;
    background-attachment: fixed;
    min-height: 100vh;
}

a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; color: var(--link-hover); }

.topbar {
    background: color-mix(in srgb, var(--panel) 94%, var(--link-soft));
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(10px);
    padding: 12px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    position: sticky;
    top: 0;
    z-index: 40;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--link);
}
.brand:hover { text-decoration: none; color: var(--link-hover); }
.brand-logo {
    display: block;
    height: 28px;
    width: auto;
    flex-shrink: 0;
}
.brand-product {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--text);
    letter-spacing: -0.02em;
    white-space: nowrap;
}
.brand-sep {
    color: color-mix(in srgb, var(--muted) 70%, var(--line));
    font-weight: 400;
}
.brand:hover .brand-product { color: var(--text); }
.brand-mark {
    display: block;
    border-radius: 8px;
    flex-shrink: 0;
}
.nav { display: flex; gap: 6px; align-items: center; flex-wrap: nowrap; }
.nav a {
    color: var(--text);
    padding: 7px 11px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}
.nav a:hover { background: color-mix(in srgb, var(--accent-soft) 70%, white); text-decoration: none; }
.nav a.is-current {
    background: var(--accent-soft);
    color: var(--accent-ink);
    font-weight: 600;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}
.nav a.btn.secondary {
    padding: 8px 14px;
    font-weight: 600;
}
.nav a.btn.secondary:hover { background: #fff; }
.nav .who { color: var(--muted); font-size: 13px; padding: 0 8px; white-space: nowrap; text-decoration: none; }
.nav a.who:hover { color: var(--text); text-decoration: underline; }
.profile-fields {
    display: grid;
    gap: 12px;
    margin: 0;
}
.profile-fields dt {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 2px;
}
.profile-fields dd {
    margin: 0;
    font-size: 15px;
}
.profile-password-form label {
    display: block;
    margin-top: 10px;
}
.profile-password-form input[type="password"] {
    width: 100%;
    max-width: 24rem;
}
.nav form { margin: 0; flex-shrink: 0; }

.nav-group {
    position: relative;
}
.nav-group > summary {
    list-style: none;
    cursor: pointer;
    user-select: none;
    color: var(--text);
    padding: 7px 11px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > summary::after {
    content: "";
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid color-mix(in srgb, var(--muted) 80%, var(--text));
    margin-top: 1px;
}
.nav-group > summary:hover {
    background: color-mix(in srgb, var(--accent-soft) 70%, white);
}
.nav-group > summary.is-current,
.nav-group[open] > summary {
    background: var(--accent-soft);
    color: var(--accent-ink);
    font-weight: 600;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}
.nav-group[open] > summary:not(.is-current) {
    background: color-mix(in srgb, var(--accent-soft) 55%, white);
    color: var(--text);
    font-weight: 500;
    box-shadow: none;
}
.nav-group-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 200px;
    padding: 6px;
    background: var(--panel, #fff);
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: 0 10px 28px color-mix(in srgb, var(--text) 10%, transparent);
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.nav-group--end .nav-group-menu {
    left: auto;
    right: 0;
}
.nav-group-menu a {
    display: block;
    padding: 8px 12px;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 500;
}
.nav-group-menu a.is-current {
    background: var(--accent-soft);
    color: var(--accent-ink);
    font-weight: 600;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}

@media (max-width: 720px) {
    .nav { flex-wrap: wrap; justify-content: flex-end; }
}

.nav-notify {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    padding: 7px 10px;
}
.nav-notify-icon { display: block; }
.nav-notify-badge {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--brand-coral, #E9555C);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
}

.notifications-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.notifications-header h1 { margin-bottom: 0; }
.notification-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
}
.notification-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.notification-item + .notification-item {
    border-top: 1px solid color-mix(in srgb, var(--border, #d8dee8) 80%, transparent);
}
.notification-item.is-unread {
    background: color-mix(in srgb, var(--accent-soft) 55%, white);
    box-shadow: inset 3px 0 0 var(--accent, #c41e3a);
}
.notification-item.is-read .notification-title {
    font-weight: 550;
    color: color-mix(in srgb, var(--text) 78%, transparent);
}
.notification-item.is-read .notification-body {
    color: color-mix(in srgb, var(--text) 70%, transparent);
}
.notification-item.is-pinned {
    background: color-mix(in srgb, var(--accent-soft) 22%, white);
}
.notification-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: start;
    padding: 4px 0;
}
.notification-open { min-width: 0; }
.notification-link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
    padding: 12px 8px;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
}
.notification-link:hover { background: color-mix(in srgb, var(--accent-soft) 40%, white); }
.notification-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
}
.notification-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--accent, #c41e3a);
    color: #fff;
}
.notification-badge.muted-badge {
    background: color-mix(in srgb, var(--line, #d8dee8) 70%, #111);
    color: var(--text);
}
.notification-context {
    font-size: 12px;
    color: var(--muted, #667085);
}
.notification-title { font-weight: 650; }
.notification-body { font-size: 14px; color: var(--text); }
.notification-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 12px;
    margin-top: 2px;
}
.notification-cta {
    font-weight: 600;
    color: var(--accent-ink, var(--accent, #c41e3a));
}
.notification-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 10px 8px 10px 0;
    justify-content: flex-end;
}
.notification-action {
    font-size: 12px;
    padding: 4px 8px;
    min-height: 0;
}
.notification-action.is-active {
    background: color-mix(in srgb, var(--accent-soft) 70%, white);
    color: var(--accent-ink, var(--accent, #c41e3a));
}
@media (max-width: 640px) {
    .notification-card {
        grid-template-columns: 1fr;
    }
    .notification-actions {
        padding: 0 8px 10px;
        justify-content: flex-start;
    }
}

.wrap {
    max-width: 98%;
    margin: 0 auto;
    padding: 28px 20px 48px;
}
.wrap.narrow { max-width: 980px; }
.wrap.wrap-wide { max-width: 1480px; }
.wrap.wrap-landing {
    max-width: 1120px;
    padding-top: 12px;
}

h1 {
    margin: 0 0 8px;
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 2.2vw, 2.05rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: var(--text);
}
h2 {
    margin: 0 0 12px;
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}
.lede {
    color: var(--muted);
    margin: 0 0 28px;
    max-width: 52rem;
    font-size: 1.02rem;
    line-height: 1.5;
}
.form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px 16px;
    margin-bottom: 12px;
}

.card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 22px 22px 20px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-card);
}

.auth-card { max-width: 420px; margin: 40px auto; }

.demo-accounts {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.demo-accounts-title {
    margin: 0 0 2px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--muted);
}
.demo-accounts-hint {
    margin: 0 0 10px;
    font-size: 13px;
}
.demo-accounts-hint code {
    font-size: 12px;
    padding: 1px 5px;
    border-radius: 4px;
    background: #f1f5f9;
    color: var(--text);
}
.demo-accounts-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 4px;
}
.demo-account {
    appearance: none;
    width: 100%;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    color: var(--text);
}
.demo-account:hover {
    background: #f8fafc;
    border-color: var(--line);
}
.demo-account:focus-visible {
    outline: 2px solid var(--link-ring);
    outline-offset: 1px;
}
.demo-account-role {
    font-size: 13px;
    font-weight: 600;
    flex: 0 1 auto;
}
.demo-account-email {
    font-size: 12px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

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

/* —— Settings-style form: section title/description on the left, fields on the right —— */
.form-card {
    --form-cols: minmax(200px, 240px) minmax(0, 600px);
    --form-gap: 40px;
    --form-pad-x: 28px;
    padding: 0;
    overflow: hidden;
}
.form-card-head {
    padding: 22px var(--form-pad-x) 20px;
    border-bottom: 1px solid var(--line);
}
.form-card-head h2 {
    margin: 0 0 4px;
    font-size: 1.3rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--text);
}
.form-card-head .help {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}
.form-section {
    display: grid;
    grid-template-columns: var(--form-cols);
    column-gap: var(--form-gap);
    padding: 28px var(--form-pad-x) 30px;
    border-bottom: 1px solid var(--line);
}
.form-section:last-of-type {
    border-bottom: 0;
}
.form-section-head {
    min-width: 0;
}
.form-section-head h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px;
    font-size: 1.08rem;
    font-weight: 650;
    letter-spacing: -0.015em;
    color: var(--text);
}
.form-section-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--accent-soft);
    color: var(--accent-ink);
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 24%, transparent);
}
.form-section-head p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.55;
}
.form-section-body {
    min-width: 0;
}
.form-section-body label {
    margin: 0 0 7px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--text);
}
.form-section-body select,
.form-section-body input[type=text],
.form-section-body input[type=number] {
    padding: 11px 12px;
    font-size: 15px;
    border-radius: 10px;
}
.input-with-prefix {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}
.input-with-prefix:focus-within {
    border-color: color-mix(in srgb, var(--link) 45%, var(--line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--link-soft) 70%, transparent);
}
.input-with-prefix .input-prefix {
    display: flex;
    align-items: center;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--muted);
    background: color-mix(in srgb, var(--bg-wash-start) 40%, white);
    border-right: 1px solid var(--line);
}
.input-with-prefix input {
    flex: 1;
    margin: 0;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    min-width: 0;
}
.form-section-body .searchable-picker {
    margin: 0;
}
.field + .field,
.field-row + .field,
.field + .field-row,
.field-row + .field-row {
    margin-top: 20px;
}
.field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.field-row > .field + .field {
    margin-top: 0;
}
.field .help {
    margin: 7px 0 0;
    font-size: 13px;
    line-height: 1.45;
}
.field .muted {
    margin: 7px 0 0;
    font-size: 13px;
}
.name-preview {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    background: linear-gradient(90deg, var(--link-soft), color-mix(in srgb, var(--accent-soft) 55%, white));
    border: 1px solid color-mix(in srgb, var(--link) 12%, var(--line));
}
.name-preview span {
    flex: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--muted);
}
.name-preview code {
    font-size: 13px;
    color: var(--text);
    word-break: break-word;
}
.field-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-wash-start) 30%, white);
}
.field-toggle label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    cursor: pointer;
}
.field-toggle input {
    width: 16px;
    height: 16px;
    accent-color: var(--accent);
    margin: 0;
}
.field-toggle .help {
    margin: 0;
    text-align: right;
}
.form-actions {
    display: grid;
    grid-template-columns: var(--form-cols);
    column-gap: var(--form-gap);
    padding: 20px var(--form-pad-x) 24px;
    border-top: 1px solid var(--line);
}
.form-actions > * {
    grid-column: 2;
    justify-self: start;
}
.form-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.form-actions .btn {
    padding: 11px 20px;
    font-size: 15px;
    background: var(--accent);
    color: #fff;
    box-shadow: 0 1px 2px color-mix(in srgb, var(--accent) 35%, transparent);
}
.form-actions .btn:hover {
    background: var(--accent-hover);
    color: #fff;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 32%, transparent);
}
.form-actions .btn.secondary {
    background: #fff;
    color: var(--text);
    border: 1px solid var(--line);
    box-shadow: none;
}
.form-actions .btn.secondary:hover {
    background: #fff;
    color: var(--text);
    border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.form-actions .btn:disabled,
.form-actions .btn[disabled] {
    background: #94a3b8;
    box-shadow: none;
    cursor: not-allowed;
}
@media (max-width: 860px) {
    .form-card {
        --form-pad-x: 18px;
    }
    .form-section {
        grid-template-columns: 1fr;
        row-gap: 14px;
        padding: 20px var(--form-pad-x) 22px;
    }
    .form-section-head h2 { margin-bottom: 2px; }
    .field-row { grid-template-columns: 1fr; }
    .form-actions { grid-template-columns: 1fr; padding: 16px var(--form-pad-x) 18px; }
    .form-actions > * { grid-column: 1; }
    .name-preview { flex-direction: column; gap: 4px; }
}

.split {
    display: grid;
    grid-template-columns: minmax(240px, 0.9fr) minmax(320px, 1.1fr);
    gap: 16px;
    align-items: start;
}

.review-workspace {
    grid-template-columns: minmax(320px, 0.95fr) minmax(340px, 1.15fr);
}
.review-approve-case-card {
    margin-top: 12px;
}
.btn.review-approve-case {
    display: block;
    width: 100%;
    padding: 16px 20px;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-align: center;
}

.preview-column {
    position: sticky;
    top: 16px;
}

@media (max-width: 860px) {
    .split { grid-template-columns: 1fr; }
    .preview-column { position: static; }
}

label { display: block; font-weight: 600; margin: 12px 0 6px; color: color-mix(in srgb, var(--text) 88%, var(--muted)); letter-spacing: 0.01em; }

input[type=text],
input[type=email],
input[type=password],
input[type=url],
input[type=search],
input[type=file],
textarea,
select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font: inherit;
    background: #fff !important;
    color: var(--text) !important;
    color-scheme: light;
}

textarea { min-height: 140px; }
.help { color: var(--muted); font-size: 13px; font-weight: 400; margin: 0 0 8px; }

.btn {
    display: inline-block;
    border: 0;
    border-radius: 9px;
    padding: 10px 16px;
    background: var(--accent);
    color: #fff;
    font-family: var(--font-sans);
    font-weight: 600;
    cursor: pointer;
    transition: background .15s ease, box-shadow .15s ease, transform .12s ease;
}
.btn:hover {
    text-decoration: none;
    color: #fff;
    background: var(--accent-hover);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 28%, transparent);
}
.btn:active { transform: translateY(1px); }
.btn.secondary {
    background: #fff;
    color: var(--text);
    border: 1px solid var(--line);
    box-shadow: none;
}
.btn.secondary:hover {
    background: #fff;
    color: var(--text);
    border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.btn.ghost { background: transparent; color: var(--muted); border: 0; padding: 6px 10px; font-weight: 500; box-shadow: none; }
.btn.ghost:hover { color: var(--text); box-shadow: none; }
.btn.danger { background: #b91c1c; color: #fff; }
.btn.danger:hover { background: #991b1b; color: #fff; box-shadow: 0 4px 14px rgba(185, 28, 28, 0.25); }
.btn.success { background: #16a34a; color: #fff; }
.btn.success:hover { background: #15803d; color: #fff; box-shadow: 0 4px 14px rgba(22, 163, 74, 0.32); }
.actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

.flash {
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent-ink);
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.notice {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 12px;
}
.notice.warn {
    background: var(--warn-bg);
    border-color: #fcd34d;
    color: var(--warn);
}

.callout {
    border: 1px solid #ddd6fe;
    background: #f5f3ff;
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: 16px;
}
.callout h2 { color: var(--review); }

.badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .02em;
}
.badge[hidden] { display: none !important; }
.badge.pass { background: var(--pass-bg); color: var(--pass); }
.badge.warning { background: var(--warn-bg); color: var(--warn); }
.badge.edited { background: var(--edited-bg); color: var(--edited); }
.badge.fail { background: var(--fail-bg); color: var(--fail); }
.badge.review { background: var(--review-bg); color: var(--review); }
.badge.unchecked { background: #eef2ff; color: #3730a3; }
.badge.neutral { background: #f3f4f6; color: #374151; }
.badge.persisted { background: #e0f2fe; color: #075985; }
.badge.new-finding { background: #ecfdf5; color: #065f46; }
.badge.cleared { background: #f3f4f6; color: #4b5563; text-decoration: line-through; }
.badge.source { background: var(--accent-soft); color: var(--accent-ink); text-transform: none; }

.add-finding-chip {
    position: absolute;
    z-index: 60;
    padding: 6px 12px;
    border: 1px solid var(--link);
    border-radius: 999px;
    background: var(--link);
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: var(--shadow-card);
}
.add-finding-chip:hover { background: var(--link-hover); border-color: var(--link-hover); }
.add-finding-chip[hidden] { display: none; }

.check-history-panel > .check-history-panel-summary {
    list-style: none;
    cursor: pointer;
}
.check-history-panel > .check-history-panel-summary::-webkit-details-marker { display: none; }
.check-history-panel > .check-history-panel-summary h2 {
    margin: 0;
    display: inline;
}
.check-history-panel > .check-history-panel-summary .help {
    margin: 6px 0 0;
}
.check-history-panel[open] > .check-history-panel-summary {
    margin-bottom: 12px;
}
.check-history-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.check-history-item details {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}
.check-history-item summary {
    list-style: none;
    cursor: pointer;
    padding: 12px 14px;
}
.check-history-item summary::-webkit-details-marker { display: none; }

.manual-check-panel > .manual-check-summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
}
.manual-check-panel > .manual-check-summary::-webkit-details-marker { display: none; }
.manual-check-panel > .manual-check-summary > span {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.manual-check-panel > .manual-check-summary::after {
    content: '▸';
    color: var(--muted);
    font-size: 14px;
    line-height: 1;
    transition: transform 0.15s ease;
}
.manual-check-panel[open] > .manual-check-summary::after {
    transform: rotate(90deg);
}
.manual-check-panel[open] > .manual-check-summary {
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.check-history-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px 16px;
    align-items: flex-start;
}
.check-history-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
}
.check-history-details {
    padding: 0 14px 14px;
    border-top: 1px solid var(--line);
}
.check-history-findings {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.check-history-findings li {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: baseline;
}
.check-history-persistence-summary {
    margin-top: 4px;
}
.check-history-cleared-heading {
    margin: 16px 0 8px;
    font-size: 0.95rem;
}
a.badge {
    text-decoration: none;
}
a.badge:hover {
    filter: brightness(0.96);
}

.table { width: 100%; border-collapse: collapse; }
.table th, .table td { text-align: left; padding: 12px 8px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.table-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: flex-end; }
.table-sort {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}
.table-sort:hover { color: var(--accent); }
.table-sort.is-active { color: var(--ink); }
.table-sort-indicator {
    font-size: 0.75em;
    opacity: 0.7;
}
.table th {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.table tbody tr:hover td { background: color-mix(in srgb, var(--accent-soft) 40%, white); }
.table tr.is-flagged { background: #faf5ff; }
.table tr.cases-row-attention {
    background: #fff7ed;
    box-shadow: inset 4px 0 0 #d97706;
}
.table tr.cases-row-attention:hover { background: #ffedd5; }
.assignment-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 16px;
    border: 1px solid #fdba74;
    background: #fff7ed;
    border-radius: 12px;
    padding: 14px 18px;
    margin-bottom: 16px;
    box-shadow: inset 4px 0 0 #d97706;
}
.assignment-banner strong { color: #9a3412; }
.assignment-banner .btn { flex-shrink: 0; }
.wrap-sow { max-width: 68rem; }
.sow-shell { margin: 0 auto 2rem; }
.sow-page-header { margin-bottom: 1rem; }
.sow-page-header h1 {
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 2.5vw, 2rem);
    margin: 0 0 0.35rem;
    letter-spacing: -0.02em;
}
.sow-page-header-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 1.5rem;
}
.sow-kicker {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent);
}
.sow-shell .sow-meta {
    margin: 0 0 0.5rem;
    color: var(--muted);
    font-weight: 600;
}
.sow-header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}
.sow-deal-strip {
    display: grid;
    gap: 0.75rem;
    margin: 0 0 1.25rem;
}
.sow-deal-market {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 14px 16px;
    box-shadow: var(--shadow-card);
}
.sow-deal-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.sow-deal-item {
    flex: 1 1 140px;
    min-width: 0;
    max-width: 100%;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 14px 16px;
    box-shadow: var(--shadow-card);
}
.sow-deal-label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}
.sow-deal-value {
    display: block;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #111827;
    line-height: 1.2;
}
.sow-deal-value--text {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
}
.sow-receipt-card {
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    border-radius: 12px;
    padding: 14px 18px;
    margin: 0 0 16px;
}
.sow-receipt-card strong { color: #166534; }
.sow-receipt-dl {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px 16px;
    margin: 10px 0 0;
}
.sow-receipt-dl dt {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.sow-receipt-dl dd { margin: 2px 0 0; font-weight: 600; }
.sow-article {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: var(--shadow-card);
    border-top: 4px solid var(--accent);
    padding: 0;
    overflow: hidden;
}
.sow-document--screen {
    padding: 1.25rem 1.35rem 0.5rem;
    display: grid;
    gap: 0.85rem;
}
.sow-document--screen .sow-doc-title { display: none; }
.sow-section {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    padding: 1rem 1.1rem 1.05rem;
}
.sow-section h2 {
    margin: 0 0 0.65rem;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #111827;
}
.sow-section p { margin: 0 0 0.65rem; line-height: 1.55; color: #1f2937; }
.sow-section p:last-child { margin-bottom: 0; }
.sow-section-note {
    margin: 0.85rem 0 0 !important;
    color: #4b5563 !important;
    font-size: 0.95rem;
}
.sow-metric-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}
.sow-metric {
    flex: 1 1 150px;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
    padding: 0.85rem 0.95rem;
}
.sow-metric-label {
    display: block;
    margin-bottom: 0.3rem;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}
.sow-metric-value {
    display: block;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #111827;
    line-height: 1.2;
}
.sow-metric-value--text {
    font-size: 1.05rem;
    letter-spacing: 0;
}
.sow-metric-hint {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.8rem;
    color: #6b7280;
    line-height: 1.35;
}
.sow-money {
    font-weight: 800;
    color: #111827;
    white-space: nowrap;
}
.sow-emphasis { font-weight: 700; color: #111827; }
.sow-market-line {
    margin: 0.75rem 0 0 !important;
    padding: 0.7rem 0.85rem;
    border-radius: 10px;
    background: color-mix(in srgb, var(--accent-soft) 55%, #fff);
    border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
    font-weight: 700;
}
.sow-ladder-wrap { margin-top: 0.85rem; }
.sow-ladder-caption {
    margin: 0 0 0.45rem;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}
.sow-ladder {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}
.sow-ladder th,
.sow-ladder td {
    border: 1px solid var(--line);
    padding: 9px 12px;
    text-align: left;
}
.sow-ladder th {
    background: #f8fafc;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.sow-ladder-row--base td {
    background: #fff7ed;
    font-weight: 700;
}
.sow-document .sow-receipt {
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    border-radius: 10px;
    padding: 12px 14px;
    margin: 0.75rem 0 0;
}
.sow-sign-note { color: #374151; }
.sow-accept {
    position: sticky;
    bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    padding: 1rem 1.35rem;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--panel) 88%, var(--accent-soft));
}
.sow-accept-copy { flex: 1; min-width: 220px; }
.sow-accept-help { margin: 0.35rem 0 0; font-size: 0.9rem; }
.sow-waiting { margin: 0; padding: 1rem 1.35rem 1.25rem; }
@media (max-width: 640px) {
    .sow-deal-value { font-size: 1.15rem; }
    .sow-document--screen { padding: 0.85rem; }
}
.rule-detail-list {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}
.rule-detail {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}
.rule-detail > summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}
.rule-detail > summary::-webkit-details-marker { display: none; }
.rule-detail-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--accent);
}
.rule-detail-title {
    font-weight: 600;
    flex: 1 1 180px;
}
.rule-detail-body {
    padding: 0 14px 14px;
    border-top: 1px solid var(--line);
}
.rule-detail-grid {
    display: grid;
    gap: 12px;
    margin: 12px 0 0;
}
.rule-detail-grid dt {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.rule-detail-grid dd {
    margin: 0;
    line-height: 1.45;
}
.rule-detail-grid code {
    font-size: 13px;
}
.library-table-wrap {
    width: 100%;
    overflow-x: auto;
}
.library-table {
    table-layout: fixed;
    min-width: 1100px;
}
.library-table .col-preview { width: 140px; }
.library-table .col-id { width: 90px; }
.library-table .col-creative { width: auto; }
.library-table .col-source { width: 150px; }
.library-table .col-date { width: 140px; white-space: nowrap; }
.library-table .col-actions { width: 180px; text-align: right; }
.library-table th.col-actions,
.library-table td.col-actions { text-align: right; }
.library-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}
.library-actions .btn { white-space: nowrap; }
.library-table .col-creative strong {
    display: block;
    font-size: 15px;
    line-height: 1.35;
    margin-bottom: 4px;
}
.library-filename {
    overflow-wrap: anywhere;
    word-break: break-word;
    font-size: 12px;
}
.library-thumb {
    display: block;
    width: 120px;
    height: 88px;
    object-fit: cover;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}
.library-table tr.is-focused {
    background: #eff6ff;
    box-shadow: inset 3px 0 0 var(--accent);
}
.library-table tr.is-focused td {
    border-color: #bfdbfe;
}
.library-thumb-sm {
    width: 72px;
    height: 54px;
}
.library-video-frames {
    margin-top: 10px;
}
.library-video-frames > summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
}
.library-frame-list {
    display: grid;
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}
.library-frame-row {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    gap: 10px;
    align-items: center;
}
.library-frame-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.library-frame-actions {
    text-align: right;
}

.type-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 8px 0 16px; }
@media (max-width: 700px) { .type-grid { grid-template-columns: 1fr 1fr; } }
.type-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 10px;
    padding: 12px 10px;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: var(--text);
}
.type-card strong { display: block; margin-bottom: 4px; }
.type-card span { color: var(--muted); font-size: 12px; }
.type-card.is-active { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent); }

.filter-grid { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 16px; }
.filter-chip {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 999px;
    padding: 6px 12px;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}
.filter-chip.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: #1e3a8a;
}

.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 700px) { .choice-grid { grid-template-columns: 1fr; } }

input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-ring);
}

.searchable-picker {
    margin: 6px 0 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.searchable-picker:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-ring);
}
.searchable-picker-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    background: #fff;
    cursor: text;
}
.searchable-picker.is-open .searchable-picker-bar {
    background: #f8fafc;
    border-bottom: 1px solid var(--line);
}
.searchable-picker.is-single.has-value:not(.is-open) .searchable-picker-bar {
    display: none;
}
.searchable-picker.is-multiple.has-value .searchable-picker-bar {
    border-top: 1px dashed var(--line);
}
.searchable-picker.is-multiple.has-value.is-open .searchable-picker-bar {
    border-top-style: solid;
}
.searchable-picker-icon {
    flex: none;
    color: var(--muted);
}
.searchable-picker input[type=search].searchable-picker-search {
    flex: 1;
    min-width: 0;
    padding: 12px 0;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    font-size: 15px;
    box-shadow: none;
}
.searchable-picker input[type=search].searchable-picker-search:focus {
    box-shadow: none;
}
.searchable-picker-search::placeholder {
    color: #94a3b8;
}
.searchable-picker-count {
    flex: none;
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    white-space: nowrap;
}
.searchable-picker-count.has-selection {
    color: var(--accent-ink);
}
.searchable-picker-selection[hidden] {
    display: none !important;
}
.searchable-picker-current {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: linear-gradient(105deg, var(--accent-soft), #fff 78%);
    box-shadow: inset 4px 0 0 var(--accent), 0 1px 0 color-mix(in srgb, var(--accent) 12%, transparent);
    cursor: pointer;
}
.searchable-picker.is-open .searchable-picker-current {
    border-bottom: 1px solid var(--line);
}
.searchable-picker-current-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
}
.searchable-picker-current-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}
.searchable-picker-current-text strong {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--accent-ink);
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.searchable-picker-current-text span {
    font-size: 12.5px;
    color: var(--muted);
}
.searchable-picker-change {
    flex: none;
    border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
    background: #fff;
    color: var(--accent-ink);
    border-radius: 8px;
    padding: 6px 12px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.searchable-picker-change:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}
.searchable-picker {
    --chip-bg: var(--accent-soft);
    --chip-ink: var(--accent-ink);
    --chip-line: color-mix(in srgb, var(--accent) 28%, white);
}
.searchable-picker[data-picker-tone="people"] {
    --chip-bg: var(--link-soft);
    --chip-ink: var(--link);
    --chip-line: color-mix(in srgb, var(--link) 22%, white);
}
.searchable-picker.is-multiple .searchable-picker-selection {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    background: #fff;
}
.searchable-picker-token {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 5px 4px 11px;
    border-radius: 999px;
    background: var(--chip-bg);
    color: var(--chip-ink);
    border: 1px solid var(--chip-line);
    font-size: 14px;
    font-weight: 600;
}
.searchable-picker-token-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--chip-ink);
    opacity: 0.65;
    cursor: pointer;
}
.searchable-picker-token-x:hover {
    opacity: 1;
    background: color-mix(in srgb, var(--chip-ink) 12%, transparent);
}
.searchable-picker-token-count {
    margin-left: auto;
    font-size: 12px;
    font-weight: 600;
    color: var(--accent-ink);
}
.searchable-picker-list {
    display: none;
    max-height: 15rem;
    overflow: auto;
    padding: 4px;
}
.searchable-picker.is-open .searchable-picker-list {
    display: block;
}
.searchable-picker.is-dropdown {
    position: relative;
    overflow: visible;
    z-index: 1;
}
.searchable-picker.is-dropdown.is-open {
    z-index: 30;
}
/* One soft card behind search + list (avoids list-only shadow seam) */
.searchable-picker.is-dropdown.is-open::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    border-radius: 12px;
    background: #fff;
    box-shadow:
        0 4px 6px -1px rgba(15, 23, 42, 0.08),
        0 12px 28px -4px rgba(15, 23, 42, 0.18);
    z-index: 0;
    pointer-events: none;
}
.searchable-picker.is-dropdown.is-open:not(.has-value)::after {
    top: 0;
    height: calc(100% + 15rem);
}
.searchable-picker.is-dropdown.is-open.has-value::after {
    top: 100%;
    height: calc(48px + 15rem);
}
.searchable-picker.is-dropdown.is-open:not(.has-value) {
    border-radius: 12px 12px 0 0;
    border-bottom-color: #e2e8f0;
}
/* Empty open: bar stays in flow; list floats under it */
.searchable-picker.is-dropdown.is-open:not(.has-value) .searchable-picker-list {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 1;
    display: block;
    max-height: 15rem;
    overflow: auto;
    margin: 0;
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 12px 12px;
    background: #fff;
    box-shadow: none;
}
/* Has-value open: chip stays in flow; search + list float as one popover */
.searchable-picker.is-dropdown.is-open.has-value .searchable-picker-bar,
.searchable-picker.is-dropdown.is-open.has-value .searchable-picker-list {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    background: #fff;
    box-shadow: none;
}
.searchable-picker.is-dropdown.is-open.has-value .searchable-picker-bar {
    top: 100%;
    display: flex;
    border: 1px solid var(--line);
    border-bottom: 1px solid #e2e8f0;
    border-radius: 12px 12px 0 0;
}
.searchable-picker.is-dropdown.is-open.has-value .searchable-picker-list {
    top: calc(100% + 48px);
    display: block;
    max-height: 15rem;
    overflow: auto;
    margin: 0;
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 12px 12px;
}
.searchable-picker .searchable-picker-option {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 9px 10px;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
}
.searchable-picker-option[hidden],
.searchable-picker-option.is-hidden {
    display: none !important;
}
.searchable-picker-empty[hidden] {
    display: none !important;
}
.searchable-picker-option:hover {
    background: #f1f5f9;
}
.searchable-picker.is-dropdown .searchable-picker-option:hover {
    background: #f8fafc;
}
.searchable-picker-option.is-selected {
    background: var(--accent-soft);
}
.searchable-picker-option.is-selected strong {
    color: var(--accent-ink);
}
.searchable-picker-create strong {
    color: var(--accent-ink);
}
.searchable-picker-option input {
    flex: none;
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--accent);
}
.searchable-picker-option-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.searchable-picker-option-text strong {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.searchable-picker-option-text .help {
    margin: 0;
    font-size: 12.5px;
}
.searchable-picker-empty {
    margin: 0;
    padding: 18px 10px;
    text-align: center;
    color: var(--muted);
    font-size: 14px;
}
.searchable-picker-group {
    margin: 0;
    padding: 10px 10px 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
}
.searchable-picker-group[hidden] {
    display: none !important;
}
.scope-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--ink);
}
.scope-mount {
    min-width: 0;
}
.scope-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    min-width: 0;
}
.scope-chip-text {
    flex: 1;
    min-width: 0;
}
.scope-chip-text strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
}
.scope-chip-change {
    flex: none;
    border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
    background: #fff;
    color: var(--accent-ink);
    border-radius: 8px;
    padding: 6px 12px;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}
.scope-chip-change:hover {
    border-color: var(--accent);
}
.scope-pick-grid {
    grid-template-columns: 1fr;
    gap: 8px;
}
.scope-pick {
    text-align: left;
    cursor: pointer;
    padding: 10px 12px;
}
.scope-pick .pick-copy strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}
.dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 160px;
    padding: 24px 16px;
    border: 2px dashed var(--line);
    border-radius: 12px;
    background: #f8fafc;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.dropzone:hover,
.dropzone.is-dragover {
    border-color: #2563eb;
    background: #eff6ff;
}
.dropzone.has-file {
    border-style: solid;
    background: #fff;
}
.dropzone-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}
.dropzone {
    position: relative;
}
.dropzone-title {
    font-weight: 600;
    font-size: 15px;
}
.dropzone-hint,
.dropzone-file {
    font-size: 13px;
}
.dropzone-file {
    margin-top: 4px;
    font-weight: 600;
    color: #111827;
}
.dropzone.is-invalid {
    border-color: #dc2626;
}
.finding.video-match {
    display: grid;
    gap: 12px;
    padding: 16px 18px;
    margin: 10px 0;
    border-radius: 10px;
}
.finding.video-match > strong {
    display: block;
    margin: 0;
    font-size: 16px;
    line-height: 1.3;
}
.finding.video-match > .finding-meta {
    margin: 0;
    gap: 8px;
}
.finding.video-match > .choice-grid {
    margin: 0;
    gap: 14px;
}
.finding.video-match > .choice-grid > div > .muted {
    margin: 0 0 6px;
}
.finding.video-match > .video-match-frames {
    margin-top: 0;
}
.video-match-frames > summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
}
.video-match-frame-list {
    display: grid;
    gap: 14px;
    margin-top: 10px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}
.video-match-frame {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.video-match-frame:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}
.dropzone-idle,
.dropzone-active {
    display: grid;
    gap: 8px;
    justify-items: center;
    width: min(100%, 40rem);
}
.dropzone-active[hidden],
.dropzone-idle[hidden] {
    display: none !important;
}
.dropzone-file-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.dropzone-file-name {
    display: block;
    max-width: 100%;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 800;
    color: var(--text);
    overflow-wrap: anywhere;
    word-break: break-word;
}
.dropzone-file-meta {
    font-size: 13px;
}
.dropzone.is-uploading {
    border-color: #93c5fd;
    background: #eff6ff;
}
.video-match-edited {
    background: var(--edited-bg);
    border: 1px solid #fdba74;
    border-left: 6px solid var(--edited);
    box-shadow: 0 0 0 1px rgba(194, 65, 12, 0.08);
}
.video-edit-alert {
    margin: 0 0 12px;
    padding: 12px 14px;
    border-radius: 8px;
    background: linear-gradient(135deg, #9a3412 0%, #c2410c 100%);
    color: #fff;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.4;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.video-edit-alert-flag {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 6px;
    background: #ffedd5;
    color: #9a3412;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.finding.edited {
    border-left-color: var(--edited);
}
.check-progress {
    display: grid;
    gap: 8px;
    width: 100%;
    margin-top: 10px;
}
.check-progress-track {
    display: block;
    height: 14px;
    border-radius: 999px;
    background: #dbeafe;
    overflow: hidden;
}
.check-progress-fill {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #1d4ed8, #2563eb);
    transition: width 0.15s ease;
}
.check-progress.is-indeterminate .check-progress-fill {
    width: 40% !important;
    animation: check-progress-pulse 1.1s ease-in-out infinite;
}
.check-progress-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    font-weight: 600;
}
.check-progress-pct {
    color: var(--accent);
}
.dropzone.is-busy {
    pointer-events: none;
}
.dropzone[hidden] {
    display: none !important;
}
@keyframes check-progress-pulse {
    0% { transform: translateX(-120%); }
    100% { transform: translateX(280%); }
}
.choice {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px;
    display: block;
    cursor: pointer;
}
.choice input { margin-right: 8px; }
.choice.is-active { border-color: var(--accent); background: var(--accent-soft); }

/* —— Check creative —— */
.check-page {
    display: grid;
    gap: 18px;
    margin-bottom: 24px;
}
.check-head h1 {
    margin: 0 0 4px;
}
.check-head .muted {
    margin: 0;
    max-width: 70ch;
}
.check-card {
    display: grid;
    grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: visible;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px rgba(15, 23, 42, 0.05);
}
.check-side {
    display: grid;
    gap: 16px;
    align-content: start;
    padding: 20px;
    background: #f8fafc;
    border-right: 1px solid var(--line);
}
.check-scope {
    display: grid;
    gap: 14px;
    margin: 0;
}
.check-side-label {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}
.check-seg {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 3px;
    border-radius: 10px;
    background: #e2e8f0;
    gap: 2px;
}
.check-seg-item {
    position: relative;
    margin: 0;
    cursor: pointer;
}
.check-seg-item input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
}
.check-seg-item span {
    display: block;
    padding: 7px 8px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    color: #475569;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.check-seg-item:hover span {
    color: var(--text);
}
.check-seg-item.is-active span {
    background: #fff;
    color: var(--accent);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}
.check-seg-item:focus-within span {
    outline: 2px solid color-mix(in srgb, var(--accent) 40%, white);
    outline-offset: 1px;
}
.check-fields {
    display: grid;
    gap: 10px;
}
.check-field {
    display: grid;
    gap: 4px;
}
.check-field[hidden] {
    display: none !important;
}
.check-field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
}
.check-field select {
    margin: 0;
    width: 100%;
    border-radius: 8px;
    border-color: #cbd5e1;
    background: #fff;
    font-size: 14px;
}
.check-count {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.check-count-number {
    font-size: 30px;
    line-height: 1;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--accent);
}
.check-count.is-empty .check-count-number {
    color: var(--muted);
}
.check-count-copy {
    font-size: 13px;
    line-height: 1.35;
    color: var(--muted);
}
.check-count-copy #check-scope-where,
.check-count-copy > span span,
.check-count-copy span:last-child {
    color: var(--text);
    font-weight: 600;
}
.check-scope-tenant-note {
    margin: 0;
    padding: 8px 10px;
    border-radius: 8px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
    font-size: 12.5px;
    line-height: 1.4;
}
.check-scope-empty {
    margin: 0;
    font-size: 13px;
}
.check-main {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 16px;
    min-width: 0;
}
.check-dropzone {
    flex: 1;
    min-height: 320px;
    border-radius: 12px;
    border: 1.5px dashed #bfdbfe;
    background: linear-gradient(180deg, #fbfdff 0%, #f3f7fd 100%);
    display: grid;
    place-items: center;
    text-align: center;
    transition: border-color 0.18s ease, background 0.18s ease;
}
.check-dropzone:hover,
.check-dropzone.is-dragover {
    border-color: var(--accent);
    background: #eff6ff;
}
.check-dropzone.is-dragover {
    border-style: solid;
}
.check-dropzone .dropzone-idle {
    display: grid;
    gap: 8px;
    justify-items: center;
    padding: 28px 20px;
}
.check-drop-glyph {
    width: 60px;
    height: 60px;
    margin-bottom: 6px;
    border-radius: 50%;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.7'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 16V4m0 0l-4 4m4-4l4 4M4 16v2a2 2 0 002 2h12a2 2 0 002-2v-2'/%3E%3C/svg%3E")
        center / 26px no-repeat,
        #fff;
    border: 1px solid #dbeafe;
    box-shadow: 0 6px 16px rgba(29, 78, 216, 0.12);
    transition: transform 0.18s ease;
}
.check-dropzone:hover .check-drop-glyph,
.check-dropzone.is-dragover .check-drop-glyph {
    transform: translateY(-3px);
}
.check-dropzone .dropzone-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text);
}
.check-dropzone .dropzone-hint {
    max-width: 46ch;
    font-size: 13px;
    line-height: 1.4;
}
.check-browse {
    color: var(--accent);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.check-formats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin-top: 6px;
}
.check-formats span {
    padding: 2px 8px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--muted);
}
.check-submit-wrap {
    display: none;
}
.check-results-rail,
.check-result-block {
    display: grid;
    gap: 14px;
    margin-top: 8px;
}
.check-results-batch {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
}
.check-result-heading {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
}
.check-related-heading {
    margin: 8px 0 0;
    font-size: 13px;
    font-weight: 600;
}
.check-result-meta {
    margin: 0;
    font-size: 13px;
    color: var(--muted);
}
.check-history {
    margin-top: 28px;
    display: grid;
    gap: 10px;
}
.check-history > h2 {
    margin: 0;
    font-size: 1.1rem;
}
.check-history > .muted {
    margin: 0;
}
.check-history-list {
    display: grid;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    padding: 6px;
}
.check-history-row {
    display: grid;
    grid-template-columns: 9.5rem minmax(8rem, 1.4fr) minmax(6rem, 1fr) minmax(8rem, 1.2fr) auto;
    gap: 10px 14px;
    align-items: center;
    padding: 10px 12px;
    border-radius: 8px;
    color: inherit;
    text-decoration: none;
}
.check-history-row:hover {
    background: #f8fafc;
}
.check-history-when,
.check-history-who,
.check-history-scope {
    font-size: 13px;
    color: var(--muted);
}
.check-history-file {
    font-weight: 600;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media (max-width: 800px) {
    .check-history-row {
        grid-template-columns: 1fr auto;
        gap: 4px 10px;
    }
    .check-history-when { grid-column: 1 / -1; }
    .check-history-file { grid-column: 1; }
    .check-history-row .badge { grid-column: 2; grid-row: 2; }
    .check-history-who,
    .check-history-scope { grid-column: 1 / -1; }
}
.check-verdict {
    padding: 16px 18px;
    border-radius: 12px;
    border: 1px solid transparent;
}
.check-verdict-flag {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
}
.check-verdict-detail {
    margin: 6px 0 0;
    font-size: 14px;
    line-height: 1.45;
    max-width: 62ch;
}
.check-verdict[data-verdict="match"] {
    background: var(--pass-bg);
    border-color: #86efac;
    color: var(--pass);
}
.check-verdict[data-verdict="edited"] {
    background: var(--edited-bg);
    border-color: #fdba74;
    color: var(--edited);
}
.check-verdict[data-verdict="closest"] {
    background: var(--review-bg);
    border-color: #c4b5fd;
    color: var(--review);
}
.check-verdict[data-verdict="none"] {
    background: var(--fail-bg);
    border-color: #fca5a5;
    color: var(--fail);
}
.match-approved {
    display: grid;
    gap: 6px;
    align-content: start;
}
.match-approved .muted {
    margin: 0;
}
.match-provenance {
    display: grid;
    gap: 4px;
    margin-top: 2px;
}
.match-provenance-id {
    font-size: 13px;
    font-weight: 700;
    color: var(--accent);
    text-decoration: none;
}
a.match-provenance-id:hover {
    text-decoration: underline;
}
.match-provenance-where {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.35;
    color: var(--muted);
}
.match-provenance-where a {
    color: var(--text);
    font-weight: 600;
    text-decoration: none;
}
.match-provenance-where a:hover {
    color: var(--accent);
    text-decoration: underline;
}
.match-provenance-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 12.5px;
    font-weight: 600;
}
.match-provenance-actions a {
    text-decoration: none;
}
.match-provenance-actions a:hover {
    text-decoration: underline;
}
@media (max-width: 860px) {
    .check-card {
        grid-template-columns: 1fr;
    }
    .check-side {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding: 16px;
    }
    .check-main {
        padding: 12px;
    }
    .check-dropzone {
        min-height: 220px;
    }
}

/* —— New case flow —— */
.case-flow-page {
    margin-bottom: 40px;
}
.case-flow {
    margin: 0;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px rgba(15, 23, 42, 0.05);
    overflow: hidden;
}
.flow-step {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 0 18px;
    padding: 24px 26px 26px 22px;
    border-bottom: 1px solid var(--line);
}
.flow-step[hidden] {
    display: none;
}
.flow-step::before {
    content: "";
    position: absolute;
    left: 43px;
    top: 58px;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
}
.flow-step:last-of-type::before,
#self-upload-fields > .flow-step:last-child::before {
    display: none;
}
.flow-step-quiet {
    background: #f8fafc;
}
.flow-num {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 700;
    font-size: 16px;
    border: 1px solid #bfdbfe;
    position: relative;
    z-index: 1;
}
.flow-body {
    min-width: 0;
    display: grid;
    gap: 10px;
    align-content: start;
    padding-top: 6px;
}
.flow-title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.25;
}
.flow-hint {
    margin: -4px 0 4px;
    font-size: 13.5px;
    color: var(--muted);
}
.flow-two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}
.case-flow-page .case-flow {
    /* Allow Market/Campaign popovers to paint past the card edge */
    overflow: visible;
}
.case-flow-page .flow-two {
    align-items: start;
}
.case-flow-page .scope-mount,
.case-flow-page .flow-step,
.case-flow-page .flow-step .check-field,
.case-flow-page .flow-body {
    overflow: visible;
}
.case-flow-page .flow-step:has(.searchable-picker.is-dropdown.is-open) {
    z-index: 5;
}
.flow-body .check-field label,
.flow-panel label {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
}
.flow-body .check-field select,
.flow-body .check-field input,
.flow-body .check-field textarea {
    margin: 0;
}
.flow-panel {
    margin-top: 6px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fafc;
}
.flow-panel label {
    margin: 0 0 6px;
}
.flow-panel .help {
    margin: -2px 0 8px;
}
.flow-panel textarea,
.flow-panel input[type=url] {
    background: #fff;
}
.flow-panel textarea {
    min-height: 160px;
}
.flow-panel [data-source] + [data-source] {
    margin-top: 0;
}
.flow-panel [data-source="creatives"] > label:not(.dropzone),
.flow-panel [data-source="creatives"] .filter-grid {
    margin-top: 12px;
}
.flow-panel [data-source="creatives"] > label:first-child {
    margin-top: 0;
}
.flow-drop {
    min-height: 170px;
    border-radius: 12px;
    border: 1.5px dashed #bfdbfe;
    background: #fff;
    gap: 6px;
    padding: 22px 16px;
    margin: 0;
    font-weight: 400;
}
.flow-drop:hover,
.flow-drop.is-dragover {
    border-color: var(--accent);
    background: #eff6ff;
}
.flow-drop.has-file {
    border-style: solid;
    border-color: #86efac;
    background: #f0fdf4;
}
.flow-drop .check-drop-glyph {
    width: 48px;
    height: 48px;
    margin-bottom: 2px;
}
.flow-drop .dropzone-title {
    font-size: 15px;
    font-weight: 700;
}
.flow-drop .dropzone-file {
    margin-top: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
    font-size: 12.5px;
    color: var(--text);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.flow-errors {
    margin: 16px 26px 0;
}
.flow-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    padding: 16px 26px;
    background: #fff;
}
.flow-footer .muted {
    margin: 0;
    font-size: 13px;
}
.flow-submit {
    padding: 12px 22px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 10px;
}
.flow-submit:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    box-shadow: none;
}

/* Create case: add-items list */
.add-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 14px;
}
.add-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 6px 6px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.add-chip-plus {
    margin-right: -4px;
    color: var(--accent);
    font-weight: 700;
}
.add-chip:hover {
    border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.add-chip .pick-icon {
    flex-basis: 28px;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background-size: 15px, auto;
}
.bundle-list {
    display: grid;
    gap: 10px;
    margin-bottom: 12px;
}
.bundle-list.is-empty { display: none; }
.bundle-group { display: contents; }
.bundle-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}
.bundle-item[data-kind="file"] { align-items: center; }
.bundle-item-body {
    display: grid;
    gap: 6px;
    min-width: 0;
}
.bundle-item-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}
.bundle-file-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bundle-item-meta {
    font-size: 12.5px;
    color: var(--muted);
}
.bundle-item textarea {
    min-height: 110px;
    margin: 0;
}
.bundle-item input[type="url"] { margin: 0; }
.bundle-item-error {
    margin: 0;
    font-size: 12.5px;
    color: #b91c1c;
}
.bundle-item-error[hidden] { display: none; }
.bundle-thumb {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid #e2e8f0;
}
.bundle-remove {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}
.bundle-remove:hover {
    background: #fef2f2;
    color: #b91c1c;
}
.bundle-google { margin-bottom: 12px; }
.bundle-google[hidden] { display: none; }
.bundle-google p { margin: 0; font-size: 13px; }
.bundle-google .btn {
    margin: 0 4px;
    padding: 5px 12px;
    font-size: 13px;
}
.flow-drop.is-compact {
    min-height: 0;
    padding: 14px 16px;
}
.flow-drop.is-compact .check-drop-glyph { display: none; }
.flow-drop.is-compact .dropzone-title { font-size: 14px; }

/* Pick tiles (radio / checkbox / button cards) */
.pick-grid {
    display: grid;
    gap: 10px;
}
.pick-grid[hidden] {
    display: none !important;
}
/* UGC create-case toggles: author display rules must not override [hidden]. */
[data-ugc-compose-paste][hidden],
[data-ugc-compose-doc][hidden],
[data-copy-delivery-paste][hidden],
[data-copy-delivery-doc][hidden],
[data-ugc-script-picker][hidden],
[data-ugc-compose-panel][hidden],
[data-ugc-script-empty][hidden],
[data-ugc-dropzone-hint][hidden] {
    display: none !important;
}
.pick-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pick-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pick-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pick-grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pick-grid-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.pick {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.pick:hover {
    border-color: #93c5fd;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.08);
}
.pick input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
}
.pick:focus-within,
.pick:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--accent) 45%, white);
    outline-offset: 2px;
}
.pick-icon {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background:
        var(--pick-icon) center / 20px no-repeat,
        #f1f5f9;
    border: 1px solid #e2e8f0;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.pick-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.pick-copy strong {
    font-size: 14px;
    line-height: 1.3;
}
.pick-copy span {
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--muted);
}
.pick.is-active {
    border-color: var(--accent);
    background: #eff6ff;
    box-shadow: 0 0 0 1px var(--accent);
}
.pick.is-active .pick-icon {
    background:
        var(--pick-icon) center / 20px no-repeat,
        var(--accent-soft);
    border-color: #93c5fd;
}
.pick.is-active::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 10px;
    width: 18px;
    height: 18px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='8' fill='%231d4ed8'/%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
        center / contain no-repeat;
}
.pick-grid-4 .pick,
.pick-grid-5 .pick {
    flex-direction: column;
    gap: 10px;
    padding: 14px 12px;
}
.pick-grid-4 .pick-copy span,
.pick-grid-5 .pick-copy span {
    font-size: 12px;
}
.pick-sm {
    padding: 11px 12px;
}
.pick-sm .pick-icon {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
    background-size: 18px;
}
.pick-sm .pick-copy strong {
    font-size: 13.5px;
}
.pick-sm .pick-copy span {
    font-size: 12px;
}
.pick-chip {
    padding: 8px 14px;
    border-radius: 999px;
}
.pick-chip.is-active::after {
    display: none;
}
.pick-chip .pick-copy strong {
    font-size: 13px;
}
.pick-chip.is-active .pick-copy strong {
    color: var(--accent);
}
.pick[data-icon="upload"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 16V4m0 0l-4 4m4-4l4 4M4 16v2a2 2 0 002 2h12a2 2 0 002-2v-2'/%3E%3C/svg%3E"); }
.pick[data-icon="brief"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 4h8l4 4v12a1 1 0 01-1 1H5a1 1 0 01-1-1V5a1 1 0 011-1h3zM8 12h8M8 16h5'/%3E%3C/svg%3E"); }
.pick[data-icon="html"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 7l-5 5 5 5M16 7l5 5-5 5M14 4l-4 16'/%3E%3C/svg%3E"); }
.pick[data-icon="url"], .bundle-icon[data-icon="url"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M10 14a4 4 0 005.7 0l3-3a4 4 0 00-5.7-5.7l-1 1M14 10a4 4 0 00-5.7 0l-3 3a4 4 0 005.7 5.7l1-1'/%3E%3C/svg%3E"); }
.pick[data-icon="docx"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M14 3H7a1 1 0 00-1 1v16a1 1 0 001 1h10a1 1 0 001-1V8l-4-5zM14 3v5h4M8 13h8M8 17h8'/%3E%3C/svg%3E"); }
.pick[data-icon="image"], .bundle-icon[data-icon="image"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 16l-5-5-9 8'/%3E%3C/svg%3E"); }
.pick[data-icon="video"], .bundle-icon[data-icon="video"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Crect x='3' y='6' width='13' height='12' rx='2'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M16 10l5-3v10l-5-3v-4z'/%3E%3C/svg%3E"); }
.pick[data-icon="text"], .bundle-icon[data-icon="text"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 6h14M8 6v12m8-12v12M9 18h6'/%3E%3C/svg%3E"); }
.pick[data-icon="creatives"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Crect x='3' y='7' width='13' height='12' rx='2'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M7 4h12a2 2 0 012 2v10M10 11l4 2.5-4 2.5z'/%3E%3C/svg%3E"); }
.pick[data-icon="package"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3 7l9-4 9 4v10l-9 4-9-4V7zM12 3v18M3 7l9 4 9-4'/%3E%3C/svg%3E"); }
.pick[data-icon="bulk"] { --pick-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231d4ed8' stroke-width='1.8'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); }

@media (max-width: 900px) {
    .pick-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pick-grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .flow-step {
        grid-template-columns: 1fr;
        padding: 18px 16px 20px;
    }
    .flow-step::before { display: none; }
    .flow-num { width: 32px; height: 32px; font-size: 14px; margin-bottom: 6px; }
    .flow-two,
    .pick-grid-2,
    .pick-grid-3 { grid-template-columns: 1fr; }
    .pick-grid-4,
    .pick-grid-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .flow-footer { padding: 14px 16px; }
    .flow-errors { margin: 12px 16px 0; }
}

/* —— Approved creatives library —— */
.library-page {
    margin-bottom: 32px;
}
.library-card-desk .library-dropzone {
    min-height: 240px;
}
.library-upload-top {
    margin-bottom: 2px;
}
.library-meta {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    padding: 0 12px;
}
.library-meta > summary {
    cursor: pointer;
    padding: 10px 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    list-style: none;
}
.library-meta > summary::-webkit-details-marker {
    display: none;
}
.library-meta[open] > summary {
    color: var(--text);
    border-bottom: 1px solid var(--line);
    margin-bottom: 10px;
}
.library-meta-fields {
    display: grid;
    gap: 10px;
    padding-bottom: 12px;
}
.library-submit-wrap {
    margin: 0;
}
.library-list-card {
    margin-top: 4px;
}
.library-list-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px 16px;
    margin-bottom: 12px;
}
.library-list-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
}
.library-list-head .muted {
    margin: 0;
    font-size: 13px;
}
.library-empty {
    margin: 8px 0 0;
}

.score-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 8px; }
.score-value { font-size: 28px; font-weight: 700; }

.preview-box {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
    max-height: 280px;
    overflow: auto;
    white-space: pre-wrap;
    font-size: 13px;
    color: var(--text);
}

.page-preview-card .preview-source {
    margin: 0 0 12px;
    word-break: break-word;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.preview-edit-toggle {
    margin-left: auto;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--pass);
    background: var(--pass-bg);
    border: 1px solid color-mix(in srgb, var(--pass) 28%, white);
    box-shadow: none;
}

.preview-edit-toggle:hover {
    color: #14532d;
    background: #bbf7d0;
    border-color: color-mix(in srgb, var(--pass) 42%, white);
    box-shadow: none;
}

.edit-copy-panel {
    margin: 0 0 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fafafa;
}

.edit-copy-form textarea {
    width: 100%;
    min-height: 220px;
    resize: vertical;
    font: inherit;
    line-height: 1.45;
}

.preview-tabs {
    display: flex;
    gap: 6px;
    margin: 0 0 12px;
}

.preview-tab {
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    border-radius: 999px;
    padding: 6px 12px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.preview-tab.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: #1e3a8a;
}

.preview-tab:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.preview-pane[hidden] {
    display: none !important;
}

.page-visual-frame {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    max-height: min(70vh, 720px);
    overflow: auto;
}

.page-archive-frame {
    overflow: hidden;
    height: min(70vh, 720px);
}

.page-archive-iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #fff;
}

.page-google-doc-frame {
    height: min(75vh, 820px);
}

.doc-visual-modes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
}
.doc-visual-mode {
    appearance: none;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.doc-visual-mode:hover:not(:disabled) {
    background: #f8fafc;
}
.doc-visual-mode.is-active {
    border-color: color-mix(in srgb, var(--link) 45%, var(--line));
    background: color-mix(in srgb, var(--link) 10%, white);
    color: var(--link);
}
.doc-visual-mode:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.doc-visual-pane[hidden] {
    display: none !important;
}
.page-doc-locate {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 14px;
    max-height: min(70vh, 720px);
    overflow: auto;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 1.55;
    color: var(--text);
}
.page-doc-locate.is-empty {
    white-space: normal;
}

.page-visual-shot {
    display: block;
    width: 100%;
    height: auto;
}

.page-preview-body {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 14px;
    max-height: min(70vh, 720px);
    overflow: auto;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 1.55;
    color: var(--text);
}

.page-preview-body.is-empty {
    white-space: normal;
}

.preview-hit {
    background: #fde68a;
    color: inherit;
    border-radius: 3px;
    padding: 0 2px;
    box-decoration-break: clone;
}

.preview-hit.is-active {
    background: #fbbf24;
    outline: 2px solid #d97706;
}

.page-preview-image-wrap {
    margin-bottom: 12px;
}

.page-preview-image {
    display: block;
    width: 100%;
    max-height: 320px;
    object-fit: contain;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.finding-guidance { margin: 0 0 12px; }
.finding-group { margin-top: 8px; }
.finding-group-count { font-weight: 500; }
.finding-group[data-finding-group="already-approved"] > h3 {
    color: #15803d;
}
.finding-group[data-finding-group="already-approved"] > h3 .finding-group-count {
    color: #15803d;
}
.finding.is-already-approved .finding-title {
    color: #15803d;
}
.finding-group[data-finding-group="reviewer"] > h3 {
    color: var(--accent);
}
.finding-group[data-finding-group="reviewer"] > h3 .finding-group-count {
    color: var(--accent-ink);
}

.finding {
    padding: 0;
    margin: 6px 0;
    border-radius: 0 10px 10px 0;
    background: #fff;
    border: 1px solid var(--line);
    border-left-width: 4px;
    border-left-color: #cbd5e1;
    transition: background 0.12s ease, box-shadow 0.12s ease;
    scroll-margin-top: 4.5rem; /* clear sticky .topbar when anchoring #finding-N */
}
.finding-row {
    appearance: none;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    border-radius: 0 9px 9px 0;
}
.finding-row:hover {
    background: #f8fafc;
}
.finding-row:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 2px #bfdbfe;
}
.finding-num {
    flex: 0 0 auto;
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 700;
    color: var(--muted);
    letter-spacing: 0.02em;
}
.finding-asset-anchor {
    flex: 0 0 auto;
    align-self: center;
}
.finding-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 15px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.finding.is-open .finding-title {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}
.finding-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin: 0;
    flex: 0 1 auto;
}
.finding-chevron {
    flex: 0 0 auto;
    width: 0.55rem;
    height: 0.55rem;
    margin-left: auto;
    border-right: 2px solid var(--muted);
    border-bottom: 2px solid var(--muted);
    transform: rotate(45deg);
    transition: transform 0.12s ease;
}
.finding.is-open .finding-chevron {
    transform: rotate(225deg);
    margin-top: 4px;
}
.finding-body {
    padding: 0 12px 12px;
    border-top: 1px dashed var(--line);
}
.finding-body[hidden] {
    display: none !important;
}
.finding-phrases {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 10px 0;
}
.finding-phrase {
    appearance: none;
    border: 1px solid color-mix(in srgb, #ca8a04 45%, var(--line));
    background: #fef9c3;
    color: #713f12;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    max-width: 100%;
    text-align: left;
}
.finding-phrase:hover {
    background: #fde68a;
}
.finding-why {
    margin: 0 0 8px;
    color: var(--text);
    font-size: 14px;
}
.finding-fix {
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--pass-bg) 70%, white);
    border: 1px solid color-mix(in srgb, var(--pass) 18%, var(--line));
}
.finding-fix-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pass);
    margin-bottom: 4px;
}
.finding-fix-text {
    margin: 0 0 6px;
    font-size: 14px;
}
.finding-copy-suggestion {
    padding: 2px 0;
    font-size: 13px;
}
.finding-meta-line {
    margin: 8px 0 0;
    font-size: 13px;
}
.finding-locate-status {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--link);
}
.finding-locate-status.is-error { color: var(--fail); }
.finding-locate-status.is-ok { color: var(--pass); }

.finding-thread {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    cursor: default;
    font-size: 13px;
}
.finding-thread-actions {
    display: inline-flex;
    gap: 8px;
}
.finding-thread .btn {
    padding: 6px 12px;
    font-size: 13px;
}
.findings-unrequested-list {
    margin: 8px 0 0;
    padding-left: 1.2rem;
}
.findings-unrequested-list a { font-weight: 600; }

.finding.is-selected {
    background: #eff6ff;
    box-shadow: 0 0 0 2px #bfdbfe;
}
.finding.critical, .finding.high { border-left-color: #dc2626; }
.finding.medium { border-left-color: #d97706; }
.finding.low { border-left-color: #2563eb; }
.finding.pass { border-left-color: #16a34a; }
.finding.is-decision-approved {
    background: color-mix(in srgb, var(--pass-bg) 55%, white);
    border-left-color: var(--pass);
}
.finding.is-decision-approved .finding-title {
    color: color-mix(in srgb, var(--text) 72%, var(--pass));
    font-weight: 600;
}
.finding.is-decision-rejected {
    background: color-mix(in srgb, var(--fail-bg) 55%, white);
    border-left-color: var(--fail);
}
.finding.is-decision-rejected .finding-title {
    color: color-mix(in srgb, var(--text) 72%, var(--fail));
    font-weight: 600;
}
.finding.is-decision-changes_requested {
    background: color-mix(in srgb, var(--warn-bg) 60%, white);
    border-left-color: var(--warn);
}
.finding.is-decision-changes_requested .finding-title {
    color: color-mix(in srgb, var(--text) 72%, var(--warn));
    font-weight: 600;
}
.finding-decision {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}
.finding-decision textarea { min-height: 72px; }
.finding-decision-result {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}
.finding-decision-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 6px;
    font-size: 14px;
}
.finding-decision-notes {
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--text);
    white-space: pre-wrap;
}
.finding-decision-change summary {
    cursor: pointer;
    color: var(--link);
    font-size: 13px;
    font-weight: 600;
    list-style: none;
}
.finding-decision-change summary::-webkit-details-marker { display: none; }
.finding-decision-change[open] summary { margin-bottom: 8px; }
.finding-decision-change .finding-decision {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}
.finding-image,
.asset-image,
.page-preview-video {
    display: block;
    max-width: 220px;
    max-height: 160px;
    margin-top: 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
    object-fit: contain;
}
.page-preview-video { max-width: 100%; max-height: 280px; }
.preview-source-creatives {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.creative-add-btn {
    margin-left: auto;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    position: relative;
}
.creative-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.creative-edit-hint {
    margin: 0 0 10px;
}
.asset-tile-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 6px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}
.asset-tile-actions.has-remove {
    grid-template-columns: 1fr 1fr;
}
.asset-tile-slot {
    display: flex;
    min-width: 0;
    width: 100%;
}
.asset-tile-remove-form {
    display: flex;
    flex: 1;
    width: 100%;
    margin: 0;
}
.asset-tile-slot > .btn.secondary.asset-tile-action,
.asset-tile-remove-form > .btn.secondary.asset-tile-action {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 1 1 auto;
    width: 100%;
    height: 34px;
    min-height: 34px;
    max-height: 34px;
    margin: 0;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    padding: 0 10px;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    text-align: center;
    white-space: nowrap;
}
.asset-tile-slot > label.btn.secondary.asset-tile-action > .creative-file-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
    cursor: pointer;
    clip: auto;
    overflow: hidden;
}
.btn.secondary.asset-tile-remove {
    color: #b91c1c;
    border-color: color-mix(in srgb, #b91c1c 35%, var(--line));
}
.btn.secondary.asset-tile-remove:hover {
    color: #991b1b;
    background: #fef2f2;
    border-color: color-mix(in srgb, #b91c1c 50%, var(--line));
}
.asset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
    margin-top: 10px;
}
.page-preview-card.is-editing-creatives #page-preview-assets {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}
.asset-grid-item {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 8px;
    background: #fff;
}
.asset-grid-item[data-chat-asset] {
    cursor: pointer;
}
.asset-grid-item[data-chat-asset]:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--accent) 55%, white);
    outline-offset: 2px;
}
.asset-grid-meta {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 6px;
}
.asset-anchor-badge {
    flex: 0 0 auto;
    display: inline-block;
    min-width: 1.6em;
    padding: 1px 6px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--accent) 12%, white);
    border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
    color: var(--accent);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em;
}
.asset-grid-label {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
    word-break: break-word;
}
.asset-grid-item.is-focused {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 45%, white);
}
.asset-grid-item.is-not-compliant {
    border-color: var(--fail);
    background: var(--fail-bg);
}
.asset-grid-item.is-not-compliant.is-focused {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 45%, white);
}
.asset-grid-item.is-approved-match,
.asset-grid-item.is-library-match {
    border-color: var(--pass);
    background: var(--pass-bg);
}
.asset-grid-item.is-reviewer-approved {
    border-color: var(--pass);
    background: var(--pass-bg);
}
.asset-grid-item.is-reviewer-rejected {
    border-color: var(--fail);
    background: var(--fail-bg);
}
.asset-grid-item.is-needs-reviewer {
    border-color: #d97706;
    background: var(--warn-bg);
}
.asset-grid-item.is-needs-reapproval {
    border-color: #d97706;
    background: var(--warn-bg);
}
.finding-pass-hint {
    margin: 0 0 10px;
    font-size: 13px;
}
.asset-library-link {
    display: inline-block;
    margin: 0 8px 6px;
    font-size: 12px;
    font-weight: 600;
}
.asset-image { max-width: 100%; max-height: 140px; }
.muted { color: var(--muted); }
.errors { color: #b91c1c; margin: 8px 0; }
.activity { list-style: none; padding: 0; margin: 0; }
.activity li { padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14px; }

.waiting {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 8px 0;
}
.wand {
    position: relative;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
}
.wand-stick {
    display: block;
    font-size: 28px;
    line-height: 40px;
    transform-origin: 30% 80%;
    animation: wand-wave 1s ease-in-out infinite;
}
.spark {
    position: absolute;
    color: #7c3aed;
    font-size: 11px;
    animation: sparkle 1.2s ease-in-out infinite;
}
.spark.s1 { top: 0; right: 2px; animation-delay: 0s; }
.spark.s2 { top: 6px; right: -4px; color: #2563eb; animation-delay: .2s; }
.spark.s3 { top: -4px; left: 8px; color: #d97706; animation-delay: .4s; }
@keyframes wand-wave {
    0%, 100% { transform: rotate(-18deg); }
    50% { transform: rotate(22deg); }
}
@keyframes sparkle {
    0%, 100% { opacity: .2; transform: translateY(4px) scale(.8); }
    50% { opacity: 1; transform: translateY(-6px) scale(1.15); }
}

.ad-compare-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.ad-compare-toolbar h2 { margin: 0 0 4px; }
.ad-compare-summary { margin: 0; }
.ad-compare-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.ad-compare-filters { margin-bottom: 16px; }
.ad-compare-search-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
.ad-compare-toolbar input[type=search].ad-compare-search {
    width: min(280px, 100%);
    margin: 0;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font: inherit;
    background: #fff;
}
.ad-compare-shell { padding-bottom: 12px; }
.ad-compare-list {
    display: grid;
    gap: 14px;
}
.ad-compare-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
}
.ad-compare-head {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}
.ad-compare-head-main { min-width: 0; }
.ad-compare-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.ad-compare-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.25;
}
.ad-compare-hierarchy {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.4;
}
.ad-compare-head-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: stretch;
}
.ad-compare-head-actions .btn {
    white-space: nowrap;
}
.ad-compare-body {
    display: grid;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}
.ad-compare-checklist {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
}
.ad-compare-checklist .ad-field-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f8fafc;
}
.ad-compare-checklist .ad-field-status .muted {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.ad-compare-images {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.ad-compare-copy-rows {
    display: grid;
    gap: 10px;
}
.ad-copy-row {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 10px 12px;
    background: #f8fafc;
}
.ad-copy-row.is-differ {
    border-color: #f0c36d;
    background: #fffbeb;
}
.ad-copy-row.is-match {
    background: #f8fafc;
}
.ad-copy-row-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.ad-copy-row-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--muted, #64748b);
}
.ad-copy-row-head .ad-field-status {
    margin: 0;
}
.ad-copy-pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}
.ad-copy-side-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 4px;
}
.ad-copy-side p {
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: #0f172a;
    word-break: break-word;
}
.ad-copy-match > summary {
    cursor: pointer;
    list-style: none;
    font-size: 13px;
    line-height: 1.4;
    color: #0f172a;
}
.ad-copy-match > summary::-webkit-details-marker { display: none; }
.ad-copy-match > summary::after {
    content: "Show both";
    display: inline-block;
    margin-left: 8px;
    font-size: 11px;
    font-weight: 600;
    color: var(--muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.ad-copy-match[open] > summary {
    margin-bottom: 8px;
}
.ad-copy-match[open] > summary::after {
    content: "Hide";
}
.ad-copy-empty {
    margin: 0;
    font-size: 13px;
}
.ad-copy-diff mark.diff-del,
.ad-copy-diff mark.diff-add {
    padding: 0 2px;
    border-radius: 3px;
    color: inherit;
}
.ad-copy-diff mark.diff-del {
    background: #fecaca;
    text-decoration: line-through;
}
.ad-copy-diff mark.diff-add {
    background: #bbf7d0;
}
.ad-compare-details {
    margin: 0;
    border-top: 1px dashed var(--line);
    padding-top: 8px;
}
.ad-compare-details > summary {
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted, #64748b);
}
.ad-compare-details-grid {
    margin: 12px 0 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px 16px;
}
.ad-compare-details-grid dt {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted, #64748b);
    margin: 0;
}
.ad-compare-details-grid dd {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.4;
    word-break: break-word;
}
.ad-compare-details-grid .muted {
    display: inline;
    margin-left: 4px;
}
.ad-compare-group {
    flex: 0 1 auto;
    max-width: 100%;
}
.ad-compare-group[open] {
    flex: 1 1 100%;
}
.ad-compare-group > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}
.ad-compare-group > summary::-webkit-details-marker { display: none; }
.ad-compare-group > summary:focus-visible {
    outline: 2px solid var(--accent, #2563eb);
    outline-offset: 2px;
    border-radius: 6px;
}
.ad-compare-group-list {
    margin: 8px 0 0;
    padding: 8px;
    list-style: none;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
    display: grid;
    gap: 6px;
    width: 100%;
    max-width: 560px;
    box-sizing: border-box;
}
.ad-compare-group-list li {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    font-size: 13px;
    padding: 4px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid var(--line);
}
.ad-compare-group-thumb {
    display: block;
    width: 56px;
    height: 42px;
    object-fit: cover;
    border-radius: 4px;
    background: #fff;
}
.ad-compare-group-thumb.is-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    text-align: center;
    padding: 2px;
    box-sizing: border-box;
    border: 1px solid var(--line);
}
.ad-compare-group-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.ad-compare-group-headline {
    flex: 1 1 100%;
    font-weight: 600;
    font-size: 12px;
    line-height: 1.3;
}
.ad-compare-select {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 4px;
}
.ad-compare-select input[type=checkbox] {
    width: 16px;
    height: 16px;
    margin: 0;
    flex: none;
}
.ad-creative-preview {
    margin: 0;
    min-width: 0;
}
.ad-creative-preview figcaption {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.ad-compare-thumb {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 420px;
    object-fit: contain;
    object-position: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}
.ad-compare-thumb.is-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px;
    font-size: 13px;
    height: 160px;
}
.ad-field-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.ad-field-status .muted {
    font-size: 12px;
}
@media (max-width: 980px) {
    .ad-compare-images,
    .ad-copy-pair {
        grid-template-columns: 1fr;
    }
    .ad-compare-thumb {
        max-height: 360px;
    }
}
@media (max-width: 760px) {
    .ad-compare-head {
        grid-template-columns: 28px minmax(0, 1fr);
    }
    .ad-compare-head-actions {
        grid-column: 2;
        flex-direction: row;
        flex-wrap: wrap;
    }
}

/* —— Signed-out landing (internal desk) —— */
body.is-landing {
    --ink: #071528;
    --ink-soft: #102a4a;
    --paper: #f3f1eb;
    --paper-line: #ddd6c8;
    background: var(--ink);
    min-height: 100vh;
    color: #e8eef7;
}

body.is-landing .topbar {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    position: relative;
    z-index: 5;
}

body.is-landing .brand {
    color: #f8fafc;
}
body.is-landing .brand > span {
    display: none;
}
body.is-landing .nav a.btn.secondary {
    background: transparent;
    color: #e8eef7;
    border-color: rgba(255, 255, 255, 0.28);
}
body.is-landing .nav a.btn.secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    text-decoration: none;
}

body.is-landing .wrap.wrap-landing {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 0;
}

.landing {
    min-height: calc(100vh - 64px);
}

.landing-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    min-height: calc(100vh - 64px);
}

.landing-ink {
    position: relative;
    padding: clamp(32px, 6vw, 72px) clamp(24px, 5vw, 72px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    background:
        radial-gradient(ellipse 90% 70% at 0% 100%, rgba(29, 78, 216, 0.35), transparent 55%),
        linear-gradient(165deg, var(--ink) 0%, var(--ink-soft) 100%);
    overflow: hidden;
}

.landing-ink::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 80% 70% at 30% 40%, #000 20%, transparent 75%);
    pointer-events: none;
}

.landing-kicker {
    position: relative;
    margin: 0 0 18px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #93c5fd;
}

.landing-brand {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 20px;
    font-family: "Space Grotesk", "Source Sans 3", sans-serif;
    font-size: clamp(1.75rem, 3.5vw, 2.4rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #f8fafc;
}

.landing-brand-mark {
    display: block;
    flex-shrink: 0;
    padding: 8px 12px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}
.landing-brand-mark img {
    display: block;
    width: auto;
    height: clamp(28px, 3.2vw, 36px);
    border-radius: 0;
    box-shadow: none;
}
.landing-brand-text {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.landing-brand-text .brand-sep {
    color: color-mix(in srgb, #f8fafc 45%, transparent);
    font-weight: 400;
}

.landing-lead {
    position: relative;
    margin: 0 0 28px;
    max-width: 32ch;
    font-size: 1.15rem;
    line-height: 1.5;
    color: #b6c4d8;
}

.landing-cta {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 40px;
}

.landing-btn {
    background: #fff;
    color: var(--ink);
    padding: 13px 22px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 999px;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
    transition: transform 160ms ease, background 160ms ease;
}
.landing-btn:hover {
    background: #dbeafe;
    color: var(--ink);
    transform: translateY(-2px);
    text-decoration: none;
}

.landing-hint {
    margin: 0;
    max-width: 34ch;
    font-size: 13px;
    line-height: 1.45;
    color: #8fa3bd;
}

.landing-rail {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 18px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    font-family: "Space Grotesk", "Source Sans 3", sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #c5d4e8;
}
.landing-rail span {
    display: inline-block;
    margin-right: 8px;
    color: #60a5fa;
    font-variant-numeric: tabular-nums;
}

.landing-desk {
    position: relative;
    background:
        radial-gradient(ellipse 70% 55% at 70% 20%, rgba(191, 219, 254, 0.55), transparent 60%),
        linear-gradient(160deg, #dbe4f0 0%, var(--paper) 42%, #e7e2d7 100%);
    padding: clamp(36px, 7vw, 80px) clamp(24px, 5vw, 64px);
    display: grid;
    align-content: center;
    justify-items: center;
    overflow: hidden;
}

.landing-desk-glow {
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.18), transparent 68%);
    top: 18%;
    right: 8%;
    pointer-events: none;
}

.landing-slip {
    position: relative;
    width: min(100%, 380px);
    padding: 16px 18px 18px;
    background: #fffdf8;
    border: 1px solid var(--paper-line);
    border-left-width: 5px;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 18px 40px rgba(15, 23, 42, 0.12);
    color: #1f2937;
}
.landing-slip header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}
.landing-slip-status {
    font-family: "Space Grotesk", sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.landing-slip-id {
    font-size: 11px;
    font-weight: 600;
    color: #94a3b8;
    font-variant-numeric: tabular-nums;
}
.landing-slip p {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: #334155;
}

.landing-slip-pass {
    border-left-color: #166534;
    transform: rotate(-3.5deg) translate(-18px, 8px);
    z-index: 1;
}
.landing-slip-pass .landing-slip-status { color: #166534; }

.landing-slip-warn {
    border-left-color: #a16207;
    transform: rotate(2.2deg) translate(10px, -6px);
    z-index: 2;
    margin-top: -12px;
}
.landing-slip-warn .landing-slip-status { color: #a16207; }

.landing-slip-fail {
    border-left-color: #991b1b;
    transform: rotate(-1.2deg) translate(-4px, -4px);
    z-index: 3;
    margin-top: -10px;
}
.landing-slip-fail .landing-slip-status { color: #991b1b; }

.landing-meter {
    position: relative;
    z-index: 4;
    margin-top: 28px;
    width: min(100%, 220px);
    padding: 16px 18px 18px;
    background: var(--ink);
    color: #e8eef7;
    border-radius: 18px;
    box-shadow: 0 22px 44px rgba(7, 21, 40, 0.35);
    animation: landing-meter-pulse 4.5s ease-in-out infinite;
}
.landing-meter-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #93c5fd;
    margin-bottom: 10px;
}
.landing-meter-track {
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    overflow: hidden;
    margin-bottom: 10px;
}
.landing-meter-fill {
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #60a5fa, #1d4ed8);
}
.landing-meter-value {
    font-family: "Space Grotesk", sans-serif;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 4px;
}
.landing-meter-note {
    font-size: 12px;
    color: #9fb2c9;
}

.landing-ink,
.landing-desk {
    animation: landing-rise 750ms ease both;
}
.landing-desk {
    animation-delay: 90ms;
}

@keyframes landing-rise {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes landing-meter-pulse {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}


/* ---- Creative progress theatre ---- */
@property --theatre-accent {
    syntax: '<color>';
    inherits: true;
    initial-value: #1d4ed8;
}
@property --theatre-soft {
    syntax: '<color>';
    inherits: true;
    initial-value: #dbeafe;
}
@property --theatre-glow {
    syntax: '<color>';
    inherits: true;
    initial-value: rgba(37, 99, 235, 0.28);
}

.theatre {
    --theatre-accent: #1d4ed8;
    --theatre-soft: #dbeafe;
    --theatre-glow: rgba(37, 99, 235, 0.28);
    display: grid;
    gap: 20px;
    margin-top: 10px;
    padding: 22px 20px 16px;
    border: 1px solid #bfdbfe;
    border-radius: 18px;
    background:
        radial-gradient(90% 70% at 50% 0%, color-mix(in srgb, var(--theatre-soft) 85%, white) 0%, transparent 60%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    overflow: hidden;
    transition:
        --theatre-accent 0.9s ease,
        --theatre-soft 0.9s ease,
        --theatre-glow 0.9s ease,
        border-color 0.9s ease,
        background 0.9s ease;
}
.theatre[hidden] { display: none !important; }

.theatre[data-outcome="match"] {
    --theatre-accent: #16a34a;
    --theatre-soft: #dcfce7;
    --theatre-glow: rgba(22, 163, 74, 0.28);
    border-color: #86efac;
}
.theatre[data-outcome="partial"] {
    --theatre-accent: #ea580c;
    --theatre-soft: #ffedd5;
    --theatre-glow: rgba(234, 88, 12, 0.28);
    border-color: #fdba74;
}
.theatre[data-outcome="none"],
.theatre[data-outcome="failed"] {
    --theatre-accent: #dc2626;
    --theatre-soft: #fee2e2;
    --theatre-glow: rgba(220, 38, 38, 0.28);
    border-color: #fca5a5;
}

.theatre-stage {
    position: relative;
    min-height: 168px;
    display: grid;
    place-items: center;
    isolation: isolate;
}
.theatre-orb {
    position: relative;
    width: 132px;
    height: 132px;
    z-index: 2;
}
.theatre-orb-ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background:
        conic-gradient(from -90deg, var(--theatre-accent) 0 calc(var(--pct, 0) * 1%), #e2e8f0 0);
    mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px));
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px));
    transition: filter 0.9s ease;
}
.theatre-orb-core {
    position: absolute;
    inset: 14px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 35% 30%, #ffffff 0%, #eff6ff 45%, #dbeafe 100%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.9),
        0 10px 28px var(--theatre-glow);
}
.theatre-orb-pct {
    font-family: "Space Grotesk", "Source Sans 3", sans-serif;
    font-size: 28px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text);
    letter-spacing: -0.02em;
}

.theatre-waves {
    position: absolute;
    inset: 18% 10%;
    border-radius: 999px;
    pointer-events: none;
    opacity: 0;
    background:
        radial-gradient(closest-side, transparent 40%, rgba(37,99,235,0.08) 70%, transparent 100%);
    z-index: 1;
}
.theatre-align-glow {
    position: absolute;
    inset: 28% 8%;
    border-radius: 999px;
    opacity: 0;
    background: linear-gradient(90deg, transparent, rgba(37,99,235,0.18), transparent);
    z-index: 1;
    pointer-events: none;
}
.theatre-film {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 0 8px 2px;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.35s ease, transform 0.35s ease;
    z-index: 3;
    pointer-events: none;
    overflow-x: auto;
    max-width: 100%;
}
.theatre.has-film .theatre-film {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.theatre.has-film .theatre-orb {
    transform: scale(0.82) translateY(-18px);
    transition: transform 0.45s ease;
}

.theatre-frame {
    margin: 0;
    flex: 0 0 auto;
    width: 56px;
}
.theatre-frame.is-new { animation: theatre-pop 0.5s ease; }
.theatre-frame-ring {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    padding: 3px;
    background: conic-gradient(#cbd5e1 0 calc(var(--sim, 0) * 1%), #e2e8f0 0);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.12);
}
.theatre-frame.is-match .theatre-frame-ring,
.theatre-frame.is-indexed .theatre-frame-ring {
    background: conic-gradient(#16a34a 0 100%, transparent 0);
}
.theatre-frame.is-miss .theatre-frame-ring {
    background: conic-gradient(#94a3b8 0 calc(var(--sim, 0) * 1%), #e2e8f0 0);
}
.theatre-frame.is-scanning .theatre-frame-ring {
    animation: theatre-spin 1s linear infinite;
    background: conic-gradient(from 0deg, #1d4ed8, #93c5fd, #1d4ed8);
}
.theatre-frame-thumb {
    width: 100%;
    height: 100%;
    border-radius: 11px;
    overflow: hidden;
    background: #0f172a;
}
.theatre-frame-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.theatre-copy {
    text-align: center;
    display: grid;
    gap: 6px;
}
.theatre-kicker {
    margin: 0;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--theatre-accent);
}
.theatre-file-name {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.theatre-status {
    margin: 4px 0 0;
    font-size: 16px;
    font-weight: 650;
    color: var(--theatre-accent);
    min-height: 1.4em;
    transition: color 0.9s ease;
}
.theatre-meta {
    margin: 0;
    font-size: 13px;
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.theatre-elapsed {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.theatre-bar {
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}
.theatre-bar-fill {
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--theatre-accent), color-mix(in srgb, var(--theatre-accent) 65%, white));
    transition: width 0.3s ease, background 0.9s ease;
}
.theatre.is-failed .theatre-bar-fill { background: linear-gradient(90deg, #991b1b, #dc2626); }
.theatre.is-done .theatre-bar-fill,
.theatre[data-outcome="match"] .theatre-bar-fill {
    background: linear-gradient(90deg, var(--theatre-accent), color-mix(in srgb, var(--theatre-accent) 70%, white));
}
.theatre[data-outcome="partial"] .theatre-bar-fill {
    background: linear-gradient(90deg, #c2410c, #fb923c);
}
.theatre[data-outcome="none"] .theatre-bar-fill,
.theatre[data-outcome="failed"] .theatre-bar-fill {
    background: linear-gradient(90deg, #991b1b, #ef4444);
}
.theatre-orb-core {
    transition: background 0.9s ease, box-shadow 0.9s ease;
}
.theatre[data-outcome="match"] .theatre-orb-core {
    background:
        radial-gradient(circle at 35% 30%, #ffffff 0%, #dcfce7 45%, #bbf7d0 100%);
}
.theatre[data-outcome="partial"] .theatre-orb-core {
    background:
        radial-gradient(circle at 35% 30%, #ffffff 0%, #ffedd5 45%, #fed7aa 100%);
}
.theatre[data-outcome="none"] .theatre-orb-core,
.theatre[data-outcome="failed"] .theatre-orb-core {
    background:
        radial-gradient(circle at 35% 30%, #ffffff 0%, #fee2e2 45%, #fecaca 100%);
}

.theatre-band {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
}
.theatre-band[hidden] { display: none !important; }
.theatre-band-wait {
    background: #fff7ed;
    color: #9a3412;
    border: 1px solid #fdba74;
}
.theatre-band-fail {
    background: var(--fail-bg);
    color: var(--fail);
    border: 1px solid #fecaca;
}
.theatre-band code {
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 4px;
    background: rgba(0,0,0,0.06);
}
.theatre-retry { margin-left: auto; }

.theatre-details {
    border-top: 1px dashed var(--line);
    padding-top: 8px;
}
.theatre-details > summary {
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted);
    user-select: none;
}
.theatre-log-list {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    max-height: 140px;
    overflow: auto;
    display: grid;
    gap: 3px;
    font-size: 12px;
}
.theatre-log-list li {
    display: grid;
    grid-template-columns: 3rem 1fr;
    gap: 10px;
    padding: 4px 6px;
    border-radius: 6px;
}
.theatre-log-list li:nth-child(odd) { background: #f8fafc; }
.theatre-log-list time {
    font-variant-numeric: tabular-nums;
    color: var(--muted);
    font-weight: 700;
}

/* Stage-driven motion */
.theatre[data-stage="upload"] .theatre-orb-core,
.theatre[data-stage="queued"] .theatre-orb-core {
    animation: theatre-breathe 2.2s ease-in-out infinite;
}
.theatre[data-stage="queued"] .theatre-orb-ring {
    animation: theatre-spin 4s linear infinite;
    background: conic-gradient(from -90deg, #93c5fd, #1d4ed8, #93c5fd);
}
.theatre[data-stage="frames"] .theatre-orb-core {
    animation: theatre-breathe 1.6s ease-in-out infinite;
}
.theatre[data-stage="audio"] .theatre-waves {
    opacity: 1;
    animation: theatre-ripple 1.4s ease-out infinite;
}
.theatre[data-stage="audio"] .theatre-orb-core {
    animation: theatre-breathe 1.1s ease-in-out infinite;
}
.theatre[data-stage="match"] .theatre-orb-core {
    box-shadow: 0 0 0 0 rgba(37,99,235,0.35), 0 10px 28px var(--theatre-glow);
    animation: theatre-ping 1.5s ease-out infinite;
}
.theatre[data-stage="align"] .theatre-align-glow {
    opacity: 1;
    animation: theatre-sweep 1.8s ease-in-out infinite;
}
.theatre[data-stage="align"] .theatre-film {
    animation: theatre-nudge 1.8s ease-in-out infinite;
}
.theatre[data-stage="index"] .theatre-orb-core,
.theatre[data-stage="report"] .theatre-orb-core {
    animation: theatre-breathe 1.4s ease-in-out infinite;
}
.theatre[data-stage="done"] .theatre-orb-core {
    animation: theatre-settle 0.6s ease forwards;
}
.theatre[data-stage="failed"] .theatre-orb-core {
    animation: none;
}

@keyframes theatre-breathe {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}
@keyframes theatre-spin {
    to { transform: rotate(360deg); }
}
@keyframes theatre-ripple {
    0% { transform: scaleX(0.55); opacity: 0.15; }
    50% { transform: scaleX(1); opacity: 0.55; }
    100% { transform: scaleX(1.15); opacity: 0; }
}
@keyframes theatre-ping {
    0% { box-shadow: 0 0 0 0 rgba(37,99,235,0.35), 0 10px 28px var(--theatre-glow); }
    100% { box-shadow: 0 0 0 18px rgba(37,99,235,0), 0 10px 28px var(--theatre-glow); }
}
@keyframes theatre-sweep {
    0%, 100% { transform: translateX(-18%); opacity: 0.25; }
    50% { transform: translateX(18%); opacity: 0.7; }
}
@keyframes theatre-nudge {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(6px); }
}
@keyframes theatre-pop {
    from { opacity: 0; transform: translateY(10px) scale(0.86); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes theatre-settle {
    from { transform: scale(1.06); }
    to { transform: scale(1); }
}

@media (max-width: 700px) {
    .theatre-orb { width: 112px; height: 112px; }
    .theatre-orb-pct { font-size: 24px; }
    .theatre-frame,
    .theatre-frame-ring { width: 48px; height: 48px; }
    .theatre-status { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
    .landing-ink,
    .landing-desk,
    .landing-meter {
        animation: none;
    }
    .theatre-orb-core,
    .theatre-orb-ring,
    .theatre-waves,
    .theatre-align-glow,
    .theatre-film,
    .theatre-frame.is-new,
    .theatre-frame.is-scanning .theatre-frame-ring,
    .theatre[data-stage="align"] .theatre-film {
        animation: none !important;
        transition: none !important;
    }
}

@media (max-width: 960px) {
    .landing-stage {
        grid-template-columns: 1fr;
    }
    .landing-ink {
        min-height: auto;
        padding-bottom: 40px;
    }
    .landing-desk {
        min-height: 420px;
        padding-top: 28px;
        padding-bottom: 48px;
    }
    .landing-slip-pass,
    .landing-slip-warn,
    .landing-slip-fail {
        transform: none;
        margin-top: 0;
    }
    .landing-slip + .landing-slip {
        transform: none;
        margin-top: 12px;
    }
}

/* Laravel default pagination uses Tailwind utility classes; constrain icons without Tailwind. */
nav[aria-label="Pagination Navigation"],
nav[role="navigation"] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 1rem;
    font-size: 14px;
    color: var(--muted);
}

nav[aria-label="Pagination Navigation"] > div,
nav[role="navigation"] > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

nav[aria-label="Pagination Navigation"] span,
nav[aria-label="Pagination Navigation"] a,
nav[role="navigation"] span,
nav[role="navigation"] a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    line-height: 1;
}

nav[aria-label="Pagination Navigation"] a,
nav[role="navigation"] a {
    color: var(--accent);
    text-decoration: none;
    border: 1px solid var(--border, #e5e7eb);
    background: #fff;
}

nav[aria-label="Pagination Navigation"] a:hover,
nav[role="navigation"] a:hover {
    background: var(--accent-soft, #eff6ff);
}

nav[aria-label="Pagination Navigation"] svg,
nav[role="navigation"] svg,
.pagination svg {
    width: 1.25rem;
    height: 1.25rem;
    max-width: 1.25rem;
    max-height: 1.25rem;
    display: block;
    flex-shrink: 0;
}

.wrap-agreement { max-width: 46rem; }
.agreement-shell { margin: 0 auto; }
.agreement-header h1 {
    font-family: var(--font-display);
    font-size: 1.75rem;
    margin: 0 0 0.35rem;
}
.agreement-document {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow-card);
    border-top: 3px solid var(--accent);
    display: flex;
    flex-direction: column;
    max-height: min(70vh, 40rem);
}
.agreement-document-body {
    padding: 1.25rem 1.5rem;
    overflow: auto;
    white-space: pre-wrap;
    line-height: 1.55;
    flex: 1;
}
.agreement-accept {
    position: sticky;
    bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--panel) 92%, var(--accent-soft));
}

/* Admin entity pages: buyers + campaigns */
.page-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 1.25rem;
}
.page-head > div:first-child { min-width: 0; flex: 1; }
.page-head h1 { margin: 0 0 0.35rem; }
.page-head .lede { margin: 0 0 0.5rem; }
.page-head .page-head-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}
.page-head .actions { margin-top: 0; }

.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin: 0 0 1.25rem;
}
.stat {
    display: block;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow-card);
    padding: 1rem 1.1rem;
    text-decoration: none;
    color: inherit;
}
a.stat:hover {
    border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
    text-decoration: none;
}
.stat-value {
    font-family: var(--font-display);
    font-size: 1.65rem;
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -0.02em;
}
.stat-label {
    margin-top: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.stat.is-pass .stat-value { color: var(--pass); }
.stat.is-warning .stat-value { color: var(--warn); }
.stat.is-fail .stat-value { color: var(--fail); }
.stat.is-empty .stat-value { color: var(--muted); opacity: 0.55; }
.stat.is-empty .stat-label { opacity: 0.85; }

.meta-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
    margin: 0.35rem 0 0;
    font-size: 0.88rem;
    color: var(--muted);
    font-weight: 500;
}
.meta-strip .meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.meta-strip .meta-item:not(:last-child)::after {
    content: "·";
    margin-left: 0.55rem;
    color: color-mix(in srgb, var(--muted) 70%, transparent);
    font-weight: 400;
}
.meta-strip .meta-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: color-mix(in srgb, var(--muted) 85%, var(--text));
}

.panel-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin: 0 0 1.25rem;
}
@media (min-width: 900px) {
    .panel-grid {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }
}
.panel-grid > .card { margin-bottom: 0; }

.status-tile {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--panel) 96%, var(--bg));
}
.status-tile + .status-tile { margin-top: 0.65rem; }
.status-tile-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}
.status-tile-label {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.status-tile-body {
    font-size: 0.95rem;
    font-weight: 500;
}
.status-tile-action {
    margin-top: 0.15rem;
    font-size: 0.88rem;
}

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.25rem 0;
}
.empty-state p {
    margin: 0;
    color: var(--muted);
}

.add-panel {
    margin-top: 1.1rem;
    border-top: 1px solid var(--line);
    padding-top: 0.85rem;
}
.add-panel > summary {
    cursor: pointer;
    list-style: none;
    font-weight: 650;
    font-size: 0.95rem;
    color: var(--text);
    user-select: none;
}
.add-panel > summary::-webkit-details-marker { display: none; }
.add-panel > summary::before {
    content: "+";
    display: inline-block;
    width: 1.1rem;
    font-weight: 700;
    color: var(--accent);
}
.add-panel[open] > summary::before { content: "−"; }
.add-panel.is-headless { border-top: 0; padding-top: 0; margin-top: 0; }
.add-panel.is-headless > summary { display: none; }
.add-panel.is-headless[open] {
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px dashed var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--panel) 92%, var(--bg));
}
.add-panel.is-headless .add-panel-body { margin-top: 0; }
.add-panel > summary:hover { color: var(--link); }
.add-panel-body {
    margin-top: 0.85rem;
}

.detail-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    align-items: start;
}
@media (min-width: 1000px) {
    .detail-layout { grid-template-columns: minmax(0, 1fr) 360px; }
}
.detail-main > .card:last-child,
.detail-side > .side-section:last-child { margin-bottom: 0; }
.detail-side {
    background: color-mix(in srgb, var(--panel) 92%, var(--bg));
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 0.35rem 1.15rem;
}
@media (min-width: 1000px) {
    .detail-side { position: sticky; top: 1rem; }
}
.side-section {
    padding: 1rem 0;
    border-bottom: 1px solid var(--line);
}
.side-section:last-child { border-bottom: 0; }
.side-section-title {
    margin: 0 0 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}
.side-section .kv {
    grid-template-columns: minmax(6rem, 8.5rem) 1fr;
    gap: 0.5rem 0.75rem;
    font-size: 0.92rem;
}
.side-section .table { font-size: 0.88rem; }

.stats-bar {
    display: flex;
    flex-wrap: wrap;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: var(--shadow-card);
    margin: 0 0 1.25rem;
    overflow: hidden;
}
.stats-bar-item {
    flex: 1 1 120px;
    padding: 0.85rem 1.1rem;
    border-right: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
}
.stats-bar-item:last-child { border-right: 0; }
.stats-bar-value {
    font-family: var(--font-display);
    font-size: 1.45rem;
    font-weight: 650;
    line-height: 1.1;
}
.stats-bar-label {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.stats-bar-item.is-pass .stats-bar-value { color: var(--pass); }
.stats-bar-item.is-warning .stats-bar-value { color: var(--warn); }
.stats-bar-item.is-fail .stats-bar-value { color: var(--fail); }
.stats-bar-item.is-empty .stats-bar-value { color: var(--muted); opacity: 0.5; }
.stats-bar.is-quiet {
    padding: 0.8rem 1.1rem;
    color: var(--muted);
    font-size: 0.92rem;
    font-weight: 500;
}

.status-tile.is-ok {
    border-left: 4px solid var(--pass);
    background: var(--panel);
}
.status-tile.is-todo {
    border-left: 4px solid #f59e0b;
    background: color-mix(in srgb, var(--panel) 85%, var(--warn-bg));
}
.status-tile.is-alert {
    border-left: 4px solid var(--fail);
    background: color-mix(in srgb, var(--panel) 88%, var(--fail-bg));
}
.status-tile .btn { align-self: flex-start; margin-top: 0.35rem; }

.section-title-count {
    margin-left: 0.4rem;
    font-weight: 500;
    color: var(--muted);
    font-size: 0.95rem;
}
.detail-main .section-card-head h2 { font-size: 1.15rem; }
.detail-main .empty-state { padding: 0; }

.activity {
    list-style: none;
    padding: 0;
    margin: 0;
}
.activity li {
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--line);
    font-size: 0.9rem;
    line-height: 1.35;
}
.activity li:last-child { border-bottom: 0; }
.activity-finding {
    margin-top: 2px;
    font-size: 0.85rem;
}
.activity-claim {
    margin-top: 2px;
    font-size: 0.8rem;
}

.kv {
    display: grid;
    grid-template-columns: minmax(7rem, 11rem) 1fr;
    gap: 0.55rem 1rem;
    margin: 0;
}
.kv dt {
    margin: 0;
    color: var(--muted);
    font-size: 0.85rem;
    font-weight: 600;
}
.kv dd {
    margin: 0;
    font-weight: 500;
    word-break: break-word;
}

.table-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 1rem;
    margin: 0 0 1rem;
}
.table-toolbar form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    flex: 1;
    margin: 0;
}
.table-toolbar input[type="search"],
.table-toolbar select {
    min-width: 12rem;
    max-width: 22rem;
}
.table-toolbar .filter-chip { margin: 0; }
.table-toolbar .result-count {
    margin-left: auto;
    font-size: 0.85rem;
    color: var(--muted);
    font-weight: 600;
}
.table-toolbar select[name="country_code"],
.table-toolbar select[name="channel"] {
    min-width: 9.5rem;
    max-width: 14rem;
}

.table.table-dense th,
.table.table-dense td {
    padding: 0.55rem 0.65rem;
    vertical-align: top;
}
.table.table-dense th.num,
.table.table-dense td.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.campaigns-table th,
.campaigns-table td {
    vertical-align: middle;
}
.campaigns-table thead th {
    position: sticky;
    top: 3.75rem; /* below sticky .topbar */
    z-index: 3;
    background: var(--panel, #fff);
    box-shadow: 0 1px 0 var(--line);
}
.campaigns-table .cell-id {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.campaigns-table .sort-link {
    color: inherit;
    text-decoration: none;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}
.campaigns-table .sort-link:hover {
    color: var(--link);
    text-decoration: underline;
}
.campaigns-table .sort-link.is-active {
    color: var(--text);
}
.campaigns-table .cell-market .entity-name {
    display: inline-block;
    line-height: 1.25;
}
.campaigns-table td.cell-country,
.campaigns-table td.cell-channel {
    white-space: nowrap;
}
.campaigns-table td.cell-brand {
    max-width: 12rem;
}
.campaigns-table .cell-flags {
    white-space: nowrap;
}
.campaigns-table .cell-flags .badge {
    margin: 0 0.2rem 0.15rem 0;
}
.campaigns-table .cell-actions {
    text-align: right;
    white-space: nowrap;
}
.campaigns-table .row-actions {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0.65rem;
    align-items: center;
    justify-content: flex-end;
}
.campaigns-table tbody tr.is-flagged {
    background: transparent;
}
.campaigns-table tbody tr:hover td {
    background: transparent;
}
.campaigns-table tbody tr:hover {
    background: color-mix(in srgb, var(--accent-soft) 40%, white);
}
.row-link {
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--link);
    text-decoration: none;
}
.row-link:hover {
    text-decoration: underline;
}

.entity-sub {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.82rem;
    color: var(--muted);
    font-weight: 500;
}
.entity-name {
    font-weight: 650;
    color: var(--text);
}
a.entity-name:hover { color: var(--link); }

.section-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.section-card-head h2 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 650;
}

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

.case-chat-fab {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 60;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--link);
    color: #fff;
    font: inherit;
    font-weight: 700;
    box-shadow: 0 8px 24px rgba(15, 78, 128, 0.28);
    cursor: pointer;
}
.case-chat-fab:hover { background: var(--link-hover); }
.case-chat-is-open .case-chat-fab { display: none; }

.case-chat-fab-icon {
    position: relative;
    width: 18px;
    height: 15px;
    border: 2px solid currentColor;
    border-radius: 4px 4px 4px 0;
}
.case-chat-fab-icon::after {
    content: "";
    position: absolute;
    left: 3px;
    right: 3px;
    top: 3px;
    height: 2px;
    background: currentColor;
    box-shadow: 0 4px 0 currentColor;
}
.case-chat-fab-count {
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 12px;
}

.case-chat-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 70;
    width: min(420px, 100vw);
    display: flex;
    flex-direction: column;
    background: var(--panel);
    border-left: 1px solid var(--line);
    box-shadow: -12px 0 32px rgba(15, 23, 42, 0.12);
}
.case-chat-drawer[hidden] { display: none; }

@media (min-width: 1200px) {
    body.case-chat-is-open { padding-right: 420px; }
}

.case-chat-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px 12px;
}
.case-chat-header h2 { margin: 0; font-size: 1.1rem; }
.case-chat-header p { margin: 2px 0 0; font-size: 13px; }
.case-chat-close {
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.case-chat-close:hover { color: var(--text); }

.case-chat-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 18px 12px;
    border-bottom: 1px solid var(--line);
}
.case-chat-filter {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.case-chat-filter:hover { border-color: var(--link-ring); }
.case-chat-filter.is-active {
    background: var(--link-soft);
    border-color: var(--link);
    color: var(--link);
}
.case-chat-filter-count {
    min-width: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--bg);
    color: var(--muted);
    font-size: 11px;
    text-align: center;
}

.case-chat-flash {
    margin: 12px 18px 0;
    cursor: pointer;
}

.case-chat-thread {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: #f8fafc;
}
.case-chat-thread.is-filtered .chat-msg-anchor { display: none; }
.case-chat-thread.is-filtered .chat-day-sep { display: none; }
.case-chat-empty { margin: auto 0; text-align: center; }

.chat-day-sep {
    display: flex;
    justify-content: center;
    align-self: stretch;
    margin: 4px 0;
}
.chat-day-sep span {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    background: #e2e8f0;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.4;
}

.chat-msg {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 88%;
}
.chat-msg[hidden] { display: none; }
.chat-msg.is-mine { align-self: flex-end; align-items: flex-end; }
.chat-msg.kind-decision {
    align-self: center;
    align-items: center;
    max-width: 100%;
    width: 100%;
}
.chat-msg.is-earlier { max-width: 100%; opacity: 0.92; }
.chat-msg.is-earlier .chat-bubble {
    background: #f1f5f9;
    border-color: var(--line);
    color: var(--text);
}

.chat-msg-author {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
    font-size: 12px;
}
.chat-msg-author[hidden] { display: none; }
.chat-role {
    padding: 0 6px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
}
.is-buyer .chat-role { background: var(--accent-soft); color: var(--accent-ink); }
.is-compliance .chat-role { background: var(--link-soft); color: var(--link); }

.chat-bubble {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 9px 12px 8px;
    border: 1px solid var(--line);
    border-radius: 12px 12px 12px 4px;
    background: #fff;
    line-height: 1.45;
    font-size: 14px;
    overflow-wrap: anywhere;
}
.chat-bubble-body {
    white-space: pre-wrap;
}
.chat-bubble-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 0;
    font-size: 11px;
}
.chat-bubble-meta time {
    flex-shrink: 0;
    margin-left: auto;
}
.is-compliance .chat-bubble {
    border-color: color-mix(in srgb, var(--link) 22%, white);
    background: var(--link-soft);
}
.is-mine .chat-bubble { border-radius: 12px 12px 4px 12px; }
.kind-review_requested .chat-bubble,
.kind-case_submitted .chat-bubble {
    border-color: color-mix(in srgb, #d97706 35%, white);
    background: #fffbeb;
}

.chat-event-label {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #b45309;
}
.chat-event {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 13px;
}
.chat-event--compact {
    width: auto;
    max-width: 100%;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    flex-wrap: nowrap;
    gap: 8px;
    font-size: 12px;
}
.chat-event--compact .badge {
    flex-shrink: 0;
    font-size: 11px;
    padding: 2px 8px;
}
.chat-event--case {
    border-color: color-mix(in srgb, var(--link) 28%, var(--line));
    background: color-mix(in srgb, var(--link-soft) 45%, white);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--link) 12%, transparent);
}
.chat-event--case .badge.pass {
    background: var(--pass);
    color: #fff;
}
.chat-event--case .badge.fail {
    background: var(--fail);
    color: #fff;
}
.chat-event--case .badge.warning {
    background: var(--warn);
    color: #fff;
}
.chat-event--compact .chat-event-who {
    flex-shrink: 0;
}
.chat-event--compact .chat-msg-anchor {
    min-width: 0;
    max-width: 10rem;
}
.chat-event--compact .chat-chip {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.chat-event--compact time {
    flex-shrink: 0;
}
.chat-event-notes {
    margin: 6px 0 0;
    align-self: center;
    max-width: 100%;
    font-size: 12px;
    color: var(--muted);
    text-align: center;
    white-space: pre-wrap;
}
.chat-audit {
    margin: 0;
    width: 100%;
    text-align: left;
    font-size: 12px;
}
.chat-msg.kind-decision .chat-audit {
    width: auto;
    max-width: 100%;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.chat-audit--inline > summary.chat-event--compact {
    display: flex;
    list-style: none;
    cursor: pointer;
}
.chat-audit--inline > summary.chat-event--compact::-webkit-details-marker { display: none; }
.chat-audit--inline > summary.chat-event--compact::marker { content: ''; }
.chat-audit--inline[open] > summary.chat-event--compact {
    outline: 2px solid color-mix(in srgb, var(--link) 35%, transparent);
    outline-offset: 1px;
}
.chat-audit-dl {
    margin: 6px 0 0;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fafafa;
    display: grid;
    gap: 6px;
}
.chat-audit-dl > div {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 8px;
}
.chat-audit-dl dt {
    margin: 0;
    color: var(--muted);
    font-weight: 600;
}
.chat-audit-dl dd {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}
.chat-audit-link {
    margin: 6px 0 0;
    font-size: 12px;
}
.chat-msg-anchor { margin-top: 0; min-width: 0; }
.chat-bubble-meta .chat-msg-anchor { flex: 1 1 auto; }
.chat-bubble-meta .chat-chip {
    max-width: 100%;
    padding: 1px 7px;
    font-size: 11px;
}
.chat-event--compact .chat-msg-anchor { margin-top: 0; }

.chat-chip {
    display: inline-block;
    max-width: 100%;
    padding: 2px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--link);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
.chat-chip:hover { border-color: var(--link); background: var(--link-soft); }
.chat-chip.is-static { color: var(--muted); cursor: default; }
.chat-chip.is-static:hover { border-color: var(--line); background: #fff; }

.case-chat-compose {
    padding: 12px 18px 14px;
    border-top: 1px solid var(--line);
    background: #fff;
}
.chat-context {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 13px;
    min-width: 0;
}
.chat-context .chat-chip:not([data-chat-jump]) { cursor: default; }
.chat-context-clear {
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.chat-context-clear:hover { color: var(--text); }

.chat-input-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}
.chat-input-row textarea {
    flex: 1 1 auto;
    min-height: 40px;
    max-height: 160px;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    font: inherit;
    line-height: 1.4;
    resize: none;
}
.chat-input-row .btn { flex: 0 0 auto; }

.chat-request {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
}
.chat-request[hidden] { display: none; }
.chat-request input { margin: 0; }
.chat-hint { margin: 6px 0 0; font-size: 12px; }

.case-chat-thread .chat-msg.is-chat-target .chat-bubble,
.finding.is-chat-target,
.asset-grid-item.is-chat-target {
    outline: 2px solid color-mix(in srgb, var(--link) 55%, white);
    outline-offset: 2px;
}

/* Facebook / UGC script compose (case create) */
.check-seg--2 {
    grid-template-columns: repeat(2, 1fr);
    max-width: 22rem;
    margin: 0 0 14px;
}
.copy-delivery-seg-btn {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 7px 10px;
    border-radius: 8px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.copy-delivery-seg-btn:hover {
    color: var(--text);
}
.copy-delivery-seg-btn.is-active {
    background: #fff;
    color: var(--accent);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.fb-compose {
    display: grid;
    gap: 14px;
}
@media (min-width: 900px) {
    .fb-compose {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
        gap: 16px;
        align-items: start;
    }
    .fb-compose-script {
        min-height: 16rem;
    }
}
.fb-compose[hidden] {
    display: none !important;
}
.fb-compose-panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px 16px 16px;
    box-shadow: var(--shadow-card);
}
.fb-compose-panel--script {
    border-color: color-mix(in srgb, var(--link) 22%, var(--line));
    background: linear-gradient(180deg, #f7fbff 0%, #fff 42%);
}
.fb-compose-panel--ad {
    border-color: color-mix(in srgb, var(--accent) 18%, var(--line));
    background: linear-gradient(180deg, #fff8f8 0%, #fff 40%);
}
.fb-compose-panel-head {
    margin: 0 0 12px;
}
.fb-compose-kicker {
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
}
.fb-compose-title {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.02em;
}
.fb-compose-lede {
    margin: 4px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
}
.fb-compose-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.fb-compose-script {
    width: 100%;
    min-height: 9rem;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    font: inherit;
    line-height: 1.45;
    resize: vertical;
}
.fb-compose-script:focus {
    outline: 2px solid var(--link-ring);
    outline-offset: 1px;
    border-color: color-mix(in srgb, var(--link) 45%, var(--line));
}
.fb-compose-group {
    display: grid;
    gap: 8px;
    padding-top: 12px;
    margin-top: 12px;
    border-top: 1px solid var(--line);
}
.fb-compose-group:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}
.fb-compose-group-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}
.fb-compose-group-head h4 {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
}
.fb-compose-count {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}
.fb-compose-rows {
    display: grid;
    gap: 8px;
}
.fb-compose-row {
    display: grid;
    grid-template-columns: 1.5rem minmax(0, 1fr) 1.75rem;
    gap: 8px;
    align-items: center;
}
.fb-compose-row--textarea {
    align-items: start;
}
.fb-compose-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    background: #eef2f7;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.fb-compose-row--textarea .fb-compose-index {
    margin-top: 10px;
}
.fb-compose-row input[type=text],
.fb-compose-row textarea {
    width: 100%;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    font: inherit;
    line-height: 1.4;
}
.fb-compose-row textarea {
    resize: vertical;
    min-height: 4.5rem;
}
.fb-compose-row input[type=text]:focus,
.fb-compose-row textarea:focus {
    outline: 2px solid var(--accent-ring);
    outline-offset: 1px;
    border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
}
.fb-compose-remove {
    appearance: none;
    border: 0;
    background: transparent;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 8px;
    color: var(--muted);
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
.fb-compose-row--textarea .fb-compose-remove {
    margin-top: 8px;
}
.fb-compose-remove:hover {
    background: var(--accent-soft);
    color: var(--accent-ink);
}
.fb-compose-remove[hidden] {
    visibility: hidden;
    pointer-events: none;
}
.fb-compose-add {
    appearance: none;
    border: 0;
    background: transparent;
    align-self: start;
    padding: 2px 0;
    margin: 0;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--link);
    cursor: pointer;
}
.fb-compose-add:hover {
    color: var(--link-hover);
    text-decoration: underline;
}
.fb-compose-doc {
    display: grid;
    gap: 10px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--panel);
    box-shadow: var(--shadow-card);
}
.fb-compose-doc[hidden] {
    display: none !important;
}
.fb-compose-doc-hint {
    margin-top: 6px;
    padding: 8px 10px;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px dashed var(--line);
}

/* Media buyer registration — ad platform emails */
.ad-platform-emails {
    display: grid;
    gap: 8px;
    margin: 0 0 12px;
}
.ad-platform-emails-rows {
    display: grid;
    gap: 8px;
}
.ad-platform-emails-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 1.75rem;
    gap: 8px;
    align-items: center;
}
.ad-platform-emails-row input[type=email] {
    width: 100%;
    margin: 0;
}
.ad-platform-emails-remove {
    appearance: none;
    border: 0;
    background: transparent;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 8px;
    color: var(--muted);
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
.ad-platform-emails-remove:hover {
    background: var(--accent-soft);
    color: var(--accent-ink);
}
.ad-platform-emails-remove[hidden] {
    visibility: hidden;
    pointer-events: none;
}
.ad-platform-emails-add {
    appearance: none;
    border: 0;
    background: transparent;
    align-self: start;
    padding: 2px 0;
    margin: 0;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--link);
    cursor: pointer;
}
.ad-platform-emails-add:hover {
    color: var(--link-hover);
    text-decoration: underline;
}
.ad-platform-emails-add[hidden] {
    display: none;
}

/* Media buyer registration layout */
.mb-register {
    max-width: 52rem;
    margin: 28px auto 56px;
    display: grid;
    gap: 16px;
}
.mb-register-hero {
    padding: 4px 2px 2px;
}
.mb-register-kicker {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
}
.mb-register-hero h1 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.2;
}
.mb-register-meta {
    margin: 8px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    align-items: center;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.4;
}
.mb-register-dot {
    color: #cbd5e1;
}
.mb-register-form {
    display: grid;
    gap: 14px;
}
.mb-register-panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px 18px 18px;
    box-shadow: var(--shadow-card);
}
.mb-register-panel--contact {
    border-color: color-mix(in srgb, var(--link) 18%, var(--line));
    background: linear-gradient(180deg, #f7fbff 0%, #fff 36%);
}
.mb-register-panel--signin {
    border-color: color-mix(in srgb, var(--accent) 16%, var(--line));
    background: linear-gradient(180deg, #fff8f8 0%, #fff 40%);
}
.mb-register-panel-head {
    margin: 0 0 14px;
}
.mb-register-panel-kicker {
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
}
.mb-register-panel-title {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--text);
}
.mb-register-panel-lede {
    margin: 4px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
}
.mb-register-fields {
    display: grid;
    gap: 12px;
}
.mb-register-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
@media (min-width: 720px) {
    .mb-register-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.mb-register-field label {
    display: block;
    margin: 0 0 4px;
    font-size: 13px;
    font-weight: 600;
}
.mb-register-field input,
.mb-register-field textarea {
    width: 100%;
    margin: 0;
}
.mb-register-field--full {
    grid-column: 1 / -1;
}
.mb-register-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin-top: 2px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--panel) 92%, white);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.06);
    backdrop-filter: blur(8px);
}
.mb-register-footer .muted {
    margin: 0;
    font-size: 13px;
}
.mb-register-submit {
    padding: 11px 20px;
    font-size: 15px;
    font-weight: 700;
}

/* Market VAT fields */
.market-vat {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.market-vat-label {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
}
.market-vat-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
}
.market-vat-seg {
    position: relative;
    width: 12rem;
    max-width: 100%;
    margin: 0;
    grid-template-columns: repeat(2, 1fr);
}
.market-vat-seg-thumb {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 3px;
    width: calc(50% - 4px);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.1);
    transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
    pointer-events: none;
    z-index: 0;
}
.market-vat-seg.is-no .market-vat-seg-thumb {
    transform: translateX(calc(100% + 2px));
}
.market-vat-seg.is-yes .market-vat-seg-thumb {
    transform: translateX(0);
}
.market-vat-seg .check-seg-item {
    z-index: 1;
}
.market-vat-seg .check-seg-item span {
    background: transparent;
    box-shadow: none;
    transition: color 0.2s ease;
}
.market-vat-seg .check-seg-item.is-active span {
    background: transparent;
    color: var(--accent);
    box-shadow: none;
}
.market-vat-seg .check-seg-item:not(.is-active) span {
    color: #64748b;
}
.market-vat-rate[hidden] {
    display: none !important;
}
.market-vat-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 2.25rem;
    padding: 4px 6px 4px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.market-vat-chip-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
}
.market-vat-chip-value {
    font-size: 14px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text);
    min-width: 2.5rem;
}
.market-vat-chip-input {
    width: 3.75rem;
    margin: 0;
    padding: 4px 6px;
    border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.market-vat-chip-input:focus {
    outline: 2px solid var(--accent-ring);
    outline-offset: 1px;
}
.market-vat-chip-edit,
.market-vat-chip-done {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
}
.market-vat-chip-edit:hover,
.market-vat-chip-done:hover {
    background: var(--accent-soft);
    color: var(--accent-ink);
}
.market-vat-chip-done {
    color: var(--accent);
}
.market-vat-chip.is-editing {
    border-color: color-mix(in srgb, var(--accent) 28%, var(--line));
    background: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent);
}
.campaign-retainer[hidden],
#materials-budget-field[hidden] {
    display: none !important;
}
.campaign-retainer-chip .market-vat-chip-input {
    width: 5rem;
}
.campaign-retainer-unit {
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    margin-right: 2px;
}
@media (prefers-reduced-motion: reduce) {
    .market-vat-seg-thumb {
        transition: none;
    }
}

/* Market bulk VAT */
.market-bulk-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
    border-radius: 12px;
    background: linear-gradient(180deg, #fff8f8 0%, #fff 70%);
}
.market-bulk-bar[hidden] {
    display: none !important;
}
.market-bulk-bar-copy {
    font-size: 13px;
}
.market-bulk-bar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.market-bulk-chip {
    display: inline-flex;
    align-items: center;
}
.market-bulk-helpers {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
}
.market-bulk-check {
    width: 2.25rem;
    text-align: center;
    vertical-align: middle;
}
.market-bulk-check input[type=checkbox] {
    width: 1rem;
    height: 1rem;
    margin: 0;
    cursor: pointer;
}