/* =====================================================================================================
   Data accuracy audits — list, builder and run report (/data/audits).

   Ported from the approved mockup (docs/design/data-accuracy-audit.html). Every rule is prefixed `da-` so
   nothing here can collide with app.css; the shared primitives (.btn, .card, .badge, .switch, .dl-*) come
   from shadcn.css and datalist.css. Load after both.
   ===================================================================================================== */

:root {
    /* Layer accents — the pipeline step-category hues, so "Source" here looks like a source there. */
    --lay-source: #7c3aed; --lay-mart: #2563eb; --lay-warehouse: #0891b2; --lay-report: #059669; --lay-other: #52525b;
    /* Engine accents, used only on the small tile beside an entity name. */
    --eng-mssql: #2563eb; --eng-clickhouse: #ca8a04; --eng-duckdb: #059669; --eng-postgres: #0891b2; --eng-mysql: #7c3aed; --eng-mongo: #16a34a;
}
:root[data-theme="dark"] {
    --lay-source: #a78bfa; --lay-mart: #60a5fa; --lay-warehouse: #22d3ee; --lay-report: #34d399; --lay-other: #8b949e;
    --eng-mssql: #60a5fa; --eng-clickhouse: #e3b341; --eng-duckdb: #34d399; --eng-postgres: #22d3ee; --eng-mysql: #a78bfa; --eng-mongo: #3fb950;
}

.da-lay-source { --lc: var(--lay-source); }
.da-lay-mart { --lc: var(--lay-mart); }
.da-lay-warehouse { --lc: var(--lay-warehouse); }
.da-lay-report { --lc: var(--lay-report); }
.da-lay-other { --lc: var(--lay-other); }

.da-eng-mssql { --ec: var(--eng-mssql); }
.da-eng-clickhouse { --ec: var(--eng-clickhouse); }
.da-eng-duckdb { --ec: var(--eng-duckdb); }
.da-eng-postgres { --ec: var(--eng-postgres); }
.da-eng-mysql { --ec: var(--eng-mysql); }
.da-eng-mongo { --ec: var(--eng-mongo); }

.da-mono { font-family: var(--font-mono); }
.da-page .input-sm, .da-page .select-sm { height: 30px !important; font-size: 12.5px; }
.dl-act-run:hover:not(:disabled) { color: var(--success); background: var(--success-subtle); }
.da-spacer { flex: 1 1 auto; }
.da-muted { color: var(--text-muted); }

/* ---------------------------------------------------------------------------------------------- list */
.da-col-layers { width: 250px; }
.da-col-schedule { width: 160px; }
.da-col-lastrun { width: 220px; }
.da-col-mism { width: 110px; }
.da-col-actions { width: 104px; }

.da-chain { display: inline-flex; align-items: center; flex-wrap: nowrap; max-width: 100%; overflow: hidden; }
.da-chip {
    display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 999px;
    font-size: 10.5px; font-weight: 600; letter-spacing: .02em; white-space: nowrap;
    color: var(--lc); background: color-mix(in srgb, var(--lc) 11%, transparent);
    border: 1px solid color-mix(in srgb, var(--lc) 26%, transparent);
}
.da-link { width: 12px; height: 1px; background: var(--border-strong); flex: 0 0 auto; position: relative; }
.da-link::after {
    content: ''; position: absolute; right: -1px; top: -2px; width: 4px; height: 4px;
    border-top: 1px solid var(--border-strong); border-right: 1px solid var(--border-strong); transform: rotate(45deg);
}

.sc .da-tile-danger { color: var(--danger); background: var(--danger-subtle); border-color: var(--danger-border); }
.sc .da-tile-warning { color: var(--warning); background: var(--warning-subtle); border-color: var(--warning-border); }
.sc .da-tile-running { color: var(--accent); background: var(--accent-subtle); border-color: var(--accent-border); }
.da-row-danger .dl-td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.da-row-warning .dl-td:first-child { box-shadow: inset 3px 0 0 var(--warning); }
.da-row-running .dl-td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.da-row-stale .dl-td:first-child { box-shadow: inset 3px 0 0 var(--serious); }
.sc .da-tile-stale { color: var(--serious); background: var(--serious-subtle); border-color: var(--serious-border); }
.da-run-msg-stale { color: var(--serious) !important; }
.dl-dot.da-dot-stale { background: var(--serious); box-shadow: 0 0 0 3px color-mix(in srgb, var(--serious) 22%, transparent); }
.pl-pill.da-pill-stale { color: var(--serious); border-color: var(--serious-border); background: var(--serious-subtle); }
.da-run-msg-danger { color: var(--danger) !important; }
.da-mism-bad { color: var(--danger) !important; font-weight: 600; }
.da-spin { animation: da-spin 1s linear infinite; }
@keyframes da-spin { to { transform: rotate(360deg); } }

/* --------------------------------------------------------------------------- page shell (builder + run) */
.da-page { margin: -20px -24px 0; min-height: calc(100% + 20px); background: var(--bg); }
/* Bootstrap (loaded globally) gives .card its own colour, var(--bs-body-color), which stays dark in the app's
   dark theme — so anything in a card that inherits its colour vanished on the dark surface. */
.da-page .card { color: var(--text-primary); }
@media (max-width: 767px) { .da-page { margin: -14px -16px 0; } }

.da-topbar {
    display: flex; align-items: center; gap: 10px; padding: 0 20px; height: 48px; min-width: 0;
    border-bottom: 1px solid var(--border); background: var(--surface);
    /* .al-main is the scroll container and sticky offsets are measured inside its 20px top padding, so -20px
       is what puts the bar flush against the app header (-14px where the padding shrinks on phones). */
    position: sticky; top: -20px; z-index: 20;
}
@media (max-width: 767px) { .da-topbar { top: -14px; } }
.da-crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 13px; }
.sc .da-crumbs a { color: var(--text-muted) !important; text-decoration: none; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.sc .da-crumbs a:hover { color: var(--text-primary) !important; }
.da-crumb-sep { color: var(--text-muted); }
.da-crumb-current { font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 320px; }
.da-body { max-width: 1280px; margin: 0 auto; padding: 22px 24px 60px; }

@media (max-width: 767px) {
    .da-topbar { padding: 0 12px; gap: 8px; }
    .da-body { padding: 16px 16px 48px; }
    .da-crumbs { flex: 1 1 auto; min-width: 0; }
    .da-crumb-current { max-width: none; min-width: 0; flex: 1 1 auto; }
    .da-topbar .pl-pill { display: none; }
    .sc .da-hide-m, .da-hide-m { display: none !important; }
}

.da-banner {
    display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; margin-bottom: 14px;
    border: 1px solid var(--border); border-radius: var(--radius-lg); font-size: 12.5px; line-height: 1.5;
}
.da-banner svg { margin-top: 2px; flex: 0 0 auto; }
.da-banner-danger { color: var(--danger); background: var(--danger-subtle); border-color: var(--danger-border); }
.da-banner-warning { color: var(--text-secondary); background: var(--warning-subtle); border-color: var(--warning-border); }
.da-banner-warning svg { color: var(--warning); }
.da-banner-info { color: var(--text-secondary); background: var(--accent-subtle); border-color: var(--accent-border); }
.da-banner ul { margin: 2px 0 0; padding-left: 18px; }

/* ---------------------------------------------------------------------------------------- lineage strip */
.da-lin { position: relative; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-xs); overflow-x: auto; margin-bottom: 18px; }
.da-lin-inner { position: relative; min-width: 640px; padding: 56px 20px 16px; }
.da-lin-arcs { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.da-lin-arc { fill: none; stroke: var(--accent); stroke-width: 1.5; }
.da-lin-arc.is-pass { stroke: var(--success); }
.da-lin-arc.is-fail { stroke: var(--danger); }
.da-lin-arc.is-idle { stroke: var(--text-muted); stroke-dasharray: 3 3; }
.da-lin-lbl { font-family: var(--font-mono); font-size: 10.5px; fill: var(--text-muted); }
.da-lin-lbl-bg { fill: var(--surface); }
.da-lin-nodes { display: grid; gap: 28px; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); position: relative; }
.da-lin-node {
    position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 11px; min-width: 0;
    border: 1px solid var(--border); border-left: 3px solid var(--lc, var(--border-strong));
    border-radius: var(--radius-md); background: var(--surface);
}
.da-lin-node.is-empty { border-style: dashed; color: var(--text-muted); }
.da-lin-node.is-error { border-color: var(--danger-border); border-left-color: var(--danger); background: var(--danger-subtle); }
.da-lin-node + .da-lin-node::before { content: ''; position: absolute; left: -29px; top: 50%; width: 22px; height: 1px; background: var(--border-strong); }
.da-lin-node + .da-lin-node::after {
    content: ''; position: absolute; left: -12px; top: calc(50% - 3px); width: 5px; height: 5px;
    border-top: 1px solid var(--border-strong); border-right: 1px solid var(--border-strong); transform: rotate(45deg);
}
.da-letter {
    flex: 0 0 auto; width: 22px; height: 22px; border-radius: 6px; display: inline-grid; place-items: center;
    font-size: 11px; font-weight: 700; color: var(--lc, var(--text-secondary));
    background: color-mix(in srgb, var(--lc, var(--text-muted)) 12%, transparent);
}
.da-lin-text { min-width: 0; }
.da-lin-layer { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--lc, var(--text-muted)); }
.da-lin-name { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-lin-sub { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-lin-node.is-error .da-lin-sub { color: var(--danger); }
.da-lin-legend { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 8px 16px; border-top: 1px solid var(--border); font-size: 11.5px; color: var(--text-muted); background: var(--surface-muted); min-width: 640px; }
.da-lin-legend i { display: inline-block; width: 18px; height: 0; border-top: 1.5px solid var(--accent); vertical-align: middle; margin-right: 6px; }
.da-lin-legend i.flow { border-top: 1px solid var(--border-strong); }
.da-lin-legend i.pass { border-color: var(--success); }
.da-lin-legend i.fail { border-color: var(--danger); }

/* ---------------------------------------------------------------------------------------------- builder */
.da-grid { display: grid; grid-template-columns: minmax(0, 1fr) 288px; gap: 20px; align-items: start; }
.da-main { min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.da-rail { position: sticky; top: 44px; display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 1023px) { .da-grid { grid-template-columns: 1fr; } .da-rail { position: static; } }
.da-sec-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.da-sec-no { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); }
.da-sec-title { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.da-sec-sub { font-size: 12.5px; color: var(--text-muted); margin-top: 3px; max-width: 680px; }
.da-form-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 640px) { .da-form-2 { grid-template-columns: 1fr; } }
.da-opt { font-weight: 400; color: var(--text-muted); }

/* source card */
.sc .da-src { border-left: 3px solid var(--lc, var(--border-strong)); }
.da-src-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.da-src-letter { width: 26px; height: 26px; border-radius: 7px; font-size: 12px; }
.sc .da-layer-sel {
    appearance: none; width: auto; height: 26px; padding: 0 22px 0 9px; border-radius: 999px;
    font: inherit; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; cursor: pointer;
    color: var(--lc, var(--text-muted)); background-color: color-mix(in srgb, var(--lc, var(--text-muted)) 11%, transparent);
    border: 1px solid color-mix(in srgb, var(--lc, var(--text-muted)) 26%, transparent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 7px center;
}
.sc .da-layer-sel:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.sc .da-layer-sel option { color: var(--text-primary); background: var(--surface); text-transform: none; }
.da-src-state { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.da-src-state.is-ok { color: var(--success); }
.da-src-state.is-warn { color: var(--warning); }
.da-src-state.is-bad { color: var(--danger); }
.da-src-body { padding: 12px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }

/* entity picker */
.da-ent { position: relative; }
.da-ent-btn {
    display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 5px 10px 5px 6px;
    text-align: left; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md);
    cursor: pointer; color: inherit; font: inherit; transition: border-color .12s ease, box-shadow .12s ease;
}
.da-ent-btn:hover { border-color: var(--border-strong); }
.da-ent-btn:focus-visible, .da-ent.is-open .da-ent-btn { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
.da-ent-btn.is-empty { border-style: dashed; color: var(--text-muted); }
.da-eng {
    flex: 0 0 auto; width: 28px; height: 28px; border-radius: 7px; display: inline-grid; place-items: center;
    font-family: var(--font-mono); font-size: 10px; font-weight: 600;
    color: var(--ec, var(--text-secondary)); background: color-mix(in srgb, var(--ec, var(--text-muted)) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--ec, var(--text-muted)) 24%, transparent);
}
.da-eng.is-none { color: var(--text-muted); background: var(--surface-subtle); border-color: var(--border); border-style: dashed; }
.da-ent-text { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.da-ent-name { font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }
.da-ent-sub { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-ent-caret { color: var(--text-muted); flex: 0 0 auto; }
.da-ent-backdrop { position: fixed; inset: 0; z-index: 39; }
.da-ent-pop { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.da-ent-search { padding: 6px; border-bottom: 1px solid var(--border); position: relative; }
.da-ent-search svg { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: var(--text-muted); }
.sc .da-ent-search .input { padding-left: 30px; height: 30px; font-size: 12.5px; }
.da-ent-list { max-height: 280px; overflow: auto; padding: 4px; }
.da-ent-group { padding: 6px 8px 2px; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.da-ent-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 8px; border: 0; background: none; border-radius: var(--radius-sm); text-align: left; cursor: pointer; color: inherit; font: inherit; }
.da-ent-item:hover:not(.is-disabled), .da-ent-item.is-active { background: var(--surface-subtle); }
.da-ent-item.is-disabled { cursor: default; }
.da-ent-item.is-disabled .da-ent-name, .da-ent-item.is-disabled .da-eng { opacity: .55; }
.da-ent-hint { font-size: 11px; color: var(--warning); white-space: nowrap; }
.sc .da-ent-hint a { color: var(--accent) !important; font-weight: 500; }
.da-ent-check { color: var(--accent); margin-left: auto; }
.da-ent-meta { font-size: 11px; color: var(--text-muted); white-space: nowrap; }
.da-ent-empty { padding: 14px 12px; font-size: 12px; color: var(--text-muted); }

/* sql editor */
.da-sqled {
    border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); overflow: hidden;
    display: grid; grid-template-columns: 40px minmax(0, 1fr); font-family: var(--font-mono); font-size: 12.5px; line-height: 20px;
    transition: border-color .12s ease, box-shadow .12s ease;
}
.da-sqled:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
.da-sqled.is-disabled { background: var(--surface-subtle); }
.da-sqled-gutter { padding: 10px 8px 10px 0; text-align: right; color: var(--text-muted); background: var(--surface-subtle); border-right: 1px solid var(--border); user-select: none; white-space: pre; font-size: 11px; }
.da-sqled textarea {
    display: block; width: 100%; border: 0; outline: none; resize: none; padding: 10px 12px; margin: 0;
    font: inherit; color: var(--text-primary); background: transparent; white-space: pre; overflow-x: auto; overflow-y: hidden; tab-size: 4;
}
.da-sqled textarea::placeholder { color: var(--text-muted); }
.da-sqled-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.da-hint { font-size: 11.5px; color: var(--text-muted); }
.da-hint code { font-family: var(--font-mono); font-size: 11px; background: var(--surface-subtle); border: 1px solid var(--border); border-radius: 4px; padding: 0 4px; }

/* preview */
.da-prev { border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; background: var(--surface-muted); }
.da-prev-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 7px 10px; border-bottom: 1px solid var(--border); font-size: 12px; color: var(--text-secondary); }
.da-prev-head b { font-weight: 600; color: var(--text-primary); }
.da-prev-cols { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.da-col-chip { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-mono); font-size: 10.5px; padding: 1px 6px; border-radius: var(--radius-sm); background: var(--surface-subtle); color: var(--text-secondary); border: 1px solid var(--border); }
.da-col-chip i { font-style: normal; color: var(--text-muted); }
.da-col-chip.is-key { background: var(--accent-subtle); color: var(--accent); border-color: var(--accent-border); }
.da-prev-table-wrap { overflow-x: auto; }
.da-prev-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); font-size: 11.5px; }
.da-prev-table th { text-align: left; padding: 4px 10px; border-bottom: 1px solid var(--border); color: var(--text-muted); white-space: nowrap; font-weight: 500; background: var(--surface-subtle); }
.da-prev-table td { padding: 3px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.da-prev-table tr:last-child td { border-bottom: 0; }
.da-prev-empty { padding: 14px 12px; font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 8px; }
.da-prev-err { padding: 10px 12px; font-size: 12px; color: var(--danger); background: var(--danger-subtle); display: flex; align-items: flex-start; gap: 8px; white-space: pre-wrap; word-break: break-word; }
.da-prev-err svg { margin-top: 2px; }

/* add source */
.da-add-src {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 12px;
    border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); background: transparent; color: var(--text-secondary);
    font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.da-add-src:hover:not(:disabled) { background: var(--surface-subtle); border-color: var(--accent); color: var(--text-primary); }
.da-add-src:disabled { opacity: .5; cursor: not-allowed; }
.da-add-src small { color: var(--text-muted); font-weight: 400; }

/* mapping grid */
.da-map-wrap { overflow-x: auto; }
.da-map-table { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 560px; }
.da-map-table th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); padding: 8px 10px; border-bottom: 1px solid var(--border); background: var(--surface-subtle); white-space: nowrap; }
.da-map-table th .da-letter { width: 20px; height: 20px; font-size: 10.5px; margin-right: 6px; vertical-align: middle; }
.da-map-th-ent { font-weight: 400; letter-spacing: 0; text-transform: none; }
.da-map-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.da-map-table tr:last-child td { border-bottom: 0; }
.da-map-role { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.da-role-tag { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); padding: 1px 6px; border-radius: 4px; border: 1px solid var(--border); background: var(--surface-subtle); }
.da-role-tag.is-key { color: var(--accent); border-color: var(--accent-border); background: var(--accent-subtle); }
.sc .da-map-table .input { font-family: var(--font-mono); font-size: 12.5px; width: 120px; }
.da-map-cell { display: flex; align-items: center; gap: 6px; }
.sc .da-map-cell .select { font-family: var(--font-mono); font-size: 12px; height: 30px; min-width: 120px; }
.sc .da-map-cell .select.is-renamed { border-color: color-mix(in srgb, var(--warning) 45%, var(--border)); }
.sc .da-map-cell .select.is-missing { border-color: var(--danger-border); color: var(--danger); }
.da-mark { flex: 0 0 auto; width: 14px; display: inline-grid; place-items: center; }
.da-mark.ok { color: var(--success); }
.da-mark.warn { color: var(--warning); }
.da-mark.bad { color: var(--danger); }
.da-map-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; border-top: 1px solid var(--border); font-size: 12px; color: var(--text-muted); }
.da-legend-item { display: inline-flex; align-items: center; gap: 5px; }
.da-icon-btn { width: 26px; height: 26px; border: 0; background: none; border-radius: 6px; color: var(--text-muted); display: inline-grid; place-items: center; cursor: pointer; }
.da-icon-btn:hover:not(:disabled) { background: var(--danger-subtle); color: var(--danger); }
.da-icon-btn:disabled { opacity: .35; cursor: not-allowed; }

/* freshness checks (inside a source card) */
.da-fresh { border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-muted); overflow: hidden; }
.da-fresh.is-empty { border-style: dashed; background: transparent; }
.da-fresh-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 9px 10px; }
.da-fresh-ico { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 7px; display: inline-grid; place-items: center;
    color: var(--serious); background: color-mix(in srgb, var(--serious) 11%, transparent); }
.da-fresh.is-empty .da-fresh-ico { color: var(--text-muted); background: var(--surface-subtle); }
.da-fresh-title { min-width: 0; flex: 1 1 260px; font-size: 12.5px; }
.da-fresh-title b { font-weight: 600; color: var(--text-primary); margin-right: 4px; }
.da-fresh-sub { font-size: 11.5px; color: var(--text-muted); margin-top: 1px; }
.sc .da-fresh-head .select { width: auto; max-width: 260px; height: 30px; font-size: 12px; }
.da-fresh-labels, .da-fresh-row {
    display: grid; grid-template-columns: minmax(150px, 1.6fr) minmax(120px, 1fr) 104px auto 26px; gap: 8px; align-items: center;
}
.da-fresh-labels { padding: 6px 10px 4px; border-top: 1px solid var(--border); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); background: var(--surface); }
.da-fresh-item { border-top: 1px solid var(--border); background: var(--surface); box-shadow: inset 3px 0 0 transparent; transition: box-shadow .12s ease; }
.da-fresh-labels + .da-fresh-item { border-top: 0; }
.da-fresh-item.is-ok { box-shadow: inset 3px 0 0 var(--success); }
.da-fresh-item.is-stale { box-shadow: inset 3px 0 0 var(--serious); }
.da-fresh-item.is-error { box-shadow: inset 3px 0 0 var(--danger); }
.da-fresh-row { padding: 7px 10px; }
.sc .da-fresh-row .input { height: 30px; font-size: 12px; font-family: var(--font-mono); }
.da-fresh-age .da-tol-group { width: 100%; }
.sc .da-fresh-age .input { width: 100%; min-width: 0; text-align: right; }
.da-fresh-age .da-tol-unit { height: 30px; }
.sc .da-fresh-check { white-space: nowrap; }
.da-fresh-result { display: flex; align-items: flex-start; gap: 7px; padding: 0 10px 8px 13px; font-size: 12px; line-height: 1.45; color: var(--text-secondary); word-break: break-word; }
.da-fresh-result svg { margin-top: 2px; flex: 0 0 auto; }
.da-fresh-result b { font-weight: 600; }
.da-fresh-item.is-ok .da-fresh-result svg, .da-fresh-item.is-ok .da-fresh-result b { color: var(--success); }
.da-fresh-item.is-stale .da-fresh-result svg, .da-fresh-item.is-stale .da-fresh-result b { color: var(--serious); }
.da-fresh-item.is-error .da-fresh-result { color: var(--danger); }
@media (max-width: 760px) {
    .da-fresh-labels { display: none; }
    .da-fresh-row { grid-template-columns: 1fr 1fr; }
    .da-fresh-row .da-fresh-age { grid-column: 1 / 2; }
}

/* freshness table (run report) */
.da-fresh-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.da-fresh-table th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); padding: 8px 12px; border-bottom: 1px solid var(--border); background: var(--surface-subtle); white-space: nowrap; }
.da-fresh-table td { padding: 8px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.da-fresh-table tr:last-child td { border-bottom: 0; }
.da-fresh-table td.n, .da-fresh-table th.n { text-align: right; font-variant-numeric: tabular-nums; }
.da-fresh-table tr.is-stale td { background: color-mix(in srgb, var(--serious) 6%, transparent); }
.da-banner-stale { color: var(--text-secondary); background: var(--serious-subtle); border-color: var(--serious-border); }
.da-banner-stale svg { color: var(--serious); }
.sc .badge-serious { --bh: var(--serious); }

/* comparisons */
.da-cmp-presets { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.da-cmp-presets-label { font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.da-cmp-presets .dl-seg { flex-wrap: wrap; max-width: 100%; }
.da-seg-note { color: var(--text-muted); font-weight: 400; }
.da-cmp-list { display: flex; flex-direction: column; container-type: inline-size; }
.da-cmp-row { display: grid; grid-template-columns: 18px minmax(150px, 1fr) auto minmax(150px, 1fr) auto; gap: 8px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.da-cmp-row:last-child { border-bottom: 0; }
.da-cmp-no { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); }
.da-cmp-side { position: relative; }
.sc .da-cmp-side .select { padding-left: 34px; height: 36px; font-weight: 500; }
.da-cmp-side .da-letter { position: absolute; left: 6px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.da-cmp-swap { width: 34px; height: 34px; border: 1px solid var(--border); background: var(--surface); border-radius: 999px; color: var(--text-muted); display: inline-grid; place-items: center; cursor: pointer; }
.da-cmp-swap:hover { color: var(--text-primary); background: var(--surface-subtle); }
.da-cmp-tolwrap { display: inline-flex; align-items: center; gap: 6px; }
.da-cmp-tol { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.da-tol-btn { font: inherit; font-size: 12px; color: var(--text-secondary); background: var(--surface-subtle); border: 1px solid var(--border); border-radius: 999px; padding: 3px 9px; cursor: pointer; white-space: nowrap; }
.da-tol-btn:hover { color: var(--text-primary); border-color: var(--border-strong); }
.da-tol-btn.is-custom { color: var(--accent); background: var(--accent-subtle); border-color: var(--accent-border); }
.sc .da-cmp-tol .input { width: 76px; height: 30px; font-size: 12px; font-family: var(--font-mono); padding: 0 8px; }
.da-cmp-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-top: 1px solid var(--border); }
.da-cmp-hint { font-size: 12px; color: var(--text-muted); }
.da-cmp-empty { padding: 18px 14px; font-size: 12.5px; color: var(--text-muted); text-align: center; }
.da-tol-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; }
.da-tol-row .da-or { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.da-tol-group { display: inline-flex; align-items: center; }
.sc .da-tol-group .input { width: 96px; font-family: var(--font-mono); border-radius: var(--radius-md) 0 0 var(--radius-md); }
.da-tol-unit { display: inline-flex; align-items: center; height: 34px; padding: 0 9px; border: 1px solid var(--border); border-left: 0; border-radius: 0 var(--radius-md) var(--radius-md) 0; background: var(--surface-subtle); color: var(--text-muted); font-size: 12px; }
@container (max-width: 760px) {
    .da-cmp-row { grid-template-columns: 24px 1fr; grid-template-areas: "no a" "swap b" "tol tol"; row-gap: 6px; }
    .da-cmp-row .da-cmp-no { grid-area: no; }
    .da-cmp-row .da-cmp-a { grid-area: a; }
    .da-cmp-row .da-cmp-swap { grid-area: swap; justify-self: center; width: 28px; height: 28px; }
    .da-cmp-row .da-cmp-b { grid-area: b; }
    .da-cmp-row .da-cmp-tolwrap { grid-area: tol; display: flex; justify-content: flex-end; margin-top: 2px; }
}

/* schedule */
.da-sched-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 640px) { .da-sched-grid { grid-template-columns: 1fr; } }
.da-inline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sc .da-inline .select, .sc .da-inline .input { width: auto; min-width: 120px; }
.sc .da-switch-row { background: none; border: 0; color: inherit; font: inherit; text-align: left; }

/* summary rail */
.da-kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; font-size: 12.5px; margin: 0; }
.da-kv dt { color: var(--text-muted); white-space: nowrap; font-weight: 400; }
.da-kv dd { margin: 0; color: var(--text-primary); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.da-kv dd code { font-family: var(--font-mono); font-size: 11.5px; color: inherit; }
.da-chk { display: flex; flex-direction: column; gap: 6px; }
.da-chk-item { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; color: var(--text-secondary); line-height: 1.4; }
.da-chk-item svg { margin-top: 2px; flex: 0 0 auto; }
.da-chk-item.ok svg { color: var(--success); }
.da-chk-item.warn { color: var(--warning); }
.da-chk-item.bad { color: var(--danger); }
.da-rail-actions { display: flex; flex-direction: column; gap: 8px; }
.da-rail-actions .btn { width: 100%; }
.da-rail-note { font-size: 12px; color: var(--text-muted); line-height: 1.5; }

/* --------------------------------------------------------------------------------------------- result */
.da-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
@media (max-width: 1023px) { .da-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .da-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.da-kpi { padding: 12px 14px; }
.da-kpi-label { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.da-kpi-value { font-size: 22px; font-weight: 650; letter-spacing: -.01em; margin-top: 4px; font-variant-numeric: tabular-nums; display: flex; align-items: center; gap: 8px; }
.da-kpi-value.is-danger { color: var(--danger); }
.da-kpi-value.is-success { color: var(--success); }
.da-kpi-value.is-warning { color: var(--warning); }
.da-kpi-value.is-stale { color: var(--serious); }
.da-kpi-sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.da-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
@media (max-width: 900px) { .da-cards { grid-template-columns: 1fr; } }
.sc .da-cc { cursor: pointer; transition: border-color .12s ease, box-shadow .12s ease; }
.sc .da-cc:hover { border-color: var(--border-strong); }
.sc .da-cc.is-selected { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-subtle); }
.da-cc-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.da-cc-title { font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.da-cc-title .da-letter { width: 20px; height: 20px; font-size: 10.5px; }
.da-cc-vs { color: var(--text-muted); font-weight: 400; }
.da-cc-body { padding: 10px 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.da-cc-k { font-size: 11px; color: var(--text-muted); }
.da-cc-v { font-family: var(--font-mono); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.da-cc-v.is-danger { color: var(--danger); }
.da-cc-v.is-success { color: var(--success); }
.da-cc-foot { padding: 8px 12px; border-top: 1px solid var(--border); font-size: 12px; color: var(--text-muted); display: flex; gap: 10px; flex-wrap: wrap; }

.da-res-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.da-card-sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.da-chart { padding: 8px 12px 6px; }
.da-chart svg { width: 100%; height: auto; display: block; }
.da-ch-axis { stroke: var(--border); stroke-width: 1; }
.da-ch-zero { stroke: var(--border-strong); stroke-width: 1; }
.da-ch-lbl { font-family: var(--font-mono); font-size: 10px; fill: var(--text-muted); }
.da-ch-bar { fill: var(--text-muted); opacity: .55; }
.da-ch-bar.is-fail { fill: var(--danger); opacity: 1; }
.da-ch-bar:hover { opacity: 1; }
.da-ch-miss { fill: none; stroke: var(--warning); stroke-width: 1.5; }
.da-ch-band { fill: color-mix(in srgb, var(--success) 10%, transparent); }
.da-ch-legend { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; font-size: 11.5px; color: var(--text-muted); padding: 0 12px 10px; }
.da-ch-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; vertical-align: -1px; margin-right: 5px; }

.da-rec-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.da-rec-wrap { overflow-x: auto; }
.da-rec { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; font-size: 12.5px; }
.da-rec th { position: sticky; top: 0; text-align: right; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); padding: 8px 10px; border-bottom: 1px solid var(--border); background: var(--surface-subtle); white-space: nowrap; }
.da-rec th:first-child, .da-rec td:first-child, .da-rec th.da-key, .da-rec td.da-key { text-align: left; }
.da-rec th .da-letter { width: 18px; height: 18px; font-size: 10px; margin-right: 5px; vertical-align: middle; }
.da-rec th.grp, .da-rec td.grp { border-left: 1px solid var(--border); }
.da-rec td { padding: 7px 10px; border-bottom: 1px solid var(--border); text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.da-rec tr:last-child td { border-bottom: 0; }
.da-rec tr.is-mismatch td { background: color-mix(in srgb, var(--danger) 5%, transparent); }
.da-rec tr.is-missing td { background: color-mix(in srgb, var(--warning) 6%, transparent); }
.da-rec td.diff-bad { color: var(--danger); font-weight: 500; }
.da-rec td.diff-ok { color: var(--text-muted); }
.da-rec td.cell-miss { color: var(--warning); font-family: var(--font-body); font-size: 11.5px; font-weight: 500; }
.da-rec td.st, .da-rec th.st { text-align: left; font-family: var(--font-body); }
.da-rec-pct { color: var(--text-muted); font-size: 11px; }
.da-rec-empty { text-align: center !important; color: var(--text-muted); padding: 24px !important; font-family: var(--font-body) !important; }
.da-rec-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 14px; border-top: 1px solid var(--border); font-size: 12.5px; color: var(--text-muted); }
.da-rec-foot strong { color: var(--text-secondary); }

.da-running { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 64px 20px; text-align: center; color: var(--text-muted); }
.da-running-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }

.da-sources-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.da-sources-table td { padding: 8px 14px; border-bottom: 1px solid var(--border); vertical-align: top; }
.da-sources-table tr:last-child td { border-bottom: 0; }
.da-sources-table pre { margin: 6px 0 0; padding: 8px 10px; font-family: var(--font-mono); font-size: 11.5px; white-space: pre-wrap; background: var(--surface-subtle); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text-secondary); max-height: 220px; overflow: auto; }
.sc .da-sources-table details summary { cursor: pointer; color: var(--text-muted); font-size: 12px; }

@media (prefers-reduced-motion: reduce) { .da-spin { animation: none; } }