/* Compact, simulated app windows for the two product release notes. */
.cl-demo {
    --demo-bg: #f6f7f9;
    --demo-panel: #fff;
    --demo-panel-soft: #f8fafd;
    --demo-text: #182334;
    --demo-muted: #64748b;
    --demo-line: #e4eaf2;
    --demo-accent: #f97e2b;
    --demo-accent-ink: #b94f0c;
    --demo-tint: #fff6ee;
    --demo-success: #15803d;
    --demo-success-tint: #edf8f1;
    --demo-shadow: 0 8px 24px #1823340a, 0 1px 3px #18233406;
    color: var(--demo-text);
    font: 12px/1.5 'Satoshi', 'Roboto', sans-serif;
    letter-spacing: 0;
    margin: 24px 0 28px;
    container-type: inline-size;
}
@media (prefers-color-scheme: dark) {
    .cl-demo {
        --demo-bg: #0b1322;
        --demo-panel: #111b2e;
        --demo-panel-soft: #0f1929;
        --demo-text: #e8eef7;
        --demo-muted: #93a3b8;
        --demo-line: #263349;
        --demo-accent-ink: #ffa15c;
        --demo-tint: #30251f;
        --demo-success: #72cba0;
        --demo-success-tint: #152f2b;
        --demo-shadow: 0 8px 24px #04091725, 0 1px 3px #04091720;
    }
}
.dark .cl-demo {
    --demo-bg: #0b1322;
    --demo-panel: #111b2e;
    --demo-panel-soft: #0f1929;
    --demo-text: #e8eef7;
    --demo-muted: #93a3b8;
    --demo-line: #263349;
    --demo-accent-ink: #ffa15c;
    --demo-tint: #30251f;
    --demo-success: #72cba0;
    --demo-success-tint: #152f2b;
    --demo-shadow: 0 8px 24px #04091725, 0 1px 3px #04091720;
}
.cl-demo *, .cl-demo *::before, .cl-demo *::after { box-sizing: border-box; }
.cl-demo b { font-weight: 600; }
.cl-demo i { font-style: normal; }
.cl-demo .cl-demo-icon { display: block; flex: 0 0 auto; width: 16px; height: 16px; }
.cl-demo-window { overflow: hidden; border: 1px solid var(--demo-line); border-radius: 12px; background: var(--demo-panel); box-shadow: var(--demo-shadow); }
.cl-demo-titlebar { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 6px 14px; border-bottom: 1px solid var(--demo-line); }
.cl-demo-brand { display: flex; align-items: center; gap: 8px; white-space: nowrap; font-size: 12px; }
.cl-demo-brand > .cl-demo-icon { color: var(--demo-accent-ink); }
.cl-demo-example { margin-left: auto; color: var(--demo-muted); font-size: 10px; white-space: nowrap; }
.cl-demo-controls { display: flex; gap: 2px; }
.cl-demo button.cl-demo-control, .cl-demo button.cl-demo-step {
    appearance: none;
    background: transparent !important;
    border: 0;
    color: var(--demo-muted) !important;
    font: inherit;
    letter-spacing: inherit;
    text-transform: none;
    box-shadow: none !important;
    cursor: pointer;
}
.cl-demo button.cl-demo-control { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border-radius: 6px; }
.cl-demo button.cl-demo-control[hidden] { display: none; }
.cl-demo button.cl-demo-control:hover { background: var(--demo-bg) !important; color: var(--demo-text) !important; }
.cl-demo button:focus-visible, .cl-demo .cl-demo-link:focus-visible { outline: 2px solid var(--demo-accent); outline-offset: -2px; }
.cl-demo-play-icon, .cl-demo[data-paused="true"] .cl-demo-pause-icon { display: none; }
.cl-demo[data-paused="true"] .cl-demo-play-icon { display: block; }
.cl-demo-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--demo-panel-soft); border-bottom: 1px solid var(--demo-line); }
.cl-demo button.cl-demo-step { position: relative; display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 39px; padding: 7px 4px; font-size: 11px; white-space: nowrap; }
.cl-demo button.cl-demo-step:not(:disabled):hover { background: var(--demo-bg) !important; }
.cl-demo button.cl-demo-step:disabled { cursor: default; opacity: 1; }
.cl-demo button.cl-demo-step[aria-current="step"] { color: var(--demo-accent-ink) !important; }
.cl-demo-step-number { display: grid; place-items: center; width: 17px; height: 17px; border: 1px solid var(--demo-line); border-radius: 50%; font-size: 9px; line-height: 1; font-variant-numeric: tabular-nums; }
.cl-demo-step[aria-current] .cl-demo-step-number { border-color: var(--demo-accent); background: var(--demo-tint); }
.cl-demo-step > i { position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background: var(--demo-accent); transform: scaleX(0); transform-origin: left; }
.cl-demo-step[aria-current] > i { transform: scaleX(var(--demo-step-progress, 1)); }
.cl-demo-plane { position: relative; overflow: hidden; isolation: isolate; background: var(--demo-panel); }
.cl-demo-searchbar { padding: 10px 14px; }
.cl-demo-searchbox { display: flex; align-items: center; gap: 9px; min-height: 37px; padding: 4px 5px 4px 10px; border: 1px solid var(--demo-line); border-radius: 7px; background: var(--demo-panel); transition: border-color .35s, box-shadow .35s; }
.cl-demo-searchbox > .cl-demo-icon { color: var(--demo-muted); }
.cl-demo-searchbox [data-demo-query] { overflow: hidden; white-space: nowrap; font-size: 12px; }
.cl-demo-search-go { display: grid; place-items: center; flex: 0 0 26px; height: 26px; margin-left: auto; border-radius: 5px; background: var(--demo-accent); color: #23190f; transition: transform .2s; }
.cl-demo-caret { display: none; width: 1px; height: 14px; background: var(--demo-accent); margin-left: -7px; flex: 0 0 1px; animation: cl-demo-blink .85s steps(1) infinite; }
.cl-demo[data-scene="typing"] .cl-demo-caret { display: block; }
.cl-demo[data-scene="typing"] .cl-demo-searchbox { border-color: var(--demo-accent); box-shadow: 0 0 0 3px var(--demo-tint); }
.cl-demo-lead-workspace { display: grid; grid-template-columns: 140px minmax(0, 1fr); border-top: 1px solid var(--demo-line); }
.cl-demo-filter-rail { padding: 12px; border-right: 1px solid var(--demo-line); background: var(--demo-panel-soft); }
.cl-demo-rail-title { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: 11px; margin-bottom: 12px; }
.cl-demo-rail-title .cl-demo-icon { width: 13px; height: 13px; }
.cl-demo-filter-count { margin-left: auto; font-size: 9px; color: var(--demo-muted); }
.cl-demo-filter { margin-bottom: 10px; }
.cl-demo-filter > span { display: block; color: var(--demo-muted); font-size: 9px; margin-bottom: 3px; }
.cl-demo-filter > div { display: flex; align-items: center; justify-content: space-between; gap: 4px; min-height: 27px; padding: 4px 6px; border: 1px solid var(--demo-line); border-radius: 4px; background: var(--demo-panel); }
.cl-demo-filter b { font-size: 10px; transition: opacity .3s, transform .3s; }
.cl-demo-filter .cl-demo-icon { width: 11px; height: 11px; color: var(--demo-muted); }
.cl-demo-filter[data-ready="false"] b { opacity: 0; transform: translateY(4px); }
.cl-demo-filter-note { display: flex; align-items: center; gap: 4px; margin-top: 12px; color: var(--demo-accent-ink); font-size: 9px; }
.cl-demo-filter-note .cl-demo-icon { width: 11px; height: 11px; }
.cl-demo-lead-results { min-width: 0; }
.cl-demo-results-title { display: flex; align-items: center; justify-content: space-between; gap: 5px; height: 37px; padding: 0 12px; }
.cl-demo-results-title b { font-size: 11px; }
.cl-demo-results-title > span { font-size: 10px; color: var(--demo-muted); font-variant-numeric: tabular-nums; }
/* The map and list share one viewport, keeping the app window still. */
.cl-demo-results-title [data-demo-count] { margin-left: auto; }
.cl-demo-view-switch { display: flex; flex: 0 0 auto; gap: 2px; margin-left: 5px; padding: 2px; border: 1px solid var(--demo-line); border-radius: 5px; background: var(--demo-panel-soft); }
.cl-demo-view-choice { display: flex; align-items: center; gap: 3px; padding: 2px 5px; border-radius: 3px; font-size: 9px; line-height: 1.5; transition: background .25s, color .25s; }
.cl-demo-view-choice .cl-demo-icon { width: 11px; height: 11px; }
.cl-demo:not([data-view="map"]) [data-demo-target="list"], .cl-demo[data-view="map"] [data-demo-target="map"] { background: var(--demo-panel); color: var(--demo-text); box-shadow: 0 1px 3px #0000000c; }
.cl-demo-lead-viewport { position: relative; overflow: hidden; }
.cl-demo-lead-list { transition: opacity .35s; }
.cl-demo[data-view="map"] .cl-demo-lead-list { opacity: 0; }
.cl-demo-map {
    --demo-map-ground: #f0f2f4;
    --demo-map-park: #e0e8e3;
    --demo-map-block: #e5e9ee;
    --demo-map-street: #fff;
    --demo-map-river: #c5d5df;
    position: absolute; inset: 0; overflow: hidden; border-top: 1px solid var(--demo-line); border-bottom: 1px solid var(--demo-line); background: var(--demo-map-ground); opacity: 0; visibility: hidden; transition: opacity .45s, visibility 0s .45s;
}
@media (prefers-color-scheme: dark) {
    .cl-demo-map { --demo-map-ground: #111d2c; --demo-map-park: #1a302f; --demo-map-block: #1a283b; --demo-map-street: #29384c; --demo-map-river: #304e63; }
}
.dark .cl-demo-map { --demo-map-ground: #111d2c; --demo-map-park: #1a302f; --demo-map-block: #1a283b; --demo-map-street: #29384c; --demo-map-river: #304e63; }
.cl-demo[data-view="map"] .cl-demo-map { opacity: 1; visibility: visible; transition: opacity .45s, visibility 0s; }
.cl-demo-map-world { position: absolute; inset: 0; transform: scale(1.12) translate(-5px, 2px); transform-origin: 55% 55%; transition: transform 1.3s cubic-bezier(.2, .8, .2, 1); }
.cl-demo[data-view="map"] .cl-demo-map-world { transform: scale(1) translate(0, 0); }
.cl-demo-map-terrain { display: block; width: 100%; height: 100%; }
.cl-demo-map-park { fill: var(--demo-map-park); }
.cl-demo-map-blocks { fill: var(--demo-map-block); }
.cl-demo-map-streets { stroke: var(--demo-map-street); stroke-width: 3; }
.cl-demo-map-road-edge { stroke: var(--demo-line); stroke-width: 7; }
.cl-demo-map-road { stroke: var(--demo-map-street); stroke-width: 5; }
.cl-demo-map-river { stroke: var(--demo-map-river); stroke-width: 10; }
.cl-demo-map-bridge { stroke: var(--demo-map-street); stroke-width: 3; }
.cl-demo-map-city { position: absolute; left: 47%; top: 57%; color: var(--demo-muted); font-size: 10px; font-weight: 600; letter-spacing: .025em; }
.cl-demo-map-location { position: absolute; top: 8px; left: 9px; display: flex; align-items: center; gap: 4px; padding: 3px 6px; background: var(--demo-panel); border: 1px solid var(--demo-line); border-radius: 4px; color: var(--demo-text); font-size: 9px; box-shadow: 0 1px 4px #00000008; }
.cl-demo-map-location .cl-demo-icon { width: 11px; height: 11px; color: var(--demo-muted); }
.cl-demo-map-zoom { position: absolute; top: 8px; right: 9px; display: flex; flex-direction: column; width: 21px; background: var(--demo-panel); border: 1px solid var(--demo-line); border-radius: 4px; color: var(--demo-muted); font-size: 13px; text-align: center; line-height: 20px; }
.cl-demo-map-zoom > span + span { border-top: 1px solid var(--demo-line); }
.cl-demo-map-note { position: absolute; bottom: 5px; right: 7px; padding: 1px 4px; border-radius: 2px; background: var(--demo-panel); color: var(--demo-muted); font-size: 8px; }
.cl-demo-map-pin { position: absolute; width: 20px; height: 25px; transform: translate(-50%, -100%); }
.cl-demo-map-marker { display: block; width: 20px; height: 25px; transform-origin: 50% 100%; transition: opacity .35s, transform .55s cubic-bezier(.2, 1.45, .4, 1); filter: drop-shadow(0 2px 2px #00000025); }
.cl-demo-map-marker svg { display: block; width: 100%; height: 100%; }
.cl-demo-map-marker path { fill: var(--demo-accent); stroke: var(--demo-panel); stroke-width: 1.5; }
.cl-demo-map-marker circle { fill: var(--demo-panel); }
.cl-demo-map-pin[data-ready="false"] .cl-demo-map-marker { opacity: 0; transform: translateY(-9px) scale(.6); }
.cl-demo[data-map-focused="true"] [data-demo-pin="0"] { z-index: 2; }
.cl-demo[data-map-focused="true"] [data-demo-pin="0"] .cl-demo-map-marker { transform: scale(1.15); }
.cl-demo-map-popup { position: absolute; bottom: 32px; left: 50%; display: flex; flex-direction: column; gap: 3px; width: max-content; padding: 7px 9px; border: 1px solid var(--demo-line); border-radius: 5px; background: var(--demo-panel); box-shadow: 0 3px 9px #00000012; opacity: 0; transform: translate(-50%, 5px); transition: opacity .3s, transform .4s cubic-bezier(.2, .8, .2, 1); }
.cl-demo-map-popup::after { content: ''; position: absolute; bottom: -4px; left: calc(50% - 4px); width: 7px; height: 7px; border-right: 1px solid var(--demo-line); border-bottom: 1px solid var(--demo-line); background: var(--demo-panel); transform: rotate(45deg); }
.cl-demo-map-popup b { font-size: 10px; }
.cl-demo-map-popup small { display: flex; align-items: center; gap: 3px; font-size: 8px; color: var(--demo-success); }
.cl-demo-map-popup .cl-demo-icon { width: 10px; height: 10px; }
.cl-demo[data-map-focused="true"] .cl-demo-map-popup { opacity: 1; transform: translate(-50%, 0); }
.cl-demo-lead-grid { display: grid; grid-template-columns: 16px minmax(0, 1fr) 42px; align-items: center; gap: 9px; padding: 0 12px; }
.cl-demo-table-heading { min-height: 26px; color: var(--demo-muted); font-size: 9px; border-top: 1px solid var(--demo-line); border-bottom: 1px solid var(--demo-line); background: var(--demo-panel-soft); }
.cl-demo-checkbox { display: grid; place-items: center; width: 13px; height: 13px; border: 1px solid var(--demo-line); border-radius: 3px; background: var(--demo-panel); transition: background .2s, border-color .2s; }
.cl-demo-checkbox .cl-demo-icon { width: 11px; height: 11px; opacity: 0; transform: scale(.5); transition: opacity .2s, transform .3s cubic-bezier(.2, 1.5, .4, 1); }
.cl-demo-lead-row { position: relative; min-height: 46px; border-bottom: 1px solid var(--demo-line); transition: background .35s; }
.cl-demo-company { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.cl-demo-company b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.cl-demo-company small { color: var(--demo-muted); font-size: 9px; }
.cl-demo-company small i { margin: 0 3px; }
.cl-demo-status { color: var(--demo-success); font-size: 9px; }
.cl-demo-lead-row > .cl-demo-company, .cl-demo-lead-row > .cl-demo-status, .cl-demo-lead-row > .cl-demo-checkbox { transition: opacity .45s, transform .45s, background .2s; }
.cl-demo-lead-row[data-ready="false"] > :not(.cl-demo-row-skeleton) { opacity: 0; transform: translateY(5px); }
.cl-demo-lead-row[data-selected="true"] { background: var(--demo-tint); }
.cl-demo-lead-row[data-selected="true"] .cl-demo-checkbox { background: var(--demo-accent); border-color: var(--demo-accent); color: #23190f; }
.cl-demo-lead-row[data-selected="true"] .cl-demo-checkbox .cl-demo-icon { opacity: 1; transform: scale(1); }
.cl-demo-row-skeleton { position: absolute; inset: 12px 65px 11px 37px; display: flex; flex-direction: column; align-items: start; gap: 7px; opacity: 0; transition: opacity .25s; pointer-events: none; }
.cl-demo-row-skeleton i { width: 72%; height: 7px; border-radius: 2px; background: var(--demo-line); }
.cl-demo-row-skeleton i:last-child { width: 45%; height: 5px; }
.cl-demo-lead-row[data-ready="false"] .cl-demo-row-skeleton { opacity: .7; }
.cl-demo[data-scene="searching"] .cl-demo-row-skeleton { animation: cl-demo-breathe 1.4s ease-in-out infinite; animation-delay: calc(var(--demo-row-index, 0) * .15s); }
.cl-demo-search-status { display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; color: var(--demo-muted); font-size: 9px; }
.cl-demo-activity { flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: var(--demo-success); }
.cl-demo[data-scene="typing"] .cl-demo-activity, .cl-demo[data-scene="upload"] .cl-demo-activity { background: var(--demo-muted); }
.cl-demo[data-busy="true"] .cl-demo-activity { background: var(--demo-accent); box-shadow: 0 0 0 3px var(--demo-tint); animation: cl-demo-breathe 1.2s ease-in-out infinite; }
.cl-demo-bottom { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 62px; padding: 10px 14px; border-top: 1px solid var(--demo-line); background: var(--demo-panel); }
.cl-demo-bottom > span { transition: opacity .25s, transform .3s; }
.cl-demo[data-scene="done"] .cl-demo-bottom > span { opacity: 0; transform: translateY(-5px); }
.cl-demo-selection, .cl-demo-original-note { display: flex; align-items: center; gap: 6px; color: var(--demo-muted); font-size: 10px; }
.cl-demo-selection-number { display: grid; place-items: center; min-width: 20px; height: 20px; border-radius: 4px; background: var(--demo-tint); color: var(--demo-accent-ink); font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; }
.cl-demo-original-note .cl-demo-icon { width: 12px; height: 12px; color: var(--demo-success); }
.cl-demo-mini-action { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 10px; border: 1px solid var(--demo-line); border-radius: 5px; background: var(--demo-panel); color: var(--demo-text); font-weight: 600; font-size: 10px; white-space: nowrap; transition: background .3s, border-color .3s, opacity .3s, transform .2s; }
.cl-demo-mini-action .cl-demo-icon { width: 12px; height: 12px; }
.cl-demo[data-phase="2"] .cl-demo-mini-action { background: var(--demo-accent); border-color: var(--demo-accent); color: #23190f; }
.cl-demo[data-phase="0"] .cl-demo-mini-action { opacity: .45; }
.cl-demo-receipt { position: absolute; bottom: 8px; left: 10px; right: 10px; display: flex; align-items: center; gap: 9px; padding: 7px 9px; border: 1px solid var(--demo-line); border-radius: 6px; background: var(--demo-panel-soft); min-height: 46px; transition: opacity .45s, transform .55s cubic-bezier(.2, .8, .2, 1), border-color .4s; }
.cl-demo-receipt > span:nth-child(2) { min-width: 0; }
.cl-demo-receipt b { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-demo-receipt small { display: block; margin-top: 2px; color: var(--demo-muted); font-size: 9px; }
.cl-demo-receipt-icon { display: grid; place-items: center; flex: 0 0 27px; height: 30px; border: 1px solid var(--demo-line); border-radius: 5px; color: var(--demo-success); background: var(--demo-success-tint); }
.cl-demo-filetype { margin-left: auto; font: 9px/1.5 'JetBrains Mono', monospace; color: var(--demo-muted); }
.cl-demo:not([data-scene="done"]) .cl-demo-receipt { opacity: 0; transform: translateY(10px); }
.cl-demo[data-scene="done"] .cl-demo-receipt { border-color: color-mix(in srgb, var(--demo-success) 28%, var(--demo-line)); }
.cl-demo-filebar { display: flex; align-items: center; gap: 9px; min-height: 55px; padding: 10px 14px; }
.cl-demo-file-icon { display: grid; place-items: center; flex: 0 0 29px; height: 35px; border: 1px solid var(--demo-line); border-radius: 5px; background: var(--demo-panel-soft); color: var(--demo-muted); }
.cl-demo-file-name { min-width: 0; }
.cl-demo-file-name b { display: block; font-size: 11px; }
.cl-demo-file-name small { display: block; color: var(--demo-muted); font-size: 9px; margin-top: 2px; }
.cl-demo-file-check { display: flex; align-items: center; gap: 4px; margin-left: auto; color: var(--demo-success); font-size: 9px; transition: opacity .3s, transform .3s; }
.cl-demo-file-check .cl-demo-icon { width: 12px; height: 12px; }
.cl-demo[data-mapped="false"] .cl-demo-file-check { opacity: 0; transform: translateY(4px); }
.cl-demo[data-entering="true"] .cl-demo-file-icon { transform: translateY(-8px) rotate(-8deg); opacity: 0; }
.cl-demo-file-icon { transition: transform .7s cubic-bezier(.2, .8, .2, 1), opacity .4s; }
.cl-demo-enrichment-options { display: flex; align-items: center; gap: 8px; min-height: 37px; padding: 6px 14px; border-top: 1px solid var(--demo-line); border-bottom: 1px solid var(--demo-line); color: var(--demo-muted); font-size: 10px; background: var(--demo-panel-soft); }
.cl-demo-data-chip { display: flex; align-items: center; gap: 4px; padding: 3px 6px; background: var(--demo-panel); border: 1px solid var(--demo-line); border-radius: 4px; color: var(--demo-text); white-space: nowrap; }
.cl-demo-data-chip .cl-demo-icon { width: 11px; height: 11px; color: var(--demo-accent-ink); }
.cl-demo-ai { display: flex; align-items: center; gap: 5px; margin-left: auto; color: var(--demo-text); white-space: nowrap; }
.cl-demo-ai .cl-demo-icon { width: 12px; height: 12px; color: var(--demo-accent-ink); }
.cl-demo-ai > i { position: relative; width: 24px; height: 14px; border-radius: 12px; background: var(--demo-accent); transition: background .25s; }
.cl-demo-ai > i::after { content: ''; position: absolute; top: 3px; left: 3px; width: 8px; height: 8px; border-radius: 50%; background: #fff; transform: translateX(10px); transition: transform .25s cubic-bezier(.2, .8, .2, 1); }
.cl-demo[data-ai="false"] .cl-demo-ai > i { background: var(--demo-muted); }
.cl-demo[data-ai="false"] .cl-demo-ai > i::after { transform: translateX(0); }
.cl-demo-enrichment-table { padding: 0 14px; }
.cl-demo-column-groups { display: grid; grid-template-columns: 60% 40%; margin-top: 10px; font-size: 8px; font-weight: 600; letter-spacing: .09em; }
.cl-demo-column-groups > span { padding: 6px 9px; background: var(--demo-panel-soft); color: var(--demo-muted); border-top: 1px solid var(--demo-line); }
.cl-demo-column-groups > span:last-child { color: var(--demo-accent-ink); background: var(--demo-tint); border-top-color: var(--demo-accent); }
.cl-demo-enrichment-grid { display: grid; grid-template-columns: 42% 18% 21% 19%; align-items: stretch; }
.cl-demo-enrichment-grid > span { display: flex; align-items: center; position: relative; min-width: 0; padding: 0 8px; }
.cl-demo-enrichment-grid .cl-demo-added { background: var(--demo-tint); }
.cl-demo-enrichment-grid > .cl-demo-added:nth-child(3) { border-left: 1px solid var(--demo-line); }
.cl-demo-enrichment-row { position: relative; min-height: 40px; border-bottom: 1px solid var(--demo-line); font-size: 10px; }
.cl-demo-source-company { gap: 8px; }
.cl-demo-source-company b { font-size: 10px; line-height: 1.3; }
.cl-demo-row-number { color: var(--demo-muted); font-size: 8px; font-variant-numeric: tabular-nums; }
.cl-demo-city { color: var(--demo-muted); font-size: 9px; }
.cl-demo-cell-value { transition: opacity .4s, transform .45s cubic-bezier(.2, .8, .2, 1); }
.cl-demo-matched { display: flex; align-items: center; gap: 3px; font-size: 9px; color: var(--demo-success); }
.cl-demo-matched .cl-demo-icon { width: 11px; height: 11px; }
.cl-demo-cell-placeholder { position: absolute; left: 8px; top: calc(50% - 2px); width: 17px; height: 3px; border-radius: 2px; background: var(--demo-line); opacity: 0; transition: opacity .2s; }
.cl-demo-enrichment-row[data-ready="false"] .cl-demo-cell-value { opacity: 0; transform: translateX(-5px); }
.cl-demo-enrichment-row[data-ready="false"] .cl-demo-cell-placeholder { opacity: 1; }
.cl-demo-row-scan { position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent, var(--demo-accent) 60%, transparent); opacity: 0; transform: scaleX(0); transform-origin: left; pointer-events: none; }
.cl-demo-enrichment-row[data-active="true"] .cl-demo-row-scan { animation: cl-demo-scan 1.65s cubic-bezier(.25, .1, .25, 1) infinite; }
.cl-demo-enrichment-row[data-active="true"] .cl-demo-row-number { color: var(--demo-accent-ink); }
.cl-demo-enrichment-row[data-active="true"] .cl-demo-cell-placeholder { animation: cl-demo-breathe .9s ease-in-out infinite; background: var(--demo-accent); }
.cl-demo-enrichment-progress { position: relative; display: flex; align-items: center; gap: 7px; height: 36px; margin: 0 14px; padding-bottom: 4px; color: var(--demo-muted); font-size: 9px; }
.cl-demo-enrichment-progress > b { margin-left: auto; font-size: 9px; font-variant-numeric: tabular-nums; }
.cl-demo-enrichment-progress > i { position: absolute; height: 2px; left: 0; right: 0; bottom: 8px; background: var(--demo-line); overflow: hidden; border-radius: 2px; }
.cl-demo-enrichment-progress > i > span { display: block; height: 100%; background: var(--demo-accent); transform: scaleX(var(--demo-progress, 1)); transform-origin: left; transition: transform .6s cubic-bezier(.2, .8, .2, 1), background .4s; }
.cl-demo[data-scene="done"] .cl-demo-enrichment-progress > i > span { background: var(--demo-success); }
.cl-demo-pointer { position: absolute; top: 0; left: 0; z-index: 5; width: 22px; height: 26px; overflow: visible; pointer-events: none; opacity: 0; filter: drop-shadow(0 2px 2px #0002); }
.cl-demo-click-ring { opacity: 0; transform-box: fill-box; transform-origin: center; }
.cl-demo .cl-demo-caption { display: flex; align-items: start; gap: 18px; padding: 12px 1px 0; }
.cl-demo .cl-demo-caption p { flex: 1; margin: 0; color: var(--demo-muted); font-size: 12px; line-height: 1.6; }
.cl-demo .cl-demo-link { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 5px; margin-top: 1px; color: var(--demo-text) !important; font-size: 11px; font-weight: 600; text-decoration: none !important; border-bottom: 1px solid var(--demo-line); padding-bottom: 2px; }
.cl-demo .cl-demo-link:hover { color: var(--demo-accent-ink) !important; border-color: var(--demo-accent); }
.cl-demo .cl-demo-link .cl-demo-icon { width: 12px; height: 12px; }
.cl-demo[data-running="false"] *, .cl-demo[data-running="false"] *::after { animation-play-state: paused !important; }
.cl-demo[data-seeking="true"] * { transition: none !important; }
@keyframes cl-demo-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
@keyframes cl-demo-breathe { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
@keyframes cl-demo-scan { 0% { opacity: 0; transform: scaleX(0); } 15% { opacity: .8; } 85% { opacity: .8; } 100% { opacity: 0; transform: scaleX(1); } }
@container (max-width: 480px) {
    .cl-demo-titlebar { gap: 7px; padding-left: 10px; padding-right: 7px; }
    .cl-demo-brand { gap: 6px; font-size: 11px; }
    .cl-demo-example { font-size: 9px; }
    .cl-demo-controls { gap: 0; }
    .cl-demo button.cl-demo-control { width: 26px; }
    .cl-demo button.cl-demo-step { font-size: 10px; gap: 4px; min-height: 43px; }
    .cl-demo-searchbar { padding: 11px 10px; }
    .cl-demo-searchbox { gap: 6px; }
    .cl-demo-searchbox [data-demo-query] { font-size: 10px; }
    .cl-demo-lead-workspace { grid-template-columns: 1fr; }
    .cl-demo-filter-rail { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-right: 0; border-bottom: 1px solid var(--demo-line); }
    .cl-demo-rail-title { margin: 0 2px 0 0; font-size: 0; }
    .cl-demo-filter-count, .cl-demo-filter > span, .cl-demo-filter-note { display: none; }
    .cl-demo-filter { margin: 0; flex: 1; }
    .cl-demo-filter > div { min-height: 24px; padding: 3px 5px; }
    .cl-demo-filter b { font-size: 9px; }
    .cl-demo-results-title { height: 35px; padding-left: 10px; padding-right: 10px; }
    .cl-demo-view-switch { margin-left: 2px; }
    .cl-demo-view-choice { padding: 2px 4px; }
    .cl-demo-lead-row { min-height: 49px; }
    .cl-demo-enrichment-table { padding: 0 10px; }
    .cl-demo-filebar { padding-left: 10px; padding-right: 10px; }
    .cl-demo-file-check { font-size: 8px; }
    .cl-demo-enrichment-options { gap: 5px; padding: 7px 10px; font-size: 9px; }
    .cl-demo-ai { gap: 4px; }
    .cl-demo-enrichment-grid { grid-template-columns: 56% 23% 21%; }
    .cl-demo-enrichment-grid .cl-demo-city { display: none; }
    .cl-demo-column-groups { grid-template-columns: 56% 44%; font-size: 7px; }
    .cl-demo-enrichment-grid > span { padding-left: 6px; padding-right: 4px; }
    .cl-demo-enrichment-grid.cl-demo-table-heading { font-size: 8px; }
    .cl-demo-source-company { gap: 5px; }
    .cl-demo-source-company b { font-size: 9px; }
    .cl-demo-enrichment-row { min-height: 49px; font-size: 9px; }
    .cl-demo-enrichment-progress { margin: 0 10px; }
    .cl-demo-bottom { padding: 9px 10px; }
    .cl-demo-mini-action { font-size: 9px; padding: 7px; gap: 4px; }
    .cl-demo-original-note { font-size: 8px; gap: 3px; }
    .cl-demo-receipt { padding: 7px; gap: 7px; }
    .cl-demo-receipt b { font-size: 10px; }
    .cl-demo-receipt small { font-size: 8px; }
    .cl-demo .cl-demo-caption { flex-direction: column; gap: 7px; padding-top: 11px; }
}
@container (max-width: 340px) {
    .cl-demo-view-choice .cl-demo-icon { display: none; }
    .cl-demo-results-title [data-demo-count] { font-size: 9px; }
    .cl-demo-titlebar { flex-wrap: wrap; gap: 3px 7px; }
    .cl-demo-brand { flex: 1; }
    .cl-demo-example { order: 3; width: 100%; margin-left: 22px; margin-top: -3px; }
    .cl-demo-step-number { width: 14px; height: 14px; font-size: 8px; }
    .cl-demo button.cl-demo-step { font-size: 9px; }
    .cl-demo-enrichment-options > span:first-child { display: none; }
    .cl-demo-file-check { max-width: 75px; line-height: 1.3; }
    .cl-demo-filetype { display: none; }
    .cl-demo-searchbox > .cl-demo-icon { width: 13px; height: 13px; }
    .cl-demo-search-go { flex-basis: 23px; height: 25px; }
    .cl-demo-original-note { max-width: 95px; line-height: 1.3; }
}
@media (prefers-reduced-motion: reduce) {
    .cl-demo *, .cl-demo *::after { animation: none !important; transition: none !important; }
    .cl-demo-pointer, .cl-demo-caret { display: none !important; }
}