/* Colour and typography live in theme.css — the one file to edit.
   This import is what makes that true for every page loading saas.css. */
@import url('/static/css/theme.css?v=6');
/* Palettes come after the theme so a [data-theme] block can override
   layer 0. Both selectors weigh the same, so order is what decides. */
@import url('/static/css/palettes.css?v=1');

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }  /* color-scheme comes from theme.css */
body { margin: 0; min-height: 100vh; background: var(--cw-bg); color: var(--cw-text); font-family: var(--cw-font); line-height: 1.5; }
button, input { font: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
svg { width: 18px; height: 18px; stroke-width: 1.8; }

.brand-lockup { display: inline-flex; align-items: center; gap: 10px; color: var(--cw-text); font-size: 15px; font-weight: 750; white-space: nowrap; }
.brand-lockup img { flex: 0 0 auto; }
/* Beats the global `svg { width: 18px }` above, which a width attribute
   on the element cannot. The mark inherits its colour from the lockup. */
.brand-mark { flex: 0 0 auto; width: var(--mark-size, 28px); height: var(--mark-size, 28px); }
.eyebrow { margin: 0 0 12px; color: var(--cw-muted); font-size: var(--text-2xs); font-weight: 700; letter-spacing: 0; text-transform: uppercase; }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--cw-green); }

/* Product-status badge — sits beside the brand lockup in every header.
   Tokens are all theme-layer (glass-* and text-*), so the badge follows
   any palette and any polarity with nothing palette-specific. */
.status-badge { position: relative; display: inline-flex; align-items: center; padding: 2px 8px; border: 1px solid var(--glass-border-subtle); border-radius: var(--shape-pill); background: var(--glass-bg-subtle); color: var(--text-muted); font-size: var(--text-xs); font-weight: var(--weight-semibold); letter-spacing: .01em; line-height: 1.4; white-space: nowrap; cursor: default; user-select: none; transition: border-color 150ms ease, background 150ms ease; }
.status-badge:hover { border-color: var(--glass-border); background: var(--glass-bg); }
.status-badge::after { content: attr(data-tooltip); position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); padding: 6px 10px; border: 1px solid var(--border-faint); border-radius: var(--shape-md); background: var(--surface-raised); color: var(--text-soft); font-size: var(--text-sm); font-weight: var(--weight-medium); line-height: 1.45; white-space: nowrap; box-shadow: var(--shadow-sm); pointer-events: none; opacity: 0; transition: opacity 120ms ease; }
.status-badge:hover::after, .status-badge:focus::after { opacity: 1; }
.status-badge:not([data-tooltip])::after { display: none; }

/* Inside the app sidebar the lockup sits in a 272px column. Keep the
   badge inline with the wordmark, matching the marketing-nav treatment,
   but tighten its padding so nothing wraps. */
.app-sidebar__top .brand-lockup { overflow: hidden; }
.app-sidebar__top .status-badge { padding: 1px 6px; font-size: var(--text-2xs); }
.text-link { color: var(--cw-text-soft); font-size: var(--text-md); font-weight: 650; }
.text-link:hover { color: var(--cw-text); }

.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--cw-text); font-size: var(--text-md); font-weight: 700; cursor: pointer; transition: background 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease; }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button:focus-visible, .icon-button:focus-visible, input:focus-visible { outline: 2px solid var(--cw-blue); outline-offset: 2px; }
.button--primary { background: var(--primary); color: var(--text-on-accent); border-color: var(--primary-hover); }
.button--primary:hover:not(:disabled) { background: var(--primary-hover); }
.button--success { background: var(--positive); color: var(--text-on-accent); border-color: color-mix(in srgb, var(--positive) 80%, #fff); }
.button--success:hover:not(:disabled) { background: color-mix(in srgb, var(--positive) 85%, #fff); }
.button--light { background: var(--text); color: var(--surface-deepest); border-color: #fff; }
.button--light:hover:not(:disabled) { background: #fff; }
.button--secondary { background: var(--surface); color: var(--cw-text-soft); border-color: var(--cw-border); }
.button--secondary:hover:not(:disabled), .button--ghost:hover:not(:disabled) { color: var(--cw-text); border-color: var(--border-strong); background: var(--surface-raised); }
.button--ghost { color: var(--cw-text-soft); border-color: transparent; }
.button--large { min-height: 48px; padding: 0 20px; font-size: var(--text-lg); }
.button--block { width: 100%; }
.button--danger { color: var(--negative-text); border-color: var(--negative-line); background: var(--negative-tint); }
.button--danger:hover:not(:disabled) { color: #fff; background: color-mix(in srgb, var(--negative) 55%, var(--surface-base)); border-color: var(--negative); }
.button:disabled { cursor: not-allowed; opacity: .48; }

.icon-button { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); color: var(--cw-muted); cursor: pointer; }
.icon-button:hover { color: var(--cw-text); border-color: var(--border-strong); }

/* The dark/light toggle carries both icons and shows the one matching the
   theme that is on - moon while dark, sun while light. Which one that is
   comes from the data-polarity attribute _theme.html puts on <html>, so it
   is a selector rather than JS reaching in to hide an element, and it keeps
   working for the palettes the toggle does not itself name: graphite is a
   light theme, so graphite shows the sun.

   Dark is the default here because the shipped default palette is dark, so
   the markup's own state is already right before any script has run. */
.theme-toggle__icon { display: inline-flex; }
.theme-toggle__icon[data-when="light"] { display: none; }
:root[data-polarity="light"] .theme-toggle__icon[data-when="dark"] { display: none; }
:root[data-polarity="light"] .theme-toggle__icon[data-when="light"] { display: inline-flex; }

/* Marketing */
.marketing-page { background: var(--surface-deepest); }
.marketing-nav { position: relative; z-index: 30; height: 68px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; max-width: 1280px; margin: 0 auto; padding: 0 28px; border-bottom: 1px solid var(--glass-wash); }
.marketing-nav__links { display: flex; gap: 28px; }
.marketing-nav__links a, .marketing-footer a { color: var(--cw-muted); font-size: 13px; font-weight: 600; }
.marketing-nav__links a:hover, .marketing-footer a:hover { color: var(--cw-text); }
.marketing-nav__actions { display: flex; justify-content: flex-end; gap: 8px; }

.marketing-hero { position: relative; min-height: 890px; overflow: hidden; border-bottom: 1px solid var(--cw-border-soft); }
.marketing-hero__backdrop { position: absolute; inset: 0; overflow: hidden; background-image: linear-gradient(var(--glass-faint) 1px, transparent 1px), linear-gradient(90deg, var(--glass-faint) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: linear-gradient(to bottom, #000 0%, var(--scrim-media) 55%, transparent 94%); mask-image: linear-gradient(to bottom, #000 0%, var(--scrim-media) 55%, transparent 94%); }
.hero-data-line { position: absolute; left: -10%; width: 120%; height: 1px; background: var(--glass-line); transform-origin: left; }
.hero-data-line::after { content: ''; position: absolute; right: 22%; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--cw-red); box-shadow: 0 0 24px color-mix(in srgb, var(--primary) 70%, transparent); }
.hero-data-line--one { top: 31%; transform: rotate(-2deg); }
.hero-data-line--two { top: 44%; transform: rotate(1deg); opacity: .55; }
.hero-data-line--two::after { right: 58%; background: var(--cw-green); box-shadow: 0 0 24px color-mix(in srgb, var(--positive) 70%, transparent); }
.hero-data-line--three { top: 57%; transform: rotate(-1deg); opacity: .35; }
.hero-data-line--three::after { right: 38%; background: var(--cw-amber); box-shadow: 0 0 24px color-mix(in srgb, var(--warning) 60%, transparent); }
.marketing-hero__content { position: relative; z-index: 2; max-width: 920px; margin: 0 auto; padding: 92px 24px 52px; text-align: center; }
.marketing-hero__content .eyebrow { display: inline-flex; align-items: center; gap: 9px; }
.marketing-hero h1 { margin: 0; font-size: 78px; line-height: 1; font-weight: 800; letter-spacing: 0; }
.marketing-hero__lead { max-width: 820px; margin: 24px auto 0; color: var(--cw-text); font-size: 25px; line-height: 1.3; font-weight: 600; }
.marketing-hero__support { max-width: 650px; margin: 18px auto 0; color: var(--cw-muted); font-size: 16px; line-height: 1.7; }
.marketing-hero__actions { display: flex; justify-content: center; gap: 10px; margin-top: 30px; }

.product-frame { position: relative; z-index: 3; display: grid; grid-template-columns: 58px 1fr; width: min(1160px, calc(100% - 40px)); height: 465px; margin: 0 auto; overflow: hidden; border: 1px solid var(--border); border-radius: 8px 8px 0 0; background: var(--surface-soft); box-shadow: 0 36px 100px var(--scrim-strong); }
.product-frame__rail { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 15px 0; border-right: 1px solid var(--cw-border-soft); background: var(--surface-base); }
.product-frame__brand { width: 34px; height: 34px; display: grid; place-items: center; margin-bottom: 12px; border: 1px solid var(--cw-border); border-radius: 6px; }
.rail-item { width: 28px; height: 28px; border-radius: 5px; background: var(--surface); border: 1px solid var(--border); }
.rail-item--active { background: var(--primary-tint); border-color: var(--primary-line); }
.product-frame__main { padding: 0 22px 22px; overflow: hidden; }
.preview-topbar { height: 72px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--cw-border-soft); }
.preview-topbar > div:first-child { display: grid; gap: 4px; }
.preview-topbar span, .preview-section-title small { color: var(--cw-muted); font-size: 10px; }
.preview-topbar strong { font-size: 16px; }
.preview-channel { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 10px 0 5px; border: 1px solid var(--cw-border); border-radius: 6px; }
.preview-channel img { width: 26px; height: 26px; border-radius: 5px; object-fit: cover; }
.preview-channel span { color: var(--cw-text-soft); font-size: 11px; }
.preview-metrics { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--cw-border-soft); }
.preview-metrics article { display: grid; gap: 4px; padding: 18px 20px; border-right: 1px solid var(--cw-border-soft); }
.preview-metrics article:last-child { border-right: 0; }
.preview-metrics span { color: var(--cw-muted); font-size: 10px; text-transform: uppercase; }
.preview-metrics strong { font-size: 26px; line-height: 1; }
.preview-metrics small { color: var(--cw-green); font-size: 9px; }
.preview-workspace-grid { display: grid; grid-template-columns: 1.55fr .8fr; gap: 14px; padding-top: 16px; }
.preview-focus, .preview-video { min-width: 0; }
.preview-section-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.preview-section-title span { font-size: 11px; font-weight: 700; }
.priority-row { min-height: 57px; display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 10px; padding: 9px 10px; border-top: 1px solid var(--cw-border-soft); }
.priority-row b { color: var(--cw-faint); font-size: 10px; }
.priority-row div { display: grid; min-width: 0; }
.priority-row strong { overflow: hidden; color: var(--cw-text-soft); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.priority-row span { overflow: hidden; color: var(--cw-faint); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.priority-row em { color: var(--cw-muted); font-size: 9px; font-style: normal; }
.priority-row--high { background: var(--primary-tint); border-left: 2px solid var(--primary); }
.priority-row--high em { color: var(--primary-text); }
.preview-video { border-left: 1px solid var(--cw-border-soft); padding-left: 16px; }
.preview-video__image { position: relative; height: 116px; overflow: hidden; margin-bottom: 10px; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface-soft); }
.preview-video__image img { width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.preview-video__image span { position: absolute; right: 6px; bottom: 6px; padding: 2px 5px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: 9px; }
.preview-video > small { color: var(--cw-muted); font-size: 9px; text-transform: uppercase; }
.preview-video > strong { display: block; margin-top: 4px; font-size: 11px; line-height: 1.4; }
.score-row { display: flex; justify-content: space-between; margin-top: 14px; color: var(--cw-muted); font-size: 9px; }
.score-row b { color: var(--cw-text); }
.score-track, .meter-track { height: 4px; margin-top: 6px; overflow: hidden; border-radius: 2px; background: var(--surface-elevated); }
.score-track span { display: block; height: 100%; background: var(--cw-green); }

.value-band { padding: 104px 28px; background: var(--surface-base); border-bottom: 1px solid var(--cw-border-soft); }
.value-band__inner { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 80px; max-width: 1160px; margin: 0 auto 60px; }
.value-band h2, .closing-cta h2, .pricing-heading h1 { margin: 0; font-size: 42px; line-height: 1.12; letter-spacing: 0; }
.value-band__inner > p { max-width: 520px; margin: 0; color: var(--cw-muted); font-size: 16px; line-height: 1.75; }
.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1160px; margin: 0 auto; border-top: 1px solid var(--cw-border); border-bottom: 1px solid var(--cw-border); }
.value-grid article { min-height: 260px; padding: 28px; border-right: 1px solid var(--cw-border); }
.value-grid article:last-child { border-right: 0; }
.feature-index { color: var(--cw-red); font-size: 11px; font-weight: 700; }
.value-grid h3 { margin: 70px 0 12px; font-size: 19px; }
.value-grid p { margin: 0; color: var(--cw-muted); font-size: 14px; line-height: 1.7; }
.closing-cta { padding: 110px 24px; text-align: center; }
.closing-cta h2 { max-width: 730px; margin: 0 auto; }
.closing-cta > div { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 28px; }
.marketing-footer { min-height: 92px; display: flex; align-items: center; justify-content: space-between; max-width: 1280px; margin: 0 auto; padding: 0 28px; border-top: 1px solid var(--cw-border-soft); }
.marketing-footer > div { display: flex; gap: 24px; }

/* Audit onboarding entry */
.audit-start-page { min-height: 100vh; background: var(--surface-base); }
.audit-start-page::before { position: fixed; z-index: -1; inset: 0; background-image: linear-gradient(var(--glass-faint) 1px, transparent 1px), linear-gradient(90deg, var(--glass-faint) 1px, transparent 1px), radial-gradient(circle at 50% 18%, color-mix(in srgb, var(--primary) 11%, transparent), transparent 35%); background-size: 54px 54px, 54px 54px, auto; content: ''; }
.audit-start-nav { max-width: none; border-bottom-color: var(--cw-border-soft); background: color-mix(in srgb, var(--surface-deepest) 88%, transparent); backdrop-filter: blur(16px); }
.audit-start-nav [aria-current='page'] { color: var(--cw-text); }
.audit-start-main { min-height: calc(100vh - 160px); padding: 72px 24px 84px; }
.audit-start-shell { width: min(820px, 100%); margin: 0 auto; }
.audit-start-intro { max-width: 690px; margin: 0 auto 30px; text-align: center; }
.audit-start-intro h1 { margin: 0; font-size: clamp(var(--text-5xl), 5vw, var(--text-7xl)); line-height: 1.05; letter-spacing: -.025em; }
.audit-start-intro > p:last-child { max-width: 620px; margin: 16px auto 0; color: var(--cw-muted); font-size: var(--text-xl); line-height: 1.65; }
.audit-start-card { overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: color-mix(in srgb, var(--surface-soft) 96%, transparent); box-shadow: 0 28px 90px var(--scrim); }
.audit-start-primary { padding: 32px; }
.audit-start-heading { display: block; }
.audit-start-heading h2 { margin: 5px 0 0; font-size: var(--text-4xl); line-height: 1.2; }
.audit-start-heading p { margin: 8px 0 0; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.6; }
.audit-start-recommended { display: inline-flex; padding: 3px 7px; border-radius: 999px; background: color-mix(in srgb, var(--positive) 10%, transparent); color: var(--cw-green); font-size: var(--text-xs); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.audit-start-form { display: grid; gap: 8px; margin-top: 25px; }
.audit-start-form label { color: var(--cw-text-soft); font-size: var(--text-md); font-weight: 700; }
.audit-start-form > div { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; }
.audit-start-form input { width: 100%; height: 48px; padding: 0 14px 0 46px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface-base); color: var(--cw-text); }
.audit-start-form input::placeholder { color: var(--cw-faint); }
.audit-start-youtube { position: absolute; z-index: 1; top: 16px; left: 15px; width: 21px; height: 15px; border-radius: 4px; background: var(--brand-youtube); pointer-events: none; }
.audit-start-youtube::after { position: absolute; top: 4px; left: 8px; border-top: 3.5px solid transparent; border-bottom: 3.5px solid transparent; border-left: 5px solid var(--text-on-accent); content: ''; }
.audit-start-assurance { margin: 14px 0 0; color: var(--cw-muted); font-size: var(--text-md); }
.audit-start-divider { display: flex; align-items: center; gap: 14px; color: var(--cw-faint); font-size: var(--text-sm); text-transform: uppercase; }
.audit-start-divider::before, .audit-start-divider::after { content: ''; flex: 1; height: 1px; background: var(--cw-border-soft); }
.audit-start-secondary { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 30px; align-items: center; padding: 27px 32px 32px; }
.audit-start-secondary__actions { display: grid; justify-items: stretch; gap: 9px; min-width: 238px; text-align: center; }
.audit-start-sample { display: flex; justify-content: center; gap: 7px; width: fit-content; margin: 20px auto 0; color: var(--cw-muted); font-size: var(--text-lg); font-weight: 650; }
.audit-start-sample:hover { color: var(--cw-text); }
.audit-start-footer { max-width: none; }

/* Auth */
.auth-page { min-height: 100vh; background-image: linear-gradient(var(--glass-faint) 1px, transparent 1px), linear-gradient(90deg, var(--glass-faint) 1px, transparent 1px); background-size: 54px 54px; }
.auth-page__brand { position: fixed; z-index: 4; top: 24px; left: 28px; }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) 480px; }
.auth-product { display: flex; flex-direction: column; justify-content: center; max-width: 650px; padding: 100px 70px; }
.auth-product h1 { max-width: 560px; margin: 0; font-size: 48px; line-height: 1.08; letter-spacing: 0; }
.auth-product > p:not(.eyebrow) { max-width: 540px; margin: 20px 0 0; color: var(--cw-muted); font-size: 16px; line-height: 1.75; }
.auth-signal-list { margin-top: 56px; border-top: 1px solid var(--cw-border); }
.auth-signal-list > div { display: grid; grid-template-columns: 34px 180px 1fr; gap: 16px; align-items: center; min-height: 72px; border-bottom: 1px solid var(--cw-border-soft); }
.auth-signal-list span { color: var(--cw-faint); font-size: 11px; }
.auth-signal-list strong { font-size: 13px; }
.auth-signal-list small { color: var(--cw-muted); font-size: 12px; }
.auth-panel { display: flex; flex-direction: column; justify-content: center; padding: 54px; border-left: 1px solid var(--cw-border); background: color-mix(in srgb, var(--surface-soft) 96%, transparent); }
.auth-panel__eyebrow { margin: 0 0 8px; color: var(--cw-red); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.auth-panel h2 { margin: 0; font-size: 26px; }
.auth-panel__copy { margin: 10px 0 26px; color: var(--cw-muted); font-size: 13px; }
/* The sign-in buttons are deliberately light inside this dark UI, so they
   use the --*-light tokens. The two wordmark colours come from the
   third-party section of theme.css: they belong to Google and YouTube and
   deliberately do not follow our palette. */
.youtube-auth-button, .google-button { width: 100%; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 13px; font-weight: 700; cursor: pointer; }
.youtube-auth-button { min-height: 56px; gap: 12px; margin-bottom: 10px; border: 1px solid color-mix(in srgb, var(--brand-youtube) 55%, transparent); background: var(--surface-light); color: var(--on-light); box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand-youtube) 8%, transparent); }
.youtube-auth-button > span:last-child { display: grid; gap: 2px; text-align: left; }
.youtube-auth-button small { color: var(--on-light-muted); font-size: 10px; font-weight: 600; }
.youtube-mark { position: relative; width: 25px; height: 18px; flex: 0 0 auto; border-radius: 5px; background: var(--brand-youtube); }
.youtube-mark span { position: absolute; top: 5px; left: 10px; width: 0; height: 0; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 7px solid var(--text-on-accent); }
.google-button { min-height: 44px; gap: 10px; border: 1px solid var(--cw-border); background: transparent; color: var(--cw-text-soft); }
.youtube-auth-button:disabled, .google-button:disabled { opacity: .5; cursor: not-allowed; }
.google-mark { font-weight: 800; color: var(--brand-google); }
.form-divider { display: flex; align-items: center; gap: 12px; margin: 22px 0; color: var(--cw-faint); font-size: 10px; text-transform: uppercase; }
.form-divider::before, .form-divider::after { content: ''; flex: 1; height: 1px; background: var(--cw-border); }
.auth-form { display: grid; gap: 15px; }
.auth-form label { display: grid; gap: 7px; color: var(--cw-text-soft); font-size: 12px; font-weight: 650; }
.auth-form input { width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface-soft); color: var(--cw-text); }
.auth-form input::placeholder { color: var(--cw-faint); }
.auth-switch { margin: 24px 0 0; color: var(--cw-muted); font-size: 12px; text-align: center; }
.auth-switch a { color: var(--cw-text); font-weight: 700; }
.form-alert { margin: 0 0 18px; padding: 11px 13px; border: 1px solid var(--negative-line); border-left: 3px solid var(--cw-danger); border-radius: 5px; background: var(--negative-tint); color: var(--negative-bright); font-size: 12px; }

/* App shell */
.app-page { overflow-x: hidden; background: var(--surface-base); }
.app-shell { min-height: 100vh; }
.app-sidebar { position: fixed; z-index: 50; inset: 0 auto 0 0; width: var(--cw-sidebar); display: flex; flex-direction: column; border-right: 1px solid var(--cw-border-soft); background: var(--surface-base); }
.app-sidebar__top { height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px; border-bottom: 1px solid var(--cw-border-soft); }
.app-sidebar__close { display: none; }
.workspace-switcher { min-height: 62px; display: grid; grid-template-columns: 34px 1fr 16px; align-items: center; gap: 9px; margin: 13px 12px 6px; padding: 7px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.workspace-switcher .channel-avatar, .workspace-avatar { width: 34px; height: 34px; }
.channel-avatar { position: relative; display: grid; flex: 0 0 auto; place-items: center; overflow: hidden; border-radius: 5px; background: var(--primary-tint); color: var(--primary-text); font-size: var(--text-lg); font-weight: 800; }
.channel-avatar img, .channel-avatar__fallback { position: absolute; inset: 0; width: 100%; height: 100%; }
.channel-avatar img { z-index: 1; object-fit: cover; }
.channel-avatar__fallback { display: grid; place-items: center; }
.channel-avatar--fallback img { display: none; }
.workspace-switcher div { min-width: 0; display: grid; }
.workspace-switcher strong, .workspace-switcher small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workspace-switcher strong { font-size: var(--text-md); }
.workspace-switcher small { color: var(--cw-muted); font-size: var(--text-xs); }
.workspace-switcher > svg { width: 14px; color: var(--cw-faint); }
.app-nav { flex: 1; padding: 7px 9px; overflow-y: auto; }
/* Quiet by default: medium-weight labels, small tracked caps for sections,
   and one accent mark on the current page instead of a full outlined box. */
.app-nav p { margin: 18px 10px 7px; color: var(--cw-faint); font-size: var(--text-xs); font-weight: var(--weight-semibold); letter-spacing: .06em; text-transform: uppercase; }
.app-nav a { position: relative; min-height: 38px; display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 9px; padding: 0 10px; border: 1px solid transparent; border-radius: 6px; color: var(--cw-muted); font-size: var(--text-md); font-weight: var(--weight-medium); transition: color 120ms ease, background-color 120ms ease; }
.app-nav a:hover { color: var(--cw-text-soft); background: var(--surface-soft); }
.app-nav a:focus-visible { outline: 2px solid var(--primary-line); outline-offset: -2px; }
.app-nav a.is-active { color: var(--cw-text); background: var(--primary-tint); }
.app-nav a.is-active::before { content: ""; position: absolute; top: 9px; bottom: 9px; left: -9px; width: 3px; border-radius: 0 3px 3px 0; background: var(--cw-red); }
.app-nav a.is-active svg { color: var(--cw-red); }
.app-nav small { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: var(--weight-semibold); letter-spacing: .04em; text-transform: uppercase; }
.app-nav small.app-nav__pill { padding: 1px 6px; border: 1px solid var(--cw-border-soft); border-radius: var(--shape-pill); }
.app-nav .sidebar-badge { display:inline-flex; align-items:center; justify-content:center; min-width:35px; padding:3px 6px; border:1px solid transparent; border-radius:999px; font-size:var(--text-2xs); font-weight:800; line-height:1; letter-spacing:.35px; white-space:nowrap; }
.app-nav .sidebar-badge--beta { color:#342407; background:#f5ce64; border-color:#dfb847; }
.app-nav .sidebar-badge--soon { color:var(--primary-text); background:var(--primary-tint); border-color:var(--primary-line); }
.app-sidebar__footer { padding: 10px; border-top: 1px solid var(--cw-border-soft); }
.plan-meter { padding: 11px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.plan-meter > div:first-child { display: flex; justify-content: space-between; color: var(--cw-muted); font-size: var(--text-xs); }
.plan-meter strong { color: var(--cw-text-soft); }
.plan-meter a { display: block; margin-top: 7px; color: var(--cw-text-soft); font-size: var(--text-xs); }
.user-menu { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: 8px; margin-top: 9px; padding: 6px 4px; }
.user-menu > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 5px; background: var(--surface-elevated); color: var(--cw-text-soft); font-size: var(--text-md); font-weight: 800; }
.user-menu > div { min-width: 0; display: grid; }
.user-menu strong, .user-menu small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu strong { font-size: var(--text-sm); }
.user-menu small { color: var(--cw-faint); font-size: var(--text-2xs); }
.user-menu .icon-button { width: 30px; height: 30px; border-color: transparent; background: transparent; }
.user-menu .icon-button svg { width: 14px; }
.app-sidebar-scrim { display: none; }

/* Collapse toggle, drawn by the sidebar island beside the Workspace heading.
   The row keeps the heading's own spacing (18px above, 7px below), so the
   nav does not shift when the island replaces the pre-rendered sidebar. */
.app-nav__heading { min-height: 26px; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 13px 4px 3px 10px; }
.app-nav__heading p { margin: 0; }
.app-sidebar__toggle { width: 26px; height: 26px; display: grid; flex: 0 0 auto; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--cw-faint); cursor: pointer; }
.app-sidebar__toggle:hover { color: var(--cw-text-soft); background: var(--surface-soft); }
.app-sidebar__toggle:focus-visible { outline: 2px solid var(--primary-line); outline-offset: 1px; }
.app-sidebar__toggle-icon { display: grid; place-items: center; }
.app-sidebar__toggle-icon svg { width: 16px; height: 16px; }

/* The channel card links to where the channel is managed, so it reads as
   clickable: a hover lift and a focus ring, nothing louder. */
a.workspace-switcher { color: inherit; transition: border-color 120ms ease, background-color 120ms ease; }
a.workspace-switcher:hover { border-color: var(--border-strong); background: var(--surface-soft); }
a.workspace-switcher:focus-visible { outline: 2px solid var(--primary-line); outline-offset: 2px; }
a.workspace-switcher > svg { transition: transform 120ms ease; }
a.workspace-switcher:hover > svg { transform: translateX(2px); }

/* Rail tooltip. Fixed, so the collapsed rail's overflow does not clip it;
   the island places it beside whichever item has hover or focus. */
.app-sidebar__tooltip { position: fixed; z-index: 60; left: calc(var(--cw-sidebar-collapsed) + 6px); display: flex; align-items: center; gap: 8px; padding: 5px 9px; border: 1px solid var(--border-faint); border-radius: 6px; background: var(--surface-raised); box-shadow: var(--shadow-md); color: var(--cw-text); font-size: var(--text-sm); font-weight: var(--weight-medium); white-space: nowrap; pointer-events: none; transform: translateY(-50%); animation: app-sidebar-tip 120ms ease; }
@keyframes app-sidebar-tip { from { opacity: 0; transform: translate(-4px, -50%); } to { opacity: 1; transform: translate(0, -50%); } }
.app-sidebar kbd { min-width: 18px; padding: 0 5px; border: 1px solid var(--cw-border); border-radius: 4px; color: var(--cw-muted); font: 500 var(--text-2xs)/18px var(--font-mono); text-align: center; }

/* Collapsed: an icon rail. Desktop only; under 820px the sidebar is the
   off-canvas drawer and always shows its labels. Labels stay in the DOM
   (only hidden), and the island gives each link a title for hover. Icons
   grow from 18px to 22px, since they carry the whole rail on their own. */
@media (min-width: 821px) {
  .app-sidebar, .app-main { transition: width 180ms ease, margin-left 180ms ease; }
  [data-sidebar="collapsed"] { --cw-sidebar: var(--cw-sidebar-collapsed); }
  [data-sidebar="collapsed"] .app-sidebar { overflow-x: hidden; }
  [data-sidebar="collapsed"] .app-sidebar__top { justify-content: center; padding: 0; }
  [data-sidebar="collapsed"] .brand-lockup > span { display: none; }
  [data-sidebar="collapsed"] .workspace-switcher { grid-template-columns: 34px; justify-content: center; margin: 13px 10px 6px; padding: 7px 0; }
  [data-sidebar="collapsed"] .workspace-switcher > div,
  [data-sidebar="collapsed"] .workspace-switcher > svg { display: none; }
  [data-sidebar="collapsed"] .app-nav { padding: 7px 10px; }
  [data-sidebar="collapsed"] .app-nav a.is-active::before { left: -10px; }
  /* The Workspace heading gives way to the toggle, centred on the rail. */
  [data-sidebar="collapsed"] .app-nav__heading { justify-content: center; margin: 8px 0 6px; }
  [data-sidebar="collapsed"] .app-nav__heading p { display: none; }
  [data-sidebar="collapsed"] .app-sidebar__toggle { width: 36px; height: 32px; }
  [data-sidebar="collapsed"] .app-sidebar__toggle-icon svg { width: 20px; height: 20px; }
  /* The remaining section label becomes a hairline, so the groups still read apart. */
  [data-sidebar="collapsed"] .app-nav > p { height: 1px; margin: 12px 6px; overflow: hidden; background: var(--cw-border-soft); color: transparent; }
  /* Only the pre-rendered sidebar has a bare first heading (the island wraps
     it with the toggle). It holds the toggle row's height so the icons do
     not jump when the island mounts. */
  [data-sidebar="collapsed"] .app-nav > p:first-child { height: 32px; margin: 8px 0 6px; background: none; }
  [data-sidebar="collapsed"] .app-nav a { min-height: 42px; grid-template-columns: 22px; justify-content: center; padding: 0; }
  [data-sidebar="collapsed"] .app-nav a > svg { width: 22px; height: 22px; }
  [data-sidebar="collapsed"] .app-nav a > span,
  [data-sidebar="collapsed"] .app-nav a > small { display: none; }
  [data-sidebar="collapsed"] .plan-meter { display: none; }
  [data-sidebar="collapsed"] .user-menu { grid-template-columns: 32px; justify-content: center; justify-items: center; gap: 6px; margin-top: 0; padding: 4px 0; }
  [data-sidebar="collapsed"] .user-menu > span { width: 32px; height: 32px; }
  [data-sidebar="collapsed"] .user-menu > div { display: none; }
  [data-sidebar="collapsed"] .user-menu .icon-button svg { width: 18px; }
}
@media (max-width: 820px) { .app-sidebar__toggle { display: none; } }
@media (prefers-reduced-motion: reduce) { .app-sidebar, .app-main, .app-nav a, a.workspace-switcher, a.workspace-switcher > svg { transition: none; } .app-sidebar__tooltip { animation: none; } }
.app-main { min-height: 100vh; margin-left: var(--cw-sidebar); }
.app-topbar { position: sticky; z-index: 20; top: 0; height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; border-bottom: 1px solid var(--cw-border-soft); background: color-mix(in srgb, var(--surface-base) 92%, transparent); backdrop-filter: blur(16px); }
.app-topbar > div:first-of-type { display: grid; }
.app-topbar small { color: var(--cw-faint); font-size: var(--text-xs); }
.app-topbar strong { font-size: var(--text-lg); }
.app-topbar__actions { display: flex; align-items: center; gap: 8px; }
.credit-badge { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--warning-line); border-radius: 5px; background: var(--warning-tint); color: var(--warning-text); font-size: var(--text-sm); font-weight: 700; }
.credit-badge svg { width: 14px; }
.app-menu-button { display: none; }
.app-content { width: 100%; max-width: 1460px; margin: 0 auto; padding: 30px 32px 70px; }
.setup-banner { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; padding: 10px 12px 10px 16px; border: 1px solid var(--primary-line); border-left: 3px solid var(--cw-red); border-radius: 6px; background: var(--primary-tint); }
.setup-banner > div { display: flex; align-items: center; gap: 12px; }
.setup-banner > div > svg { color: var(--cw-red); }
.setup-banner span { display: grid; }
.setup-banner strong { font-size: var(--text-lg); }
.setup-banner small { color: var(--cw-muted); font-size: var(--text-sm); }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.page-heading h1 { margin: 0; font-size: var(--text-5xl); line-height: 1.18; letter-spacing: 0; }
.page-heading > div > p:last-child { margin: 8px 0 0; color: var(--cw-muted); font-size: var(--text-lg); }

.metric-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 18px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.metric-strip article { min-width: 0; min-height: 118px; padding: 18px; border-right: 1px solid var(--cw-border-soft); }
.metric-strip article:last-child { border-right: 0; }
.metric-strip article > span { color: var(--cw-muted); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.metric-strip strong { display: block; margin-top: 11px; font-size: var(--text-5xl); line-height: 1; }
.metric-strip strong small { color: var(--cw-faint); font-size: var(--text-md); }
.metric-strip p { margin: 10px 0 0; color: var(--cw-faint); font-size: var(--text-xs); }
.dashboard-grid { display: grid; grid-template-columns: 1.5fr .85fr; gap: 16px; }
.workspace-panel { min-width: 0; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.panel-heading { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 16px; border-bottom: 1px solid var(--cw-border-soft); }
.panel-heading > div { display: grid; }
.panel-heading span { font-size: var(--text-md); font-weight: 750; }
.panel-heading small { color: var(--cw-faint); font-size: var(--text-xs); }
.panel-heading > a { color: var(--cw-muted); font-size: var(--text-xs); font-weight: 700; }
.panel-heading > a:hover { color: var(--cw-text); }
.workspace-priority { min-height: 82px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--cw-border-soft); transition: background 150ms ease; }
.workspace-priority:last-child { border-bottom: 0; }
.workspace-priority:hover { background: var(--surface-soft); }
.workspace-priority b { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--warning-line); border-radius: 5px; background: var(--warning-tint); color: var(--cw-amber); }
.workspace-priority b svg { width: 13px; }
.workspace-priority div { min-width: 0; display: grid; gap: 2px; }
.workspace-priority div > small { overflow: hidden; color: var(--cw-faint); font-size: var(--text-2xs); text-overflow: ellipsis; white-space: nowrap; }
.workspace-priority strong { font-size: var(--text-md); }
.workspace-priority span { overflow: hidden; color: var(--cw-muted); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.workspace-priority em { color: var(--cw-amber); font-size: var(--text-2xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.priority-high { color: var(--negative-text); }
.priority-medium { color: var(--warning-text); }
.latest-video-panel { grid-row: span 2; }
.latest-video { display: block; padding: 14px; }
.latest-video__media { position: relative; aspect-ratio: 16/9; overflow: hidden; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface); }
.latest-video__media img { width: 100%; height: 100%; object-fit: cover; }
.latest-video__media span { position: absolute; right: 7px; bottom: 7px; padding: 2px 5px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: var(--text-xs); }
.latest-video > strong { display: block; margin: 12px 0 8px; font-size: var(--text-lg); line-height: 1.45; }
.latest-video > div:last-child { display: flex; gap: 15px; color: var(--cw-muted); font-size: var(--text-xs); }
.activity-list > div { min-height: 60px; display: flex; align-items: center; gap: 11px; padding: 9px 15px; border-bottom: 1px solid var(--cw-border-soft); }
.activity-list > div:last-child { border-bottom: 0; }
.activity-list p { min-width: 0; display: grid; margin: 0; }
.activity-list strong { font-size: var(--text-sm); }
.activity-list small { overflow: hidden; color: var(--cw-muted); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.activity-list > div > span { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 5px; background: var(--positive-tint); color: var(--cw-green); }
.activity-list svg { width: 13px; }
/* Dashboard island. Laid out around the product promise: "Know what to try
   next" leads, "Know if it worked" sits beside it, channel context follows.
   One tinted surface (the spotlight) carries the accent; everything else
   stays on the neutral panel ground so the next change is what stands out. */
.dash-heading { margin-bottom: 20px; }
.dash-main { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 16px; align-items: start; margin-bottom: 16px; }
.dash-section { min-width: 0; padding: 16px; border: 1px solid var(--cw-border); border-radius: var(--shape-xl); background: var(--cw-surface); }
.dash-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.dash-section__head h2 { margin: 4px 0 0; font-size: var(--text-xl); font-weight: var(--weight-semibold); letter-spacing: -.01em; }
.dash-section__eyebrow { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--primary-text); font-size: var(--text-xs); font-weight: var(--weight-semibold); letter-spacing: .06em; text-transform: uppercase; }
.dash-section__eyebrow svg { width: 14px; height: 14px; }
.dash-section__link { display: inline-flex; align-items: center; gap: 7px; color: var(--cw-muted); font-size: var(--text-sm); font-weight: var(--weight-medium); white-space: nowrap; }
.dash-section__link:hover { color: var(--cw-text); }
.dash-count { min-width: 22px; padding: 1px 7px; border-radius: var(--shape-pill); background: var(--primary-tint); color: var(--primary-text); font-size: var(--text-xs); font-variant-numeric: tabular-nums; text-align: center; }

/* The spotlight: the one card on the page that is meant to be looked at first. */
.dash-spotlight { position: relative; display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr); gap: 16px; overflow: hidden; padding: 14px; border: 1px solid var(--primary-line); border-radius: var(--shape-xl); background: radial-gradient(120% 140% at 100% 0%, var(--primary-tint-strong) 0%, transparent 55%), var(--primary-tint); color: inherit; transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease; }
.dash-spotlight:hover { border-color: var(--primary); box-shadow: 0 10px 30px color-mix(in srgb, var(--primary) 16%, transparent); transform: translateY(-1px); }
.dash-spotlight:focus-visible { outline: 2px solid var(--primary-line); outline-offset: 3px; }
.dash-spotlight__media { position: relative; aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--cw-border-soft); border-radius: var(--shape-lg); background: var(--surface-soft); color: var(--cw-faint); }
.dash-spotlight__media img { width: 100%; height: 100%; object-fit: cover; }
.dash-spotlight__media svg { width: 28px; height: 28px; }
.dash-spotlight__body { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.dash-spotlight__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dash-spotlight__video { overflow: hidden; color: var(--cw-muted); font-size: var(--text-sm); text-overflow: ellipsis; white-space: nowrap; }
.dash-spotlight__finding { color: var(--cw-text); font-size: var(--text-xl); font-weight: var(--weight-semibold); line-height: 1.3; letter-spacing: -.01em; }
.dash-spotlight__why { color: var(--cw-text-soft); font-size: var(--text-sm); line-height: 1.5; }
.dash-spotlight__cta { margin-top: auto; padding-top: 6px; }
.dash-spotlight__cta .button { pointer-events: none; }
.dash-spotlight__cta .button svg { width: 16px; transition: transform 160ms ease; }
.dash-spotlight:hover .dash-spotlight__cta .button svg { transform: translateX(3px); }
.dash-tag { padding: 2px 9px; border: 1px solid var(--cw-border); border-radius: var(--shape-pill); color: var(--cw-muted); font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.dash-tag--high { border-color: var(--warning-line); background: var(--warning-tint); color: var(--warning-text); }
.dash-meter { display: inline-flex; align-items: center; gap: 7px; color: var(--cw-muted); font-size: var(--text-xs); font-weight: var(--weight-medium); }
.dash-meter__bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; }
.dash-meter__bars i { width: 4px; border-radius: 1px; background: var(--cw-border); }
.dash-meter__bars i:nth-child(1) { height: 5px; }
.dash-meter__bars i:nth-child(2) { height: 8px; }
.dash-meter__bars i:nth-child(3) { height: 12px; }
.dash-meter__bars i.is-on { background: var(--primary-text); }

.dash-queue { margin-top: 14px; }
.dash-queue__label { margin: 0 0 6px; color: var(--cw-faint); font-size: var(--text-xs); font-weight: var(--weight-semibold); letter-spacing: .06em; text-transform: uppercase; }
.dash-queue__row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 10px; border-radius: var(--shape-lg); color: inherit; transition: background-color 120ms ease; }
.dash-queue__row + .dash-queue__row { border-top: 1px solid var(--cw-border-soft); }
.dash-queue__row:hover { background: var(--surface-soft); }
.dash-queue__rank { color: var(--cw-faint); font: var(--weight-semibold) var(--text-sm) var(--font-mono); font-variant-numeric: tabular-nums; }
.dash-queue__copy { min-width: 0; display: grid; gap: 2px; }
.dash-queue__copy strong { overflow: hidden; font-size: var(--text-md); font-weight: var(--weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.dash-queue__copy small { overflow: hidden; color: var(--cw-faint); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.dash-queue__action { display: inline-flex; align-items: center; gap: 6px; color: var(--primary-text); font-size: var(--text-sm); font-weight: var(--weight-semibold); white-space: nowrap; }
.dash-queue__action svg { width: 14px; transition: transform 120ms ease; }
.dash-queue__row:hover .dash-queue__action svg { transform: translateX(2px); }

.dash-empty { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 22px; border: 1px dashed var(--cw-border); border-radius: var(--shape-xl); }
.dash-empty > div { flex: 1 1 260px; }
.dash-empty strong { display: block; color: var(--cw-text-soft); font-size: var(--text-lg); }
.dash-empty p { margin: 4px 0 0; color: var(--cw-muted); font-size: var(--text-md); }
.dash-empty__icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--positive-tint); color: var(--positive-text); }
.dash-empty--live .dash-empty__icon { background: var(--primary-tint); color: var(--primary-text); animation: dash-pulse 2.4s ease-in-out infinite; }
@keyframes dash-pulse { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary) 30%, transparent); } 50% { box-shadow: 0 0 0 8px transparent; } }

/* Results: each applied change, with how its video moved afterwards. */
.dash-results__list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
/* The badge goes under the title, not beside it: the column is narrow, and
   the video title is what identifies the row. */
.dash-result { display: grid; grid-template-columns: 76px minmax(0, 1fr); grid-template-rows: auto auto; align-items: start; column-gap: 12px; row-gap: 7px; padding: 10px; border-radius: var(--shape-lg); color: inherit; transition: background-color 120ms ease; }
.dash-result__media { grid-row: span 2; }
.dash-result__badge { grid-column: 2; justify-self: start; }
.dash-result:hover { background: var(--surface-soft); }
.dash-result__media { aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; border-radius: var(--shape-sm); background: var(--surface-soft); color: var(--cw-faint); }
.dash-result__media img { width: 100%; height: 100%; object-fit: cover; }
.dash-result__media svg { width: 16px; }
.dash-result__copy { min-width: 0; display: grid; gap: 2px; }
.dash-result__copy strong { overflow: hidden; font-size: var(--text-sm); font-weight: var(--weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.dash-result__copy small { color: var(--cw-faint); font-size: var(--text-xs); }
.dash-result__headline { overflow: hidden; color: var(--cw-muted); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.dash-result__badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border: 1px solid var(--cw-border); border-radius: var(--shape-pill); color: var(--cw-muted); font-size: var(--text-sm); font-weight: var(--weight-semibold); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dash-result__badge svg { width: 14px; height: 14px; }
.dash-result__badge--positive { border-color: var(--positive-line); background: var(--positive-tint); color: var(--positive-text); }
.dash-result__badge--negative { border-color: var(--negative-line); background: var(--negative-tint); color: var(--negative-text); }
.dash-result__badge--measuring { border-color: var(--primary-line); background: var(--primary-tint); color: var(--primary-text); }
.dash-results__note { margin: 12px 4px 0; color: var(--cw-faint); font-size: var(--text-xs); line-height: 1.5; }
.dash-results__empty { padding: 18px; border: 1px dashed var(--cw-border); border-radius: var(--shape-xl); }
.dash-results__empty strong { display: block; color: var(--cw-text-soft); font-size: var(--text-lg); }
.dash-results__empty p { margin: 6px 0 14px; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.5; }
.dash-results__steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; color: var(--cw-text-soft); font-size: var(--text-sm); }
.dash-results__steps li { display: flex; align-items: center; gap: 10px; }
.dash-results__steps i { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--primary-line); border-radius: 50%; color: var(--primary-text); font: var(--weight-semibold) var(--text-xs) var(--font-mono); font-style: normal; }

/* Channel at a glance. */
.dash-glance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.dash-glance__item { position: relative; display: flex; align-items: center; gap: 12px; min-width: 0; padding: 11px 14px; border: 1px solid var(--cw-border); border-radius: var(--shape-xl); background: var(--cw-surface); color: inherit; }
.dash-glance__item > div { min-width: 0; }
.dash-glance__item span:not(.dash-glance__icon) { color: var(--cw-muted); font-size: var(--text-2xs); font-weight: var(--weight-semibold); letter-spacing: .06em; text-transform: uppercase; }
.dash-glance__item strong { display: block; margin-top: 1px; font-size: var(--text-3xl); font-weight: var(--weight-semibold); line-height: 1.15; font-variant-numeric: tabular-nums; }
.dash-glance__item strong small { color: var(--cw-faint); font-size: var(--text-sm); font-weight: var(--weight-medium); }
.dash-glance__item p { margin: 1px 0 0; overflow: hidden; color: var(--cw-faint); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.dash-glance__icon { width: 36px; height: 36px; display: grid; flex: 0 0 auto; place-items: center; border-radius: var(--shape-lg); background: var(--surface-soft); color: var(--cw-muted); }
.dash-glance__icon svg { width: 18px; height: 18px; }
/* The latest-upload card opens that video. */
.dash-glance__item--link { transition: border-color 120ms ease, background-color 120ms ease; }
.dash-glance__item--link:hover { border-color: var(--border-strong); background: var(--surface-soft); }
.dash-glance__item--link:hover .dash-glance__icon { background: var(--primary-tint); color: var(--primary-text); }
.dash-glance__item--link:focus-visible { outline: 2px solid var(--primary-line); outline-offset: 2px; }
.dash-glance__go { position: absolute; top: 10px; right: 10px; width: 15px; height: 15px; color: var(--cw-faint); opacity: 0; transition: opacity 120ms ease, transform 120ms ease; }
.dash-glance__item--link:hover .dash-glance__go, .dash-glance__item--link:focus-visible .dash-glance__go { opacity: 1; transform: translate(1px, -1px); }
.dash-ring { width: 36px; height: 36px; flex: 0 0 auto; transform: rotate(-90deg); }
.dash-ring circle { fill: none; stroke-width: 3.6; }
.dash-ring__track { stroke: var(--surface-soft); }
.dash-ring__value { stroke: var(--positive-text); stroke-linecap: round; }

.dash-context { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.dash-context .latest-video-panel { grid-row: auto; }
.dash-context .workspace-panel { border-radius: var(--shape-xl); }

@media (max-width: 1050px) {
  .dash-main, .dash-context { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .dash-spotlight { grid-template-columns: 1fr; }
  .dash-glance { grid-template-columns: 1fr; }
  .dash-queue__row { grid-template-columns: 24px minmax(0, 1fr); }
  .dash-queue__action { grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) {
  .dash-spotlight, .dash-spotlight__cta .button svg, .dash-queue__row, .dash-queue__action svg, .dash-result, .dash-glance__item--link, .dash-glance__go { transition: none; }
  .dash-spotlight:hover { transform: none; }
  .dash-empty--live .dash-empty__icon { animation: none; }
}

.empty-state { min-height: 180px; display: flex; align-items: center; justify-content: center; gap: 14px; padding: 28px; color: var(--cw-muted); text-align: left; }
.empty-state > svg { width: 26px; height: 26px; color: var(--cw-faint); }
.empty-state > div { max-width: 440px; }
.empty-state strong { color: var(--cw-text-soft); font-size: var(--text-lg); }
.empty-state p { margin: 6px 0 14px; font-size: var(--text-md); }
.empty-state--compact { min-height: 120px; justify-content: flex-start; }
.empty-state--large { min-height: 360px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); text-align: center; }
.empty-state--large > svg { width: 36px; height: 36px; }
.empty-state__spinner { flex: 0 0 auto; width: 26px; height: 26px; border: 2px solid var(--cw-border); border-top-color: var(--cw-blue); border-radius: 50%; animation: opportunity-spin .9s linear infinite; }
.empty-state--large .empty-state__spinner { width: 36px; height: 36px; }
@media (prefers-reduced-motion: reduce) { .empty-state__spinner { animation: none; } }

/* Onboarding */
.onboarding-layout { min-height: calc(100vh - 170px); display: grid; grid-template-columns: 1fr 520px; align-items: center; gap: 70px; max-width: 1120px; margin: 0 auto; }
.onboarding-copy h1 { max-width: 580px; margin: 0; font-size: var(--text-7xl); line-height: 1.12; letter-spacing: 0; }
.onboarding-copy > p:last-child { max-width: 540px; color: var(--cw-muted); font-size: var(--text-xl); line-height: 1.75; }
.onboarding-flow { padding: 24px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.onboarding-step { min-height: 70px; display: grid; grid-template-columns: 30px 1fr 22px; align-items: center; gap: 12px; border-bottom: 1px solid var(--cw-border-soft); color: var(--cw-faint); }
.onboarding-step > span { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 5px; font-size: var(--text-sm); }
.onboarding-step > div { display: grid; }
.onboarding-step strong { color: var(--cw-text-soft); font-size: var(--text-md); }
.onboarding-step small { font-size: var(--text-xs); }
.onboarding-step.is-current { color: var(--cw-red); }
.onboarding-step.is-current > span { border-color: var(--primary-line); background: var(--primary-tint-strong); }
.onboarding-step.is-complete { color: var(--cw-green); }
.onboarding-flow > .button { margin-top: 20px; }
.trust-line { display: flex; justify-content: center; gap: 7px; margin: 13px 0 0; color: var(--cw-faint); font-size: var(--text-xs); }
.trust-line svg { width: 13px; }

/* Video library */
.video-library-toolbar { min-height: 44px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 0 12px; border: 1px solid var(--cw-border-soft); border-radius: 6px; color: var(--cw-muted); font-size: var(--text-xs); }
.video-library-toolbar span:last-child { display: flex; align-items: center; gap: 6px; color: var(--warning-text); }
.video-library-toolbar svg { width: 13px; }
.video-library { border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.video-pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; margin-top: 16px; }
.video-pagination > span { color: var(--cw-muted); font-size: var(--text-md); text-align: center; }
.video-pagination > .button:last-child { justify-self: end; }
.video-row { min-height: 126px; display: grid; grid-template-columns: 170px minmax(0, 1fr) auto; align-items: center; gap: 18px; padding: 13px; border-bottom: 1px solid var(--cw-border-soft); }
.video-row:last-child { border-bottom: 0; }
.video-row__media { position: relative; width: 170px; aspect-ratio: 16/9; overflow: hidden; border-radius: 5px; background: var(--surface-raised); }
.video-row__media img { width: 100%; height: 100%; object-fit: cover; }
.video-row__media span { position: absolute; right: 6px; bottom: 6px; padding: 2px 5px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: var(--text-xs); }
.video-row__content { min-width: 0; }
.video-row__content > p { margin: 0 0 4px; color: var(--cw-faint); font-size: var(--text-xs); }
.video-row__content h2 { overflow: hidden; margin: 0; font-size: var(--text-lg); line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.video-row__content > div { display: flex; gap: 14px; margin-top: 13px; color: var(--cw-muted); font-size: var(--text-xs); }
.video-row__content > div span { display: flex; align-items: center; gap: 5px; }
.video-row__content svg { width: 12px; }
.video-comment-metric { display: inline-flex; align-items: center; gap: 5px; margin: -4px -5px; padding: 4px 5px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); color: var(--cw-text-soft); font: inherit; cursor: pointer; touch-action: manipulation; transition: border-color 140ms ease, background 140ms ease, color 140ms ease, transform 80ms ease; -webkit-tap-highlight-color: transparent; }
.video-comment-metric span { font-weight: 600; }
.video-comment-metric svg { color: var(--warning-dim); transition: color 140ms ease; }
.video-comment-metric:hover { border-color: var(--border-strong); background: var(--surface-raised); color: var(--cw-text-soft); }
.video-comment-metric:hover svg { color: var(--warning-text); }
.video-comment-metric:focus-visible { outline: 0; border-color: var(--border-strong); background: var(--surface-elevated); color: var(--cw-text); box-shadow: 0 0 0 2px color-mix(in srgb, var(--negative) 38%, transparent); }
.video-comment-metric:focus-visible svg { color: var(--warning-text); }
.video-comment-metric:active { background: var(--surface-elevated); transform: translateY(1px); }
.video-row__content > .video-analysis-preview { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 9px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--cw-border-soft); }
.video-analysis-preview strong { color: var(--cw-green); font-size: var(--text-lg); }
.video-analysis-preview strong small { color: var(--cw-muted); font-size: var(--text-2xs); }
.video-analysis-preview > span { overflow: hidden; color: var(--cw-text-soft); font-size: var(--text-xs); line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.video-row__action { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.video-row__rerun { display: flex; }
.video-row__content > .video-tool-statuses { gap: 16px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--cw-border-soft); }
.video-tool-statuses span { color: var(--cw-faint); }
.video-tool-statuses span.is-ready { color: var(--cw-green); }
.video-row__action .button { min-width: 124px; }
.video-tag-state { display: flex; align-items: center; gap: 6px; margin-top: 8px !important; color: var(--cw-green) !important; font-size: var(--text-2xs) !important; font-weight: 700; text-transform: uppercase; }
.video-tag-state svg { width: 12px; }

/* Comment intelligence */
.comment-intelligence-dialog { width: min(720px, calc(100vw - 32px)); max-height: min(86vh, 820px); padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 9px; background: var(--cw-surface); color: var(--cw-text); box-shadow: 0 30px 90px var(--scrim-strong); }
.comment-intelligence-dialog::backdrop { background: var(--overlay); backdrop-filter: blur(3px); }
.comment-intelligence-dialog__shell { display: grid; grid-template-rows: auto minmax(0, 1fr); max-height: min(86vh, 820px); }
.comment-intelligence-dialog__header { min-height: 78px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 34px; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--cw-border); background: var(--surface); }
.comment-intelligence-dialog__header > span { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--warning-line); border-radius: 6px; background: var(--warning-tint-strong); color: var(--warning-text); }
.comment-intelligence-dialog__header > span svg { width: 17px; }
.comment-intelligence-dialog__header > div { min-width: 0; }
.comment-intelligence-dialog__header h2 { overflow: hidden; margin: 2px 0 2px; font-size: var(--text-xl); text-overflow: ellipsis; white-space: nowrap; }
.comment-intelligence-dialog__header small { display: block; overflow: hidden; color: var(--cw-muted); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.comment-intelligence-dialog__body { overflow-y: auto; }
.comment-intelligence-dialog__body[aria-busy="true"] { min-height: 230px; display: grid; place-items: center; }
.comment-intelligence-result { padding: 18px; }
.comment-intelligence-loading { min-height: 190px; display: flex; align-items: center; justify-content: center; gap: 14px; padding: 24px; color: var(--cw-muted); }
.comment-intelligence-loading > span { width: 26px; height: 26px; flex: 0 0 auto; border: 2px solid var(--border); border-top-color: var(--cw-red); border-radius: 50%; animation: comment-intelligence-spin 800ms linear infinite; }
.comment-intelligence-loading strong { color: var(--cw-text-soft); font-size: var(--text-lg); }
.comment-intelligence-loading p { max-width: 360px; margin: 4px 0 0; font-size: var(--text-sm); line-height: 1.55; }
.comment-intelligence-credit-prompt { display: grid; justify-items: start; gap: 12px; padding: 30px; }
.comment-intelligence-credit-prompt > svg { width: 28px; height: 28px; color: var(--warning-text); }
.comment-intelligence-credit-prompt h3 { margin: 0; font-size: var(--text-2xl); }
.comment-intelligence-credit-prompt p { max-width: 480px; margin: 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.6; }
@keyframes comment-intelligence-spin { to { transform: rotate(360deg); } }
.comment-intelligence-takeaway { padding: 16px; border: 1px solid var(--warning-line); border-radius: 7px; background: linear-gradient(135deg, var(--warning-tint-strong), var(--surface-raised)); }
.comment-intelligence-takeaway .eyebrow { color: var(--warning-text); }
.comment-intelligence-takeaway h3 { max-width: 620px; margin: 7px 0 0; color: var(--text); font-size: var(--text-2xl); line-height: 1.45; }
.comment-intelligence-section-heading { display: flex; align-items: center; justify-content: space-between; margin: 20px 2px 8px; }
.comment-intelligence-section-heading p { margin: 0; }
.comment-intelligence-section-heading span { color: var(--cw-faint); font-size: var(--text-2xs); }
.comment-intelligence-clusters { display: grid; }
.comment-cluster { padding: 15px 2px; border-top: 1px solid var(--cw-border-soft); }
.comment-cluster:first-of-type { border-top: 0; }
.comment-cluster > header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 18px; }
.comment-cluster h4 { margin: 2px 0 0; font-size: var(--text-lg); }
.comment-cluster > header > strong { display: grid; justify-items: end; color: var(--cw-text-soft); font-size: var(--text-sm); }
.comment-cluster > header > strong small { margin-top: 2px; color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 400; }
.comment-cluster > p { max-width: 610px; margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.6; }
.comment-cluster__signal { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 4px; color: var(--warning-text); font-size: var(--text-2xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.comment-cluster__signal svg { width: 11px; }
.comment-cluster details { margin-top: 10px; }
.comment-cluster summary { width: fit-content; display: flex; align-items: center; gap: 5px; color: var(--cw-text-soft); font-size: var(--text-xs); cursor: pointer; list-style: none; }
.comment-cluster summary::-webkit-details-marker { display: none; }
.comment-cluster summary svg { width: 12px; transition: transform 140ms ease; }
.comment-cluster details[open] summary svg { transform: rotate(180deg); }
.comment-cluster__comments { display: grid; gap: 7px; margin-top: 9px; }
.comment-cluster blockquote { margin: 0; padding: 9px 11px; border-left: 2px solid var(--border-strong); border-radius: 0 5px 5px 0; background: var(--surface); }
.comment-cluster--request blockquote { border-left-color: var(--warning-line-strong); }
.comment-cluster blockquote p { margin: 0; color: var(--cw-text-soft); font-size: var(--text-xs); line-height: 1.55; }
.comment-cluster blockquote footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; color: var(--cw-faint); font-size: var(--text-2xs); }
.comment-cluster blockquote footer span { display: inline-flex; align-items: center; gap: 4px; }
.comment-cluster blockquote footer svg { width: 10px; }
.comment-intelligence-request-bridge { display: grid; grid-template-columns: 30px minmax(0, 1fr) 14px; align-items: center; gap: 10px; margin-top: 8px; padding: 10px 12px; border: 1px solid var(--positive-line); border-radius: 6px; background: var(--positive-tint); }
.comment-intelligence-request-bridge > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 5px; background: var(--positive-tint-strong); color: var(--cw-green); }
.comment-intelligence-request-bridge > span svg, .comment-intelligence-request-bridge > svg { width: 14px; }
.comment-intelligence-request-bridge p { display: grid; gap: 2px; margin: 0; }
.comment-intelligence-request-bridge strong { color: var(--cw-text-soft); font-size: var(--text-xs); }
.comment-intelligence-request-bridge small { color: var(--cw-muted); font-size: var(--text-2xs); }
.comment-intelligence-request-bridge > svg { color: var(--cw-faint); }
.comment-intelligence-meta { display: grid; gap: 10px; margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--cw-border); }
.comment-intelligence-coverage { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 2px 6px; }
.comment-intelligence-coverage strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.comment-intelligence-coverage > span { color: var(--cw-muted); font-size: var(--text-xs); }
.comment-intelligence-coverage small { grid-column: 1 / -1; max-width: 630px; color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.55; }
.comment-intelligence-meta p { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0; color: var(--cw-faint); font-size: var(--text-2xs); }
.comment-intelligence-meta p span { position: relative; }
.comment-intelligence-meta p span + span::before { position: absolute; left: -7px; content: "·"; }
.comment-intelligence-refresh { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; padding: 12px; border: 1px solid var(--cw-border-soft); border-radius: 6px; background: var(--surface); }
.comment-intelligence-refresh > div { display: grid; min-width: 0; gap: 3px; }
.comment-intelligence-refresh strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.comment-intelligence-refresh small { color: var(--cw-muted); font-size: var(--text-2xs); line-height: 1.45; }
.comment-intelligence-refresh .button { flex: 0 0 auto; }
.comment-intelligence-insufficient { min-height: 200px; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-content: center; gap: 14px; }
.comment-intelligence-insufficient > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 7px; color: var(--cw-faint); }
.comment-intelligence-insufficient svg { width: 19px; }
.comment-intelligence-insufficient h3 { margin: 5px 0; font-size: var(--text-xl); }
.comment-intelligence-insufficient p:last-child { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.6; }
.comment-intelligence-no-pattern { min-height: 92px; display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 14px; border: 1px solid var(--cw-border-soft); border-radius: 6px; color: var(--cw-faint); }
.comment-intelligence-no-pattern > svg { width: 20px; }
.comment-intelligence-no-pattern p { display: grid; gap: 3px; margin: 0; }
.comment-intelligence-no-pattern strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.comment-intelligence-no-pattern span { color: var(--cw-muted); font-size: var(--text-xs); }
.comment-intelligence-error { min-height: 110px; display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--negative-line); border-radius: 6px; background: var(--negative-tint); }
.comment-intelligence-error > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--negative-tint-strong); color: var(--negative-text); }
.comment-intelligence-error svg { width: 16px; }
.comment-intelligence-error strong { font-size: var(--text-md); }
.comment-intelligence-error p { margin: 4px 0 0; color: var(--negative-dim); font-size: var(--text-xs); }

/* Video workspace */
.video-workspace-nav { min-height: 42px; display: flex; align-items: center; gap: 22px; margin-bottom: 14px; border-bottom: 1px solid var(--cw-border); }
.video-workspace-nav__back { display: inline-flex; align-items: center; gap: 6px; color: var(--cw-muted); font-size: var(--text-xs); }
.video-workspace-nav__back svg { width: 13px; }
.video-workspace-nav__tools { align-self: stretch; display: flex; align-items: stretch; gap: 4px; }
.video-workspace-nav__tools a { position: relative; display: inline-flex; align-items: center; gap: 6px; min-width: 86px; justify-content: center; padding: 0 12px; color: var(--cw-faint); font-size: var(--text-xs); }
.video-workspace-nav__tools a::after { position: absolute; right: 8px; bottom: 5px; left: 8px; height: 2px; background: transparent; content: ""; }
.video-workspace-nav__tools a.is-active { color: var(--cw-text); }
.video-workspace-nav__tools a.is-active::after { background: var(--cw-red); }
.video-workspace-nav__tools svg { width: 13px; }
.video-workspace-nav__tools em { width: 5px; height: 5px; border-radius: 50%; background: var(--cw-green); }
.video-workspace-nav__tools small { color: var(--cw-amber); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.video-workspace-header { min-height: 122px; display: grid; grid-template-columns: 170px minmax(0, 1fr) 34px; align-items: center; gap: 18px; padding: 16px 0 20px; border-bottom: 1px solid var(--cw-border); }
.video-workspace-header__media { position: relative; width: 170px; aspect-ratio: 16/9; overflow: hidden; border-radius: 5px; background: var(--surface-raised); }
.video-workspace-header__media img { width: 100%; height: 100%; object-fit: cover; }
.video-workspace-header__media > span { position: absolute; right: 6px; bottom: 6px; padding: 2px 5px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: var(--text-xs); }
.video-workspace-header > div { min-width: 0; }
.video-workspace-header h1 { overflow: hidden; margin: 2px 0 9px; font-size: var(--text-3xl); line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.video-workspace-header__metrics { display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--cw-muted); font-size: var(--text-xs); }
.video-workspace-header__metrics span { display: inline-flex; align-items: center; gap: 5px; }
.video-workspace-header__metrics svg { width: 12px; }
.video-capability-list { margin-top: 18px; border-top: 1px solid var(--cw-border); }
.video-capability-row { min-height: 106px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 16px 4px; border-bottom: 1px solid var(--cw-border); }
.video-capability-row__icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 6px; color: var(--cw-text-soft); }
.video-capability-row__icon svg { width: 17px; }
.video-capability-row__copy { min-width: 0; }
.video-capability-row__copy > div { display: flex; align-items: center; gap: 9px; }
.video-capability-row h2 { margin: 0; font-size: var(--text-lg); }
.video-capability-row p { max-width: 700px; margin: 6px 0 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.5; }
.tool-state { color: var(--cw-faint); font-size: var(--text-2xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.tool-state--ready { color: var(--cw-green); }
.tool-state--coming-soon { color: var(--cw-amber); }
.video-capability-row__past-report { display: inline-flex; margin-top: 9px; color: var(--cw-text-soft); font-size: var(--text-xs); text-decoration: underline; text-underline-offset: 3px; }
.video-analysis-preview-page { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(240px, .6fr); gap: 28px; align-items: center; margin-top: 22px; padding: 32px; border: 1px solid var(--cw-border); border-left: 3px solid var(--cw-amber); border-radius: 7px; background: var(--cw-surface); }
.video-analysis-preview-page__icon { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 18px; border: 1px solid var(--warning-line); border-radius: 7px; background: var(--warning-tint-strong); color: var(--cw-amber); }
.video-analysis-preview-page__icon svg { width: 21px; height: 21px; }
.video-analysis-preview-page h1 { max-width: 590px; margin: 9px 0 12px; font-size: clamp(23px, 3vw, 36px); line-height: 1.15; }
.video-analysis-preview-page__intro > p:last-of-type { max-width: 620px; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.65; }
.video-analysis-preview-page__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
.video-analysis-preview-page__actions .button { display: inline-flex; align-items: center; gap: 8px; }
.video-analysis-preview-page__actions svg { width: 14px; height: 14px; }
.video-analysis-preview-page__video { overflow: hidden; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface); }
.video-analysis-preview-page__video img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.video-analysis-preview-page__video > div { display: grid; gap: 6px; padding: 14px; }
.video-analysis-preview-page__video small { color: var(--cw-muted); font-size: var(--text-xs); }
.video-analysis-preview-page__video strong { font-size: var(--text-lg); line-height: 1.4; }
.video-analysis-preview-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.video-analysis-preview-details article { padding: 21px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.video-analysis-preview-details svg { width: 18px; height: 18px; color: var(--cw-amber); }
.video-analysis-preview-details h2 { margin: 15px 0 7px; font-size: var(--text-lg); }
.video-analysis-preview-details p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.55; }
.prepublish-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr); gap: 36px; align-items: center; padding: 36px; border: 1px solid var(--cw-border); border-left: 3px solid var(--cw-amber); border-radius: 7px; background: var(--cw-surface); }
.prepublish-hero__icon { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 18px; border: 1px solid var(--warning-line); border-radius: 7px; background: var(--warning-tint-strong); color: var(--cw-amber); }
.prepublish-hero__icon svg { width: 21px; height: 21px; }
.prepublish-hero h1 { max-width: 650px; margin: 9px 0 13px; font-size: clamp(24px, 3vw, 36px); line-height: 1.15; }
.prepublish-hero > div:first-child > p:not(.eyebrow) { max-width: 660px; margin: 0 0 24px; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.7; }
.prepublish-hero__outline { padding: 21px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.prepublish-hero__outline > span { display: block; margin-bottom: 15px; color: var(--cw-muted); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.prepublish-hero__outline > div { display: flex; align-items: center; gap: 11px; padding: 13px 0; border-top: 1px solid var(--cw-border-soft); }
.prepublish-hero__outline > div svg { width: 16px; color: var(--cw-amber); }
.prepublish-hero__outline > div strong { font-size: var(--text-md); }
.prepublish-hero__outline small { display: block; margin-top: 13px; color: var(--cw-muted); font-size: var(--text-xs); }
.prepublish-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.prepublish-details article { padding: 21px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.prepublish-details svg { width: 18px; height: 18px; color: var(--cw-amber); }
.prepublish-details h2 { margin: 15px 0 7px; font-size: var(--text-lg); }
.prepublish-details p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.55; }
.video-capability-row__result strong { color: var(--cw-green); font-size: var(--text-2xl); }
.video-capability-row__result small { color: var(--cw-muted); font-size: var(--text-2xs); }
.video-capability-row > .button, .video-capability-row > form .button { min-width: 142px; }
.video-opportunity-banner { min-height: 76px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto 15px; align-items: center; gap: 13px; margin-top: 16px; padding: 12px 15px; border: 1px solid var(--warning-line); border-radius: 7px; background: var(--warning-tint); }
.video-opportunity-banner > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 5px; background: var(--warning-tint-strong); color: var(--cw-amber); }
.video-opportunity-banner > span svg { width: 16px; }
.video-opportunity-banner > div { min-width: 0; }
.video-opportunity-banner strong, .video-opportunity-banner small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.video-opportunity-banner strong { margin: 2px 0 4px; font-size: var(--text-md); }
.video-opportunity-banner small { color: var(--cw-muted); font-size: var(--text-2xs); }
.video-opportunity-banner em { color: var(--cw-amber); font-size: var(--text-2xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.video-opportunity-banner > svg { width: 15px; color: var(--cw-faint); }

/* Post-publish performance */
.performance-video-header { min-height: 118px; display: grid; grid-template-columns: 170px minmax(0, 1fr) 34px; align-items: center; gap: 18px; padding: 15px 0 20px; border-bottom: 1px solid var(--cw-border); }
.performance-video-header__media { position: relative; width: 170px; aspect-ratio: 16/9; overflow: hidden; border-radius: 5px; background: var(--surface-raised); }
.performance-video-header__media img { width: 100%; height: 100%; object-fit: cover; }
.performance-video-header__media span { position: absolute; right: 6px; bottom: 6px; padding: 2px 5px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: var(--text-xs); }
.performance-video-header > div { min-width: 0; }
.performance-video-header h1 { overflow: hidden; margin: 3px 0 6px; font-size: var(--text-3xl); line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.performance-video-header p:last-child { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); }
.performance-empty { min-height: 430px; }
.performance-verdict { min-height: 116px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 16px; margin-top: 18px; padding: 18px 20px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--positive-tint); }
.performance-verdict > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--positive-line); border-radius: 50%; color: var(--cw-green); }
.performance-verdict > span svg { width: 19px; }
.performance-verdict > div { min-width: 0; }
.performance-verdict h2 { margin: 3px 0 4px; font-size: var(--text-4xl); }
.performance-verdict > div > p:last-child { max-width: 760px; margin: 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.5; }
.performance-verdict > strong { display: grid; justify-items: end; color: var(--cw-green); font-size: var(--text-5xl); }
.performance-verdict > strong small { color: var(--cw-muted); font-size: var(--text-xs); font-weight: 600; }
.performance-verdict--watch { background: var(--warning-tint); }
.performance-verdict--watch > span { border-color: var(--warning-line); color: var(--cw-amber); }
.performance-verdict--building { background: var(--cw-surface); }
.performance-verdict--building > span { border-color: var(--cw-border); color: var(--cw-blue); }
.performance-hero { display: grid; grid-template-columns: minmax(0, 1.5fr) .65fr .9fr; margin-top: 12px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.performance-hero article { min-height: 145px; display: grid; align-content: center; gap: 7px; padding: 20px; border-right: 1px solid var(--cw-border-soft); }
.performance-hero article:last-child { border-right: 0; }
.performance-hero span { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 750; text-transform: uppercase; }
.performance-hero strong { font-size: var(--text-2xl); line-height: 1.35; }
.performance-hero p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.performance-position strong { color: var(--cw-text); font-size: var(--text-4xl); }
.performance-position p b { color: var(--cw-text-soft); }
.performance-rank strong { font-size: var(--text-6xl); }
.performance-rank strong small { color: var(--cw-muted); font-size: var(--text-lg); }
.performance-momentum--improving strong { color: var(--cw-green); }
.performance-momentum--fading strong { color: var(--cw-amber); }
.performance-chart-panel { margin-top: 16px; padding: 21px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.performance-chart-panel .section-heading { margin-bottom: 12px; }
.performance-chart-legend { display: flex; align-items: center; gap: 16px; color: var(--cw-muted); font-size: var(--text-2xs); }
.performance-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.performance-chart-legend i { width: 18px; height: 2px; background: var(--cw-red); }
.performance-chart-legend span:nth-child(2) i { background: var(--text-faint); }
.performance-chart-legend span:nth-child(3) i { width: 8px; height: 8px; transform: rotate(45deg); background: var(--cw-amber); }
.performance-chart-legend span.performance-chart-legend__action i { width: 8px; height: 8px; transform: rotate(45deg); background: var(--cw-amber); }
.performance-chart-legend span.performance-chart-legend__gap i { height: 0; background: transparent; border-top: 2px dashed var(--cw-faint); transform: none; }
.performance-chart-heading__right { display: grid; justify-items: end; gap: 8px; }
.performance-chart-ranges { display: inline-flex; padding: 2px; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface-base); }
.performance-chart-ranges a { min-width: 38px; padding: 5px 9px; border-radius: 3px; color: var(--cw-muted); font-size: var(--text-2xs); font-weight: 750; text-align: center; text-decoration: none; }
.performance-chart-ranges a:hover { color: var(--cw-text); }
.performance-chart-ranges a[aria-current="true"] { background: var(--surface-raised); color: var(--cw-text); box-shadow: inset 0 0 0 1px var(--cw-border-soft); }
.trajectory-verdict { color: var(--cw-text-soft); font-size: var(--text-sm); }
.trajectory-verdict--improving { color: var(--cw-green); }
.trajectory-verdict--fading { color: var(--cw-amber); }
.performance-chart { position: relative; min-height: 260px; border-top: 1px solid var(--cw-border-soft); border-bottom: 1px solid var(--cw-border-soft); }
.performance-chart svg { width: 100%; height: 260px; display: block; overflow: visible; }
.performance-chart > div { position: absolute; inset: 0; display: grid; place-items: center; color: var(--cw-muted); font-size: var(--text-sm); }
.performance-chart > div[hidden] { display: none; }
.performance-chart__grid { stroke: var(--border-faint); stroke-width: 1; }
.performance-chart__current, .performance-chart__baseline { fill: none; stroke: var(--cw-red); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.performance-chart__current--gap { stroke: var(--cw-faint); stroke-width: 2; stroke-dasharray: 4 6; }
.performance-chart__baseline { stroke: var(--text-faint); stroke-width: 2; stroke-dasharray: 7 6; }
.performance-chart__dot { fill: var(--cw-red); stroke: var(--surface-soft); stroke-width: 2; }
.performance-chart__dot--baseline { fill: var(--text-faint); }
.performance-chart__dot--quiet { opacity: 0; }
.performance-chart__axis { fill: var(--cw-faint); font-size: var(--text-xs); }
.performance-chart__action-line { stroke: var(--warning); stroke-width: 1; stroke-dasharray: 3 5; opacity: .7; }
.performance-chart__action-marker { fill: var(--cw-amber); stroke: var(--surface-soft); stroke-width: 2; }
.performance-chart__action-hit { fill: transparent; cursor: pointer; }
.performance-chart__action-group { cursor: pointer; outline: none; }
.performance-chart__action-group:hover .performance-chart__action-marker,
.performance-chart__action-group:focus .performance-chart__action-marker { stroke: var(--warning-bright); stroke-width: 3; }
.performance-chart__tooltip { position: absolute !important; z-index: 5; width: min(290px, calc(100% - 24px)); height: max-content; min-height: max-content; inset: auto auto auto 50%; display: none !important; grid-auto-rows: max-content; align-content: start; justify-items: stretch; gap: 7px; padding: 12px 13px; border: 1px solid var(--warning-line); border-radius: 6px; background: var(--warning-tint); box-shadow: 0 12px 32px var(--scrim); pointer-events: none; transform: translate(-50%, calc(-100% - 12px)); }
.performance-chart__tooltip.is-visible { display: grid !important; }
.performance-chart__tooltip > span { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--cw-amber); font-size: var(--text-2xs); font-weight: 750; text-transform: uppercase; }
.performance-chart__tooltip > span em { color: var(--cw-faint); font-style: normal; font-weight: 650; }
.performance-chart__tooltip strong { color: var(--cw-text); font-size: var(--text-lg); line-height: 1.35; }
.performance-chart__tooltip p { margin: 0; color: var(--cw-text-soft); font-size: var(--text-xs); line-height: 1.45; }
.performance-chart__tooltip small { color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.4; }
.performance-chart-actions { display: flex; flex-wrap: wrap; gap: 8px 15px; padding: 11px 2px 0; }
.performance-coverage-note { display: flex; align-items: center; gap: 7px; margin: 10px 2px 0; color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.45; }
.performance-coverage-note svg { width: 13px; height: 13px; flex: 0 0 auto; }
.performance-chart-actions button { display: inline-flex; align-items: flex-start; gap: 7px; padding: 4px 0; border: 0; background: transparent; color: var(--cw-muted); text-align: left; cursor: pointer; }
.performance-chart-actions button:hover b, .performance-chart-actions button:focus b { color: var(--cw-amber); }
.performance-chart-actions button:focus { outline: 1px solid var(--focus-ring); outline-offset: 3px; }
.performance-chart-actions button > span { display: grid; gap: 2px; }
.performance-chart-actions svg { width: 12px; flex: 0 0 auto; color: var(--cw-amber); }
.performance-chart-actions b { color: var(--cw-text-soft); font-size: var(--text-2xs); }
.performance-chart-actions small { color: var(--cw-faint); font-size: var(--text-2xs); }
.performance-method { margin-top: 12px; }
.performance-method summary { width: fit-content; display: flex; align-items: center; gap: 7px; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.performance-method summary svg { width: 13px; color: var(--cw-blue); }
.performance-method p { max-width: 850px; margin: 8px 0 0 20px; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.5; }
.performance-metrics { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 16px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.performance-metrics article { min-height: 105px; display: grid; align-content: center; gap: 5px; padding: 17px; border-right: 1px solid var(--cw-border-soft); }
.performance-metrics article:last-child { border-right: 0; }
.performance-metrics span { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.performance-metrics strong { font-size: var(--text-3xl); }
.performance-metrics p { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.4; }
.performance-metrics small { color: var(--cw-faint); font-size: var(--text-xs); }
.performance-metrics .is-unavailable { opacity: .62; }
.performance-peer-context { margin-top: 10px; color: var(--cw-muted); }
.performance-peer-context summary { width: fit-content; display: flex; align-items: center; gap: 7px; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.performance-peer-context summary svg { width: 13px; color: var(--cw-blue); }
.performance-peer-context p { max-width: 850px; margin: 8px 0 0 20px; font-size: var(--text-xs); line-height: 1.55; }
.milestone-section { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--cw-border); }
.milestone-next { display: inline-flex; align-items: center; gap: 7px; color: var(--cw-muted); font-size: var(--text-xs); }
.milestone-next svg { width: 13px; }
.milestone-timeline { margin-top: 16px; }
.milestone-item { display: grid; grid-template-columns: 105px minmax(0, 1fr); min-height: 150px; }
.milestone-item__time { position: relative; padding: 3px 20px 0 0; border-right: 1px solid var(--cw-border); text-align: right; }
.milestone-item__time span { position: absolute; top: 6px; right: -5px; width: 9px; height: 9px; border: 2px solid var(--cw-bg); border-radius: 50%; background: var(--cw-green); }
.milestone-item__time strong { color: var(--cw-text-soft); font-size: var(--text-xs); }
.milestone-item__body { margin: 0 0 16px 22px; padding: 17px 19px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.milestone-item__body > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.milestone-item__body em { color: var(--cw-green); font-size: var(--text-2xs); font-style: normal; font-weight: 750; text-transform: uppercase; }
.milestone-item__body small { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: capitalize; }
.milestone-item h3 { margin: 7px 0 5px; font-size: var(--text-xl); }
.milestone-item p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.milestone-item ul { display: flex; flex-wrap: wrap; gap: 7px 16px; margin: 11px 0 0; padding: 0; list-style: none; }
.milestone-item li { position: relative; padding-left: 10px; color: var(--cw-text-soft); font-size: var(--text-xs); }
.milestone-item li::before { position: absolute; top: 5px; left: 0; width: 4px; height: 4px; border-radius: 50%; background: var(--cw-green); content: ""; }
.milestone-item--pending .milestone-item__time span, .milestone-item--processing .milestone-item__time span { background: var(--cw-blue); }
.milestone-item--failed .milestone-item__time span { background: var(--cw-amber); }
.video-history-note { max-width: 850px; margin: -4px 0 14px; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.history-event { min-height: 120px; }
.history-event { scroll-margin-top: 90px; outline: none; }
.history-event.is-targeted .milestone-item__body { animation: history-event-target 1.8s ease; }
@keyframes history-event-target {
  0%, 100% { border-color: var(--warning-line); box-shadow: none; }
  25% { border-color: var(--cw-amber); box-shadow: 0 0 0 3px color-mix(in srgb, var(--warning) 12%, transparent); }
}
.history-event--published { min-height: 94px; }
.history-event--published .milestone-item__time span { background: var(--cw-faint); }
.history-event--recommendation .milestone-item__time span, .history-event--opportunity .milestone-item__time span { background: var(--cw-blue); }
.history-event--recommendation .milestone-item__body em, .history-event--opportunity .milestone-item__body em { color: var(--cw-blue); }
.history-event--action_applied .milestone-item__time span { background: var(--cw-amber); }
.history-event--action_applied .milestone-item__body { border-color: var(--warning-line); background: var(--warning-tint); }
.history-event--action_applied .milestone-item__body em { color: var(--cw-amber); }
.history-event__outcome { display: flex !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 10px !important; margin-top: 12px; padding: 12px; border-left: 2px solid var(--cw-faint); background: var(--surface-soft); }
.history-event__outcome--positive { border-left-color: var(--cw-green); }
.history-event__outcome--negative { border-left-color: var(--cw-amber); }
.history-event__outcome--measuring { border-left-color: var(--cw-blue); }
.history-event__outcome > svg { width: 14px; flex: 0 0 auto; color: var(--cw-green); }
.history-event__outcome--negative > svg { color: var(--cw-amber); }
.history-event__outcome--measuring > svg { color: var(--cw-blue); }
.history-event__outcome > div { width: 100%; display: grid !important; gap: 6px; }
.history-event__outcome > div > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.history-event__outcome b { color: var(--cw-text); font-size: var(--text-sm); }
.history-event__outcome em { color: var(--cw-faint); font-size: var(--text-2xs); font-style: normal; font-weight: 650; white-space: nowrap; }
.history-event__outcome p { color: var(--cw-text-soft); font-size: var(--text-xs); }
.history-event__outcome dl { display: flex; gap: 20px; margin: 1px 0 0; }
.history-event__outcome dl div { display: grid; gap: 2px; }
.history-event__outcome dt { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.history-event__outcome dd { margin: 0; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.history-event__outcome small { color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.45; text-transform: none; }
.history-event__details { margin-top: 10px; }
.history-event__details summary { width: fit-content; color: var(--cw-text-soft); font-size: var(--text-2xs); font-weight: 700; cursor: pointer; }
.history-event__details ul { margin-top: 8px; }
.milestone-empty { min-height: 120px; display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 20px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.milestone-empty > svg { width: 20px; color: var(--cw-blue); }
.milestone-empty > div { display: grid; gap: 4px; }
.milestone-empty strong { font-size: var(--text-md); }
.milestone-empty small { color: var(--cw-muted); font-size: var(--text-xs); }

/* Analysis */
.analysis-breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 17px; color: var(--cw-faint); font-size: var(--text-sm); }
.analysis-breadcrumb a { display: inline-flex; align-items: center; gap: 5px; color: var(--cw-text-soft); }
.analysis-breadcrumb svg { width: 13px; }
.analysis-breadcrumb__action { margin-left: auto; }
.analysis-summary { min-height: 178px; display: flex; align-items: center; justify-content: space-between; gap: 36px; padding: 24px; border: 1px solid var(--cw-border); border-left: 3px solid var(--cw-red); border-radius: 7px; background: var(--cw-surface); }
.analysis-video-heading { display: flex; align-items: center; gap: 20px; min-width: 0; }
.analysis-video-heading img { width: 190px; aspect-ratio: 16/9; flex: 0 0 auto; object-fit: cover; border-radius: 5px; }
.analysis-video-heading > div { min-width: 0; }
.analysis-video-heading h1 { max-width: 650px; margin: 0; font-size: var(--text-4xl); line-height: 1.3; letter-spacing: 0; }
.analysis-video-heading > div > p:last-child { color: var(--cw-muted); font-size: var(--text-sm); }
.analysis-video-heading .analysis-brief { max-width: 650px; margin: 9px 0 0; color: var(--cw-text-soft); font-size: var(--text-md); line-height: 1.55; }
.overall-score { min-width: 156px; display: grid; justify-items: center; gap: 8px; }
.overall-score > div { width: 112px; height: 112px; display: grid; place-content: center; border-radius: 50%; background: radial-gradient(circle at center, var(--surface-soft) 58%, transparent 60%), conic-gradient(var(--cw-green) calc(var(--score) * 1%), var(--surface-elevated) 0); text-align: center; }
.overall-score strong { font-size: var(--text-5xl); line-height: 1; }
.overall-score span { color: var(--cw-muted); font-size: var(--text-2xs); text-transform: uppercase; }
.overall-score small { color: var(--cw-muted); font-size: var(--text-xs); }
.analysis-section { margin-top: 30px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 16px; }
.section-heading h2 { margin: 0; font-size: var(--text-3xl); }
.section-heading > p { max-width: 430px; margin: 0; color: var(--cw-muted); font-size: var(--text-sm); text-align: right; }
.dimension-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dimension-card { min-height: 220px; padding: 17px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.dimension-card--requires_data { background: var(--surface-soft); }
.dimension-card--partial { border-top-color: var(--warning-line); }
.dimension-card--scored { border-top-color: var(--positive-line); }
.dimension-card__top { display: flex; align-items: center; justify-content: space-between; color: var(--cw-faint); font-size: var(--text-2xs); }
.dimension-card__top em { font-style: normal; text-transform: uppercase; }
.dimension-card--partial .dimension-card__top em { color: var(--cw-amber); }
.dimension-card--scored .dimension-card__top em { color: var(--cw-green); }
.dimension-card__score { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-top: 18px; }
.dimension-card h3 { margin: 0; font-size: var(--text-2xl); }
.dimension-card__score > strong { font-size: var(--text-4xl); line-height: 1; }
.dimension-card__score small { color: var(--cw-faint); font-size: var(--text-xs); }
.dimension-card > p { min-height: 43px; margin: 16px 0 12px; color: var(--cw-muted); font-size: var(--text-sm); }
.dimension-card ul, .plan-card ul { margin: 0; padding: 0; list-style: none; }
.dimension-card li { position: relative; margin-top: 6px; padding-left: 13px; color: var(--cw-faint); font-size: var(--text-xs); }
.dimension-card li::before { content: ''; position: absolute; left: 0; top: 6px; width: 4px; height: 4px; border-radius: 50%; background: var(--border-strong); }
.analysis-findings { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 30px; }
.finding-column { min-width: 0; }
.finding-column > article { min-height: 82px; display: grid; grid-template-columns: 38px 1fr; gap: 12px; padding: 14px 0; border-top: 1px solid var(--cw-border-soft); }
.finding-column > article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 5px; font-size: var(--text-md); font-weight: 800; }
.finding-column--positive > article > span { background: var(--positive-tint); color: var(--cw-green); }
.finding-column--negative > article > span { background: var(--negative-tint); color: var(--negative-text); }
.finding-column article strong { font-size: var(--text-md); }
.finding-column article p, .muted-copy { margin: 4px 0 0; color: var(--cw-muted); font-size: var(--text-sm); }
.next-data-band { min-height: 90px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; margin-top: 22px; padding: 16px 20px; border: 1px solid var(--primary-line); border-left: 3px solid var(--cw-blue); border-radius: 6px; background: var(--primary-tint-soft); }
.next-data-band > div { display: flex; align-items: center; gap: 12px; }
.next-data-band > div > svg { color: var(--cw-blue); }
.next-data-band span { display: grid; }
.next-data-band strong { font-size: var(--text-md); }
.next-data-band small, .next-data-band > p { color: var(--cw-muted); font-size: var(--text-xs); }
.next-data-band > p { margin: 0; }

/* Tag recommendations */
.tag-context-header { min-height: 100px; display: grid; grid-template-columns: 126px minmax(0, 1fr) 34px; align-items: center; gap: 16px; padding: 13px 0 18px; border-bottom: 1px solid var(--cw-border); }
.tag-context-header > img { width: 126px; aspect-ratio: 16/9; object-fit: cover; border-radius: 5px; background: var(--surface-raised); }
.tag-context-header__copy { min-width: 0; }
.tag-context-header h1 { overflow: hidden; margin: 2px 0 8px; font-size: var(--text-3xl); line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.tag-context-header__copy > div { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--cw-muted); font-size: var(--text-xs); }
.tag-status { min-height: 66px; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 12px; padding: 13px 16px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.tag-status > svg { width: 19px; }
.tag-status > span { display: grid; gap: 3px; }
.tag-status strong { font-size: var(--text-md); }
.tag-status small { color: var(--cw-muted); font-size: var(--text-xs); }
.tag-status--success { border-color: var(--positive-line); background: var(--positive-tint); }
.tag-status--success > svg { color: var(--cw-green); }
.tag-status--error { border-color: var(--negative-line); background: var(--negative-tint); }
.tag-status--error > svg { color: var(--negative-text); }
.tag-start-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr); align-items: start; gap: 14px; margin-top: 18px; }
.tag-current-state, .tag-generate-panel { min-width: 0; padding: 22px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.tag-count-label { min-width: 28px; height: 24px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 5px; color: var(--cw-muted); font-size: var(--text-xs); }
.tag-existing-preview { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.tag-existing-preview > span { padding: 6px 9px; border: 1px solid var(--border-strong); border-radius: 5px; background: var(--primary-tint-soft); color: var(--cw-text-soft); font-size: var(--text-xs); }
.tag-empty-inline { min-height: 68px; display: flex; align-items: center; gap: 11px; width: 100%; color: var(--cw-faint); }
.tag-empty-inline > svg { width: 20px; }
.tag-empty-inline > span { display: grid; gap: 3px; }
.tag-empty-inline strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.tag-empty-inline small { color: var(--cw-muted); font-size: var(--text-xs); }
.tag-empty-inline--compact { min-height: 48px; }
.tag-generate-panel { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 16px; border-color: var(--primary-line); background: var(--primary-tint-soft); }
.tag-generate-panel__icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 6px; background: var(--primary-tint); color: var(--cw-blue); }
.tag-generate-panel__icon svg { width: 18px; }
.tag-generate-panel h2 { margin: 3px 0 7px; font-size: var(--text-2xl); }
.tag-generate-panel p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.55; }
.tag-input-signals { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 7px; }
.tag-input-signals span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border: 1px solid var(--cw-border-soft); border-radius: 4px; color: var(--cw-muted); font-size: var(--text-2xs); }
.tag-input-signals svg { width: 12px; }
.tag-generate-panel form { grid-column: 1 / -1; display: grid; gap: 8px; }
.tag-generate-panel form .button { width: 100%; }
.tag-generate-panel form small { color: var(--cw-faint); font-size: var(--text-2xs); text-align: center; }
.tag-strategy-band { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid var(--cw-border); }
.tag-strategy-band > div { min-width: 0; }
.tag-strategy-band h2 { max-width: 830px; margin: 3px 0 7px; font-size: var(--text-xl); line-height: 1.4; }
.tag-strategy-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--cw-text-soft); font-size: var(--text-2xs); text-transform: capitalize; }
.tag-strategy-meta span { display: inline-flex; align-items: center; gap: 5px; }
.tag-strategy-meta svg { width: 12px; }
.tag-strategy-meta .is-muted { color: var(--cw-faint); }
.tag-optimizer { display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: start; gap: 14px; margin-top: 14px; }
.tag-decision-panel, .tag-review-panel { min-width: 0; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.tag-decision-group { padding: 20px; border-bottom: 1px solid var(--cw-border-soft); }
.tag-decision-group:last-child { border-bottom: 0; }
.tag-group-heading { display: flex; align-items: start; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.tag-group-heading > div:first-child { display: flex; align-items: start; gap: 10px; }
.tag-group-heading h2 { margin: 1px 0 4px; font-size: var(--text-lg); }
.tag-group-heading p { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.45; }
.tag-group-heading > span { color: var(--cw-muted); font-size: var(--text-xs); }
.tag-group-icon { width: 28px; height: 28px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 5px; background: var(--positive-tint); color: var(--cw-green); }
.tag-group-icon--ai { background: var(--primary-tint); color: var(--cw-blue); }
.tag-group-icon svg { width: 14px; }
.tag-existing-options { display: flex; flex-wrap: wrap; gap: 7px; }
.tag-existing-options label { position: relative; min-height: 31px; display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 5px 7px 5px 9px; border: 1px solid var(--positive-line); border-radius: 5px; background: var(--positive-tint); color: var(--cw-text-soft); font-size: var(--text-xs); cursor: pointer; }
.tag-existing-options input { position: absolute; opacity: 0; pointer-events: none; }
.tag-existing-options label > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tag-existing-options label > svg { width: 12px; color: var(--cw-green); }
.tag-existing-options label:has(input:not(:checked)) { border-color: var(--cw-border-soft); background: var(--surface-soft); color: var(--cw-faint); text-decoration: line-through; }
.tag-existing-options label:has(input:not(:checked)) > svg { opacity: 0; }
.tag-bulk-actions { display: flex; gap: 8px; }
.tag-bulk-actions button { padding: 0; border: 0; background: transparent; color: var(--cw-muted); font: inherit; font-size: var(--text-2xs); cursor: pointer; }
.tag-bulk-actions button:hover { color: var(--cw-text); }
.tag-recommendation-list { border-top: 1px solid var(--cw-border-soft); }
.tag-recommendation-row { min-height: 58px; display: grid; grid-template-columns: 22px minmax(0, 1fr) 112px; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--cw-border-soft); cursor: pointer; }
.tag-recommendation-row:last-child { border-bottom: 0; }
.tag-recommendation-row > input { position: absolute; opacity: 0; pointer-events: none; }
.tag-option-check { width: 19px; height: 19px; display: grid; place-items: center; border: 1px solid var(--border-strong); border-radius: 4px; background: var(--surface-soft); color: transparent; }
.tag-option-check svg { width: 12px; }
.tag-recommendation-row.is-selected .tag-option-check { border-color: var(--positive-line); background: var(--positive-tint-strong); color: var(--cw-green); }
.tag-recommendation-copy { min-width: 0; display: grid; gap: 3px; }
.tag-recommendation-copy strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.tag-recommendation-copy small { display: -webkit-box; overflow: hidden; color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.tag-recommendation-meta { display: grid; justify-items: end; gap: 5px; }
.tag-intent { padding: 3px 5px; border: 1px solid var(--border-strong); border-radius: 3px; color: var(--text-muted); font-size: var(--text-2xs); font-style: normal; text-transform: uppercase; }
.tag-intent--broad { border-color: var(--warning-line); color: var(--warning-text); }
.tag-intent--long_tail { border-color: var(--primary-line); color: var(--primary-text); }
.tag-relevance { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.tag-relevance--high { color: var(--cw-green); }
.tag-relevance--strong { color: var(--cw-green); }
.tag-relevance--good { color: var(--primary-text); }
.tag-custom-control { display: grid; grid-template-columns: 90px minmax(0, 1fr); align-items: center; gap: 10px; }
.tag-custom-control > label { color: var(--cw-muted); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.tag-custom-control > div { display: grid; grid-template-columns: minmax(0, 1fr) 34px; gap: 6px; }
.tag-custom-control input { min-width: 0; height: 36px; padding: 0 10px; border: 1px solid var(--cw-border); border-radius: 5px; outline: 0; background: var(--surface-base); color: var(--cw-text); font: inherit; font-size: var(--text-sm); }
.tag-custom-control input:focus { border-color: var(--border-strong); }
.tag-review-panel { position: sticky; top: 72px; padding: 18px; }
.tag-review-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.tag-review-heading h2 { margin: 2px 0 0; font-size: var(--text-xl); }
.tag-budget { display: flex; align-items: baseline; gap: 4px; color: var(--cw-muted); }
.tag-budget strong { color: var(--cw-green); font-size: var(--text-3xl); }
.tag-budget span { font-size: var(--text-xs); }
.tag-budget.is-over strong { color: var(--negative-text); }
.tag-budget-track { height: 4px; overflow: hidden; margin: 13px 0 10px; border-radius: 2px; background: var(--surface-elevated); }
.tag-budget-track span { display: block; width: 0; height: 100%; background: var(--cw-green); transition: width 150ms ease; }
.tag-budget-track.is-over span { background: var(--negative); }
.tag-selection-stats { display: flex; gap: 12px; margin-bottom: 13px; color: var(--cw-faint); font-size: var(--text-2xs); }
.tag-selection-stats strong { color: var(--cw-text-soft); }
.tag-selected-list { max-height: 280px; min-height: 96px; display: flex; align-content: flex-start; flex-wrap: wrap; gap: 6px; overflow-y: auto; padding: 11px; border: 1px solid var(--cw-border-soft); border-radius: 6px; background: var(--surface-base); }
.tag-selected-chip { min-height: 30px; display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 4px 5px 4px 9px; border: 1px solid var(--positive-line); border-radius: 5px; background: var(--positive-tint); color: var(--cw-text-soft); font-size: var(--text-xs); }
.tag-selected-chip--recommended { border-color: var(--primary-line); background: var(--primary-tint-soft); }
.tag-selected-chip--custom { border-color: var(--warning-line); background: var(--warning-tint); }
.tag-selected-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tag-selected-chip button { width: 20px; height: 20px; display: grid; flex: 0 0 auto; place-items: center; border: 0; background: transparent; color: var(--cw-muted); cursor: pointer; }
.tag-selected-chip button:hover { color: var(--negative-text); }
.tag-selected-chip svg { width: 12px; }
.tag-selected-empty { margin: auto; color: var(--cw-faint); font-size: var(--text-xs); }
.tag-apply-explainer { display: flex; align-items: start; gap: 9px; margin-top: 12px; padding: 10px; border: 1px solid var(--warning-line); border-radius: 5px; background: var(--warning-tint); }
.tag-apply-explainer > svg { width: 15px; flex: 0 0 auto; color: var(--cw-amber); }
.tag-apply-explainer p { display: grid; gap: 3px; margin: 0; }
.tag-apply-explainer strong { font-size: var(--text-xs); }
.tag-apply-explainer span { color: var(--cw-muted); font-size: var(--text-2xs); line-height: 1.4; }
.tag-review-footer { display: grid; gap: 12px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--cw-border-soft); }
.tag-review-footer > span { color: var(--cw-muted); font-size: var(--text-2xs); line-height: 1.4; }
.tag-review-footer > .button { width: 100%; }
.tag-permission-action { display: grid; gap: 9px; }
.tag-permission-action p { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--cw-amber); font-size: var(--text-2xs); line-height: 1.4; }
.tag-permission-action p svg { width: 13px; flex: 0 0 auto; }
.tag-permission-action .button { width: 100%; }

/* Growth opportunities */
.opportunity-page-heading > div { max-width: 720px; }
.opportunity-monitor-status { min-width: 210px; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.opportunity-monitor-status > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--positive-tint); color: var(--cw-green); }
.opportunity-monitor-status > span svg { width: 14px; }
.opportunity-monitor-status > div { display: grid; gap: 2px; }
.opportunity-monitor-status strong { font-size: var(--text-sm); }
.opportunity-monitor-status small { color: var(--cw-muted); font-size: var(--text-2xs); }
.opportunity-notice { min-height: 62px; display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 13px 15px; border: 1px solid var(--primary-line); border-radius: 6px; background: var(--primary-tint-soft); }
.opportunity-notice > svg { width: 17px; flex: 0 0 auto; color: var(--cw-blue); }
.opportunity-notice--working > svg { animation: opportunity-spin 1.5s linear infinite; }
.opportunity-notice--neutral { border-color: var(--cw-border); background: var(--cw-surface); }
.opportunity-notice--neutral > svg { color: var(--cw-muted); }
.opportunity-notice > span { display: grid; gap: 3px; }
.opportunity-notice strong { font-size: var(--text-sm); }
.opportunity-notice small { color: var(--cw-muted); font-size: var(--text-2xs); }
.opportunity-toolbar { min-height: 44px; display: flex; align-items: center; justify-content: space-between; color: var(--cw-muted); font-size: var(--text-xs); }
.opportunity-toolbar span { color: var(--cw-text-soft); font-weight: 700; }
.opportunity-list { border-top: 1px solid var(--cw-border); }
.opportunity-row { min-height: 150px; display: grid; grid-template-columns: 112px minmax(0, 1fr) 165px; align-items: center; gap: 19px; padding: 18px 6px; border-bottom: 1px solid var(--cw-border); transition: background 150ms ease, padding 150ms ease; }
.opportunity-row:hover { padding-right: 10px; padding-left: 10px; background: var(--glass-faint); }
.opportunity-row__media { width: 112px; aspect-ratio: 16/9; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface); color: var(--cw-muted); }
.opportunity-row__media img { width: 100%; height: 100%; object-fit: cover; }
.opportunity-row__media svg { width: 18px; }
.opportunity-row__copy { min-width: 0; }
.opportunity-row__copy > div { display: flex; align-items: center; gap: 7px; }
.opportunity-row__copy > div em, .opportunity-row__copy > div b { color: var(--cw-amber); font-size: var(--text-2xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.opportunity-row__copy > div b { padding-left: 7px; border-left: 1px solid var(--cw-border); color: var(--cw-muted); }
.opportunity-row h2 { overflow: hidden; margin: 6px 0 3px; font-size: var(--text-xl); line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-row__finding { display: block; overflow: hidden; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-row p { overflow: hidden; margin: 3px 0 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-row__support { display: block; overflow: hidden; margin-top: 7px; color: var(--cw-faint); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.opportunity-row__action { min-height: 64px; display: grid; grid-template-columns: minmax(0, 1fr) 15px; align-content: center; gap: 3px 8px; padding-left: 18px; border-left: 1px solid var(--cw-border-soft); color: var(--cw-muted); }
.opportunity-row__action span { grid-column: 1 / -1; color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.opportunity-row__action strong { color: var(--cw-green); font-size: var(--text-md); }
.opportunity-row__action svg { width: 13px; transition: transform 150ms ease; }
.opportunity-row:hover .opportunity-row__action { color: var(--cw-text-soft); }
.opportunity-row:hover .opportunity-row__action svg { transform: translateX(2px); }
.opportunity-empty { min-height: 300px; }
.resolved-opportunities { margin-top: 42px; padding-top: 27px; border-top: 1px solid var(--cw-border); }
.resolved-opportunities .section-heading > span { color: var(--cw-muted); font-size: var(--text-xs); }
.resolved-opportunities > div:last-child { border-top: 1px solid var(--cw-border-soft); }
.resolved-opportunities a { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--cw-border-soft); color: var(--cw-muted); font-size: var(--text-xs); }
.resolved-opportunities a > span { min-width: 0; display: grid; gap: 2px; }
.resolved-opportunities a strong, .resolved-opportunities a small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resolved-opportunities a strong { color: var(--cw-text-soft); font-size: var(--text-xs); }
.resolved-opportunities a small { color: var(--cw-faint); font-size: var(--text-2xs); }
.opportunity-history-status { flex: 0 0 auto; color: var(--cw-faint); font-size: var(--text-2xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.opportunity-history-status--completed { color: var(--cw-green); }
.opportunity-detail-header { min-height: 190px; display: grid; grid-template-columns: 250px minmax(0, 1fr) auto; align-items: center; gap: 25px; padding: 19px 0 25px; border-bottom: 1px solid var(--cw-border); }
.opportunity-detail-header__media { position: relative; width: 250px; aspect-ratio: 16/9; overflow: hidden; border-radius: 5px; background: var(--surface-raised); }
.opportunity-detail-header__media img { width: 100%; height: 100%; object-fit: cover; }
.opportunity-detail-header__media span { position: absolute; left: 8px; bottom: 8px; padding: 4px 6px; border-radius: 3px; background: var(--scrim-media); color: var(--on-scrim); font-size: var(--text-2xs); font-weight: 700; }
.opportunity-detail-header__copy { min-width: 0; }
.opportunity-detail-header__copy .eyebrow { margin-bottom: 5px; color: var(--cw-amber); }
.opportunity-detail-header h1 { margin: 0 0 7px; font-size: var(--text-5xl); line-height: 1.25; }
.opportunity-detail-header__copy > p:last-child { max-width: 720px; margin: 10px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.55; }
.opportunity-detail-header__actions { display: grid; gap: 8px; justify-items: stretch; }
.opportunity-detail-header__actions .button { justify-content: flex-start; white-space: nowrap; }
.opportunity-studio-link { white-space: nowrap; }
.opportunity-diagnosis { display: grid; grid-template-columns: .85fr 1.2fr .85fr; margin-top: 18px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.opportunity-diagnosis article { min-height: 116px; display: grid; align-content: center; gap: 6px; padding: 18px 20px; border-right: 1px solid var(--cw-border-soft); }
.opportunity-diagnosis article:last-child { border-right: 0; }
.opportunity-diagnosis span { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.opportunity-diagnosis strong { font-size: var(--text-2xl); line-height: 1.35; }
.opportunity-diagnosis p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.opportunity-diagnosis__primary strong { color: var(--cw-amber); font-size: var(--text-3xl); }
.opportunity-diagnosis__action { background: var(--positive-tint); }
.opportunity-diagnosis__action strong { color: var(--cw-green); }
.opportunity-comparison-method { margin-top: 11px; color: var(--cw-muted); }
.opportunity-comparison-method summary { width: fit-content; display: flex; align-items: center; gap: 7px; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.opportunity-comparison-method summary svg { width: 13px; color: var(--cw-blue); }
.opportunity-comparison-method p { max-width: 850px; margin: 8px 0 0 20px; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.5; }
.opportunity-evidence-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 10px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.opportunity-evidence-strip article { min-height: 88px; display: grid; align-content: center; gap: 4px; padding: 15px 17px; border-right: 1px solid var(--cw-border-soft); }
.opportunity-evidence-strip article:last-child { border-right: 0; }
.opportunity-evidence-strip span { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.opportunity-evidence-strip small { color: var(--cw-muted); font-size: var(--text-2xs); line-height: 1.4; }
.opportunity-evidence-strip strong { font-size: var(--text-xl); }
.opportunity-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 430px; align-items: start; gap: 24px; margin-top: 18px; }
.opportunity-reasoning { border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.opportunity-story-heading { padding: 22px; border-bottom: 1px solid var(--cw-border); }
.opportunity-story-heading .eyebrow { margin-bottom: 4px; }
.opportunity-story-heading h2 { margin: 0; font-size: var(--text-3xl); }
.opportunity-story-heading > p:last-child { max-width: 720px; margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.55; }
.opportunity-reasoning section { min-height: 140px; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 15px; padding: 22px; border-bottom: 1px solid var(--cw-border); }
.opportunity-reasoning section > span { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 5px; color: var(--cw-text-soft); }
.opportunity-reasoning section > span svg { width: 15px; }
.opportunity-reasoning h2 { margin: 3px 0 7px; font-size: var(--text-xl); }
.opportunity-reasoning section p { max-width: 760px; margin: 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.6; }
.opportunity-reasoning section small { display: flex; align-items: center; gap: 6px; margin-top: 12px; color: var(--cw-faint); font-size: var(--text-xs); line-height: 1.45; }
.opportunity-reasoning section small svg { width: 12px; flex: 0 0 auto; color: var(--cw-green); }
.opportunity-prepared-solution { display: grid; gap: 6px; margin-top: 16px; padding: 14px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-bg-soft); }
.opportunity-prepared-solution > span { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.opportunity-prepared-solution > strong { color: var(--cw-text); font-size: var(--text-lg); line-height: 1.4; }
.opportunity-prepared-solution ol { display: grid; gap: 4px; margin: 3px 0 0; padding-left: 18px; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.opportunity-reasoning .repurposing-direction { min-height: 0; display: block; padding: 22px; border-bottom: 0; }
.repurposing-direction__format { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 15px; border-bottom: 1px solid var(--cw-border-soft); }
.repurposing-direction__format span, .repurposing-direction__title span, .repurposing-direction__angle span, .repurposing-direction__outline > span { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.repurposing-direction__format strong { padding: 5px 8px; border: 1px solid var(--positive-line); border-radius: 4px; background: var(--positive-tint); color: var(--cw-green); font-size: var(--text-xs); }
.repurposing-direction__title { padding: 20px 0 10px; }
.repurposing-direction__title h2 { max-width: 720px; margin: 7px 0 0; font-size: var(--text-4xl); line-height: 1.35; }
.repurposing-direction__angle { max-width: 720px; padding-bottom: 19px; }
.opportunity-reasoning .repurposing-direction__angle p { margin-top: 7px; font-size: var(--text-md); }
.repurposing-direction__outline { padding-top: 17px; border-top: 1px solid var(--cw-border-soft); }
.repurposing-direction__outline ol { display: grid; gap: 0; margin: 12px 0 0; padding: 0; list-style: none; }
.repurposing-direction__outline li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--cw-border-soft); }
.repurposing-direction__outline li:last-child { border-bottom: 0; }
.repurposing-direction__outline li b { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 600; }
.opportunity-reasoning .repurposing-direction__outline li p { color: var(--cw-text-soft); font-size: var(--text-sm); }
.opportunity-reasoning .description-refresh-preview { min-height: 0; display: block; padding: 22px; border-bottom: 0; }
.description-refresh-preview__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--cw-border-soft); }
.description-refresh-preview__heading > div { display: grid; gap: 4px; }
.description-refresh-preview__heading span { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.description-refresh-preview__heading strong { color: var(--cw-text-soft); font-size: var(--text-sm); }
.description-refresh-preview__heading > svg { width: 18px; color: var(--cw-green); }
.description-refresh-preview__copy, .description-refresh-preview__current { max-height: 430px; overflow: auto; margin-top: 16px; padding: 16px; border: 1px solid var(--cw-border-soft); border-radius: 5px; background: var(--surface-base); color: var(--cw-text-soft); font-size: var(--text-sm); line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.description-refresh-preview details { margin-top: 14px; }
.description-refresh-preview summary { width: fit-content; color: var(--cw-muted); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.description-refresh-preview__current { max-height: 260px; margin-top: 10px; color: var(--cw-muted); }
.description-refresh-preview__current em { color: var(--cw-faint); }
.opportunity-supporting-evidence { padding: 16px 22px; }
.opportunity-supporting-evidence summary { color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.opportunity-supporting-evidence > div { display: grid; gap: 8px; padding-top: 13px; }
.opportunity-supporting-evidence p { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.55; }
.opportunity-supporting-evidence p strong { color: var(--cw-text-soft); }
.opportunity-action-panel { position: sticky; top: 72px; padding: 20px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.opportunity-action-heading h2 { margin: 3px 0 7px; font-size: var(--text-3xl); }
.opportunity-action-heading > p:last-child { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.55; }
.opportunity-manual-completion { display: grid; gap: 8px; margin-top: 17px; }
.opportunity-manual-completion .button { width: 100%; }
.opportunity-manual-completion > small { color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.45; text-align: center; }
.description-refresh-form { display: grid; gap: 12px; margin-top: 15px; }
.description-refresh-form > .button { width: 100%; }
.description-final-field { display: grid; gap: 6px; }
.description-final-field > span { display: flex; align-items: center; justify-content: space-between; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.description-final-field > span small { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 500; }
.description-final-field textarea { width: 100%; min-height: 260px; resize: vertical; padding: 11px; border: 1px solid var(--cw-border); border-radius: 5px; outline: 0; background: var(--surface-base); color: var(--cw-text); font: inherit; font-size: var(--text-sm); line-height: 1.55; }
.description-final-field textarea:focus { border-color: var(--positive-line-strong); box-shadow: 0 0 0 2px color-mix(in srgb, var(--positive) 12%, transparent); }
.description-final-field > small { color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.45; }
.title-suggestion-form { display: grid; gap: 12px; margin-top: 15px; }
.current-title { padding: 11px; border-left: 2px solid var(--cw-faint); background: var(--surface-soft); }
.current-title span { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.current-title p { margin: 5px 0 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.45; }
.title-suggestion-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 2px; }
.title-suggestion-heading span { color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.title-suggestion-heading small { color: var(--cw-faint); font-size: var(--text-2xs); }
.title-suggestion-list { display: grid; gap: 6px; }
.title-suggestion-list button { width: 100%; min-height: 68px; display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--cw-border-soft); border-radius: 5px; background: transparent; color: var(--cw-text); font: inherit; text-align: left; cursor: pointer; transition: background 150ms ease, border-color 150ms ease; }
.title-suggestion-list button:hover { border-color: var(--border); background: var(--surface-soft); }
.title-suggestion-list button.is-selected { border-color: var(--positive-line); background: var(--positive-tint); }
.title-suggestion-list button > span { width: 18px; height: 18px; display: grid; place-items: center; border: 1px solid var(--border-strong); border-radius: 50%; color: transparent; }
.title-suggestion-list button.is-selected > span { border-color: var(--cw-green); background: var(--positive-tint-strong); color: var(--cw-green); }
.title-suggestion-list button > span svg { width: 11px; }
.title-suggestion-list button > div { min-width: 0; display: grid; gap: 3px; }
.title-suggestion-list button strong { font-size: var(--text-sm); line-height: 1.4; }
.title-suggestion-list button small { color: var(--cw-muted); font-size: var(--text-2xs); line-height: 1.4; }
.title-final-field { display: grid; gap: 6px; }
.title-final-field > span { display: flex; align-items: center; justify-content: space-between; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.title-final-field > span small { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 500; }
.title-final-field textarea { width: 100%; min-height: 66px; resize: vertical; padding: 10px; border: 1px solid var(--cw-border); border-radius: 5px; outline: 0; background: var(--surface-base); color: var(--cw-text); font: inherit; font-size: var(--text-md); line-height: 1.45; }
.title-final-field textarea:focus { border-color: var(--positive-line-strong); box-shadow: 0 0 0 2px color-mix(in srgb, var(--positive) 12%, transparent); }
.title-final-field > small { color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.4; }
.opportunity-apply-note { display: flex; align-items: start; gap: 8px; padding: 10px; border: 1px solid var(--warning-line); border-radius: 5px; background: var(--warning-tint); color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.45; }
.opportunity-apply-note svg { width: 14px; flex: 0 0 auto; color: var(--cw-amber); }
.title-suggestion-form > .button { width: 100%; }
.opportunity-secondary-actions { display: flex; align-items: center; justify-content: space-between; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--cw-border-soft); }
.opportunity-secondary-actions a, .opportunity-secondary-actions button { padding: 0; border: 0; background: transparent; color: var(--cw-muted); font: inherit; font-size: var(--text-xs); cursor: pointer; }
.opportunity-secondary-actions a:hover { color: var(--cw-text-soft); }
.opportunity-secondary-actions button:hover { color: var(--negative-text); }
.opportunity-resolved-state { min-height: 310px; display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; }
.opportunity-resolved-state > svg { width: 28px; color: var(--cw-muted); }
.opportunity-resolved-state--completed > svg { color: var(--cw-green); }
.opportunity-resolved-state .eyebrow { margin: 2px 0 0; }
.opportunity-resolved-state h2 { margin: 0; font-size: var(--text-2xl); }
.opportunity-resolved-state > p:last-of-type { max-width: 310px; margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.5; }
.opportunity-resolved-state > a { margin-top: 8px; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.opportunity-title-change { width: 100%; display: grid; justify-items: start; gap: 5px; margin-top: 10px; padding: 11px; border: 1px solid var(--cw-border-soft); border-radius: 5px; background: var(--surface-soft); text-align: left; }
.opportunity-title-change span { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.opportunity-title-change p, .opportunity-title-change strong { margin: 0; font-size: var(--text-xs); line-height: 1.4; }
.opportunity-title-change p { color: var(--cw-muted); }
.opportunity-title-change > svg { width: 12px; color: var(--cw-faint); }
@keyframes opportunity-spin { to { transform: rotate(360deg); } }

/* Remaining workspace pages */
.feature-bridge { min-height: 330px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; padding: 44px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.feature-bridge > div:first-child > span { color: var(--cw-red); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.feature-bridge h2 { max-width: 560px; margin: 12px 0; font-size: var(--text-5xl); }
.feature-bridge p { max-width: 540px; color: var(--cw-muted); font-size: var(--text-lg); }
.audit-map { display: flex; align-items: center; justify-content: center; gap: 10px; }
.audit-map span { min-height: 70px; display: grid; place-items: center; padding: 0 14px; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface-soft); color: var(--cw-text-soft); font-size: var(--text-sm); text-align: center; }
.audit-map svg { width: 14px; color: var(--cw-faint); }
.timeline { border-left: 1px solid var(--cw-border); margin-left: 16px; padding-left: 28px; }
.timeline > article { position: relative; min-height: 100px; padding: 11px 0 20px; border-bottom: 1px solid var(--cw-border-soft); }
.timeline > article > span { position: absolute; left: -45px; top: 12px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--positive-line); border-radius: 50%; background: var(--positive-tint); color: var(--cw-green); }
.timeline > article > span svg { width: 13px; }
.timeline small { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.timeline h2 { margin: 5px 0; font-size: var(--text-lg); }
.timeline p { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); }
.timeline > article.timeline--failed > span { color: var(--cw-red); border-color: var(--negative-line); background: var(--negative-tint); }
.access-heading { margin-bottom: 20px; }
.credit-overview, .access-details { width: min(760px, 100%); border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.credit-overview { margin-bottom: 14px; }
.credit-overview__main { padding: 24px; }
.credit-overview__topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.credit-overview__topline h2 { margin: 0; color: var(--cw-text-soft); font-size: var(--text-lg); font-weight: 700; }
.credit-overview__topline > span { color: var(--cw-muted); font-size: var(--text-md); }
.credit-overview__amount { display: flex; align-items: baseline; gap: 9px; margin: 16px 0 12px; line-height: 1; }
.credit-overview__amount strong { font-size: var(--text-7xl); font-weight: 750; letter-spacing: -.04em; }
.credit-overview__amount span { color: var(--cw-text-soft); font-size: var(--text-xl); }
.credit-overview__breakdown { margin: 0; color: var(--cw-text-soft); font-size: var(--text-md); }
.credit-overview__breakdown span { padding: 0 3px; color: var(--cw-faint); }
.credit-overview__caption { margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-md); }
.credit-overview__status { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 24px; border-top: 1px solid var(--cw-border-soft); }
.credit-overview__status p { margin: 0; color: var(--cw-text-soft); font-size: var(--text-md); }
.credit-request-dialog { width: min(520px, calc(100vw - 32px)); padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 9px; background: var(--cw-surface); color: var(--cw-text); box-shadow: 0 30px 90px var(--scrim-strong); }
.credit-request-dialog::backdrop { background: var(--overlay); backdrop-filter: blur(3px); }
.credit-request-dialog__form > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px; border-bottom: 1px solid var(--cw-border); background: var(--surface); }
.credit-request-dialog__form > header p { margin: 0 0 4px; }
.credit-request-dialog__form > header h2 { margin: 0; font-size: var(--text-2xl); }
.credit-request-dialog__body { display: grid; gap: 9px; padding: 20px; }
.credit-request-dialog__body > p { margin: 0 0 7px; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.6; }
.credit-request-dialog__body label { color: var(--cw-text-soft); font-size: var(--text-sm); font-weight: 700; }
.credit-request-dialog__body textarea { min-height: 120px; resize: vertical; padding: 11px; border: 1px solid var(--cw-border); border-radius: 5px; outline: 0; background: var(--surface-soft); color: var(--cw-text); font: inherit; font-size: var(--text-md); line-height: 1.55; }
.credit-request-dialog__body textarea:focus { border-color: var(--positive-line-strong); box-shadow: 0 0 0 2px color-mix(in srgb, var(--positive) 12%, transparent); }
.credit-request-form__error { display: block; margin-top: 5px; color: var(--negative-text); font-size: var(--text-sm); }
.credit-request-dialog__form > footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--cw-border-soft); }
.access-details { padding: 22px 24px; }
.access-details h2 { margin: 0 0 15px; font-size: var(--text-2xl); }
.access-details__table { border-top: 1px solid var(--cw-border-soft); }
.access-details__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; min-height: 43px; border-bottom: 1px solid var(--cw-border-soft); color: var(--cw-text-soft); font-size: var(--text-lg); }
.access-details__row strong { color: var(--cw-text); font-size: var(--text-md); font-weight: 700; }
.access-details__row--head { min-height: 35px; color: var(--cw-muted); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.access-details p { margin: 17px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.6; }
.audit-credit-link a { color: var(--cw-text); text-decoration: underline; }
.plan-grid { width: min(900px, 100%); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-inline: auto; }
.plan-grid--single { max-width: 520px; grid-template-columns: 1fr; }
.plan-grid--single .plan-card { min-height: 0; }
.plan-card { min-height: 450px; display: flex; flex-direction: column; padding: 25px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.plan-card--featured { border-top: 3px solid var(--cw-red); background: var(--primary-tint); }
.plan-card > span { color: var(--cw-muted); font-size: var(--text-sm); font-weight: 750; text-transform: uppercase; }
.plan-card h2 { margin: 16px 0 9px; font-size: var(--text-6xl); }
.plan-card h2 small { color: var(--cw-muted); font-size: var(--text-md); font-weight: 500; }
.plan-card > p { min-height: 54px; margin: 0; color: var(--cw-muted); font-size: var(--text-md); }
.plan-card ul { flex: 1; margin: 22px 0; border-top: 1px solid var(--cw-border-soft); }
.plan-card li { position: relative; padding: 11px 0 11px 18px; border-bottom: 1px solid var(--cw-border-soft); color: var(--cw-text-soft); font-size: var(--text-sm); }
.plan-card li::before { content: ''; position: absolute; left: 0; top: 17px; width: 6px; height: 6px; border-radius: 50%; background: var(--cw-green); }
.audit-workspace-card { overflow: hidden; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.audit-claimed-journeys { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 28px; margin-bottom: 18px; padding: 22px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.audit-claimed-journeys h2 { margin: 0; font-size: var(--text-3xl); }
.audit-claimed-journeys > div:first-child > p:last-child { margin: 8px 0 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.6; }
.audit-claimed-journeys__list { display: grid; gap: 7px; }
.audit-claimed-journeys__list > a { min-height: 56px; display: grid; grid-template-columns: 30px 1fr 16px; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--cw-border-soft); border-radius: 6px; background: var(--surface-soft); color: var(--cw-text); text-decoration: none; }
.audit-claimed-journeys__list > a:hover { border-color: var(--border-strong); background: var(--surface); }
.audit-claimed-journeys__list > a > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--positive-tint); color: var(--cw-green); }
.audit-claimed-journeys__list > a svg { width: 14px; }
.audit-claimed-journeys__list > a > div { display: grid; gap: 3px; }
.audit-claimed-journeys__list strong { font-size: var(--text-sm); }
.audit-claimed-journeys__list small { color: var(--cw-faint); font-size: var(--text-2xs); }
.audit-claimed-journeys__list > a > svg { color: var(--cw-faint); }
.audit-channel-target { min-height: 104px; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 15px; padding: 20px 22px; border-bottom: 1px solid var(--cw-border); }
.audit-channel-target > .channel-avatar, .audit-channel-target > .workspace-avatar { width: 48px; height: 48px; border-radius: 6px; }
.connected-channel .channel-avatar { width: 40px; height: 40px; }
.audit-channel-target > div { min-width: 0; }
.audit-channel-target span, .audit-workspace-action span { color: var(--cw-faint); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; }
.audit-channel-target h2 { margin: 3px 0 1px; font-size: var(--text-2xl); }
.audit-channel-target p { color: var(--cw-muted); font-size: var(--text-sm); }
.audit-channel-target em { display: inline-flex; align-items: center; gap: 5px; color: var(--cw-green); font-size: var(--text-xs); font-style: normal; font-weight: 700; text-transform: uppercase; }
.audit-channel-target em svg { width: 13px; }
.audit-workspace-action { min-height: 190px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 32px; padding: 28px 32px; }
.audit-workspace-action strong { display: block; margin: 7px 0; font-size: var(--text-4xl); }
.audit-workspace-action p { max-width: 650px; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.7; }
.audit-workspace-action form { margin: 0; }
.audit-workspace-buttons { display: grid; justify-items: stretch; gap: 8px; min-width: 190px; }
.audit-workspace-buttons .button { width: 100%; }
.audit-credit-link { color: var(--cw-muted); font-size: var(--text-xs); text-align: center; }
.audit-flow-band { min-height: 84px; display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 14px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.audit-flow-band div { display: flex; align-items: center; gap: 9px; }
.audit-flow-band span { color: var(--cw-red); font-size: var(--text-xs); font-weight: 800; }
.audit-flow-band strong { font-size: var(--text-md); }
.audit-flow-band > svg { width: 15px; color: var(--cw-faint); }
.audit-public-link { margin: 14px 2px 0; color: var(--cw-muted); font-size: var(--text-sm); }
.audit-public-link a { color: var(--cw-text-soft); }
.audit-report-heading { margin-bottom: 18px; }
.audit-report-heading .text-link { display: inline-flex; align-items: center; gap: 6px; }
.audit-report-heading .text-link svg { width: 14px; }
.audit-report-heading h1 { margin: 12px 0 4px; font-size: var(--text-5xl); }
.audit-report-heading p { color: var(--cw-muted); font-size: var(--text-md); }
.audit-report-shell { height: calc(100vh - 205px); min-height: 620px; overflow: hidden; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-deepest); }
.audit-report-shell iframe { width: 100%; height: 100%; border: 0; background: var(--surface-deepest); }
.settings-sections { border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.settings-sections > section { min-height: 150px; display: grid; grid-template-columns: 270px 1fr; gap: 40px; padding: 24px; border-bottom: 1px solid var(--cw-border-soft); }
.settings-sections > section:last-child { border-bottom: 0; }
.settings-sections h2 { margin: 0; font-size: var(--text-xl); }
.settings-sections section > div:first-child > p { margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-sm); }
.settings-sections dl { margin: 0; }
.settings-sections dl > div { display: grid; grid-template-columns: 130px 1fr; min-height: 38px; align-items: center; border-bottom: 1px solid var(--cw-border-soft); font-size: var(--text-sm); }
.settings-sections dt { color: var(--cw-muted); }
.settings-sections dd { margin: 0; color: var(--cw-text-soft); }
.settings-feedback { margin-bottom: 18px; padding: 11px 13px; border: 1px solid var(--positive-line); border-radius: 5px; background: var(--positive-tint); color: var(--cw-green); font-size: var(--text-lg); }
.settings-profile { max-width: 480px; }
.settings-profile form { display: grid; justify-items: start; gap: 9px; margin-bottom: 17px; }
.settings-profile label { color: var(--cw-muted); font-size: var(--text-sm); }
.settings-profile input { width: 100%; min-height: 40px; padding: 0 11px; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface-soft); color: var(--cw-text); font: inherit; font-size: var(--text-lg); }
.settings-profile .button { margin-top: 3px; }
.settings-profile__error { color: var(--negative-bright); font-size: var(--text-sm); }
.connected-channel { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; }
.connected-channel img { width: 44px; height: 44px; border-radius: 6px; object-fit: cover; }
.connected-channel span { display: grid; }
.connected-channel strong { font-size: var(--text-lg); }
.connected-channel small { color: var(--cw-muted); font-size: var(--text-xs); }
.connected-channel em { color: var(--cw-green); font-size: var(--text-xs); font-style: normal; }

/* Appearance: one option per palette, each drawn in the palette it selects.
   The [data-theme] on the label re-points the six raw slots, so --p-ink and
   friends below resolve to that palette's colours rather than the page's. */
/* min-width:0 is what actually lets this drop to one column on a phone: as a
   grid item it is floored at min-content otherwise, and the 178px track floor
   then pushes the whole settings panel wider than the screen. The min() keeps
   the track itself from being the thing that overflows. */
.theme-choice { min-width: 0; }
.theme-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(178px, 100%), 1fr)); gap: 10px; min-width: 0; max-width: 620px; }
.theme-option { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 9px; padding: 9px 11px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); cursor: pointer; }
.theme-option:hover { border-color: var(--border-strong); }
.theme-option:has(:checked) { border-color: var(--primary-line); background: var(--primary-tint); }
.theme-option:has(:focus-visible) { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.theme-option input { grid-row: 1 / 3; margin: 0; accent-color: var(--primary); }
/* A miniature of the page: the ground it uses, its accent, and its two text
   weights - built from the ramp, so a light palette previews as a light one. */
.theme-option__preview { grid-column: 2; display: flex; align-items: center; gap: 5px; height: 30px; padding: 0 9px; border: 1px solid var(--p-line); border-radius: var(--shape-md); background: color-mix(in srgb, var(--p-ink) var(--p-ramp-base), var(--p-depth)); }
.theme-option__preview i { display: block; border-radius: var(--shape-pill); }
.theme-option__accent { width: 13px; height: 13px; background: var(--p-accent); }
.theme-option__text { width: 30px; height: 5px; background: var(--p-text-high); }
.theme-option__muted { width: 18px; height: 5px; background: var(--p-text-mid); }
/* The full text colour, not the soft one: at 10px the soft token drops to
   4.3:1 in royal_glimmer, and this label IS the control's name. */
.theme-option__label { grid-column: 2; color: var(--cw-text); font-size: var(--text-sm); }
.theme-option:has(:checked) .theme-option__label { color: var(--primary-text); }
.theme-choice__fallback { margin: 0; color: var(--cw-muted); font-size: var(--text-sm); }
/* Pricing */
.pricing-layout { max-width: 1160px; margin: 0 auto; padding: 90px 28px 110px; }
.pricing-heading { max-width: 760px; margin: 0 auto 55px; text-align: center; }
.pricing-heading > p:last-child { max-width: 620px; margin: 18px auto 0; color: var(--cw-muted); font-size: 15px; line-height: 1.7; }
.pricing-note { margin: 20px 0 0; color: var(--cw-faint); font-size: 10px; text-align: center; }

/* Redesigned pricing card — single-card layout
   All tokens from the theme layer; adapts to any palette / polarity. */
.pricing-stage { display: flex; justify-content: center; }

.pricing-card { position: relative; width: 100%; max-width: 480px; padding: 38px 34px 32px; border: 1px solid var(--glass-border); border-radius: 16px; background: var(--glass-bg); }

.pricing-card__badge { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: var(--shape-pill); background: var(--primary); color: var(--text-on-accent); font-size: var(--text-sm); font-weight: var(--weight-semibold); white-space: nowrap; }
.pricing-card__badge svg { width: 14px; height: 14px; flex: 0 0 14px; }

.pricing-card h2 { margin: 6px 0 0; font-size: 24px; line-height: 1.2; }
.pricing-card__sub { margin: 6px 0 0; color: var(--text-muted); font-size: var(--text-md); }

/* Pricing treatment: $0 large + strikethrough original */
.pricing-card__price { display: flex; align-items: baseline; gap: 10px; margin: 26px 0 0; }
.pricing-card__amount { font-family: var(--font-display); font-size: 60px; font-weight: var(--weight-heavy); line-height: 1; letter-spacing: -.02em; }
.pricing-card__was { color: var(--text-muted); font-size: var(--text-xl); font-weight: var(--weight-medium); }
.pricing-card__was s { text-decoration: line-through; text-decoration-thickness: 1.5px; }

/* Promo info strip */
.pricing-card__promo { display: flex; align-items: flex-start; gap: 12px; margin: 24px 0 0; padding: 14px 16px; border: 1px solid var(--primary-line); border-radius: var(--shape-lg); background: var(--primary-tint-soft); }
.pricing-card__promo > svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px; color: var(--primary-text); }
.pricing-card__promo div { display: grid; gap: 2px; }
.pricing-card__promo strong { color: var(--text); font-size: var(--text-md); font-weight: var(--weight-semibold); }
.pricing-card__promo span { color: var(--text-muted); font-size: var(--text-sm); }

/* Feature list with check icons */
.pricing-card__features { margin: 28px 0 0; padding: 0; list-style: none; display: grid; gap: 0; }
.pricing-card__features li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--glass-line); color: var(--text-soft); font-size: var(--text-md); }
.pricing-card__features li:last-child { border-bottom: 0; }
.pricing-card__features svg { flex: 0 0 16px; width: 16px; height: 16px; color: var(--primary-text); }

/* CTA */
.pricing-card__cta { margin-top: 26px; }

/* Legal footnote */
.pricing-card__legal { margin: 18px 0 0; color: var(--text-muted); font-size: var(--text-xs); line-height: 1.6; text-align: center; }

/* Audience requests */
.audience-toast-region { position: fixed; z-index: 1200; bottom: max(24px, env(safe-area-inset-bottom)); right: 24px; width: min(440px, calc(100vw - 32px)); pointer-events: none; display: grid; gap: 12px; }
.audience-toast-region > :empty { display: none; }
.audience-toast { display: flex; align-items: flex-start; gap: 14px; padding: 20px; border: 1px solid var(--primary-line); border-radius: 14px; background: var(--primary-tint); color: var(--text); box-shadow: var(--shadow-md); pointer-events: auto; animation: audience-toast-enter .24s ease-out; }
.audience-toast__copy { flex: 1; min-width: 0; display: grid; gap: 6px; }
.audience-toast__copy strong { font-size: var(--text-xl); line-height: 1.4; }
.audience-toast__copy small { color: var(--text-soft); font-size: var(--text-lg); line-height: 1.6; }
.audience-toast__icon { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; color: var(--primary-bright); font-weight: 700; }
.audience-toast--working .audience-toast__icon { border: 2px solid var(--primary-line); border-top-color: var(--primary-bright); border-radius: 50%; animation: opportunity-spin .9s linear infinite; }
.audience-toast--success { border-color: var(--positive-line-strong); }
.audience-toast--success .audience-toast__icon { color: var(--positive-text); }
.audience-toast--error { border-color: var(--negative-line-strong); }
.audience-toast--error .audience-toast__icon { color: var(--negative-bright); }
.audience-toast__link { color: var(--primary-bright); font-size: var(--text-lg); text-decoration: underline; text-underline-offset: 3px; }
.audience-toast__dismiss { border: 0; background: transparent; color: var(--text-soft); font-size: var(--text-4xl); cursor: pointer; padding: 0 4px; line-height: 1; min-width: 24px; min-height: 24px; }
@keyframes audience-toast-enter { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 600px) { .audience-toast-region { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) { .audience-toast, .audience-toast--working .audience-toast__icon { animation: none; } }
.audience-scan-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--cw-border); border-radius: 8px; background: var(--cw-surface); }
.audience-scan-form label { color: var(--cw-muted); font-size: var(--text-md); }
.audience-scan-form input[type="number"] { width: 64px; padding: 6px 8px; border: 1px solid var(--cw-border); border-radius: 5px; background: transparent; color: inherit; font-size: var(--text-lg); }
.audience-scan-form span { color: var(--cw-muted); font-size: var(--text-md); }
.audience-scan-summary { display: flex; flex-wrap: wrap; gap: 18px; padding: 12px 16px; margin-bottom: 20px; border: 1px solid var(--cw-border-soft); border-radius: 6px; background: var(--cw-surface); color: var(--cw-muted); font-size: var(--text-md); }
.audience-scan-summary svg { width: 14px; height: 14px; margin-right: 6px; vertical-align: -2px; color: var(--cw-muted); }

.audience-request-list { display: grid; gap: 16px; }
.audience-request-card { padding: 20px; border: 1px solid var(--cw-border); border-radius: 8px; background: var(--cw-surface); }
.audience-request-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 10px; }
.audience-request-card__header h2 { margin: 4px 0 0; font-size: var(--text-3xl); line-height: 1.3; }
.audience-request-card__header h2 a { color: inherit; text-decoration: none; }
.audience-request-card__header h2 a:hover { text-decoration: underline; }
.audience-request-card__stats { display: flex; gap: 20px; text-align: right; }
.audience-request-card__stats span { display: grid; gap: 2px; }
.audience-request-card__stats strong { font-size: var(--text-3xl); }
.audience-request-card__stats small { color: var(--cw-muted); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .04em; }
.audience-request-card__summary { margin: 0 0 12px; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.5; }
.audience-keyword-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; padding: 0; list-style: none; }
.audience-keyword-chips li { padding: 3px 9px; border: 1px solid var(--cw-border-soft); border-radius: 999px; color: var(--cw-muted); font-size: var(--text-sm); text-transform: lowercase; }
.audience-asked-from { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.audience-asked-from__label { display: inline-flex; align-items: center; gap: 4px; color: var(--cw-muted); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .05em; }
.audience-asked-from__label svg { width: 12px; height: 12px; }
.audience-asked-from ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.audience-asked-from__badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; background: color-mix(in srgb, var(--primary-text) 12%, transparent); color: var(--primary-text); font-size: var(--text-sm); max-width: 320px; }
.audience-asked-from__badge a { color: inherit; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
.audience-asked-from__badge a:hover { text-decoration: underline; }
.audience-asked-from__badge em { color: var(--cw-muted); font-style: normal; font-size: var(--text-xs); padding-left: 6px; border-left: 1px solid color-mix(in srgb, var(--primary-text) 30%, transparent); }
.audience-asked-from__more { padding: 3px 9px; color: var(--cw-muted); font-size: var(--text-sm); }
.audience-request-card__samples { margin-top: 8px; padding: 10px 12px; border: 1px dashed var(--cw-border-soft); border-radius: 6px; }
.audience-request-card__samples summary { color: var(--cw-muted); font-size: var(--text-md); cursor: pointer; }
.audience-request-card__samples ul { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.audience-request-card__samples blockquote { margin: 0 0 4px; padding: 0; color: inherit; font-size: var(--text-lg); line-height: 1.5; }
.audience-request-card__samples small { color: var(--cw-muted); font-size: var(--text-sm); }
.audience-request-card__actions { display: flex; gap: 10px; margin-top: 14px; }
.audience-request-card__actions form { display: inline; }

.audience-discarded { margin-top: 34px; }
.audience-discarded__list { display: grid; gap: 8px; }
.audience-discarded__row { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border: 1px solid var(--cw-border-soft); border-radius: 6px; background: var(--cw-surface); }
.audience-discarded__row strong { display: block; font-size: var(--text-lg); }
.audience-discarded__row small { color: var(--cw-muted); font-size: var(--text-sm); }

.empty-state--compact { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px dashed var(--cw-border-soft); border-radius: 6px; color: var(--cw-muted); }
.empty-state--compact strong { display: block; font-size: var(--text-lg); color: var(--cw-text, inherit); }
.empty-state--compact p { margin: 4px 0 0; font-size: var(--text-md); }

@media (max-width: 1050px) {
  .marketing-hero h1 { font-size: 64px; }
  .product-frame { height: 430px; }
  .auth-layout { grid-template-columns: 1fr 430px; }
  .auth-product { padding: 90px 40px; }
  .auth-signal-list > div { grid-template-columns: 30px 150px 1fr; }
  .metric-strip { grid-template-columns: repeat(2, 1fr); }
  .metric-strip article:nth-child(2) { border-right: 0; }
  .metric-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--cw-border-soft); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .latest-video-panel { grid-row: auto; }
  .onboarding-layout { grid-template-columns: 1fr 430px; gap: 40px; }
  .analysis-video-heading img { width: 150px; }
  .tag-optimizer { grid-template-columns: 1fr; }
  .tag-review-panel { position: static; }
  .opportunity-row { grid-template-columns: 96px minmax(0, 1fr) 145px; }
  .opportunity-row__media { width: 96px; }
  .opportunity-detail-grid { grid-template-columns: 1fr; }
  .opportunity-action-panel { position: static; }
  .opportunity-diagnosis { grid-template-columns: repeat(3, 1fr); }
  .performance-hero { grid-template-columns: 1fr 1fr; }
  .performance-position { grid-column: 1 / -1; border-bottom: 1px solid var(--cw-border-soft); }
  .performance-hero article:nth-child(2) { border-right: 1px solid var(--cw-border-soft); }
  .performance-metrics { grid-template-columns: repeat(2, 1fr); }
  .performance-metrics article:nth-child(2) { border-right: 0; }
  .performance-metrics article:nth-child(-n+2) { border-bottom: 1px solid var(--cw-border-soft); }
  .plan-card { min-height: 0; }
}

@media (max-width: 820px) {
  .marketing-nav { grid-template-columns: 1fr auto; padding: 0 18px; }
  .marketing-nav__links { display: none; }
  .audit-start-main { padding-top: 54px; }
  .audit-start-secondary { grid-template-columns: 1fr; }
  .audit-start-secondary__actions { justify-items: stretch; }
  .marketing-hero { min-height: 820px; }
  .marketing-hero__content { padding-top: 70px; }
  .marketing-hero h1 { font-size: 52px; }
  .marketing-hero__lead { font-size: 21px; }
  .product-frame { grid-template-columns: 44px 1fr; height: 390px; }
  .preview-workspace-grid { grid-template-columns: 1fr; }
  .preview-video { display: none; }
  .value-band__inner, .value-grid { grid-template-columns: 1fr; }
  .value-band__inner { gap: 22px; }
  .value-grid article { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--cw-border); }
  .value-grid article:last-child { border-bottom: 0; }
  .value-grid h3 { margin-top: 50px; }
  .auth-layout { display: block; }
  .auth-product { display: none; }
  .auth-panel { min-height: 100vh; max-width: 520px; margin: 0 auto; border-left: 0; background: color-mix(in srgb, var(--surface-soft) 94%, transparent); }
  .app-sidebar { transform: translateX(-100%); transition: transform 180ms ease; }
  .sidebar-is-open .app-sidebar { transform: translateX(0); }
  .app-sidebar__close { display: inline-flex; }
  .app-sidebar-scrim { position: fixed; z-index: 40; inset: 0; display: block; visibility: hidden; background: var(--scrim-strong); opacity: 0; transition: opacity 180ms ease, visibility 180ms ease; }
  .sidebar-is-open .app-sidebar-scrim { visibility: visible; opacity: 1; }
  .app-main { margin-left: 0; }
  .app-menu-button { display: inline-flex; }
  .app-topbar { padding: 0 16px; }
  .app-topbar > div:first-of-type { margin-right: auto; margin-left: 10px; }
  .app-content { padding: 24px 18px 60px; }
  .onboarding-layout { display: block; min-height: auto; }
  .onboarding-flow { margin-top: 30px; }
  .analysis-summary { align-items: flex-start; }
  .analysis-video-heading { align-items: flex-start; }
  .analysis-video-heading img { width: 130px; }
  .dimension-grid, .analysis-findings { grid-template-columns: 1fr; }
  .next-data-band, .feature-bridge { grid-template-columns: 1fr; }
  .video-row { grid-template-columns: 140px 1fr; }
  .video-row__media { width: 140px; }
  .video-row__action { grid-column: 1 / -1; justify-content: flex-end; }
  .tag-start-layout { grid-template-columns: 1fr; }
  .opportunity-row { grid-template-columns: 88px minmax(0, 1fr) 130px; gap: 12px; }
  .opportunity-row__media { width: 88px; }
  .opportunity-detail-header { grid-template-columns: 170px minmax(0, 1fr); }
  .opportunity-detail-header__media { width: 170px; }
  .performance-video-header { grid-template-columns: 140px minmax(0, 1fr); }
  .performance-video-header__media { width: 140px; }
  .performance-video-header > .icon-button { display: none; }
  .opportunity-detail-header__actions { grid-column: 1 / -1; grid-template-columns: repeat(2, max-content); justify-content: end; }
  .opportunity-diagnosis { grid-template-columns: 1fr 1fr; }
  .opportunity-diagnosis article { border-bottom: 1px solid var(--cw-border-soft); }
  .opportunity-diagnosis article:nth-child(2) { border-right: 0; }
  .opportunity-diagnosis article:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .opportunity-evidence-strip { grid-template-columns: 1fr 1fr; }
  .opportunity-evidence-strip article:nth-child(2) { border-right: 0; }
  .opportunity-evidence-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--cw-border-soft); }
  .settings-sections > section { grid-template-columns: 1fr; gap: 20px; }
}

@media (max-width: 560px) {
  .marketing-nav__actions .button--ghost { display: none; }
  .audit-start-main { min-height: calc(100vh - 68px); padding: 42px 12px 60px; }
  .audit-start-intro { margin-bottom: 22px; }
  .audit-start-intro h1 { font-size: var(--text-6xl); }
  .audit-start-primary, .audit-start-secondary { padding: 22px 18px; }
  .audit-start-heading h2 { margin-top: 3px; font-size: var(--text-3xl); }
  .audit-start-form > div { grid-template-columns: 1fr; }
  .audit-start-form .button { width: 100%; }
  .audit-start-secondary__actions { min-width: 0; }
  .marketing-hero { min-height: 760px; }
  .marketing-hero__content { padding: 58px 18px 38px; }
  .marketing-hero h1 { font-size: 42px; }
  .marketing-hero__lead { font-size: 18px; }
  .marketing-hero__support { font-size: 14px; }
  .marketing-hero__actions { flex-direction: column; }
  .product-frame { width: calc(100% - 20px); grid-template-columns: 36px 1fr; height: 340px; }
  .product-frame__rail { gap: 9px; }
  .product-frame__brand { width: 28px; height: 28px; }
  .rail-item { width: 24px; height: 24px; }
  .product-frame__main { padding: 0 10px 10px; }
  .preview-topbar { height: 58px; }
  .preview-channel { display: none; }
  .preview-metrics article { padding: 13px 8px; }
  .preview-metrics strong { font-size: 20px; }
  .priority-row { grid-template-columns: 20px 1fr; }
  .priority-row em { display: none; }
  .value-band { padding: 72px 18px; }
  .value-band h2, .closing-cta h2, .pricing-heading h1 { font-size: 32px; }
  .closing-cta { padding: 80px 18px; }
  .closing-cta > div { flex-direction: column; }
  .marketing-footer { min-height: 120px; flex-direction: column; justify-content: center; gap: 18px; }
  .auth-panel { padding: 90px 24px 45px; }
  .app-content { padding-right: 12px; padding-left: 12px; }
  .app-topbar__actions .credit-badge { display: none; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .metric-strip { grid-template-columns: 1fr; }
  .metric-strip article { border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .metric-strip article:last-child { border-bottom: 0; }
  .setup-banner { align-items: flex-start; flex-direction: column; }
  .workspace-priority { grid-template-columns: 22px 1fr; }
  .workspace-priority em { grid-column: 2; display: block; margin-top: 3px; }
  .video-row { grid-template-columns: 1fr; }
  .video-row__media { width: 100%; }
  .video-row__content h2 { white-space: normal; }
  .video-row__action { grid-column: auto; display: grid; grid-template-columns: minmax(0, 1fr); justify-content: stretch; }
  .video-row__action .button, .video-row__action form:not(.video-row__rerun), .video-row__action form:not(.video-row__rerun) .button { width: 100%; }
  .video-row__rerun { width: 34px; }
  .comment-intelligence-dialog { width: calc(100vw - 16px); max-height: 92vh; }
  .comment-intelligence-dialog__shell { max-height: 92vh; }
  .comment-intelligence-dialog__header { grid-template-columns: 32px minmax(0, 1fr) 32px; padding: 11px; }
  .comment-intelligence-dialog__header > span { width: 32px; height: 32px; }
  .comment-intelligence-result { padding: 12px; }
  .comment-intelligence-takeaway { padding: 13px; }
  .comment-intelligence-takeaway h3 { font-size: var(--text-xl); }
  .comment-cluster > header { grid-template-columns: 1fr; gap: 6px; }
  .comment-cluster > header > strong { justify-items: start; }
  .comment-intelligence-coverage { grid-template-columns: 1fr; }
  .comment-intelligence-coverage small { grid-column: auto; }
  .video-workspace-nav { align-items: stretch; gap: 10px; overflow-x: auto; }
  .video-workspace-nav__back { min-width: 28px; }
  .video-workspace-nav__back span { display: none; }
  .video-workspace-nav__tools a { min-width: 76px; padding: 0 8px; }
  .video-workspace-header { grid-template-columns: 104px minmax(0, 1fr) 34px; gap: 10px; }
  .video-workspace-header__media { width: 104px; }
  .video-workspace-header h1 { display: -webkit-box; overflow: hidden; font-size: var(--text-xl); white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .video-workspace-header__metrics span:nth-child(2), .video-workspace-header__metrics span:nth-child(3) { display: none; }
  .video-capability-row { grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 15px 2px; }
  .video-capability-row__icon { width: 34px; height: 34px; }
  .video-capability-row__result { grid-column: 2; }
  .video-capability-row > .button, .video-capability-row > form { grid-column: 1 / -1; width: 100%; }
  .video-capability-row > .button, .video-capability-row > form .button { width: 100%; }
  .video-analysis-preview-page { grid-template-columns: 1fr; padding: 22px; }
  .video-analysis-preview-details { grid-template-columns: 1fr; }
  .prepublish-hero { grid-template-columns: 1fr; padding: 22px; }
  .prepublish-details { grid-template-columns: 1fr; }
  .video-opportunity-banner { grid-template-columns: 32px minmax(0, 1fr) 14px; padding: 11px; }
  .video-opportunity-banner > span { width: 32px; height: 32px; }
  .video-opportunity-banner small, .video-opportunity-banner em { display: none; }
  .video-opportunity-banner > svg { grid-column: 3; }
  .performance-video-header { grid-template-columns: 104px minmax(0, 1fr); gap: 10px; }
  .performance-video-header__media { width: 104px; }
  .performance-video-header h1 { display: -webkit-box; overflow: hidden; font-size: var(--text-xl); white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .performance-video-header p:last-child { display: none; }
  .performance-verdict { grid-template-columns: 36px minmax(0, 1fr); gap: 11px; padding: 15px; }
  .performance-verdict > span { width: 36px; height: 36px; }
  .performance-verdict h2 { font-size: var(--text-3xl); }
  .performance-verdict > strong { grid-column: 2; justify-items: start; font-size: var(--text-3xl); }
  .performance-hero { grid-template-columns: 1fr; }
  .performance-position { grid-column: auto; }
  .performance-hero article, .performance-hero article:nth-child(2) { min-height: 115px; border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .performance-hero article:last-child { border-bottom: 0; }
  .performance-chart-panel { padding: 15px 8px; }
  .performance-chart-legend { align-items: flex-start; flex-direction: column; gap: 6px; }
  .performance-chart-heading__right { justify-items: start; }
  .performance-chart-actions { display: grid; }
  .performance-chart__tooltip { width: calc(100% - 16px); }
  .performance-metrics { grid-template-columns: 1fr; }
  .performance-metrics article { min-height: 85px; border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .performance-metrics article:last-child { border-bottom: 0; }
  .milestone-item { grid-template-columns: 72px minmax(0, 1fr); }
  .milestone-item__time { padding-right: 14px; }
  .milestone-item__body { margin-left: 14px; padding: 14px; }
  .milestone-item__body > div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .milestone-item ul { display: grid; }
  .history-event__outcome > div > span { align-items: flex-start; flex-direction: column; gap: 3px; }
  .history-event__outcome em { white-space: normal; }
  .history-event__outcome dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .analysis-summary { align-items: stretch; flex-direction: column; }
  .analysis-video-heading { flex-direction: column; }
  .analysis-video-heading img { width: 100%; }
  .overall-score { min-width: 0; }
  .analysis-breadcrumb { flex-wrap: wrap; }
  .analysis-breadcrumb__action { width: 100%; margin-left: 0; }
  .tag-context-header { grid-template-columns: 92px minmax(0, 1fr) 34px; gap: 10px; }
  .tag-context-header > img { width: 92px; }
  .tag-context-header h1 { display: -webkit-box; overflow: hidden; font-size: var(--text-xl); white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .tag-context-header__copy > div span:last-child { display: none; }
  .tag-status { grid-template-columns: 22px 1fr; }
  .tag-status > .button { grid-column: 1 / -1; width: 100%; }
  .tag-current-state, .tag-generate-panel { padding: 17px; }
  .tag-strategy-band { align-items: stretch; flex-direction: column; }
  .tag-strategy-band .button { width: 100%; }
  .tag-decision-group { padding: 16px; }
  .tag-group-heading { align-items: flex-start; flex-direction: column; }
  .tag-bulk-actions { align-self: flex-end; }
  .tag-recommendation-row { grid-template-columns: 22px minmax(0, 1fr); }
  .tag-recommendation-meta { grid-column: 2; display: flex; align-items: center; justify-content: flex-start; }
  .tag-recommendation-copy small { -webkit-line-clamp: 2; }
  .tag-custom-control { grid-template-columns: 1fr; }
  .tag-review-panel { padding: 16px; }
  .opportunity-row { grid-template-columns: 96px minmax(0, 1fr); min-height: 210px; align-items: start; padding: 15px 2px; }
  .opportunity-row:hover { padding-right: 2px; padding-left: 2px; }
  .opportunity-row__media { width: 96px; margin-top: 2px; }
  .opportunity-row__copy h2 { white-space: normal; }
  .opportunity-row__finding, .opportunity-row__copy p { white-space: normal; }
  .opportunity-row__action { grid-column: 1 / -1; grid-template-columns: 1fr 15px; min-height: 54px; padding: 10px 0 0; border-top: 1px solid var(--cw-border-soft); border-left: 0; }
  .opportunity-monitor-status { width: 100%; }
  .opportunity-detail-header { grid-template-columns: 104px minmax(0, 1fr); gap: 12px; min-height: 140px; }
  .opportunity-detail-header__media { width: 104px; }
  .opportunity-detail-header h1 { display: -webkit-box; overflow: hidden; font-size: var(--text-xl); white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .opportunity-detail-header__copy > p:last-child { display: none; }
  .opportunity-detail-header__copy > strong { white-space: normal; }
  .opportunity-detail-header__media span { display: none; }
  .opportunity-detail-header__actions { grid-template-columns: 1fr; width: 100%; }
  .opportunity-detail-header__actions .button { width: 100%; }
  .opportunity-diagnosis { grid-template-columns: 1fr; }
  .opportunity-diagnosis article, .opportunity-diagnosis article:nth-child(2) { grid-column: auto; border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .opportunity-diagnosis article:last-child { border-bottom: 0; }
  .opportunity-comparison-method summary { font-size: var(--text-sm); }
  .opportunity-evidence-strip { grid-template-columns: 1fr; }
  .opportunity-evidence-strip article { min-height: 72px; padding: 12px; border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .opportunity-evidence-strip article:last-child { border-bottom: 0; }
  .opportunity-reasoning section { min-height: 112px; padding: 18px 2px; }
  .opportunity-reasoning .repurposing-direction { padding: 18px 2px; }
  .opportunity-reasoning .description-refresh-preview { padding: 18px 2px; }
  .repurposing-direction__format { align-items: flex-start; flex-direction: column; }
  .repurposing-direction__title h2 { font-size: var(--text-2xl); }
  .opportunity-story-heading { padding: 18px 2px 15px; }
  .opportunity-action-panel { padding: 15px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .section-heading > p { text-align: left; }
  .feature-bridge { padding: 24px; }
  .audit-map { align-items: stretch; flex-direction: column; }
  .audit-map svg { margin: 0 auto; transform: rotate(90deg); }
  .audit-claimed-journeys { grid-template-columns: 1fr; padding: 16px; }
  .audit-channel-target { grid-template-columns: 42px 1fr; padding: 16px; }
  .audit-channel-target > img, .audit-channel-target > .workspace-avatar { width: 42px; height: 42px; }
  .audit-channel-target em { grid-column: 2; }
  .audit-workspace-action { grid-template-columns: 1fr; padding: 22px 16px; }
  .audit-workspace-action .button { width: 100%; }
  .audit-flow-band { align-items: stretch; flex-direction: column; padding: 20px; }
  .audit-flow-band > svg { margin: 0 auto; transform: rotate(90deg); }
  .audit-report-shell { height: calc(100vh - 190px); min-height: 540px; }
  .credit-overview__main, .access-details { padding: 20px 17px; }
  .credit-overview__topline { align-items: flex-start; flex-direction: column; gap: 3px; }
  .credit-overview__amount strong { font-size: var(--text-7xl); }
  .credit-overview__status { align-items: stretch; flex-direction: column; padding: 16px 17px; }
  .credit-overview__status .button { width: 100%; }
  .credit-request-dialog__form > footer { flex-direction: column-reverse; }
  .credit-request-dialog__form > footer .button { width: 100%; }
  .settings-sections dl > div { grid-template-columns: 90px 1fr; }
  .pricing-layout { padding: 60px 16px 80px; }
  .plan-grid { grid-template-columns: 1fr; }
  .pricing-card { padding: 32px 20px 26px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

.performance-chart__point { cursor: pointer; }
.performance-chart__point:focus { outline: none; }
.performance-chart__point:hover .performance-chart__dot,
.performance-chart__point:focus .performance-chart__dot { r: 5; stroke: var(--cw-text); stroke-width: 2; opacity: 1; }

.performance-chart__tooltip.performance-chart__tooltip--point { width: max-content; max-width: calc(100% - 24px); padding: 7px 10px; gap: 2px; border-color: var(--cw-border); text-align: left; justify-items: start; }
.performance-chart__tooltip--point > span { color: var(--cw-muted); font-size: var(--text-sm); font-weight: 400; text-transform: none; }

.future-section { margin-top: 28px; }
.future-section__heading { margin-bottom: 13px; }
.future-section__heading h2 { margin: 5px 0 0; font-size: var(--text-2xl); }
.future-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.future-card { min-width: 0; display: flex; align-items: flex-start; gap: 14px; padding: 20px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.future-card__icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--warning-line); border-radius: 6px; background: var(--warning-tint-strong); color: var(--cw-amber); }
.future-card__icon svg { width: 17px; height: 17px; }
.future-card__copy { min-width: 0; flex: 1; }
.future-card__label { color: var(--cw-amber); font-size: var(--text-xs); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.future-card h3, .future-card h2 { margin: 7px 0 6px; color: var(--cw-text); font-size: var(--text-xl); line-height: 1.35; }
.future-card p { max-width: 580px; margin: 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.6; }
.future-card .future-interest { align-self: flex-end; }
.future-interest { flex: 0 0 auto; }
.future-interest button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 7px 10px; border: 1px solid var(--warning-line); border-radius: 5px; background: var(--warning-tint-strong); color: var(--cw-amber); font: inherit; font-size: var(--text-sm); font-weight: 700; white-space: nowrap; cursor: pointer; }
.future-interest button:hover:not(:disabled), .future-interest button:focus-visible { border-color: var(--cw-amber); background: var(--warning-tint-strong); }
.future-interest button:focus-visible { outline: 2px solid var(--cw-amber); outline-offset: 2px; }
.future-interest button:disabled { border-color: var(--cw-border); background: var(--cw-bg-soft); color: var(--cw-muted); cursor: default; }
.future-interest svg { width: 13px; height: 13px; }
.future-card--subtle { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(205px, 265px) auto; align-items: center; margin-top: 18px; padding: 16px 18px; }
.future-card--subtle .future-card__icon { border-color: var(--cw-border); background: var(--cw-bg-soft); color: var(--cw-muted); }
.future-card--subtle .future-card__label { color: var(--cw-faint); }
.future-card--subtle h2 { font-size: var(--text-lg); }
.future-card--subtle p { font-size: var(--text-xs); }
.future-card--subtle .future-interest { align-self: center; }
.trajectory-preview { position: relative; overflow: hidden; padding: 10px 12px; border: 1px solid var(--cw-border-soft); border-radius: 5px; background: radial-gradient(circle at 78% 12%, color-mix(in srgb, var(--positive) 11%, transparent), transparent 55%), var(--surface-soft); }
.trajectory-preview::after { position: absolute; right: 0; bottom: 0; left: 0; height: 35px; background: linear-gradient(transparent, color-mix(in srgb, var(--surface-soft) 58%, transparent)); content: ""; pointer-events: none; }
.trajectory-preview__heading, .trajectory-preview__direction { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.trajectory-preview__heading strong { color: var(--cw-text-soft); font-size: var(--text-xs); }
.trajectory-preview__heading > span { padding: 2px 5px; border: 1px solid var(--cw-border); border-radius: 3px; color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; }
.trajectory-preview__trend { height: 32px; margin: 4px 0 0; opacity: .48; filter: blur(1.4px); }
.trajectory-preview__trend svg { width: 100%; height: 100%; overflow: visible; }
.trajectory-preview__trend path { fill: none; stroke: var(--cw-green); stroke-width: 2; stroke-linecap: round; }
.trajectory-preview__direction { padding-bottom: 7px; color: var(--cw-muted); font-size: var(--text-2xs); }
.trajectory-preview__direction i, .trajectory-preview__signals i { display: block; height: 4px; border-radius: 4px; background: var(--text-faint); opacity: .5; filter: blur(2px); }
.trajectory-preview__direction i { width: 48px; }
.trajectory-preview__signals { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 7px; border-top: 1px solid var(--cw-border-soft); }
.trajectory-preview__signals > div { display: grid; gap: 5px; min-width: 0; }
.trajectory-preview__signals span { color: var(--cw-muted); font-size: var(--text-2xs); white-space: nowrap; }
.trajectory-preview__signals i { width: 80%; }
.trajectory-preview__signals > div:last-child i { width: 58%; }
.future-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.future-hero-actions .button { margin: 0; }
.editing-permission-page { display: flex; justify-content: center; padding: clamp(30px, 7vw, 90px) 16px; }
.editing-permission-card { width: min(100%, 560px); padding: clamp(28px, 5vw, 48px); border: 1px solid var(--cw-border); border-radius: 12px; background: var(--cw-bg-soft); box-shadow: 0 22px 70px var(--scrim-soft); }
.editing-permission-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-bottom: 22px; border: 1px solid var(--cw-border); border-radius: 12px; color: var(--cw-green); }
.editing-permission-icon svg { width: 24px; height: 24px; }
.editing-permission-card h1 { margin: 7px 0 18px; font-size: clamp(28px, 4vw, 38px); line-height: 1.15; }
.editing-permission-card p:not(.eyebrow) { margin: 0 0 15px; color: var(--cw-text-soft); line-height: 1.6; }
.editing-permission-card form { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.editing-permission-card .form-alert { margin-top: 20px; }
@media (max-width: 1050px) {
  .future-grid { grid-template-columns: 1fr; }
  .future-card--subtle { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .trajectory-preview { grid-column: 2 / -1; }
}
@media (max-width: 650px) {
  .future-card { flex-wrap: wrap; padding: 17px; }
  .future-card__copy { flex-basis: calc(100% - 52px); }
  .future-card .future-interest { margin-left: 48px; }
  .future-card--subtle .future-interest { align-self: flex-start; }
  .future-card--subtle { grid-template-columns: 34px minmax(0, 1fr); }
  .future-card--subtle .future-interest { grid-column: 2; margin-left: 0; }
  .trajectory-preview { grid-column: 2; }
}

/* Anonymous Audit Journey shell */
.audit-journey-page { background: var(--surface-deepest); }
.audit-journey-sidebar { background: var(--surface-base); }
.journey-channel-card { min-height: 76px; display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 10px; margin: 13px 12px 6px; padding: 10px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.journey-channel-card__avatar { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--primary-line); border-radius: 6px; background: var(--primary-tint-strong); color: var(--cw-red); }
.journey-channel-card__avatar svg { width: 18px; }
.journey-channel-card > div { min-width: 0; display: grid; gap: 2px; }
.journey-channel-card small, .journey-channel-card span { overflow: hidden; color: var(--cw-faint); font-size: var(--text-2xs); text-overflow: ellipsis; white-space: nowrap; }
.journey-channel-card strong { overflow: hidden; font-size: var(--text-md); text-overflow: ellipsis; white-space: nowrap; }
.audit-journey-nav__locked { min-height: 38px; display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 9px; padding: 0 10px; color: var(--text-faint); font-size: var(--text-md); font-weight: 600; cursor: default; }
.audit-journey-nav__locked > small { display: grid; place-items: center; color: var(--text-faint); }
.audit-journey-nav__locked > small svg { width: 12px; height: 12px; }
.audit-journey-sidebar__footer { display: grid; gap: 9px; padding: 10px; border-top: 1px solid var(--cw-border-soft); }
.audit-journey-sidebar__footer form { margin: 0; }
.journey-access-card { padding: 11px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--cw-surface); }
.journey-access-card > span { display: flex; align-items: center; gap: 6px; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.journey-access-card > span svg { width: 13px; color: var(--cw-green); }
.journey-access-card p { margin: 7px 0 0; color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.5; }
.audit-journey-content { max-width: 1540px; }
.audit-claim-form { margin: 0; }
.audit-claim-notice { margin: 0 0 20px; }
.audit-connect-form { margin: 0; }
.audit-connection-state { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 16px; margin: 0 0 20px; padding: 17px 18px; border: 1px solid var(--positive-line); border-radius: 7px; background: var(--positive-tint); }
.audit-connection-state > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--positive-tint-strong); color: var(--cw-green); }
.audit-connection-state > span svg { width: 18px; }
.audit-connection-state h2 { margin: 0; font-size: var(--text-xl); }
.audit-connection-state p:last-child { margin: 5px 0 0; color: var(--cw-muted); font-size: var(--text-sm); line-height: 1.55; }
.audit-connection-state--warning { border-color: var(--warning-line); background: var(--warning-tint); }
.audit-connection-state--warning > span { background: var(--warning-tint-strong); color: var(--cw-amber); }
.audit-connection-state--success { border-color: var(--positive-line-strong); background: var(--positive-tint); }
.audit-journey-hero { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, .6fr); gap: 36px; align-items: end; margin-bottom: 20px; }
.audit-journey-hero h1 { max-width: 820px; margin: 0; font-size: clamp(var(--text-4xl), 4vw, var(--text-7xl)); line-height: 1.08; letter-spacing: -.025em; }
.audit-journey-hero > div > p:last-child { max-width: 760px; margin: 15px 0 0; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.7; }
.journey-status-dot { width: 7px; height: 7px; display: inline-block; margin-right: 7px; border-radius: 50%; background: var(--cw-amber); box-shadow: 0 0 14px color-mix(in srgb, var(--warning) 35%, transparent); }
.journey-status-dot--ready { background: var(--cw-green); box-shadow: 0 0 14px color-mix(in srgb, var(--positive) 38%, transparent); }
.journey-status-dot--failed { background: var(--cw-danger); box-shadow: 0 0 14px color-mix(in srgb, var(--primary) 38%, transparent); }
.audit-journey-meta { margin: 0; border-top: 1px solid var(--cw-border); }
.audit-journey-meta > div { min-height: 35px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--cw-border-soft); font-size: var(--text-xs); }
.audit-journey-meta dt { color: var(--cw-faint); }
.audit-journey-meta dd { margin: 0; color: var(--cw-text-soft); font-weight: 650; text-align: right; }
.audit-journey-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 34px; padding: 0; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); list-style: none; }
.audit-journey-steps li { min-height: 112px; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 11px; padding: 16px; border-right: 1px solid var(--cw-border-soft); }
.audit-journey-steps li:last-child { border-right: 0; }
.audit-journey-steps li > span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 50%; color: var(--cw-faint); font-size: var(--text-xs); font-weight: 800; }
.audit-journey-steps li > div { min-width: 0; display: grid; gap: 2px; }
.audit-journey-steps small { color: var(--cw-faint); font-size: var(--text-2xs); text-transform: uppercase; }
.audit-journey-steps strong { font-size: var(--text-md); }
.audit-journey-steps p { margin: 2px 0 0; color: var(--cw-faint); font-size: var(--text-2xs); }
.audit-journey-steps .is-complete { background: var(--positive-tint); }
.audit-journey-steps .is-complete > span { border-color: var(--positive-line-strong); background: var(--positive-tint-strong); color: var(--cw-green); }
.audit-journey-steps .is-next { background: var(--primary-tint); }
.audit-journey-steps .is-next > span { border-color: var(--primary-line); color: var(--primary-text); }
.audit-journey-steps .is-working { background: var(--primary-tint); }
.audit-journey-steps .is-working > span { border-color: var(--primary-line); color: var(--cw-blue); }
.audit-journey-steps .is-warning { background: var(--warning-tint); }
.audit-journey-steps .is-warning > span { border-color: var(--warning-line-strong); color: var(--cw-amber); }
.audit-journey-report-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 14px; }
.audit-journey-report-heading h2 { margin: 0; font-size: var(--text-3xl); }
.audit-journey-report-heading p:last-child { margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-sm); }
.audit-journey-report-heading .text-link { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.audit-journey-report-heading .text-link svg { width: 13px; }
.audit-journey-report-shell { height: min(1040px, calc(100vh - 92px)); min-height: 720px; }
.native-audit { display: grid; gap: 18px; }
.native-audit__overview, .native-audit__section { border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); }
.native-audit__overview { overflow: hidden; }
.native-audit__channel { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 18px; padding: 26px 28px; border-bottom: 1px solid var(--cw-border-soft); background: linear-gradient(120deg, var(--surface), var(--surface-soft)); }
.native-audit__channel img { width: 66px; height: 66px; border: 1px solid var(--cw-border); border-radius: 50%; object-fit: cover; }
.native-audit__channel h2 { margin: 2px 0 0; font-size: var(--text-4xl); }
.native-audit__channel p:last-child { max-width: 920px; margin: 9px 0 0; color: var(--cw-text-soft); font-size: var(--text-md); line-height: 1.7; }
.native-audit__metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; }
.native-audit__metrics > div { min-height: 90px; display: grid; align-content: center; gap: 7px; padding: 16px 20px; border-right: 1px solid var(--cw-border-soft); }
.native-audit__metrics > div:last-child { border-right: 0; }
.native-audit__metrics dt, .native-audit__signal-grid dt, .native-audit__owner-metrics dt { color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.native-audit__metrics dd { margin: 0; color: var(--cw-text); font-family: var(--cw-font); font-size: var(--text-4xl); font-weight: 700; }
.native-audit__section { padding: 28px; }
.native-audit__section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.native-audit__section-heading h2 { margin: 2px 0 0; font-size: var(--text-4xl); }
.native-audit__section-heading > span { color: var(--cw-faint); font-size: var(--text-xs); }
.native-audit__evidence-tag { display: inline-flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--primary-line); border-radius: 4px; background: var(--primary-tint); color: var(--primary-bright) !important; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.native-audit__evidence-tag svg { width: 13px; }
.native-audit__evidence-tag--private { border-color: var(--positive-line-strong); background: var(--positive-tint); color: var(--cw-green) !important; }
.native-audit__lead { max-width: 980px; margin: -4px 0 24px; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.75; }
.native-audit__lead--patterns { margin: 22px 0 0; }
.native-audit__finding-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.native-audit__finding-grid--observations { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.native-audit__finding { min-height: 190px; padding: 20px; border: 1px solid var(--cw-border); border-top: 2px solid var(--primary-line); border-radius: 6px; background: var(--surface-soft); }
.native-audit__finding--high { border-top-color: var(--cw-green); }
.native-audit__finding--low { border-top-color: var(--cw-amber); }
.native-audit__finding--private { background: var(--positive-tint); }
.native-audit__finding header, .native-audit__pattern-grid header { display: flex; justify-content: space-between; gap: 12px; color: var(--cw-faint); font-size: var(--text-2xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.native-audit__finding h3, .native-audit__pattern-grid h3 { margin: 19px 0 8px; font-size: var(--text-xl); }
.native-audit__finding > p, .native-audit__pattern-grid > article > p { margin: 0; color: var(--cw-text-soft); font-size: var(--text-sm); line-height: 1.7; }
.native-audit__finding > div { margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--cw-border-soft); }
.native-audit__finding > div strong { color: var(--cw-faint); font-size: var(--text-2xs); letter-spacing: .05em; text-transform: uppercase; }
.native-audit__finding > div p { margin: 6px 0 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.65; }
.native-audit__action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.native-audit__action-grid article { min-height: 138px; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 13px; padding: 18px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface-soft); }
.native-audit__action-grid article > span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--primary-line); border-radius: 50%; color: var(--primary-text); font-size: var(--text-xs); font-weight: 800; }
.native-audit__action-grid article > div { min-width: 0; }
.native-audit__action-grid h3 { margin: 1px 0 8px; font-size: var(--text-xl); }
.native-audit__action-grid p { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.65; }
.native-audit__action-grid strong { display: block; color: var(--cw-text-soft); font-size: var(--text-sm); line-height: 1.65; }
.native-audit__action-grid small { display: block; margin-top: 11px; color: var(--cw-faint); font-size: var(--text-2xs); line-height: 1.55; }
.native-audit__signal-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.native-audit__signal-grid > article { min-height: 250px; padding: 18px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface-soft); }
.native-audit__signal-icon { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--cw-border); border-radius: 5px; color: var(--cw-green); }
.native-audit__signal-icon svg { width: 15px; }
.native-audit__signal-grid h3 { margin: 22px 0 8px; font-size: var(--text-xl); }
.native-audit__signal-grid article > p { min-height: 68px; margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.65; }
.native-audit__signal-grid dl { display: grid; gap: 7px; margin: 15px 0 0; padding-top: 13px; border-top: 1px solid var(--cw-border-soft); }
.native-audit__signal-grid dl > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.native-audit__signal-grid dd { margin: 0; color: var(--cw-text-soft); font-size: var(--text-xs); font-weight: 700; }
.native-audit__cadence { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 7px; }
.native-audit__cadence > div { min-height: 80px; display: grid; align-content: center; gap: 3px; padding: 11px; border: 1px solid var(--cw-border); border-radius: 5px; background: var(--surface-soft); }
.native-audit__cadence span, .native-audit__cadence small { color: var(--cw-faint); font-size: var(--text-2xs); }
.native-audit__cadence strong { font-family: var(--cw-font); font-size: var(--text-3xl); }
.native-audit__table-wrap { margin-top: 18px; overflow-x: auto; border: 1px solid var(--cw-border); border-radius: 6px; }
.native-audit__table { width: 100%; border-collapse: collapse; font-size: var(--text-xs); }
.native-audit__table caption { padding: 15px 16px; border-bottom: 1px solid var(--cw-border); color: var(--cw-text); font-size: var(--text-md); font-weight: 700; text-align: left; }
.native-audit__table th, .native-audit__table td { padding: 11px 16px; border-bottom: 1px solid var(--cw-border-soft); text-align: left; white-space: nowrap; }
.native-audit__table th { color: var(--cw-faint); font-size: var(--text-2xs); letter-spacing: .04em; text-transform: uppercase; }
.native-audit__table tbody tr:last-child td { border-bottom: 0; }
.native-audit__table td { color: var(--cw-text-soft); }
.native-audit__table-title { max-width: 340px; overflow: hidden; text-overflow: ellipsis; }
.native-audit__table--heatmap th, .native-audit__table--heatmap td { min-width: 52px; padding: 9px; text-align: center; }
.native-audit__table--heatmap td.is-active { background: var(--positive-tint-strong); color: var(--cw-green); font-weight: 800; }
.native-audit__table--traffic td:nth-child(2) { min-width: 220px; display: flex; align-items: center; gap: 10px; }
.native-audit__table progress { width: min(190px, 70%); height: 5px; overflow: hidden; border: 0; border-radius: 10px; background: var(--surface-elevated); color: var(--cw-green); }
.native-audit__table progress::-webkit-progress-bar { background: var(--surface-elevated); }
.native-audit__table progress::-webkit-progress-value { background: var(--cw-green); }
.native-audit__table progress::-moz-progress-bar { background: var(--cw-green); }
.native-audit__reference { margin-top: 18px; padding: 20px; border: 1px solid var(--warning-line); border-radius: 6px; background: var(--warning-tint); }
.native-audit__reference h3 { margin: 4px 0 7px; font-size: var(--text-xl); }
.native-audit__reference > p:last-of-type { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.65; }
.native-audit__reference-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 15px; }
.native-audit__reference-grid > div { display: grid; gap: 4px; padding: 11px; border: 1px solid var(--warning-line); border-radius: 4px; }
.native-audit__reference-grid span, .native-audit__reference-grid small { color: var(--cw-faint); font-size: var(--text-2xs); }
.native-audit__reference-grid strong { font-size: var(--text-lg); }
.native-audit__reference-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.native-audit__reference-columns > div { padding: 14px; border: 1px solid var(--warning-line); border-radius: 5px; }
.native-audit__reference-columns h3 { margin: 0 0 6px; }
.native-audit__reference-columns p { margin: 0; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.6; }
.native-audit__reference-columns ul { display: grid; gap: 7px; margin: 13px 0 0; padding: 0; list-style: none; }
.native-audit__reference-columns li { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding-top: 7px; border-top: 1px solid var(--warning-line); font-size: var(--text-2xs); }
.native-audit__reference-columns li small { grid-column: 1 / -1; color: var(--cw-faint); }
.native-audit__section--private { border-color: var(--positive-line); background: linear-gradient(145deg, var(--positive-tint), var(--surface-soft) 48%); }
.native-audit__owner-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 22px 0 0; border: 1px solid var(--positive-line); border-radius: 6px; background: var(--positive-tint); }
.native-audit__owner-metrics > div { min-height: 112px; display: grid; align-content: center; gap: 5px; padding: 16px; border-right: 1px solid var(--positive-line); border-bottom: 1px solid var(--positive-line); }
.native-audit__owner-metrics > div:nth-child(3n) { border-right: 0; }
.native-audit__owner-metrics > div:nth-last-child(-n+3) { border-bottom: 0; }
.native-audit__owner-metrics dd { margin: 0; color: var(--cw-green); font-family: var(--cw-font); font-size: var(--text-4xl); font-weight: 700; }
.native-audit__owner-metrics small { color: var(--cw-faint); font-size: var(--text-2xs); }
.native-audit__pattern-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.native-audit__pattern-grid > article { padding: 18px; border: 1px solid var(--positive-line); border-radius: 6px; background: var(--positive-tint); }
.native-audit__pattern-grid ul { display: grid; gap: 5px; margin: 13px 0 0; padding: 12px 0 0; border-top: 1px solid var(--positive-line); list-style: none; }
.native-audit__pattern-grid li { display: flex; justify-content: space-between; gap: 12px; color: var(--cw-faint); font-size: var(--text-2xs); }
.native-audit__pattern-grid li strong { color: var(--cw-text-soft); }
.native-audit__private-actions { margin-top: 24px; }
.native-audit__private-actions > .eyebrow { margin-bottom: 11px; }
.native-audit__text-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.native-audit__text-grid article { padding: 17px; border: 1px solid var(--cw-border); border-radius: 6px; }
.native-audit__text-grid h3 { margin: 0 0 10px; font-size: var(--text-lg); }
.native-audit__text-grid ul { display: grid; gap: 7px; margin: 0; padding-left: 16px; color: var(--cw-muted); font-size: var(--text-xs); line-height: 1.6; }
.audit-evidence-boundary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; overflow: hidden; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--cw-surface); scroll-margin-top: 84px; }
.audit-evidence-boundary article { position: relative; min-height: 230px; padding: 28px 30px; }
.audit-evidence-boundary article + article { border-left: 1px solid var(--cw-border); background: var(--surface); }
.audit-evidence-boundary__icon { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 30px; border: 1px solid var(--positive-line); border-radius: 7px; background: var(--positive-tint); color: var(--cw-green); }
.audit-evidence-boundary__icon--locked { border-color: var(--warning-line); background: var(--warning-tint); color: var(--cw-amber); }
.audit-evidence-boundary__icon svg { width: 18px; }
.audit-evidence-boundary h2 { margin: 0; font-size: var(--text-3xl); }
.audit-evidence-boundary article > p:last-child { max-width: 600px; margin: 10px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.7; }
.audit-direct-path { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 42px; margin-top: 18px; padding: 30px; border: 1px solid var(--border); border-radius: 7px; background: linear-gradient(115deg, var(--surface), var(--surface-soft)); }
.audit-direct-path h2 { margin: 0; font-size: var(--text-4xl); }
.audit-direct-path > div:first-child > p:last-child { max-width: 760px; margin: 9px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.7; }
.audit-direct-path__actions { min-width: 250px; display: grid; gap: 10px; justify-items: stretch; text-align: center; }

@media (max-width: 1050px) {
  .audit-journey-hero { grid-template-columns: 1fr; gap: 20px; }
  .audit-connection-state { grid-template-columns: 40px 1fr; }
  .audit-connection-state > .button, .audit-connection-state > form { grid-column: 2; }
  .audit-journey-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-journey-steps li:nth-child(2) { border-right: 0; }
  .audit-journey-steps li:nth-child(-n+2) { border-bottom: 1px solid var(--cw-border-soft); }
  .native-audit__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .native-audit__metrics > div:nth-child(3) { border-right: 0; }
  .native-audit__metrics > div:nth-child(-n+3) { border-bottom: 1px solid var(--cw-border-soft); }
  .native-audit__finding-grid--observations, .native-audit__signal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .native-audit__cadence { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .audit-direct-path { grid-template-columns: 1fr; }
  .audit-direct-path__actions { width: min(360px, 100%); }
}

@media (max-width: 650px) {
  .audit-journey-topbar__login { display: none; }
  .audit-journey-topbar .button--light { min-height: 34px; padding: 0 10px; font-size: var(--text-sm); }
  .audit-journey-steps { grid-template-columns: 1fr; }
  .audit-journey-steps li { min-height: 92px; border-right: 0; border-bottom: 1px solid var(--cw-border-soft); }
  .audit-journey-steps li:nth-child(2) { border-right: 0; }
  .audit-journey-steps li:last-child { border-bottom: 0; }
  .audit-journey-report-heading { align-items: flex-start; flex-direction: column; }
  .audit-journey-report-shell { height: 760px; min-height: 0; }
  .native-audit__channel { align-items: start; padding: 21px 18px; }
  .native-audit__channel img { width: 50px; height: 50px; }
  .native-audit__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .native-audit__metrics > div, .native-audit__metrics > div:nth-child(3) { min-height: 78px; border-right: 1px solid var(--cw-border-soft); border-bottom: 1px solid var(--cw-border-soft); }
  .native-audit__metrics > div:nth-child(2n) { border-right: 0; }
  .native-audit__metrics > div:last-child { border-bottom: 0; }
  .native-audit__section { padding: 21px 18px; }
  .native-audit__section-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .native-audit__finding-grid, .native-audit__finding-grid--observations, .native-audit__action-grid, .native-audit__signal-grid, .native-audit__pattern-grid, .native-audit__text-grid { grid-template-columns: 1fr; }
  .native-audit__owner-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .native-audit__owner-metrics > div, .native-audit__owner-metrics > div:nth-child(3n), .native-audit__owner-metrics > div:nth-last-child(-n+3) { border-right: 1px solid var(--positive-line); border-bottom: 1px solid var(--positive-line); }
  .native-audit__owner-metrics > div:nth-child(2n) { border-right: 0; }
  .native-audit__owner-metrics > div:nth-last-child(-n+2) { border-bottom: 0; }
  .native-audit__reference-grid { grid-template-columns: 1fr; }
  .native-audit__cadence, .native-audit__reference-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-evidence-boundary { grid-template-columns: 1fr; }
  .audit-evidence-boundary article { min-height: 210px; padding: 24px 20px; }
  .audit-evidence-boundary article + article { border-top: 1px solid var(--cw-border); border-left: 0; }
  .audit-direct-path { padding: 24px 20px; }
}

/* Phase 6 audit experience refinement */
.audit-journey-page--connected .audit-journey-sidebar { background: var(--cw-sidebar, var(--surface-base)); }
.journey-channel-card--connected { border-color: var(--positive-line); background: var(--positive-tint); }
.journey-channel-card--connected .journey-channel-card__avatar { border-color: var(--positive-line); background: var(--positive-tint); color: var(--cw-green); }
.audit-journey-nav__locked { width: 100%; border: 0; background: transparent; font-family: inherit; text-align: left; cursor: pointer; transition: color .16s ease, background .16s ease; }
.audit-journey-nav__locked:hover, .audit-journey-nav__locked:focus-visible { border-radius: 5px; outline: 0; background: var(--surface); color: var(--cw-text-soft); }
.audit-journey-nav__locked:hover > small { color: var(--cw-amber); }
.audit-journey-hero { grid-template-columns: minmax(0, 1fr) auto; align-items: center; margin-bottom: 28px; padding: 6px 0 2px; }
.audit-journey-hero h1 { max-width: 900px; }
.audit-journey-hero > div > p:last-child { max-width: 820px; font-size: var(--text-xl); line-height: 1.65; }
.audit-journey-report-heading { margin-bottom: 18px; }
.audit-journey-report-heading h2 { font-size: var(--text-4xl); }
.audit-journey-report-heading p:last-child { font-size: var(--text-lg); line-height: 1.6; }
.audit-connection-state { margin-bottom: 26px; padding: 19px 20px; }
.audit-connection-state h2 { font-size: var(--text-2xl); }
.audit-connection-state p:last-child { font-size: var(--text-lg); }

.audit-enrichment-progress { position: relative; display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 18px; margin: 0 0 28px; padding: 23px 24px 29px; overflow: hidden; border: 1px solid var(--primary-line); border-radius: 8px; background: linear-gradient(110deg, var(--primary-tint), var(--primary-tint-soft) 70%); }
.audit-enrichment-progress__spinner { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--primary-line); border-radius: 50%; background: var(--primary-tint-strong); color: var(--primary-bright); }
.audit-enrichment-progress__spinner svg { width: 24px; animation: audit-spin 1.2s linear infinite; }
.audit-enrichment-progress__copy h2 { margin: 0; font-size: var(--text-3xl); }
.audit-enrichment-progress__copy > p:last-child { max-width: 820px; margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.6; }
.audit-enrichment-progress__status { display: flex; align-items: center; gap: 8px; color: var(--primary-bright); }
.audit-enrichment-progress__status > span { width: 7px; height: 7px; border-radius: 50%; background: var(--primary-text); box-shadow: 0 0 12px color-mix(in srgb, var(--primary-text) 70%, transparent); animation: audit-pulse 1.3s ease-in-out infinite; }
.audit-enrichment-progress__status small { font-size: var(--text-sm); font-weight: 700; }
.audit-enrichment-progress__track { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--primary-tint-strong); }
.audit-enrichment-progress__track span { display: block; width: 42%; height: 100%; background: linear-gradient(90deg, transparent, var(--primary-text), transparent); animation: audit-progress 2.2s ease-in-out infinite; }
@keyframes audit-spin { to { transform: rotate(360deg); } }
@keyframes audit-pulse { 50% { opacity: .35; } }
@keyframes audit-progress { from { transform: translateX(-110%); } to { transform: translateX(340%); } }

.native-audit { gap: 22px; }
.native-audit__overview, .native-audit__section, .native-audit__conversion { border-radius: 9px; }
.native-audit__channel { padding: 30px 32px; }
.native-audit__channel h2 { font-size: var(--text-5xl); }
.native-audit__channel p:last-child { max-width: 1020px; font-size: var(--text-xl); line-height: 1.65; }
.native-audit__metrics > div { min-height: 98px; padding: 18px 22px; }
.native-audit__metrics dt, .native-audit__signal-grid dt, .native-audit__owner-metrics dt { font-size: var(--text-xs); }
.native-audit__metrics dd { font-size: var(--text-4xl); }
.native-audit__section { padding: 32px; }
.native-audit__section-heading { margin-bottom: 24px; }
.native-audit__section-heading h2 { font-size: var(--text-5xl); line-height: 1.2; }
.native-audit__section-heading > span { font-size: var(--text-sm); }
.native-audit__section--diagnosis { border-color: var(--border-strong); background: linear-gradient(145deg, var(--surface), var(--surface-soft) 55%); }
.native-audit__section--private-lead { border-color: var(--positive-line-strong); box-shadow: 0 16px 60px color-mix(in srgb, var(--positive) 12%, transparent); }
.native-audit__finding { min-height: 0; padding: 23px; }
.native-audit__finding:only-child, .native-audit__action-grid article:only-child { grid-column: 1 / -1; max-width: 900px; }
.native-audit__finding header, .native-audit__pattern-grid header { font-size: var(--text-xs); }
.native-audit__finding h3, .native-audit__pattern-grid h3 { margin: 16px 0 9px; font-size: var(--text-3xl); line-height: 1.35; }
.native-audit__finding > p, .native-audit__pattern-grid > article > p { font-size: var(--text-lg); line-height: 1.65; }
.native-audit__finding > div { margin-top: 17px; padding-top: 14px; }
.native-audit__finding > div strong { font-size: var(--text-xs); }
.native-audit__finding > div p { font-size: var(--text-lg); line-height: 1.6; }
.native-audit__actions-block { margin-top: 28px; padding-top: 25px; border-top: 1px solid var(--cw-border); }
.native-audit__subheading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.native-audit__subheading h3 { margin: 2px 0 0; font-size: var(--text-3xl); }
.native-audit__subheading > small { color: var(--cw-faint); font-size: var(--text-sm); }
.native-audit__action-grid article { min-height: 0; padding: 21px; }
.native-audit__action-grid article > span { width: 31px; height: 31px; font-size: var(--text-md); }
.native-audit__action-grid h3 { font-size: var(--text-2xl); }
.native-audit__action-grid p { font-size: var(--text-lg); }
.native-audit__action-grid strong { font-size: var(--text-lg); line-height: 1.6; }
.native-audit__action-grid small { font-size: var(--text-sm); line-height: 1.55; }
.native-audit__private-actions { margin: 28px 0 0; padding-top: 24px; border-top: 1px solid var(--positive-line); }

.native-audit__conversion { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 42px; padding: 31px 32px; border: 1px solid var(--warning-line); background: radial-gradient(circle at 0 0, color-mix(in srgb, var(--warning) 10%, transparent), transparent 38%), linear-gradient(120deg, var(--warning-tint), var(--surface) 72%); scroll-margin-top: 90px; }
.native-audit__conversion h2 { margin: 0; font-size: var(--text-4xl); }
.native-audit__conversion > div:first-child > p:nth-of-type(2) { max-width: 840px; margin: 10px 0 0; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.65; }
.native-audit__conversion ul { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 18px 0 0; padding: 0; list-style: none; }
.native-audit__conversion li { display: inline-flex; align-items: center; gap: 7px; color: var(--cw-muted); font-size: var(--text-md); font-weight: 650; }
.native-audit__conversion li svg { width: 14px; color: var(--cw-amber); }
.native-audit__conversion-actions { min-width: 270px; display: grid; gap: 10px; justify-items: stretch; text-align: center; }
.native-audit__conversion-actions form { margin: 0; }
.native-audit__conversion-actions .button { width: 100%; }
.native-audit__conversion-actions > small { color: var(--cw-faint); font-size: var(--text-xs); }

.native-audit__signal-grid { gap: 12px; }
.native-audit__signal-grid > article { min-height: 0; padding: 21px; }
.native-audit__signal-grid h3 { margin: 18px 0 8px; font-size: var(--text-2xl); }
.native-audit__signal-grid article > p { min-height: 76px; font-size: var(--text-md); line-height: 1.65; }
.native-audit__signal-grid dd { font-size: var(--text-sm); }
.native-audit__visual-card { padding: 21px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.native-audit__visual-card--wide { margin-top: 18px; }
.native-audit__visual-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.native-audit__visual-heading h3 { margin: 2px 0 0; font-size: var(--text-2xl); }
.native-audit__visual-heading > small { color: var(--cw-faint); font-size: var(--text-xs); text-transform: uppercase; }
.native-audit__bar-chart { display: grid; gap: 13px; }
.native-audit__bar-chart > div { display: grid; grid-template-columns: minmax(90px, .45fr) minmax(140px, 2fr) 72px 62px; align-items: center; gap: 12px; }
.native-audit__bar-chart span { color: var(--cw-text-soft); font-size: var(--text-md); font-weight: 700; }
.native-audit__bar-chart i, .native-audit__comparison-grid i, .native-audit__pattern-bars i, .native-audit__traffic-list i, .native-audit__retention-row i { height: 8px; overflow: hidden; border-radius: 10px; background: var(--surface-elevated); }
.native-audit__bar-chart b, .native-audit__comparison-grid b, .native-audit__pattern-bars b, .native-audit__traffic-list b, .native-audit__retention-row b { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--positive), var(--cw-green)); transition: width .55s ease; }
.native-audit__bar-chart strong { text-align: right; font-size: var(--text-lg); }
.native-audit__bar-chart small { color: var(--cw-faint); font-size: var(--text-xs); }

.native-audit__reference { padding: 22px; }
.native-audit__reference .native-audit__visual-heading { margin-bottom: 16px; }
.native-audit__reference .native-audit__visual-heading h3 { font-size: var(--text-3xl); }
.native-audit__comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.native-audit__comparison-grid article { padding: 16px; border: 1px solid var(--warning-line); border-radius: 6px; background: color-mix(in srgb, var(--surface-deepest) 28%, transparent); }
.native-audit__comparison-grid header { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.native-audit__comparison-grid header span { font-size: var(--text-lg); font-weight: 750; }
.native-audit__comparison-grid header strong { color: var(--cw-amber); font-size: var(--text-xs); font-weight: 650; }
.native-audit__comparison-grid article > div { display: grid; grid-template-columns: 76px minmax(80px, 1fr) 52px; align-items: center; gap: 10px; margin-top: 8px; }
.native-audit__comparison-grid article > div > span { color: var(--cw-muted); font-size: var(--text-xs); }
.native-audit__comparison-grid em { color: var(--cw-text-soft); font-size: var(--text-sm); font-style: normal; font-weight: 750; text-align: right; }
.native-audit__comparison-grid [data-audit-reference-bar] { background: var(--warning); }
.native-audit__reference-columns > div { padding: 18px; }
.native-audit__reference-columns h3 { font-size: var(--text-xl); }
.native-audit__pattern-bars { display: grid; gap: 14px; margin-top: 14px; }
.native-audit__pattern-bars > div { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; }
.native-audit__pattern-bars span, .native-audit__pattern-bars strong { font-size: var(--text-md); }
.native-audit__pattern-bars i, .native-audit__pattern-bars small { grid-column: 1 / -1; }
.native-audit__pattern-bars small { color: var(--cw-faint); font-size: var(--text-xs); }

.native-audit__owner-metrics dt { font-size: var(--text-xs); }
.native-audit__owner-metrics small { font-size: var(--text-sm); line-height: 1.45; }
.native-audit__owner-visuals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.native-audit__retention-list { display: grid; gap: 15px; }
.native-audit__retention-row { display: grid; gap: 8px; padding-top: 13px; border-top: 1px solid var(--positive-line); }
.native-audit__retention-row:first-child { padding-top: 0; border-top: 0; }
.native-audit__retention-row > strong { overflow: hidden; font-size: var(--text-md); text-overflow: ellipsis; white-space: nowrap; }
.native-audit__retention-row > div { display: grid; grid-template-columns: 78px minmax(70px, 1fr) 44px; align-items: center; gap: 9px; }
.native-audit__retention-row span { color: var(--cw-faint); font-size: var(--text-xs); }
.native-audit__retention-row em { color: var(--cw-text-soft); font-size: var(--text-xs); font-style: normal; text-align: right; }
.native-audit__retention-row i:not(.is-positive) b { background: linear-gradient(90deg, var(--negative), var(--negative-text)); }
.native-audit__traffic-list { display: grid; gap: 13px; }
.native-audit__traffic-list > div { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; }
.native-audit__traffic-list span, .native-audit__traffic-list strong { font-size: var(--text-md); }
.native-audit__traffic-list i, .native-audit__traffic-list small { grid-column: 1 / -1; }
.native-audit__traffic-list small { color: var(--cw-faint); font-size: var(--text-xs); }
.native-audit__pattern-intro { margin-top: 25px; }
.native-audit__pattern-intro > p:last-child { max-width: 960px; margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.6; }
.native-audit__pattern-grid > article { padding: 20px; }
.native-audit__pattern-grid li { font-size: var(--text-sm); }
.native-audit__details { margin-top: 18px; border-top: 1px solid var(--cw-border-soft); }
.native-audit__details summary { display: flex; justify-content: space-between; gap: 20px; padding: 16px 2px 0; color: var(--cw-text-soft); font-size: var(--text-md); font-weight: 750; cursor: pointer; }
.native-audit__details summary span { color: var(--cw-green); font-size: var(--text-xs); }
.native-audit__details[open] summary span { visibility: hidden; }
.native-audit__table { font-size: var(--text-sm); }
.native-audit__table th { font-size: var(--text-xs); }
.native-audit__text-grid li { font-size: var(--text-md); line-height: 1.65; }

.audit-evidence-boundary article { min-height: 215px; }
.audit-evidence-boundary h2 { font-size: var(--text-3xl); }
.audit-evidence-boundary article > p:last-child { font-size: var(--text-lg); }
.audit-evidence-boundary ul { display: grid; gap: 8px; margin: 12px 0 0; padding-left: 18px; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.55; }
.audit-direct-path--connected { border-color: var(--positive-line); background: linear-gradient(115deg, var(--positive-tint), var(--surface-soft)); }

.audit-unlock-dialog { width: min(540px, calc(100vw - 32px)); padding: 30px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); color: var(--cw-text); box-shadow: 0 30px 100px var(--scrim-strong); }
.audit-unlock-dialog::backdrop { background: var(--overlay); backdrop-filter: blur(4px); }
.audit-unlock-dialog__close { position: absolute; top: 14px; right: 14px; }
.audit-unlock-dialog__icon { width: 45px; height: 45px; display: grid; place-items: center; margin-bottom: 22px; border: 1px solid var(--warning-line); border-radius: 8px; background: var(--warning-tint); color: var(--cw-amber); }
.audit-unlock-dialog__icon svg { width: 20px; }
.audit-unlock-dialog h2 { margin: 0; font-size: var(--text-4xl); line-height: 1.25; }
.audit-unlock-dialog > p:not(.eyebrow) { margin: 10px 0 0; color: var(--cw-muted); font-size: var(--text-lg); line-height: 1.65; }
.audit-unlock-dialog ul { display: grid; gap: 12px; margin: 22px 0; padding: 0; list-style: none; }
.audit-unlock-dialog li { display: grid; grid-template-columns: 30px 1fr; gap: 11px; align-items: start; }
.audit-unlock-dialog li > svg { width: 18px; color: var(--cw-green); }
.audit-unlock-dialog li span { display: grid; gap: 3px; }
.audit-unlock-dialog li strong { font-size: var(--text-lg); }
.audit-unlock-dialog li small { color: var(--cw-faint); font-size: var(--text-sm); line-height: 1.5; }
.audit-unlock-dialog__actions { display: grid; gap: 8px; }
.audit-unlock-dialog__actions form { margin: 0; }

@media (max-width: 1050px) {
  .native-audit__conversion { grid-template-columns: 1fr; }
  .native-audit__conversion-actions { width: min(380px, 100%); }
  .native-audit__owner-visuals { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  .audit-journey-hero { grid-template-columns: 1fr; }
  .audit-journey-hero > .button { justify-self: start; }
  .audit-enrichment-progress { grid-template-columns: 46px 1fr; padding: 20px 18px 26px; }
  .audit-enrichment-progress__spinner { width: 44px; height: 44px; }
  .audit-enrichment-progress__status { grid-column: 2; }
  .native-audit__channel p:last-child { font-size: var(--text-lg); }
  .native-audit__section { padding: 23px 18px; }
  .native-audit__section-heading h2 { font-size: var(--text-4xl); }
  .native-audit__subheading { align-items: flex-start; flex-direction: column; }
  .native-audit__conversion { padding: 25px 20px; }
  .native-audit__conversion h2 { font-size: var(--text-4xl); }
  .native-audit__conversion ul { display: grid; }
  .native-audit__bar-chart > div { grid-template-columns: 88px minmax(80px, 1fr) 62px; gap: 8px; }
  .native-audit__bar-chart small { display: none; }
  .native-audit__comparison-grid { grid-template-columns: 1fr; }
  .native-audit__reference-columns { grid-template-columns: 1fr; }
  .native-audit__visual-card { padding: 17px; }
  .audit-unlock-dialog { padding: 26px 20px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .audit-enrichment-progress__spinner svg, .audit-enrichment-progress__status > span, .audit-enrichment-progress__track span { animation: none; }
}

/* Evidence-led native audit */
.audit-journey-hero { margin-bottom: 12px; }
.audit-journey-hero h1 { max-width: none; font-size: clamp(var(--text-3xl), 3vw, var(--text-6xl)); }
.audit-journey-hero > div > p:last-child { margin-top: 8px; line-height: 1.45; }
.native-audit { gap: 14px; }
.native-audit__channel { gap: 13px; padding: 17px 22px; }
.native-audit__channel img { width: 44px; height: 44px; }
.native-audit__channel h2 { font-size: var(--text-3xl); }
.native-audit__channel p:last-child { margin-top: 4px; font-size: var(--text-md); line-height: 1.45; }
.native-audit__metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.native-audit__metrics > div { min-height: 69px; padding: 12px 18px; }
.native-audit__metrics dd { font-size: var(--text-3xl); }
.native-audit__section--diagnosis { padding: 24px; }
.native-audit__section--diagnosis > .native-audit__section-heading { margin-bottom: 16px; }
.audit-finding-list { display: grid; gap: 13px; }
.audit-finding { min-width: 0; padding: 22px; border: 1px solid var(--cw-border); border-radius: 8px; background: var(--surface-soft); }
.audit-finding__topline { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 5px 18px; color: var(--cw-faint); font-size: var(--text-sm); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.audit-finding h3 { max-width: 900px; margin: 12px 0 5px; color: var(--cw-text); font-size: clamp(var(--text-xl), 2vw, var(--text-3xl)); line-height: 1.25; }
.audit-finding__sample { margin: 0 0 18px; color: var(--cw-muted); font-size: var(--text-md); }
.audit-finding__bars { display: grid; gap: 11px; max-width: 900px; margin-top: 16px; }
.audit-finding__bar-row { display: grid; grid-template-columns: minmax(105px, 170px) minmax(90px, 1fr) 85px 72px; align-items: center; gap: 12px; }
.audit-finding__bar-row > span { color: var(--cw-text-soft); font-size: var(--text-lg); font-weight: 650; }
.audit-finding__bar-track { height: 11px; overflow: hidden; border-radius: 20px; background: var(--surface-elevated); }
.audit-finding__bar-track i { display: block; min-width: 2px; height: 100%; border-radius: inherit; background: var(--cw-green); }
.audit-finding__bar-row strong { color: var(--cw-text); font-size: var(--text-lg); text-align: right; }
.audit-finding__bar-row small { color: var(--cw-faint); font-size: var(--text-sm); }
.audit-finding__axis { margin: 10px 0 0; color: var(--cw-faint); font-size: var(--text-sm); }
.audit-finding__metrics { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
.audit-finding__metrics > div { display: grid; gap: 4px; min-width: 155px; padding: 14px; border: 1px solid var(--cw-border); border-radius: 6px; }
.audit-finding__metrics dt { color: var(--cw-muted); font-size: var(--text-sm); }
.audit-finding__metrics dd { margin: 0; font-size: var(--text-3xl); font-weight: 700; }
.audit-finding__examples { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 19px; }
.audit-finding__examples a { display: grid; align-content: start; gap: 6px; min-width: 0; padding: 8px; border: 1px solid var(--cw-border); border-radius: 6px; color: var(--cw-text-soft); text-decoration: none; }
.audit-finding__examples a:hover { border-color: var(--primary-line); }
.audit-finding__examples img { width: 100%; aspect-ratio: 16 / 9; border-radius: 3px; object-fit: cover; }
.audit-finding__examples span { display: -webkit-box; overflow: hidden; font-size: var(--text-md); font-weight: 650; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.audit-finding__examples small { color: var(--cw-faint); font-size: var(--text-xs); }
.audit-finding__examples .audit-finding__example-group { color: var(--cw-green); font-size: var(--text-xs); font-weight: 700; }
.audit-finding__caveat { max-width: 900px; margin: 17px 0 0; padding-left: 11px; border-left: 2px solid var(--cw-border); color: var(--cw-muted); font-size: var(--text-md); line-height: 1.55; }
.audit-finding__interpretation, .audit-finding__observation { color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.55; }
.audit-finding__detail { margin-top: 15px; border-top: 1px solid var(--cw-border-soft); }
.audit-finding__detail summary { padding-top: 13px; color: var(--cw-green); font-size: var(--text-md); font-weight: 700; cursor: pointer; }
.audit-finding__detail p { max-width: 850px; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.6; }
.audit-next-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.audit-next-steps article { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; padding: 18px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); }
.audit-next-steps__number { color: var(--cw-green); font-size: var(--text-lg); font-weight: 750; }
.audit-next-steps__label { display: block; margin-bottom: 6px; color: var(--cw-faint); font-size: var(--text-sm); font-weight: 700; }
.audit-next-steps h4 { margin: 0 0 8px; font-size: var(--text-xl); }
.audit-next-steps p { margin: 0; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.55; }
.audit-next-steps details { margin-top: 12px; border-top: 1px solid var(--cw-border-soft); }
.audit-next-steps summary { padding-top: 11px; color: var(--cw-green); font-size: var(--text-md); font-weight: 700; cursor: pointer; }
.audit-next-steps details p { margin-top: 9px; }
.audit-next-steps details small { display: block; margin-top: 8px; color: var(--cw-faint); font-size: var(--text-sm); }
.audit-evidence-panel { margin-top: 9px; border: 1px solid var(--cw-border); border-radius: 6px; background: var(--surface-soft); }
.audit-evidence-panel > summary { display: flex; justify-content: space-between; gap: 10px; padding: 15px 17px; color: var(--cw-text-soft); font-size: var(--text-lg); font-weight: 700; cursor: pointer; }
.audit-evidence-panel > summary span { color: var(--cw-green); font-size: var(--text-sm); }
.audit-evidence-panel[open] > summary { border-bottom: 1px solid var(--cw-border); }
.audit-evidence-panel > .native-audit__signal-grid, .audit-evidence-panel > .native-audit__visual-card, .audit-evidence-panel > .native-audit__reference, .audit-evidence-panel > .native-audit__cadence, .audit-evidence-panel > .native-audit__details { margin: 16px; }
.audit-evidence-panel__note { margin: 15px 17px; color: var(--cw-muted); font-size: var(--text-md); }
.native-audit__signal-grid h3 { margin-top: 0; }
.native-audit__signal-grid article > p { min-height: 0; }
.native-audit__conversion { border-color: var(--positive-line); background: var(--positive-tint); }
.native-audit__conversion li svg { color: var(--cw-green); }
.native-audit__conversion > div:first-child > small { display: block; margin-top: 12px; color: var(--cw-faint); font-size: var(--text-sm); }
@media (max-width: 900px) {
  .audit-finding__examples { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .audit-journey-hero h1 { font-size: var(--text-5xl); }
  .audit-journey-hero > div > p:last-child { font-size: var(--text-lg); }
  .native-audit__channel { padding: 13px 15px; }
  .native-audit__channel img { width: 38px; height: 38px; }
  .native-audit__channel h2 { font-size: var(--text-2xl); }
  .native-audit__channel p:last-child { font-size: var(--text-sm); }
  .native-audit__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .native-audit__metrics > div { min-height: 60px; padding: 10px 15px; }
  .native-audit__metrics dd { font-size: var(--text-2xl); }
  .native-audit__section--diagnosis { padding: 16px 13px; }
  .audit-finding { padding: 17px 14px; }
  .audit-finding h3 { font-size: var(--text-3xl); }
  .audit-finding__bar-row { grid-template-columns: minmax(0, 1fr) 70px; gap: 5px 9px; }
  .audit-finding__bar-row > span { grid-column: 1 / 2; font-size: var(--text-lg); }
  .audit-finding__bar-track { grid-column: 1 / 2; grid-row: 2; }
  .audit-finding__bar-row strong { grid-column: 2; grid-row: 1; font-size: var(--text-lg); }
  .audit-finding__bar-row small { grid-column: 2; grid-row: 2; text-align: right; }
  .audit-finding__examples { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(155px, 62%); grid-template-columns: none; gap: 8px; overflow-x: auto; padding-bottom: 5px; scroll-snap-type: x mandatory; }
  .audit-finding__examples a { padding: 5px; }
  .audit-finding__examples a { scroll-snap-align: start; }
  .audit-finding__examples span { font-size: var(--text-sm); }
  .audit-next-steps { grid-template-columns: 1fr; }
  .audit-evidence-panel > .native-audit__signal-grid, .audit-evidence-panel > .native-audit__visual-card, .audit-evidence-panel > .native-audit__reference, .audit-evidence-panel > .native-audit__cadence, .audit-evidence-panel > .native-audit__details { margin: 10px; }
}

/* Findings lead; the snapshot and deeper analysis recede. */
.native-audit { gap: 22px; }
.native-audit__overview { border: 0; border-bottom: 1px solid var(--cw-border); border-radius: 0; background: transparent; }
.native-audit__channel { padding: 4px 0 12px; }
.native-audit__metrics { border-top: 0; }
.native-audit__metrics > div { min-height: 58px; padding: 7px 15px 13px 0; border: 0; }
.native-audit__metrics dd { font-size: var(--text-2xl); }
.native-audit__section--diagnosis { padding: 0; border: 0; background: transparent; }
.native-audit__section--diagnosis > .native-audit__section-heading { margin: 0 0 10px; }
.native-audit__section--diagnosis .native-audit__section-heading h2 { font-size: clamp(var(--text-3xl), 2.7vw, var(--text-5xl)); }
.audit-finding-list { gap: 0; }
.audit-finding { padding: 27px 0 28px; border: 0; border-bottom: 1px solid var(--cw-border); border-radius: 0; background: transparent; }
.audit-finding:first-child { padding-top: 16px; }
.audit-finding h3 { max-width: 800px; margin: 9px 0 7px; font-size: clamp(var(--text-3xl), 2.75vw, var(--text-5xl)); line-height: 1.15; letter-spacing: -.025em; }
.audit-finding__measure { max-width: 790px; margin: 0 0 4px; color: var(--cw-text-soft); font-size: var(--text-xl); line-height: 1.5; }
.audit-finding__sample { margin: 0; color: var(--cw-faint); font-size: var(--text-md); }
.audit-finding__caveat { max-width: 830px; margin: 7px 0 0; padding: 0; border: 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.5; }
.audit-finding__body { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(300px, 1fr); align-items: start; gap: 28px; margin-top: 18px; }
.audit-finding__chart { min-width: 0; }
.audit-finding__bars { margin: 0; }
.audit-finding__examples { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.audit-finding__examples a { padding: 0; border: 0; background: transparent; }
.audit-finding__examples img { border-radius: 5px; }
.audit-finding__examples span { font-size: var(--text-lg); }
.audit-finding__examples small { font-size: var(--text-sm); }
.audit-finding--observation .audit-finding__body, .audit-finding--metrics .audit-finding__body,
.audit-finding--timeline .audit-finding__body, .audit-finding--traffic .audit-finding__body { display: block; }
.audit-finding--observation .audit-finding__examples { max-width: 650px; }
.audit-finding--timeline .audit-finding__chart, .audit-finding--traffic .audit-finding__chart { max-width: 850px; }
.audit-finding__detail { max-width: 850px; margin-top: 18px; }
.audit-finding__transcript { display: grid; grid-template-columns: minmax(200px, .72fr) minmax(250px, 1fr); gap: 24px; grid-column: 1 / -1; align-items: start; max-width: 900px; }
.audit-finding__video { display: grid; gap: 6px; color: var(--cw-text); text-decoration: none; }
.audit-finding__video img { width: 100%; max-width: 360px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }
.audit-finding__video span { font-size: var(--text-lg); font-weight: 700; line-height: 1.4; }
.audit-finding__video small { color: var(--cw-green); font-size: var(--text-md); }
.audit-finding__quote { padding: 14px 0 14px 19px; border-left: 3px solid var(--cw-green); }
.audit-finding__quote > small { color: var(--cw-muted); font-size: var(--text-md); font-weight: 700; }
.audit-finding__quote blockquote { margin: 10px 0; font-size: var(--text-2xl); line-height: 1.5; }
.audit-finding__quote p { margin: 0; color: var(--cw-muted); font-size: var(--text-md); }
.native-audit__actions-block { margin-top: 30px; }
.audit-next-steps article { background: transparent; }
.audit-next-steps__target { margin: -3px 0 7px !important; color: var(--cw-green) !important; font-size: var(--text-md) !important; font-weight: 700; }
.native-audit__section--signals, .native-audit__section--compact { padding: 0; border: 0; background: transparent; }
.native-audit__section--signals .native-audit__section-heading h2,
.native-audit__section--compact .native-audit__section-heading h2 { font-size: var(--text-3xl); }
.audit-evidence-panel { border: 0; border-top: 1px solid var(--cw-border); border-radius: 0; background: transparent; }
.audit-evidence-panel > summary { padding: 14px 0; }
.native-audit__conversion { gap: 25px; padding: 22px 25px; border: 1px solid var(--cw-border); background: var(--surface-soft); }
.native-audit__conversion h2 { font-size: var(--text-3xl); }
.native-audit__conversion ul { margin-top: 11px; }
.native-audit__conversion .button { min-height: 42px; font-size: var(--text-md); }
@media (max-width: 900px) {
  .audit-finding__body { grid-template-columns: 1fr; gap: 17px; }
  .audit-finding__examples { max-width: 680px; }
}
@media (max-width: 650px) {
  .native-audit { gap: 19px; }
  .native-audit__channel { padding: 0 0 8px; }
  .native-audit__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .native-audit__metrics > div { min-height: 48px; padding: 5px 8px 8px 0; }
  .native-audit__section--diagnosis { padding: 0; }
  .audit-finding { padding: 22px 0 23px; }
  .audit-finding h3 { font-size: var(--text-4xl); }
  .audit-finding__measure { font-size: var(--text-lg); }
  .audit-finding__body { margin-top: 16px; }
  .audit-finding__examples { grid-auto-columns: minmax(165px, 57%); }
  .audit-finding__transcript { grid-template-columns: 1fr; gap: 10px; }
  .audit-finding__video { grid-template-columns: 100px 1fr; column-gap: 12px; }
  .audit-finding__video .audit-finding__thumb { grid-row: 1 / 3; width: 100px; }
  .audit-finding__video img { width: 100%; }
  .audit-finding__quote { padding: 8px 0 8px 14px; }
  .audit-finding__quote blockquote { font-size: var(--text-xl); }
  .native-audit__conversion { padding: 19px 17px; }
  .native-audit__conversion ul { display: none; }
}

/* Measured channel overview and outcome-led comparison evidence. */
.native-audit__overview { border-bottom: 0; }
.native-audit__channel { padding-bottom: 0; }
.audit-glance { padding: 17px 19px 16px; border: 1px solid var(--cw-border); border-radius: 8px; background: var(--surface-soft); }
.audit-glance__heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin-bottom: 13px; }
.audit-glance__heading .eyebrow { margin: 0 0 3px; }
.audit-glance__heading h2 { margin: 0; font-size: var(--text-3xl); line-height: 1.2; }
.audit-glance__heading > small { color: var(--cw-faint); font-size: var(--text-sm); }
.audit-glance__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.audit-glance__item { min-width: 0; padding: 0 15px; border-left: 1px solid var(--cw-border); }
.audit-glance__item:first-child { padding-left: 0; border-left: 0; }
.audit-glance__item h3 { margin: 0 0 8px; color: var(--cw-muted); font-size: var(--text-md); font-weight: 750; }
.audit-glance__item > strong { display: block; min-height: 30px; color: var(--cw-text); font-size: var(--text-xl); line-height: 1.25; }
.audit-glance__item--higher > strong { color: var(--positive-text); }
.audit-glance__item--lower > strong { color: var(--negative-text); }
.audit-glance__item > p { min-height: 27px; margin: 3px 0 9px; color: var(--cw-faint); font-size: var(--text-sm); line-height: 1.35; }
.audit-glance__pairs { display: grid; gap: 5px; }
.audit-glance__pair { display: grid; grid-template-columns: minmax(50px, 74px) minmax(20px, 1fr) minmax(35px, max-content); align-items: center; gap: 5px; }
.audit-glance__pair span, .audit-glance__pair small { overflow: hidden; color: var(--cw-faint); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.audit-glance__pair small { text-align: right; }
.audit-glance__pair i, .audit-glance__cohort i, .audit-glance__share { display: block; height: 6px; overflow: hidden; border-radius: 6px; background: var(--surface-elevated); }
.audit-glance__pair b, .audit-glance__cohort b, .audit-glance__share i { display: block; height: 100%; border-radius: inherit; background: var(--cw-muted); }
.audit-glance__pair--higher b { background: var(--positive); }
.audit-glance__pair--lower b { background: var(--negative); opacity: .75; }
.audit-glance__timeline { display: flex; align-items: end; gap: 4px; height: 34px; }
.audit-glance__timeline span { display: flex; align-items: end; flex: 1; height: 100%; border-bottom: 1px solid var(--cw-border); }
.audit-glance__timeline i { display: block; width: 100%; min-height: 2px; border-radius: 3px 3px 0 0; background: var(--cw-muted); }
.audit-glance__axis { display: block; margin-top: 3px; color: var(--cw-faint); font-size: var(--text-xs); }
.audit-glance__cohorts { display: grid; gap: 3px; }
.audit-glance__cohort { display: grid; grid-template-columns: 65px 1fr; align-items: center; gap: 5px; }
.audit-glance__cohort span { overflow: hidden; color: var(--cw-faint); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
.audit-glance__cohort i { height: 4px; }
.audit-glance__cohort--higher b { background: var(--positive); }
.audit-glance__share { height: 7px; }
.audit-glance__share i { background: var(--cw-muted); }
.journey-channel-card__avatar { overflow: hidden; border-radius: 50%; }
.journey-channel-card__avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.audit-finding__bar-row { grid-template-columns: minmax(115px, 170px) minmax(80px, 1fr) 75px 96px; }
.audit-finding__bar-label { display: block; line-height: 1.3; }
.audit-finding__bar-label small { display: block; margin-top: 3px; color: var(--cw-faint); font-size: var(--text-sm); font-weight: 500; }
.audit-finding__bar-track i { background: var(--cw-muted); }
.audit-finding__bar-row--higher .audit-finding__bar-track i { background: var(--positive); }
.audit-finding__bar-row--lower .audit-finding__bar-track i { background: var(--negative); opacity: .75; }
.audit-finding__bar-row em { font-size: var(--text-sm); font-style: normal; font-weight: 700; text-align: right; }
.audit-finding__bar-row--higher em { color: var(--positive-text); }
.audit-finding__bar-row--lower em { color: var(--negative-text); }
.audit-finding__example-panel { min-width: 0; max-width: 480px; }
.audit-finding__examples { gap: 10px; }
.audit-finding__examples .audit-finding__example { position: relative; display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 9px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.audit-finding__examples .audit-finding__example:hover { transform: translateY(-2px); border-color: var(--primary-line); box-shadow: 0 7px 18px color-mix(in srgb, var(--cw-text) 8%, transparent); }
.audit-finding__examples .audit-finding__example:focus-visible,
.audit-finding__video:focus-visible { outline: 3px solid var(--cw-green); outline-offset: 3px; border-color: var(--cw-green); }
.audit-finding__video { padding: 8px; border: 1px solid var(--cw-border); border-radius: 7px; background: var(--surface-soft); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.audit-finding__video:hover { transform: translateY(-2px); border-color: var(--primary-line); box-shadow: 0 7px 18px color-mix(in srgb, var(--cw-text) 8%, transparent); }
.audit-finding__video small { display: inline-flex; align-items: center; gap: 3px; }
.audit-finding__video small svg { width: 13px; height: 13px; }
.audit-finding__thumb { position: relative; width: 100%; }
.audit-finding__thumb .audit-finding__duration { position: absolute; right: 6px; bottom: 6px; padding: 2px 5px; border-radius: 3px; background: rgba(0, 0, 0, .82); color: #fff; font-size: var(--text-sm); font-weight: 750; line-height: 1.2; }
.audit-finding__examples .audit-finding__example img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; }
.audit-finding__examples .audit-finding__example-title { display: -webkit-box; overflow: hidden; color: var(--cw-text); font-size: var(--text-lg); font-weight: 700; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.audit-finding__examples .audit-finding__example-action { position: absolute; top: 15px; right: 15px; display: grid; place-items: center; width: 23px; height: 23px; overflow: visible; border-radius: 4px; background: rgba(0, 0, 0, .78); color: #fff; -webkit-line-clamp: unset; }
.audit-finding__example-action svg { width: 13px; height: 13px; }
.audit-finding__more { margin-top: 10px; }
.audit-finding__more summary { width: fit-content; color: var(--cw-green); font-size: var(--text-md); font-weight: 700; cursor: pointer; }
.audit-finding__more[open] summary { margin-bottom: 10px; }
.audit-finding__caveat { margin-top: 14px; }
@media (max-width: 900px) {
  .audit-glance__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 0; }
  .audit-glance__item:nth-child(odd) { padding-left: 0; border-left: 0; }
  .audit-glance__item:nth-child(n+3) { padding-top: 13px; border-top: 1px solid var(--cw-border); }
}
@media (max-width: 650px) {
  .audit-glance { padding: 14px; }
  .audit-glance__heading { margin-bottom: 11px; }
  .audit-glance__heading h2 { font-size: var(--text-2xl); }
  .audit-glance__heading > small { display: none; }
  .audit-glance__item { padding-right: 9px; padding-left: 10px; }
  .audit-glance__item > strong { min-height: 0; font-size: var(--text-lg); }
  .audit-glance__item > p { min-height: 0; font-size: var(--text-sm); }
  .audit-glance__pair { grid-template-columns: minmax(40px, 58px) minmax(18px, 1fr) minmax(30px, max-content); }
  .audit-glance__pair span, .audit-glance__pair small, .audit-glance__cohort span { font-size: var(--text-xs); }
  .audit-glance__cohort { grid-template-columns: 51px 1fr; }
  .native-audit__section--diagnosis > .native-audit__section-heading .native-audit__evidence-tag { display: none; }
  .audit-finding__bar-row { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; }
  .audit-finding__bar-row .audit-finding__bar-label { grid-column: 1; grid-row: 1; }
  .audit-finding__bar-row .audit-finding__bar-label small { text-align: left; }
  .audit-finding__bar-row strong { grid-column: 2; grid-row: 1; }
  .audit-finding__bar-row .audit-finding__bar-track { grid-column: 1 / -1; grid-row: 2; }
  .audit-finding__bar-row em { grid-column: 1 / -1; grid-row: 3; text-align: left; }
  .audit-finding__examples { grid-auto-columns: minmax(155px, 62%); }
  .audit-finding__examples .audit-finding__example { padding: 7px; }
  .audit-finding__examples .audit-finding__example-action { top: 13px; right: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .audit-finding__examples .audit-finding__example { transition: none; }
  .audit-finding__examples .audit-finding__example:hover { transform: none; }
  .audit-finding__video { transition: none; }
  .audit-finding__video:hover { transform: none; }
}

/* Audit reading order: orientation, one lead finding, then quieter evidence. */
.audit-journey-hero { grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 22px; }
.audit-journey-hero__channel { display: flex; align-items: center; gap: 10px; max-width: 330px; padding: 10px 12px; border: 1px solid var(--cw-border); border-radius: 8px; background: var(--surface-soft); }
.audit-journey-hero__channel img, .audit-journey-hero__avatar-fallback { flex: none; width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
.audit-journey-hero__avatar-fallback { display: grid; place-items: center; background: var(--surface-elevated); color: var(--cw-green); }
.audit-journey-hero__avatar-fallback svg { width: 19px; }
.audit-journey-hero__channel strong, .audit-journey-hero__channel small { display: block; }
.audit-journey-hero__channel strong { color: var(--cw-text); font-size: var(--text-md); line-height: 1.4; }
.audit-journey-hero__channel small { margin-top: 3px; color: var(--cw-faint); font-size: var(--text-sm); }
.native-audit { gap: 19px; }
.audit-glance { padding: 14px 17px; border-color: var(--cw-border-soft); background: var(--surface-soft); }
.audit-glance__heading { margin-bottom: 11px; }
.audit-glance__heading h2 { font-size: var(--text-2xl); }
.audit-glance__item h3 { margin-bottom: 5px; }
.audit-glance__item > strong { min-height: 0; font-size: var(--text-xl); }
.audit-glance__item > p { min-height: 0; margin: 3px 0 7px; }
.audit-glance__cohort--lower b { background: var(--negative); opacity: .75; }
.native-audit__section--diagnosis > .native-audit__section-heading { margin-bottom: 13px; }
.audit-finding-list { gap: 0; }
.audit-finding { min-width: 0; }
.audit-finding--primary { margin-bottom: 10px; padding: 28px; border: 1px solid var(--positive-line-strong); border-radius: 10px; background: linear-gradient(140deg, var(--positive-tint), var(--surface) 54%, var(--surface-soft)); box-shadow: 0 12px 30px color-mix(in srgb, var(--positive) 7%, transparent); }
.audit-finding--primary:first-child { padding-top: 28px; }
.audit-finding--primary .audit-finding__topline > span:first-child { color: var(--positive-text); }
.audit-finding--primary h3 { max-width: 1000px; margin-top: 12px; font-size: clamp(var(--text-4xl), 3.2vw, var(--text-6xl)); line-height: 1.13; }
.audit-finding--primary .audit-finding__body { gap: 26px; margin-top: 21px; }
.audit-finding--primary .audit-finding__example-panel { max-width: none; }
.audit-finding--primary .audit-finding__bar-track { height: 12px; }
.audit-finding__bars--cohort .audit-finding__bar-row,
.audit-finding__bars--timeline .audit-finding__bar-row,
.audit-finding__bars--traffic .audit-finding__bar-row { grid-template-columns: minmax(105px, 150px) minmax(100px, 1fr) 75px; }
.audit-finding--secondary { padding: 24px 4px 26px; border-bottom: 1px solid var(--cw-border); }
.audit-finding--secondary:first-child { padding-top: 20px; }
.audit-finding--secondary h3 { max-width: 830px; font-size: clamp(var(--text-2xl), 2.2vw, var(--text-4xl)); }
.audit-finding--secondary .audit-finding__body { grid-template-columns: minmax(240px, 1fr) minmax(230px, .8fr); gap: 18px; margin-top: 14px; }
.audit-finding--secondary .audit-finding__example-panel { max-width: 390px; }
.audit-finding--secondary .audit-finding__bar-row { gap: 7px; }
.audit-finding__examples .audit-finding__example-group { color: var(--cw-muted); }
.audit-finding__examples .audit-finding__example-group--higher { color: var(--positive-text); }
.audit-finding__examples .audit-finding__example-group--lower { color: var(--negative-text); }
.audit-finding__next { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 14px 22px; margin-top: 19px; padding: 16px 18px; border: 1px solid var(--positive-line); border-radius: 7px; background: color-mix(in srgb, var(--positive-tint) 78%, var(--surface)); }
.audit-finding__next-action { flex: 1 1 330px; min-width: 0; }
.audit-finding__next-action .eyebrow { margin: 0 0 4px; color: var(--positive-text); font-size: var(--text-sm); }
.audit-finding__next-action h4 { margin: 0 0 5px; color: var(--cw-text); font-size: var(--text-2xl); line-height: 1.3; }
.audit-finding__next-action > p:not(.eyebrow) { max-width: 740px; margin: 0; color: var(--cw-text-soft); font-size: var(--text-lg); line-height: 1.55; }
.audit-finding__next-action .audit-finding__next-target { margin-bottom: 5px !important; color: var(--cw-muted) !important; font-size: var(--text-md) !important; }
.audit-finding__next-action details { margin-top: 9px; }
.audit-finding__next-action summary { width: fit-content; color: var(--cw-green); font-size: var(--text-md); font-weight: 700; cursor: pointer; }
.audit-finding__next-action details p { max-width: 700px; margin: 7px 0 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.5; }
.audit-finding__growth-form { margin: 0; }
.audit-finding__growth-link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 39px; padding: 9px 12px; border: 1px solid var(--positive-line-strong); border-radius: 5px; background: var(--surface); color: var(--positive-text); font: inherit; font-size: var(--text-md); font-weight: 750; line-height: 1.3; text-align: center; text-decoration: none; cursor: pointer; }
.audit-finding__growth-link:hover { border-color: var(--positive); background: var(--positive-tint); }
.audit-finding__growth-link:focus-visible { outline: 3px solid var(--cw-green); outline-offset: 3px; }
.audit-finding__growth-link svg { width: 14px; height: 14px; }
.audit-finding--secondary .audit-finding__next { margin-top: 13px; padding: 10px 0 10px 14px; border: 0; border-left: 2px solid var(--positive-line-strong); border-radius: 0; background: transparent; }
.audit-finding--secondary .audit-finding__next-action h4 { font-size: var(--text-xl); }
.audit-finding--secondary .audit-finding__next-action > p:not(.eyebrow) { font-size: var(--text-md); }
.audit-finding__detail { margin-top: 12px; }
.audit-finding__unmatched { margin-top: 14px; }
.audit-finding__unmatched-list { display: grid; gap: 14px; padding: 15px 0; }
.audit-finding__unmatched-list article { padding-left: 13px; border-left: 2px solid var(--cw-border); }
.audit-finding__unmatched-list h3 { margin: 0 0 5px; font-size: var(--text-lg); }
.audit-finding__unmatched-list p, .audit-finding__unmatched-list small { margin: 0; color: var(--cw-muted); font-size: var(--text-md); line-height: 1.5; }
.audit-evidence-panel--connected { margin-top: 16px; }
.audit-evidence-panel--connected > .native-audit__owner-metrics, .audit-evidence-panel--connected > .native-audit__owner-visuals, .audit-evidence-panel--connected > .native-audit__pattern-intro, .audit-evidence-panel--connected > .native-audit__pattern-grid, .audit-evidence-panel--connected > .native-audit__details { margin: 15px; }
.native-audit__conversion { border-color: var(--cw-border); background: var(--surface-soft); }
.native-audit__section--signals { margin-top: 1px; }
@media (max-width: 900px) {
  .audit-finding--primary .audit-finding__body, .audit-finding--secondary .audit-finding__body { grid-template-columns: 1fr; }
  .audit-finding--primary .audit-finding__example-panel { max-width: 620px; }
}
@media (max-width: 650px) {
  .audit-journey-hero { grid-template-columns: 1fr; gap: 12px; }
  .audit-journey-hero--native > div:first-child > p:last-child { display: none; }
  .audit-journey-hero__channel { max-width: none; padding: 8px 10px; }
  .audit-journey-hero__channel img, .audit-journey-hero__avatar-fallback { width: 35px; height: 35px; }
  .audit-glance { padding: 12px; }
  .audit-glance__grid { gap: 8px 0; }
  .audit-glance__item:nth-child(n+3) { padding-top: 8px; }
  .audit-glance__item > p { margin-bottom: 5px; }
  .audit-glance__cohorts, .audit-glance__cohorts + .audit-glance__axis { display: none; }
  .audit-glance__item { padding-right: 7px; }
  .audit-finding--primary, .audit-finding--primary:first-child { padding: 18px 15px; }
  .audit-finding--primary h3 { font-size: var(--text-5xl); }
  .audit-finding--secondary { padding: 21px 0; }
  .audit-finding--secondary h3 { font-size: var(--text-4xl); }
  .audit-finding--primary .audit-finding__body, .audit-finding--secondary .audit-finding__body { gap: 13px; margin-top: 14px; }
  .audit-finding__bars--cohort .audit-finding__bar-row,
  .audit-finding__bars--timeline .audit-finding__bar-row,
  .audit-finding__bars--traffic .audit-finding__bar-row { grid-template-columns: minmax(0, 1fr) auto; }
  .audit-finding--primary .audit-finding__examples { grid-auto-columns: minmax(210px, 76%); }
  .audit-finding--secondary .audit-finding__examples { grid-auto-columns: minmax(145px, 56%); }
  .audit-finding__next { padding: 12px; }
  .audit-finding__next-action { flex-basis: 100%; }
  .audit-finding__growth-form, .audit-finding__growth-link { width: 100%; }
  .audit-finding--secondary .audit-finding__next { padding: 9px 0 9px 11px; }
}