@import '_content/Indx.Systm.Blazor/Indx.Systm.Blazor.6mpdwk9cei.bundle.scp.css';

/* /Components/Account/Pages/Admin/Datasets.razor.rz.scp.css */
/* Documents by dataset, above the table, on the Base surface like a stat. */
.admin-datasets-docs[b-pssrlczn5p] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: calc(var(--spacing) * 2);
    margin-bottom: 24px;
    background: var(--lv2);
    border-radius: var(--radius);
}

@media (prefers-color-scheme: dark) { :where(:root:not([data-theme="light"])) .admin-datasets-docs[b-pssrlczn5p] { background: var(--lv1); } }
:where(:root[data-theme="dark"]) .admin-datasets-docs[b-pssrlczn5p] { background: var(--lv1); }

.admin-datasets-docs-head[b-pssrlczn5p] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.admin-datasets-docs-title[b-pssrlczn5p] {
    font: var(--text-xs);
    color: var(--lv5);
}

.admin-datasets-docs-total[b-pssrlczn5p] {
    font: var(--text-sm);
    font-weight: var(--med);
    color: var(--lv8);
    font-variant-numeric: tabular-nums;
}

/* Cells keep to one line, so the row height stays even and a narrow screen scrolls the table
   sideways instead of stacking every value into a tall column. ::deep: the table element is
   systm Table's. */
[b-pssrlczn5p] .admin-datasets-table th,
[b-pssrlczn5p] .admin-datasets-table td {
    white-space: nowrap;
    font-size: 13px;
}

/* The days-woken strip in a row: the calendar's cells alone, no labels, the height of the row. */
.admin-datasets-woken[b-pssrlczn5p] { display: inline-flex; vertical-align: middle; }
.admin-datasets-woken[b-pssrlczn5p]  .indx-heatmap { gap: 0; }
/* /Components/Account/Pages/Admin/Monitor.razor.rz.scp.css */
/* The instance at a glance: the stats, above the stream. */
.admin-monitor-stats[b-vkjv1gdyez] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 24px;
}

/* The rate's sparkline fills the tile's foot, the height of a line of text. */
[b-vkjv1gdyez] .admin-monitor-spark {
    display: block;
    width: 100%;
    min-width: 80px;
}


/* ::deep throughout: the table element belongs to systm Table, not to this page. */

/* Time and Source are short and fixed in shape, so they keep to one line and the width goes to
   the text. */
[b-vkjv1gdyez] .admin-monitor-table td:nth-child(1),
[b-vkjv1gdyez] .admin-monitor-table td:nth-child(2),
[b-vkjv1gdyez] .admin-monitor-table th:nth-child(1),
[b-vkjv1gdyez] .admin-monitor-table th:nth-child(2) {
    white-space: nowrap;
}

/* A log line carries dataset keys, URLs and exception names with nowhere to break, and one of
   those is what pushes a table wider than the screen. */
[b-vkjv1gdyez] .admin-monitor-table td:last-child {
    overflow-wrap: anywhere;
}

/* Three columns of log line do not fit a phone, and scrolling the frame sideways is the wrong
   answer for this table: what happened is the part you came to read and it would be the part off
   the screen. So the row becomes a block -- when and where on one line, what happened under it --
   and nothing scrolls in either direction. */
@media (max-width: 768px) {
    /* ResizableColumns writes the columns' widths together as the table's own min-width (720px,
       inline), which kept the stacked rows that wide and scrolled the frame on a phone (12 Nov
       2026). Inline needs !important to be undone; the table and its body become blocks, so a row
       is as wide as the screen. */
    [b-vkjv1gdyez] .admin-monitor-table,
    [b-vkjv1gdyez] .admin-monitor-table tbody {
        display: block;
        width: 100%;
        min-width: 0 !important;
    }

    [b-vkjv1gdyez] .admin-monitor-table thead {
        /* The stacked row labels itself, and a header naming columns that are no longer beside
           each other reads as noise. Hidden from the eye, not from a screen reader. */
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    [b-vkjv1gdyez] .admin-monitor-table tbody tr {
        display: block;
        padding: 8px 0;
        border-top: 0.5px solid var(--lv3);
    }

    [b-vkjv1gdyez] .admin-monitor-table tbody tr:last-child {
        border-bottom: 0.5px solid var(--lv3);
    }

    [b-vkjv1gdyez] .admin-monitor-table td {
        display: block;
        height: auto;
        padding: 0;
        border: 0;
    }

    /* When and where read as one caption line above the text. */
    [b-vkjv1gdyez] .admin-monitor-table td:nth-child(1),
    [b-vkjv1gdyez] .admin-monitor-table td:nth-child(2) {
        display: inline;
    }

    [b-vkjv1gdyez] .admin-monitor-table td:nth-child(2)::before {
        content: "";
        margin-left: 8px;
    }

    [b-vkjv1gdyez] .admin-monitor-table td:last-child {
        margin-top: 2px;
    }
}

/* The CPU and Memory tiles carry their pixl icon before the name, the label's companion as on a
   Tab: the same tone, the same line, under the hint's dotted underline together. */

/* A line of its own in a stat's foot, which is a wrapping row: the server's part under the
   instance's memory. */
.admin-monitor-line[b-vkjv1gdyez] {
    flex-basis: 100%;
}
/* /Components/Account/Pages/Admin/Settings.razor.rz.scp.css */
/* The section's menu is a second column beside the admin menu, built as that one is: from the
   header to the window's bottom, sticking while the section scrolls (the shell scrolls, not the
   window), its title level with the admin menu's. No hairline of its own: the admin menu's
   border is the line, and a second one stood mid-window once a wide page centred (28 Oct 2026).
   The layout reaches out over the content's
   padding on the top, left and bottom for that, and the section takes the padding back. On a
   phone the menu is the scrolling row above the section, as the admin column becomes a bar. */
.settings-layout[b-ft10gxb5nu] {
    display: flex;
    align-items: flex-start;
    margin: calc(var(--spacing) * -4) 0 calc(var(--page-gutter) * -1) calc(var(--page-gutter) * -1);
}
.settings-side[b-ft10gxb5nu] {
    width: 200px;
    flex: none;
    position: sticky;
    top: 0;
    height: calc(100vh - var(--header-height));
    overflow-y: auto;
}
/* The icons start under the header trail's icon, 50px into the column: the menu's inset and a
   micro Button's padding beside an icon. Measured, not derived: change one of those and look
   again. (39px since the column lost its 1px hairline.) */
.settings-side[b-ft10gxb5nu]  .side-menu { padding-left: 39px; }
.settings-main[b-ft10gxb5nu] {
    flex: 1;
    min-width: 0;
    max-width: calc(600px + var(--page-gutter) * 2);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: calc(var(--spacing) * 4) var(--page-gutter) var(--page-gutter);
}
.settings-main > h2[b-ft10gxb5nu] { margin: 0; }

@media (max-width: 768px) {
    .settings-layout[b-ft10gxb5nu] { flex-direction: column; align-items: stretch; margin: 0; }
    .settings-side[b-ft10gxb5nu] { width: auto; height: auto; position: static; border-bottom: 1px solid var(--lv2); overflow: visible; padding-bottom: 8px; }
    .settings-side[b-ft10gxb5nu]  .side-menu { padding-left: 0; }
    .settings-main[b-ft10gxb5nu] { padding: 16px 0 0; max-width: none; }
}

.settings-stack[b-ft10gxb5nu] { display: flex; flex-direction: column; gap: 16px; }
.settings-head[b-ft10gxb5nu] { font: var(--text-sm); font-weight: var(--med); color: var(--lv7); margin: 20px 0 0; }
.settings-note[b-ft10gxb5nu] { font: var(--text-xs); color: var(--lv4); margin: 0; }
.settings-indent[b-ft10gxb5nu] { margin: 4px 0 0 48px; }
.settings-mono[b-ft10gxb5nu] { color: var(--lv6); font-family: var(--font-mono); }
.settings-more-models[b-ft10gxb5nu] { display: flex; flex-direction: column; gap: 8px; }
.settings-more-model[b-ft10gxb5nu] { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.settings-add-model[b-ft10gxb5nu] { display: flex; align-items: flex-end; gap: 8px; }
.settings-add-model > :first-child[b-ft10gxb5nu] { flex: 1; }
.settings-try[b-ft10gxb5nu] { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }

/* The keys: one row a provider, its name, whether its key works, and the steps for it. */
.soa-keys[b-ft10gxb5nu] { display: flex; flex-direction: column; border: 1px solid var(--lv2); border-radius: var(--radius); }
.soa-key[b-ft10gxb5nu] { display: grid; grid-template-columns: 120px 1fr auto; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--lv2); }
.soa-key:last-child[b-ft10gxb5nu] { border-bottom: none; }
.soa-key-name[b-ft10gxb5nu] { font: var(--text-sm); color: var(--lv8); }
.soa-key-state[b-ft10gxb5nu] { display: flex; flex-direction: column; gap: 2px; min-width: 0; font: var(--text-xs); }
.soa-key-ok[b-ft10gxb5nu] { display: inline-flex; align-items: center; gap: 6px; color: var(--lv8); }
.soa-key-bad[b-ft10gxb5nu] { color: var(--CSignal); overflow-wrap: anywhere; }
.soa-key-dim[b-ft10gxb5nu] { color: var(--lv5); }
.soa-key-actions[b-ft10gxb5nu] { display: flex; gap: 4px; }

@media (max-width: 560px) {
    .soa-key[b-ft10gxb5nu] { grid-template-columns: 1fr auto; }
    .soa-key-state[b-ft10gxb5nu] { grid-column: 1 / -1; grid-row: 2; }
}

.settings-problem[b-ft10gxb5nu] { color: var(--CSignal); }
/* /Components/Account/Pages/Admin/Teams.razor.rz.scp.css */
.admin-teams[b-fweeg6ef1r] { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.admin-teams-count[b-fweeg6ef1r] { color: var(--lv5); font-variant-numeric: tabular-nums; margin-left: 4px; }
.admin-teams-loading[b-fweeg6ef1r] { display: flex; align-items: center; gap: 8px; color: var(--lv5); }

.admin-teams-mono[b-fweeg6ef1r] { font-family: var(--font-mono); }
.admin-teams-num[b-fweeg6ef1r] { text-align: right; font-variant-numeric: tabular-nums; }
.admin-teams-faint[b-fweeg6ef1r] { font: var(--text-xs); color: var(--lv5); white-space: nowrap; }

/* Worth a look, and the members, datasets and keys of an opened team: a titled column of lines. */
.admin-teams-block[b-fweeg6ef1r] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.admin-teams-block-title[b-fweeg6ef1r] { display: inline-flex; align-items: center; gap: 6px; font: var(--text-xs); font-weight: var(--med); color: var(--lv7); margin-bottom: 4px; }
.admin-teams-findings-list[b-fweeg6ef1r] { padding: 0 12px 8px; }
.admin-teams-findings-list .admin-teams-finding:last-child[b-fweeg6ef1r] { border-bottom: 0; }
.admin-teams-findings-summary[b-fweeg6ef1r] { display: inline-flex; align-items: center; gap: 8px; }
.admin-teams-findings-summary[b-fweeg6ef1r]  svg { flex: none; }
.admin-teams-finding[b-fweeg6ef1r] { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 0.5px solid var(--lv2); font: var(--text-sm); color: var(--lv7); }
.admin-teams-finding .admin-teams-mono[b-fweeg6ef1r] { color: var(--lv8); }
.admin-teams-finding-text[b-fweeg6ef1r] { color: var(--lv6); }


/* Cells keep to one line; a narrow screen scrolls the table sideways. ::deep: the table is systm Table's. */
[b-fweeg6ef1r] .admin-teams-table th,
[b-fweeg6ef1r] .admin-teams-table td { white-space: nowrap; font-size: 13px; }

/* A row opens in place, as a record does in Records: the whole row is the target. */
.admin-teams-row[b-fweeg6ef1r] { cursor: pointer; }
.admin-teams-row:hover > td[b-fweeg6ef1r], .admin-teams-row:focus-visible > td[b-fweeg6ef1r] { background: var(--lv1); }
.admin-teams-row:focus-visible[b-fweeg6ef1r] { outline: none; }
.admin-teams-row--open > td[b-fweeg6ef1r], .admin-teams-row--open:hover > td[b-fweeg6ef1r] { background: var(--lv2); }
.admin-teams-name[b-fweeg6ef1r] { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); color: var(--lv7); }
.admin-teams-name[b-fweeg6ef1r]  svg { flex: none; }
.admin-teams-activity[b-fweeg6ef1r] { display: inline-flex; align-items: center; gap: 10px; }
.admin-teams-activity .admin-teams-num[b-fweeg6ef1r] { min-width: 56px; font: var(--text-xs); color: var(--lv7); }

[b-fweeg6ef1r] .admin-teams-table .admin-teams-expanded > td { background: var(--lv1); padding: 8px 12px 12px; white-space: normal; cursor: default; }
.admin-teams-expanded-body[b-fweeg6ef1r] { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) minmax(0, 2fr); gap: 24px; }
@media (max-width: 900px) { .admin-teams-expanded-body[b-fweeg6ef1r] { grid-template-columns: minmax(0, 1fr); } }
.admin-teams-line[b-fweeg6ef1r] { display: flex; align-items: center; gap: 10px; padding: 4px 0; border-bottom: 0.5px solid var(--lv2); font: var(--text-xs); color: var(--lv7); }
.admin-teams-line .admin-teams-num[b-fweeg6ef1r] { color: var(--lv6); }
.admin-teams-line-main[b-fweeg6ef1r] { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Managing an opened team's members. */
.admin-teams-add[b-fweeg6ef1r] { margin-left: auto; }
.admin-teams-role[b-fweeg6ef1r] { width: 110px; flex: none; }
/* /Components/Account/Pages/ApiKey.razor.rz.scp.css */
/* API keys. One column, as wide as the page like every console page: the table needs the room (it
   scrolled sideways inside an 880px cap with the window half empty, Nov 2026). The text keeps its
   own reading width below. Sections spaced by the shared heading rhythm, no borders or shadows. */
.key-page[b-q7ihpwfoyw] { min-width: 0; }
.key-intro[b-q7ihpwfoyw] { color: var(--lv5); font: var(--text-sm); max-width: 640px; margin-bottom: calc(var(--spacing) * 6); }
.key-muted[b-q7ihpwfoyw] { color: var(--lv5); }
.key-suffix[b-q7ihpwfoyw] { margin-left: 8px; color: var(--lv5); font: 12px var(--font-mono); }
.key-expired[b-q7ihpwfoyw] { color: var(--CSignal); }

[b-q7ihpwfoyw] .key-reveal { margin-bottom: calc(var(--spacing) * 4); }
.key-reveal-scope[b-q7ihpwfoyw] { display: block; margin-bottom: 8px; }
.key-token[b-q7ihpwfoyw] {
    display: block;
    padding: 10px 12px;
    background: var(--lv0);
    border-radius: var(--radius);
    font: 12px/1.5 var(--font-mono);
    color: var(--lv8);
    overflow-wrap: anywhere;
    user-select: all;
}
.key-reveal-actions[b-q7ihpwfoyw] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }

/* The frame is systm Table's, with ResizableColumns: every cell keeps to one line, and the access
   description, the longest, fills what the others leave. */
.key-scope[b-q7ihpwfoyw] { color: var(--lv6); }
.key-actions[b-q7ihpwfoyw] { text-align: right; white-space: nowrap; }
/* Show key and Revoke side by side, at the right: ConfirmButton renders a block of its own. */
.key-row-actions[b-q7ihpwfoyw] { display: flex; gap: 4px; align-items: center; justify-content: flex-end; }
[b-q7ihpwfoyw] .key-legacy { margin-top: calc(var(--spacing) * 3); }

.key-form[b-q7ihpwfoyw] { display: flex; flex-direction: column; gap: 18px; }
.key-field[b-q7ihpwfoyw] { display: flex; flex-direction: column; gap: 6px; }
.key-label[b-q7ihpwfoyw] { font: var(--text-xs); color: var(--lv6); }
.key-help[b-q7ihpwfoyw] { margin: 0; font: var(--text-xs); color: var(--lv5); }
.key-radios[b-q7ihpwfoyw] { display: flex; gap: 20px; flex-wrap: wrap; }
.key-datasets[b-q7ihpwfoyw] { display: flex; flex-direction: column; gap: 6px; padding: 8px 0 0 2px; }

.key-code[b-q7ihpwfoyw] {
    margin: 0 0 calc(var(--spacing) * 3);
    padding: 14px 16px;
    background: var(--lv1);
    border-radius: var(--radius);
    font: 12px/1.6 var(--font-mono);
    overflow-x: auto;
}
/* /Components/Account/Pages/License.razor.rz.scp.css */
/* License, drawn as the license portal draws its half: the license on the left, how it reaches this
   server on the right, cards a surface a step up with no border and no shadow. ::deep reaches into
   systm components; .license-page is this page's own element above them. */
.license-head[b-uavug4vydj] { display: flex; flex-direction: column; gap: 4px; margin-bottom: 32px; }
.license-head h2[b-uavug4vydj] { margin: 0; }
.license-head p[b-uavug4vydj] { margin: 0; color: var(--lv5); }
.license-loading[b-uavug4vydj] { display: flex; align-items: center; gap: 8px; color: var(--lv5); }

.license-page[b-uavug4vydj] { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.license-columns[b-uavug4vydj] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: start; }
@media (max-width: 860px) { .license-columns[b-uavug4vydj] { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
.license-column[b-uavug4vydj] { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.license-column h3[b-uavug4vydj], .license-card h3[b-uavug4vydj] { margin: 0; font: var(--text-base); color: var(--lv8); }

.license-card[b-uavug4vydj] { background: var(--lv1); border-radius: var(--radius); padding: 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.license-text[b-uavug4vydj] { font: var(--text-sm); color: var(--lv5); margin: 0; line-height: 1.5; }
.license-faint[b-uavug4vydj] { font: var(--text-xs); color: var(--lv5); margin: 0; }
.license-mono[b-uavug4vydj] { font-family: var(--font-mono); }
.license-code[b-uavug4vydj] { font-family: var(--font-mono); white-space: nowrap; }
.license-inline[b-uavug4vydj] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

.license-facts[b-uavug4vydj] { display: grid; grid-template-columns: 110px 1fr; gap: 8px 16px; align-items: center; font: var(--text-sm); color: var(--lv7); }

/* The datasets the limit cuts: the name, then how much of it is searched. */
.license-over[b-uavug4vydj] { display: flex; flex-direction: column; gap: 10px; }
.license-over-row[b-uavug4vydj] { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; align-items: center; font: var(--text-sm); color: var(--lv7); }

.license-links[b-uavug4vydj] { display: flex; flex-direction: column; }
.license-link[b-uavug4vydj] { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--lv2); color: var(--lv7); font: var(--text-sm); text-decoration: none; }
.license-link span[b-uavug4vydj] { flex: 1; }
.license-link:hover[b-uavug4vydj] { color: var(--lv8); }

.license-connected[b-uavug4vydj] { display: flex; align-items: flex-start; gap: 10px; font: var(--text-sm); color: var(--lv8); }
.license-tick[b-uavug4vydj] { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--lv8); color: var(--lv0); display: inline-flex; align-items: center; justify-content: center; }
.license-connected-text[b-uavug4vydj] { display: flex; flex-direction: column; gap: 2px; }

.license-actions[b-uavug4vydj] { text-align: right; width: 1%; white-space: nowrap; }
.license-page[b-uavug4vydj]  .license-files td, .license-page[b-uavug4vydj]  .license-files th { font-size: 13px; }
/* /Components/Account/Pages/Manage/Index.razor.rz.scp.css */
/* Display: a label column and the controls, each control as wide as its content. */
.appearance-rows[b-ruou7xp3pi] { display: grid; grid-template-columns: 90px auto; justify-content: start; align-items: center; gap: 12px 16px; }
.appearance-label[b-ruou7xp3pi] { font: var(--text-sm); color: var(--lv5); }
/* /Components/Datasets/CategoriesTab.razor.rz.scp.css */
.browse-tab[b-fwkw9k23qu] { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }

.browse-toolbar[b-fwkw9k23qu] { align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 0; padding: 8px 12px; border-bottom: 1px solid var(--lv2); flex: none; }
.browse-label[b-fwkw9k23qu] { color: var(--lv5); font: var(--text-xs); white-space: nowrap; }
.browse-count[b-fwkw9k23qu] { color: var(--lv5); font: var(--text-xs); white-space: nowrap; }
.browse-tb-filter[b-fwkw9k23qu] { flex: 1 1 160px; max-width: 320px; }
.browse-tb-controls[b-fwkw9k23qu] { margin-left: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.browse-tb-full[b-fwkw9k23qu] { display: inline-flex; }

/* What the tree is drawn from: a ghost button and a systm Popover under it, each picker a row of
   its own. */
.browse-tb-source[b-fwkw9k23qu] { display: inline-flex; }
.browse-tb-source[b-fwkw9k23qu]  .browse-source-menu {
    width: 300px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.browse-source-row[b-fwkw9k23qu] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }

/* Narrow (the frame, not the window: it is a container): the filter across the first row with the
   full screen step, the controls across the second; the count goes. The canvas's zoom controls
   move to the top, out of the way of the chosen category's panel, which comes up from the bottom here. */
.browse-frame[b-fwkw9k23qu] { container-type: inline-size; }
@container (max-width: 720px) {
    .browse-tb-filter[b-fwkw9k23qu] { flex: 1 1 0; max-width: none; }
    .browse-tb-controls[b-fwkw9k23qu] { order: 3; flex-basis: 100%; margin-left: 0; gap: 8px; }
    .browse-count[b-fwkw9k23qu] { display: none; }
    .browse-stage[b-fwkw9k23qu]  .indx-tree-controls { bottom: auto; top: 12px; }
}

.browse-note[b-fwkw9k23qu] { color: var(--lv5); font: var(--text-sm); margin: 0; }

/* The frame: one bordered room as tall as the window leaves, the toolbar its top row and the
   canvas the rest, scrolling inside; the chosen category's panel floats over its right edge. */
.browse-frame[b-fwkw9k23qu] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-height) - 64px);
    min-height: 420px;
    border: 1px solid var(--lv2);
    background: var(--lv0);
}
/* In the browser's full screen the frame is the screen: the same room, border and all. */
.browse-frame:fullscreen[b-fwkw9k23qu] {
    height: 100vh;
    min-height: 0;
    border: none;
}
.browse-pad[b-fwkw9k23qu] { padding: 16px; }
.browse-stage[b-fwkw9k23qu] { position: relative; flex: 1; min-height: 0; }
/* The board fills the stage and pans inside it; the list scrolls. */
.browse-stage[b-fwkw9k23qu]  .indx-tree-canvas,
.browse-stage[b-fwkw9k23qu]  .indx-tree-list-wrap {
    height: 100%;
    border: none;
}
.browse-stage[b-fwkw9k23qu]  .indx-tree-list-wrap { overflow: auto; }

[b-fwkw9k23qu] .browse-panel {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 340px;
    max-height: calc(100% - 24px);
    overflow: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.browse-panel-head[b-fwkw9k23qu] { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.browse-panel-title[b-fwkw9k23qu] { font: var(--text-lg); color: var(--lv8); }
.browse-panel-path[b-fwkw9k23qu] { font: var(--text-xs); color: var(--lv5); margin-top: 2px; word-break: break-word; }
.browse-stats[b-fwkw9k23qu] { display: flex; gap: 16px; flex-wrap: wrap; }
.browse-figures[b-fwkw9k23qu] { display: flex; flex-direction: column; gap: 4px; }
.browse-figure[b-fwkw9k23qu] { display: inline-flex; align-items: center; gap: 6px; font: var(--text-xs); color: var(--lv5); }
.browse-actions[b-fwkw9k23qu] { display: flex; gap: 8px; }
.browse-products-title[b-fwkw9k23qu] { font: var(--text-xs); color: var(--lv5); text-transform: uppercase; letter-spacing: 0.05em; }
.browse-products[b-fwkw9k23qu] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.browse-product[b-fwkw9k23qu] { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--lv2); font: var(--text-sm); }
.browse-product-title[b-fwkw9k23qu] { color: var(--lv7); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.browse-product-key[b-fwkw9k23qu] { color: var(--lv4); font: var(--text-xs); font-family: var(--font-mono); flex: none; }

@container (max-width: 720px) {
    [b-fwkw9k23qu] .browse-panel { left: 12px; width: auto; top: auto; bottom: 12px; max-height: 60%; }
}

/* The empty state, in the datasets page's first-visit shape: a large icon, a line, a detail,
   then the two shapes the tree reads, each with the tree it makes. */
.browse-empty[b-fwkw9k23qu] { margin: 0 auto; max-width: 1040px; }
.browse-empty-shapes[b-fwkw9k23qu] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.browse-empty-shape[b-fwkw9k23qu] { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; background: var(--lv1); border-radius: var(--radius); min-width: 0; }
.browse-empty-shape-title[b-fwkw9k23qu] { margin: 0; font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.browse-empty-shape-text[b-fwkw9k23qu] { margin: 0; font: var(--text-sm); line-height: 1.55; color: var(--lv6); }
.browse-empty-code[b-fwkw9k23qu] { margin: 4px 0 0; padding: 10px 12px; font-family: var(--font-mono); font-size: 11px; line-height: 1.5; color: var(--lv7); background: var(--lv0); border-radius: var(--radius); white-space: pre-wrap; word-break: break-word; }
.browse-empty-tree[b-fwkw9k23qu] { margin-top: 4px; }
.browse-empty-tree[b-fwkw9k23qu]  .indx-tree-canvas { background: var(--lv0); max-height: 260px; }
.browse-empty-actions[b-fwkw9k23qu] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 20px 0 8px; justify-content: center; }
.browse-empty-hint[b-fwkw9k23qu] { font: var(--text-xs); color: var(--lv5); }
@media (max-width: 720px) { .browse-empty-shapes[b-fwkw9k23qu] { grid-template-columns: minmax(0, 1fr); } }
/* /Components/Datasets/DataCheckModal.razor.rz.scp.css */
/* Wide enough for the report's table; the host is how a page's scoped rule reaches the dialog
   (FieldProfileManagerModal does the same). */
.data-check-host[b-pg8mc4elej]  .data-check-modal { max-width: 640px; width: 94vw; gap: 14px; }
.data-check-text[b-pg8mc4elej] { margin: 0; font: var(--text-sm); color: var(--lv7); }
.data-check-when[b-pg8mc4elej] { margin: 0; font: var(--text-sm); color: var(--lv5); }
.data-check-outdated[b-pg8mc4elej] { color: var(--lv8); font-weight: var(--med); }
.data-check-faint[b-pg8mc4elej] { margin: 0; font: var(--text-xs); color: var(--lv5); }
.data-check-error[b-pg8mc4elej] { margin: 0; font: var(--text-sm); color: var(--CSignal); }
.data-check-progress[b-pg8mc4elej] { display: flex; flex-direction: column; gap: 10px; }
.data-check-progress-line[b-pg8mc4elej] { display: flex; justify-content: space-between; font: var(--text-sm); color: var(--lv7); font-variant-numeric: tabular-nums; }
.data-check-pct[b-pg8mc4elej] { color: var(--lv8); font-weight: var(--med); }
.data-check-section[b-pg8mc4elej] { display: flex; flex-direction: column; gap: 6px; }
.data-check-section-head[b-pg8mc4elej] { display: flex; flex-direction: column; gap: 2px; }
.data-check-finding[b-pg8mc4elej] { display: flex; align-items: flex-start; gap: 12px; }
.data-check-finding-text[b-pg8mc4elej] { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.data-check-finding-head[b-pg8mc4elej] { font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.data-check-field[b-pg8mc4elej] { overflow-wrap: anywhere; }
.data-check-num[b-pg8mc4elej] { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.data-check-share[b-pg8mc4elej] { color: var(--lv5); }
.data-check-action[b-pg8mc4elej] { width: 1%; white-space: nowrap; }
.data-check-sr[b-pg8mc4elej] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.data-check-clear[b-pg8mc4elej] { margin-left: auto; }
/* /Components/Datasets/DatasetAlerts.razor.rz.scp.css */
.indx-dataset-alerts[b-pyt37cfaq8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
}
/* /Components/Datasets/DatasetDownloadButton.razor.rz.scp.css */
.ddl[b-mc7p64gf83] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ddl-progress[b-mc7p64gf83] { display: flex; align-items: center; gap: 8px; min-width: 220px; }
.ddl-progress[b-mc7p64gf83]  .indx-progress-wrapper { width: 140px; }
.ddl-text[b-mc7p64gf83] { color: var(--lv4); font: var(--text-xs); font-variant-numeric: tabular-nums; }
/* /Components/Datasets/DatasetList.razor.rz.scp.css */
.indx-datasets-heading[b-kc1wohyo04] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: calc(var(--spacing) * 4);
}

.indx-datasets-heading h2[b-kc1wohyo04] {
    margin: 0;
}

.indx-datasets-heading-spacer[b-kc1wohyo04] { flex: 1; }

/* Narrow: the title on its own line, the actions on a row under it, so no button wraps inside itself. */
@media (max-width: 768px) {
    .indx-datasets-heading[b-kc1wohyo04] { flex-wrap: wrap; gap: 10px 8px; }
    .indx-datasets-heading h2[b-kc1wohyo04] { flex: 1 1 100%; }
    .indx-datasets-heading-spacer[b-kc1wohyo04] { display: none; }
    .indx-datasets-heading[b-kc1wohyo04]  .indx-btn { white-space: nowrap; }
}

.indx-create-error[b-kc1wohyo04] {
    color: var(--CSignal);
    margin: 0;
}

/* The guide a team sees before its first dataset: an opening in the shape of intrface's result
   messages, the three steps as cards, the skill. Centred on the page, since it is the page. */
.indx-empty-state[b-kc1wohyo04] {
    margin: 0 auto;
    max-width: 1040px;
}

/* The opening, as intrface's SearchResultsMessage: icon, title, detail, centred, with air. */

.indx-empty-steps[b-kc1wohyo04] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.indx-empty-step[b-kc1wohyo04] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px 20px;
    background: var(--lv1);
    border-radius: var(--radius);
    min-width: 0;
}

.indx-empty-step-number[b-kc1wohyo04] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--lv7);
    color: var(--lv0);
    font: var(--text-xs);
    font-weight: var(--med);
    font-variant-numeric: tabular-nums;
}

.indx-empty-step-title[b-kc1wohyo04] { margin: 2px 0 0; font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.indx-empty-step-text[b-kc1wohyo04] { margin: 0; font: var(--text-sm); line-height: 1.55; color: var(--lv6); }
.indx-empty-step-code[b-kc1wohyo04] {
    margin: 4px 0 0;
    padding: 10px 12px;
    font-family: var(--font-mono);
    font-size: 11px;
    line-height: 1.5;
    color: var(--lv6);
    background: var(--lv2);
    border-radius: var(--radius);
    overflow-x: auto;
}
.indx-empty-step-actions[b-kc1wohyo04] { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 6px; }

@media (max-width: 900px) {
    .indx-empty-steps[b-kc1wohyo04] { grid-template-columns: minmax(0, 1fr); }
}

.indx-empty-intro[b-kc1wohyo04] {
    color: var(--lv5);
    margin-bottom: 20px;
}

.indx-empty-intro--tight[b-kc1wohyo04] {
    margin-bottom: 8px;
}

.indx-empty-skill[b-kc1wohyo04] {
    margin-top: 28px;
    text-align: center;
}

/* 260px rather than 220px puts five cards on a row where six used to fit. Six left the footer too
   narrow for a state chip and a document count side by side, so they crowded each other. */
.indx-dataset-grid[b-kc1wohyo04] {
    display: grid;
    /* Wider than the old 260: the detail block below carries a label and a value on one line, and
       at 260 the longer labels wrapped. Four to a row on a laptop, five on a wide screen. */
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
}

.indx-dataset-card[b-kc1wohyo04] {
    display: flex;
    flex-direction: column;
    /* Not space-between any more. The detail block is the card's own height now, so spreading the
       parts to the edges left a gap that grew with the tallest card in the row. */
    gap: 16px;
    min-height: 260px;
    padding: 18px;
    border-radius: var(--radius);
    background: var(--lv1);
    color: inherit;
    text-decoration: none;
    font: var(--text-sm);
}

.indx-dataset-card:hover[b-kc1wohyo04] {
    background: var(--lv2);
}

.indx-dataset-card-head[b-kc1wohyo04] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: var(--lv7);
}

/* Observr's count at the head's end: the icon and the number, quiet until hovered for the title. */
.indx-dataset-card-observr[b-kc1wohyo04] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding: 1px 6px;
    border-radius: 3px;
    background: var(--lv2);
    font: var(--text-2xs);
    font-weight: var(--med);
    font-variant-numeric: tabular-nums;
    color: var(--lv7);
    flex: none;
}

.indx-dataset-card-name[b-kc1wohyo04] {
    font-weight: var(--med);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* State and count close the card, under a rule. The rule is fainter than the one the tables use
   (--lv2 against --lv3): inside a surface that is already separated by tone, it is there to group
   rather than to divide, and at --lv3 it cut the card in two. */
.indx-dataset-card-foot[b-kc1wohyo04] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: auto;              /* sits at the foot however tall the card grows */
    padding-top: 14px;
    border-top: 0.5px solid var(--lv2);
}

/* The count keeps its width and never breaks mid-number, so a long dataset state chip pushes it
   onto the next line rather than squeezing into it. */
/* Search activity: one group with the state line at the foot of the card, so the free space
   opens above it: margin-top: auto here, and none on the foot that follows. Two auto margins
   would share the space and open it between them. Left on the foot alone, the space opened between the two and the graph drifted up to the
   detail list it is not part of - the note in the mockup's css. */
.indx-dataset-card-activity[b-kc1wohyo04] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: auto;
}

/* Today's count beside the label: the number that goes with the dashed last segment. */
.indx-dataset-card-activity-today[b-kc1wohyo04] {
    color: var(--lv5);
    font-variant-numeric: tabular-nums;
}

.indx-dataset-card-activity + .indx-dataset-card-foot[b-kc1wohyo04] {
    margin-top: 0;
}

.indx-dataset-card-activity-label[b-kc1wohyo04] {
    color: var(--lv4);
    font: var(--text-xs);
}

.indx-dataset-card-count[b-kc1wohyo04] {
    color: var(--lv5);
    font: var(--text-xs);
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── The detail block ────────────────────────────────────────────────────────
   The Status tab's formatting (StatusTab.razor.css), narrowed for a card: a label column in
   --lv4 at medium weight and a fixed width, values in --lv6 beside it, one row per fact. A grid
   rather than a table because the whole card is one anchor and a table inside it is neither
   valid nor navigable.

   Its rows are optional -- a hibernated dataset has no field shape and no last-index time -- and
   the block is left out entirely while a dataset is loading, since those figures are about to
   change. */
.indx-dataset-card-detail[b-kc1wohyo04] {
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 5px 12px;
    align-items: baseline;
    font: var(--text-xs);
}

.indx-dataset-card-term[b-kc1wohyo04] {
    color: var(--lv4);
    font-weight: var(--med);
    white-space: nowrap;
}

.indx-dataset-card-value[b-kc1wohyo04] {
    color: var(--lv6);
    font-variant-numeric: tabular-nums;
}

/* ── The role chips ─────────────────────────────────────────────────────────
   The Search preview's facet chips (SearchPreviewTab.razor.css): a label and its count in one
   chip, the count set off from the label and dimmer than it. They sit in the value column beside
   "Fields", which baseline alignment keeps level with the first row of chips.
   - At most two rows: they wrap, and a third row is clipped rather than growing the card. A chip
     is its --text-xs line (11px x 1.5) plus 2px padding top and bottom.
   - Pulled left by the chip's own horizontal padding (6px), so the chip text lines up with the
     values in the rows above instead of starting 6px after them.
   Designed in the components viewer's Dataset card mockup (indx-react/apps/components). */
.indx-dataset-card-fields[b-kc1wohyo04] {
    --chip-h: calc(11px * 1.5 + 4px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    min-width: 0;
    max-height: calc(2 * var(--chip-h) + 4px);
    overflow: hidden;
    margin-left: -6px;
}

.indx-dataset-card-rolecount[b-kc1wohyo04] {
    margin-left: 6px;
    color: var(--lv5);
    font-variant-numeric: tabular-nums;
}

/* ── Moving, errored and empty ───────────────────────────────────────────────
   These replace the label/value rows rather than joining them: a dataset that is loading has no
   settled figures to report, and an errored one has exactly one thing worth saying. All span
   both columns, since none of them is a label and a value. */
.indx-dataset-card-doing[b-kc1wohyo04] {
    grid-column: 1 / -1;
    color: var(--lv5);
}

.indx-dataset-card-progress[b-kc1wohyo04] {
    grid-column: 1 / -1;
    margin-top: 6px;
}

/* Clamped rather than truncated on one line: the first line of an engine message is usually the
   kind of failure, and the second says which field or file. The Status tab has it in full. */
.indx-dataset-card-error[b-kc1wohyo04] {
    grid-column: 1 / -1;
    color: var(--lv6);
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.indx-datasets-all-hidden[b-kc1wohyo04] { margin: 0; font: var(--text-sm); color: var(--lv5); }
/* /Components/Datasets/DatasetPanel.razor.rz.scp.css */
.indx-dataset-card[b-5s0z7p7ppw] {
    margin-top: 0;
}

.indx-dataset-card-inner[b-5s0z7p7ppw] {
    position: relative;
}

/* The note above a tab a viewer reads but cannot change (ReadOnlyArea). */
.indx-readonly-note[b-5s0z7p7ppw] {
    margin-bottom: 16px;
}
/* /Components/Datasets/DatasetStatus.razor.rz.scp.css */
.indx-dataset-status[b-lvxz210z3o] {
    display: flex;
    align-items: center;
    gap: 8px;
}
.indx-dataset-chip[b-lvxz210z3o] { display: inline-flex; }

/* A phone: the chip is its icon. The label is a text node of the Chip's own, so it goes by its
   size; the icon keeps its pixel size. */
@media (max-width: 768px) {
    .indx-dataset-chip[b-lvxz210z3o]  .indx-chip { font-size: 0; gap: 0; padding: 3px 6px; }
}
/* /Components/Datasets/DatasetWakeDays.razor.rz.scp.css */
.wake-days-heading[b-sawvqw2r58] { margin-top: 24px; margin-bottom: 6px; }
.wake-days-help[b-sawvqw2r58] { font: var(--text-sm); color: var(--lv5); margin: 0 0 10px; }
/* /Components/Datasets/FieldConfigTab.razor.rz.scp.css */
.fc-error[b-2ycce5rpjx] { color: var(--CSignal); margin-top: 4px; }
/* /Components/Datasets/FieldConfigTable.razor.rz.scp.css */
.indx-fields-table[b-shcq54qb7x] {
    margin-bottom: 12px;
}

/* The frame is systm Table's: it scrolls sideways inside itself, so the table can never push
   the page wider. It is switched off only where the table is sure to fit, because a scrolling
   frame becomes the header row's sticky container and stops it from sticking to the page. Where
   that is depends on the mode, since the columns have set widths (below):
     simple    710px of columns + a field column of 300px + the page gutters  ->  1100px
     advanced 1150px of columns + a field column of 270px + the page gutters  ->  1500px
   Below those the header is static, for the same reason. */
@media (min-width: 1100px) {
    .indx-fields-table:not(.indx-fields-table--advanced)[b-shcq54qb7x]  .indx-table-scroll {
        overflow-x: visible;
    }
}

@media (min-width: 1500px) {
    .indx-fields-table--advanced[b-shcq54qb7x]  .indx-table-scroll {
        overflow-x: visible;
    }
}

@media (max-width: 1099px) {
    .indx-fields-table .indx-table thead[b-shcq54qb7x] {
        position: static;
    }
}

@media (max-width: 1499px) {
    .indx-fields-table--advanced .indx-table thead[b-shcq54qb7x] {
        position: static;
    }
}

.indx-num-input[b-shcq54qb7x] {
    width: 70px;
    padding: 10px;
    height: 30px;
    font: var(--text-xs);
    background: transparent;
    border: 1px solid var(--lv3);
    border-radius: var(--radius);
    color: var(--lv7);
    box-sizing: border-box;
}

.indx-num-input:hover[b-shcq54qb7x] {
    border-color: var(--lv5);
}

.indx-num-input:focus[b-shcq54qb7x] {
    outline: none;
    border-color: var(--lv5);
}

.indx-num-input:disabled[b-shcq54qb7x] {
    opacity: 0.5;
    cursor: not-allowed;
}

.indx-num-input[b-shcq54qb7x]::-webkit-inner-spin-button,
.indx-num-input[b-shcq54qb7x]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.indx-num-input[b-shcq54qb7x] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.indx-weight-slider[b-shcq54qb7x] {
    min-width: 110px;
}


.indx-table-check[b-shcq54qb7x] {
    text-align: center;
}

/* Every column but the first has a set width, so the first one takes whatever is left. Without
   this the automatic table layout shares the width out by content, and the whole table shifts
   whenever the rows change: toggling unused fields, typing in the filter, or a long nested name
   scrolling into the list. The widths fit the longest header (PreloadFilters) and the controls:
   a checkbox, the weight slider with its value, a number box. */
.indx-col-check[b-shcq54qb7x] {
    width: 130px;
    white-space: nowrap;
}

.indx-col-weight[b-shcq54qb7x] {
    width: 190px;
    white-space: nowrap;
}

/* Advanced mode has eleven columns after the first, so it runs tighter: less cell padding, and
   widths cut to what each header needs. 4 x 100 + 4 x 120 + 3 x 90 = 1150px, which leaves the
   field column room inside the page width. At the simple widths it came to 1370px, more than the
   page can ever give it. */
.indx-fields-table--advanced .indx-table th[b-shcq54qb7x],
.indx-fields-table--advanced .indx-table td[b-shcq54qb7x] {
    padding: 0 10px;
}

.indx-fields-table--advanced .indx-col-check[b-shcq54qb7x] {
    width: 100px;
}

.indx-fields-table--advanced .indx-col-check-wide[b-shcq54qb7x] {
    width: 120px;
}

.indx-col-num[b-shcq54qb7x] {
    width: 90px;
    white-space: nowrap;
}

/* A container row opens a group: its nested fields follow, indented. It carries no controls,
   because it holds no value of its own and every capability on it would be inert. It is styled
   like every other row on purpose; the indent under it is what shows the grouping, and a tinted
   header band would read as a section of the table rather than as a field. The class stays as a
   hook for tests and for anything that needs to find these rows. */

.indx-group-note[b-shcq54qb7x] {
    font: var(--text-xs);
    font-weight: var(--book);
    color: var(--lv4);
}

/* The parent path of a nested name ("cover.asset.metadata." before "dimensions") reads a step
   fainter than the leaf, so the part the row configures stands out and the path is there when
   needed. Same tone as .indx-cell-value, the type badge next to it. */
.indx-field-path[b-shcq54qb7x] {
    color: var(--lv5);
    font-weight: var(--book);
}

/* Column header tooltips */
.indx-th-tip[b-shcq54qb7x] {
    position: relative;
    cursor: default;
}

.indx-th-tip[b-shcq54qb7x]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--lv7);
    color: var(--lv1);
    font: var(--text-xs);
    font-weight: var(--book);
    padding: 6px 10px;
    border-radius: var(--radius);
    white-space: normal;
    width: 200px;
    z-index: 100;
    pointer-events: none;
    /* display:none when hidden, never opacity:0, for the reason spelled out at the type badge's
       panel below: an invisible box is still laid out and still counts toward the scroll frame's
       overflow. The last column's tip is 200px wide on a 90px column, so it added 44px of empty
       scroll past the table's right edge. */
    display: none;
    line-height: 1.4;
}

.indx-th-tip:hover[b-shcq54qb7x]::after {
    display: block;
}

/* The last column's tip opens leftward from the column's right edge. Centred, it would reach
   past the table while shown and give the frame a scrollbar for as long as the pointer rests. */
th:last-child .indx-th-tip[b-shcq54qb7x]::after {
    left: auto;
    right: 0;
    transform: none;
}

/* Hover panel on the type badge, showing a sample of the field's content and its flags.
   Two constraints shape it, both from sitting in a table body cell rather than in the header:

   1. It is display:none when hidden, never opacity:0. An opacity:0 box is still laid out and
      still counts toward the scroll container's overflow, which put a scrollbar on the table
      permanently without anyone hovering. That rules out a fade, and a fade is not worth a
      scrollbar.
   2. It opens to the right, centred on its row, except on the last rows where it opens upward.
      See the nth-last-child rule below for why. */
.indx-sample-tip[b-shcq54qb7x] {
    position: relative;
    cursor: help;
}

/* A real element rather than a ::after: the panel holds a value and a flag line, and a single
   attr() string cannot carry both. */
.indx-field-pop[b-shcq54qb7x] {
    display: none;
    position: absolute;
    top: 50%;
    left: calc(100% + 8px);
    transform: translateY(-50%);
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    /* lv5 rather than the lv7 the column-header tips use: this one carries sampled data and is on
       screen while reading a table, so it should sit back. No border, the tone separates it from
       the row, in keeping with the design's no-elevation rule. lv1 on lv5 clears AA in both
       themes (the scale inverts, so this stays an inverted chip either way). */
    background: var(--lv5);
    color: var(--lv1);
    padding: 7px 10px;
    border-radius: var(--radius);
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    width: 280px;
    z-index: 100;
    pointer-events: none;
}

.indx-sample-tip:hover .indx-field-pop[b-shcq54qb7x] {
    display: flex;
}

/* The panel lives in the first column, which StickyFirstColumn pins with z-index 1. A z-index on a
   positioned element makes a stacking context, so the panel's own z-index only ranks it inside its
   cell: against the next row's first cell, which is another z-index 1 painted later in document
   order, the whole cell loses and the row below covers the panel. Raising the hovered cell instead
   ranks the cells against each other, which is where the contest actually is. 3 clears the header
   cell's 2 as well, so a panel opening upward from the last rows is not clipped by the header
   either. Only while hovered, so the pinned column keeps its usual order the rest of the time. */
td:first-child:hover[b-shcq54qb7x] {
    z-index: 3;
}

/* The last rows open the panel upward instead of centring it. Below 1440px the wrap sets
   overflow-x:auto, which makes the computed overflow-y auto as well, so anything reaching past the
   final row adds scroll height and shows a scrollbar. Overflow above a scroll container's origin
   is not scrollable, so growing upward costs nothing, and the panel lands over the rows above
   rather than below the table. This replaces padding on the wrap, which worked but left a gap
   under the table whether or not anyone hovered. */
.indx-table tbody tr:nth-last-child(-n + 2) .indx-field-pop[b-shcq54qb7x] {
    top: auto;
    bottom: -6px;
    transform: none;
}

/* Capped at three lines to keep the panel a readable size. A 160-character sample would otherwise
   run to five or six lines, which reads as a wall rather than as a sample. */
.indx-field-pop-value[b-shcq54qb7x] {
    font: var(--text-sm);
    font-weight: var(--book);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* The same muted role as .indx-group-note, but a tone that works on this panel: the note sits on
   the table background where lv4 reads as secondary, while the panel's ground is lv5, and lv4 on
   lv5 is almost the same tone. lv3 is the equivalent step down from the panel's own text colour. */
.indx-field-pop-note[b-shcq54qb7x] {
    font: var(--text-xs);
    font-weight: var(--book);
    color: var(--lv3);
}

.indx-field-pop-flag[b-shcq54qb7x] {
    font: var(--text-xs);
    font-weight: var(--med);
    color: var(--lv3);
}

.indx-cell-inner[b-shcq54qb7x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding-left: calc(var(--depth, 0) * var(--indent, 18px));
}

/* The field name: systm Truncate, start side. It may shrink, but never to nothing. */
.indx-cell-inner[b-shcq54qb7x]  .indx-field-name {
    flex: 0 1 auto;
    min-width: 6ch;
}

/* Three renderings by width. Wide: the plain table. Narrower than it fits: the same table in
   a scrolling frame with the field column pinned, and that column kept modest. 768px and under:
   the table gives way to the list of rows that open, since no amount of pinning makes twelve
   columns readable on a phone. */
.indx-fields-cards[b-shcq54qb7x] {
    display: none;
}

@media (max-width: 1100px) {
    .indx-table td:first-child[b-shcq54qb7x],
    .indx-table th:first-child[b-shcq54qb7x] {
        max-width: 220px;
    }
}

@media (max-width: 768px) {
    .indx-fields-table[b-shcq54qb7x] {
        display: none;
    }

    .indx-fields-cards[b-shcq54qb7x] {
        display: flex;
        flex-direction: column;
        margin-bottom: 12px;
    }
}

/* One field. Nested fields step in a little under their container's heading. Neighbours share
   a border, so the list reads as one surface. */
.indx-field-card[b-shcq54qb7x] {
    margin-left: calc(var(--depth, 0) * 8px);
    min-width: 0;
}

.indx-field-card + .indx-field-card[b-shcq54qb7x] {
    margin-top: -0.5px;
}

.indx-field-card-heading[b-shcq54qb7x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 40px;
    padding: 0 15px;
    font: var(--text-sm);
    border: 0.5px solid var(--lv3);
    background: var(--lv1);
    min-width: 0;
}

.indx-field-card-summary[b-shcq54qb7x] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.indx-field-card-title[b-shcq54qb7x] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.indx-field-card-state[b-shcq54qb7x] {
    font: var(--text-xs);
    font-weight: var(--book);
    color: var(--lv5);
}

.indx-field-card-detail[b-shcq54qb7x] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 15px;
    font: var(--text-xs);
    font-weight: var(--book);
    color: var(--lv5);
}

/* What the hover popover shows on a wide screen, in reach of a finger here. */
.indx-field-card-sample[b-shcq54qb7x] {
    color: var(--lv6);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

/* The settings table inside an open row: the label column needs less than systm's default half,
   and the weight slider wants the room. */
.indx-field-card[b-shcq54qb7x]  .indx-table-cell-label {
    min-width: 0;
}

.indx-field-card[b-shcq54qb7x]  .indx-table td {
    padding: 0 12px;
}

.indx-field-card[b-shcq54qb7x]  .indx-weight-slider {
    min-width: 150px;
}

.indx-fields-empty[b-shcq54qb7x] {
    font: var(--text-xs);
    color: var(--lv4);
    padding: 12px 0;
}


.indx-cell-value[b-shcq54qb7x] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font: var(--text-xs);
    font-weight: var(--book);
    color: var(--lv5);
    white-space: nowrap;
}

/* A field Analyze found no value for reads a step fainter than a detected type, the same tone as
   .indx-group-note. Both say the row is real but there is nothing behind it to configure against
   yet. lv4 is the fainter of the two in both themes, since the scale inverts. */
.indx-cell-value-faint[b-shcq54qb7x] {
    color: var(--lv4);
}

/* The Profile column: the menu and the edit button beside it (Nov 2026). */
.indx-col-profile[b-shcq54qb7x] {
    width: 240px;
    min-width: 200px;
}

.indx-profile-cell[b-shcq54qb7x] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.indx-profile-cell[b-shcq54qb7x]  .indx-select-wrapper {
    flex: 1;
    min-width: 0;
}

/* The menu's button fills the column, its caret at the far end, rather than sizing to its value. */
.indx-profile-cell[b-shcq54qb7x]  .indx-select {
    width: 100%;
    justify-content: space-between;
}

/* A cell whose value is not the saved one, until Save or Cancel: the confirmed accent (blue in
   the light theme, teal in the dark), as an outline inside the cell, since the design has no shadows. */
[b-shcq54qb7x] .indx-cell-changed {
    outline: 1.5px solid var(--CConfirmed);
    outline-offset: -3px;
}
/* /Components/Datasets/FieldProfileManagerModal.razor.rz.scp.css */
/* display: contents keeps the wrapper out of the layout; it is here for the scope (::deep). */
.fpm-host[b-8o2b8jqwx4] { display: contents; }
.fpm-host[b-8o2b8jqwx4]  .fpm-modal { max-width: 1120px; width: 94vw; gap: 16px; }
.fpm[b-8o2b8jqwx4] { display: flex; flex-direction: column; gap: 16px; }

.fpm[b-8o2b8jqwx4]  .fpm-table th,
.fpm[b-8o2b8jqwx4]  .fpm-table td { height: auto; padding: 10px 14px; vertical-align: top; }
.fpm[b-8o2b8jqwx4]  .fpm-table th { white-space: nowrap; font-weight: var(--med); color: var(--lv7); vertical-align: middle; }
.fpm-head[b-8o2b8jqwx4] { display: inline-flex; align-items: center; gap: 6px; }
.fpm[b-8o2b8jqwx4]  .fpm-profile { min-width: 220px; }
.fpm-name[b-8o2b8jqwx4] { display: inline-flex; align-items: center; gap: 8px; color: var(--lv8); font-weight: var(--med); }
.fpm-about[b-8o2b8jqwx4] { display: block; font: var(--text-xs); color: var(--lv5); margin-top: 4px; line-height: 1.4; }
.fpm-with-icon[b-8o2b8jqwx4] { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--lv7); }
.fpm-plain[b-8o2b8jqwx4] { color: var(--lv5); }
.fpm-marked[b-8o2b8jqwx4] { color: var(--lv8); }
.fpm-pattern[b-8o2b8jqwx4] { font-family: var(--font-mono); font-size: 12px; white-space: nowrap; }
.fpm-fields[b-8o2b8jqwx4] { color: var(--lv7); line-height: 1.4; }
.fpm[b-8o2b8jqwx4]  .fpm-actions { width: 1%; white-space: nowrap; text-align: right; vertical-align: middle; }
.fpm-buttons[b-8o2b8jqwx4] { display: inline-flex; gap: 2px; }
.fpm[b-8o2b8jqwx4]  .fpm-row--deleting td { background: var(--lv2); }
.fpm-sr[b-8o2b8jqwx4] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.fpm-delete[b-8o2b8jqwx4] { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: var(--lv2); border-radius: var(--radius); }
.fpm-delete-text[b-8o2b8jqwx4] { margin: 0; color: var(--lv8); line-height: 1.5; }
.fpm-select[b-8o2b8jqwx4] { max-width: 280px; }
.fpm-note[b-8o2b8jqwx4] { margin: 0; font: var(--text-xs); color: var(--lv6); line-height: 1.5; }
.fpm-default[b-8o2b8jqwx4] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fpm-default-label[b-8o2b8jqwx4] { color: var(--lv7); }
/* /Components/Datasets/FieldProfileModal.razor.rz.scp.css */
/* The profile editor: the modal form's rhythm (.indx-modal-form), its groups a legend over their
   controls, the advanced part set in from the disclosure's edges. */
.fp-form[b-w55btisdgs] {
    gap: 20px;
}

.fp-group[b-w55btisdgs] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.fp-legend[b-w55btisdgs] {
    font: var(--text-sm);
    font-weight: var(--med);
    color: var(--lv7);
}

.fp-label[b-w55btisdgs] {
    font: var(--text-sm);
    color: var(--lv7);
}

.fp-row[b-w55btisdgs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.fp-hint[b-w55btisdgs] {
    margin: 0;
    font: var(--text-xs);
    color: var(--lv5);
}

/* What a weight of 0 does, with the warning icon in its own colour; the text stays in the ink. */
.fp-warning[b-w55btisdgs] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    font: var(--text-xs);
    color: var(--lv7);
}

/* The tolerance's step names under the slider: three equal columns, so the middle name sits under
   the middle mark whatever the names' widths. */
/* Each step's name under its stop: the native thumb is 18px wide, so its centre runs from 9px
   to the width less 9px; --at is the step's place, 0 to 1. The ends are aligned to the edges
   rather than centred, so they do not stick out past the track. */
.fp-steps[b-w55btisdgs] {
    position: relative;
    height: 16px;
    font: var(--text-xs);
    color: var(--lv5);
}

.fp-steps > span[b-w55btisdgs] {
    position: absolute;
    top: 0;
    left: calc(9px + (100% - 18px) * var(--at));
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.fp-steps > :first-child[b-w55btisdgs] {
    left: 0;
    transform: none;
}

.fp-steps > :last-child[b-w55btisdgs] {
    left: auto;
    right: 0;
    transform: none;
}

.fp-step-on[b-w55btisdgs] {
    color: var(--lv8);
    font-weight: var(--med);
}

.fp-advanced[b-w55btisdgs] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 12px 16px 16px;
}

/* A label with a tooltip: dotted underline and the help cursor, as .indx-stat-label--hint. */
.fp-hinted[b-w55btisdgs] {
    cursor: help;
    border-bottom: 1px dotted var(--lv3);
}

.fp-hinted:focus-visible[b-w55btisdgs] {
    outline: 2px solid var(--lv5);
    outline-offset: 2px;
}

/* Delete at the far end of the actions, after Save and Cancel. */
.fp-delete[b-w55btisdgs] {
    margin-left: auto;
}
/* /Components/Datasets/KeyFieldRow.razor.rz.scp.css */
.key-row[b-smhwcdys9c] { display: flex; align-items: center; gap: 12px; margin: 14px 0 4px; flex-wrap: wrap; }
.key-text[b-smhwcdys9c] { display: flex; flex-direction: column; gap: 2px; max-width: 480px; }
.key-title[b-smhwcdys9c] { font: var(--text-xs); font-weight: 600; color: var(--lv5); }
.key-help[b-smhwcdys9c] { font: var(--text-xs); color: var(--lv4); }
.key-help--value[b-smhwcdys9c] { color: var(--lv5); }
.key-help--narrow[b-smhwcdys9c] { max-width: 300px; }
.key-select[b-smhwcdys9c] { width: 220px; }
.key-error[b-smhwcdys9c] { font: var(--text-xs); color: var(--CSignal); max-width: 520px; }
/* /Components/Datasets/ObservrDigestButton.razor.rz.scp.css */
.opt-row[b-qi8y6glsrm] { display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.opt-muted[b-qi8y6glsrm] { font: var(--text-xs); color: var(--lv5); }
/* /Components/Datasets/OptionsTab.razor.rz.scp.css */
.opt-tab[b-6ui0xab23t] { margin-top: 0; }
.opt-narrow[b-6ui0xab23t] { max-width: 560px; }
.opt-row[b-6ui0xab23t] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.opt-row--top[b-6ui0xab23t] { margin-top: 8px; }
/* A second setting under the same heading: room between it and the control above. */
.opt-gap[b-6ui0xab23t] { margin-top: 24px; }
.opt-row--top10[b-6ui0xab23t] { margin-top: 10px; }
.opt-w80[b-6ui0xab23t] { width: 80px; }
.opt-w220[b-6ui0xab23t] { width: 220px; }
.opt-w240[b-6ui0xab23t] { width: 240px; }
.opt-tabular[b-6ui0xab23t] { font-variant-numeric: tabular-nums; }
.opt-muted[b-6ui0xab23t] { color: var(--lv4); font: var(--text-xs); }
.opt-error[b-6ui0xab23t] { color: var(--CSignal); font: var(--text-xs); margin-top: 4px; }
.opt-error--6[b-6ui0xab23t] { margin-top: 6px; }
.opt-success[b-6ui0xab23t] { color: var(--CTeal); font: var(--text-xs); margin-top: 6px; }
.opt-warning[b-6ui0xab23t] { color: var(--CWarning); font: var(--text-xs); margin-top: 4px; max-width: 560px; }
.opt-danger-text[b-6ui0xab23t] { color: var(--CSignal); font: var(--text-sm); }

[b-6ui0xab23t] .opt-steps-surface { max-width: 560px; padding: 14px 16px; margin: 4px 0 8px; box-sizing: border-box; }
.opt-steps[b-6ui0xab23t] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.opt-steps-foot[b-6ui0xab23t] { margin-top: 10px; justify-content: space-between; }
.opt-steps-note[b-6ui0xab23t] { margin: 0; flex: 1; }
.opt-step[b-6ui0xab23t] { display: flex; align-items: center; gap: 10px; font: var(--text-sm); color: var(--lv6); }
.opt-step--active[b-6ui0xab23t] { color: var(--lv8); font-weight: var(--med); }
.opt-step--done[b-6ui0xab23t] { color: var(--lv8); }
.opt-step-mark[b-6ui0xab23t] { width: 14px; height: 14px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.opt-step-dot[b-6ui0xab23t] { width: 4px; height: 4px; background: var(--lv3); }
.opt-step--done .opt-step-mark[b-6ui0xab23t] { color: var(--CTeal); }
.opt-step-label[b-6ui0xab23t] { flex: none; }
.opt-step-pct[b-6ui0xab23t] { font: var(--text-xs); color: var(--lv8); font-variant-numeric: tabular-nums; margin-left: 4px; }

/* The sections' menu beside the section, built as Admin > Settings builds its own
   (Settings.razor.css): a column from the header to the window's bottom, sticking while the
   section scrolls, its title level with the dataset menu's. The layout reaches out over the
   content's padding and the panel Surface's (one --spacing more on each side than the admin page
   has) and the section takes them back; without that it sat lower than the admin one (12 Nov 2026).
   On a phone the menu is the row above the section. */
.opt-layout[b-6ui0xab23t] {
    display: flex;
    align-items: flex-start;
    margin: calc(var(--spacing) * -5) 0 calc((var(--page-gutter) + var(--spacing)) * -1) calc((var(--page-gutter) + var(--spacing)) * -1);
}
.opt-side[b-6ui0xab23t] {
    width: 200px;
    flex: none;
    position: sticky;
    top: 0;
    height: calc(100vh - var(--header-height));
    overflow-y: auto;
}
/* As on the admin page: the icons under the header trail's icon. */
.opt-side[b-6ui0xab23t]  .side-menu { padding-left: 39px; }
.opt-main[b-6ui0xab23t] {
    flex: 1;
    min-width: 0;
    max-width: calc(640px + var(--page-gutter) * 2);
    padding: calc(var(--spacing) * 5) var(--page-gutter) var(--page-gutter);
}
@media (max-width: 768px) {
    .opt-layout[b-6ui0xab23t] { flex-direction: column; align-items: stretch; margin: 0; }
    .opt-side[b-6ui0xab23t] { width: auto; height: auto; position: static; border-bottom: 1px solid var(--lv2); overflow: visible; padding-bottom: 8px; }
    .opt-side[b-6ui0xab23t]  .side-menu { padding-left: 0; }
    .opt-main[b-6ui0xab23t] { padding: 16px 0 0; max-width: none; }
}
/* /Components/Datasets/QueryParametersTab.razor.rz.scp.css */
.qp-tab[b-jhzrqs1xz7] { margin-top: 0; }
.qp-intro[b-jhzrqs1xz7] { max-width: 640px; }
[b-jhzrqs1xz7] .qp-table { max-width: 640px; margin-bottom: 24px; }
/* The groups: side by side once each can have 380px, else one under the other. Each table keeps
   its own height; the shorter one does not stretch to match. */
.qp-groups[b-jhzrqs1xz7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr));
    gap: 0 24px;
    align-items: start;
    max-width: 1304px;
}
/* One column: the setting's name, its help, and its control on the last line. The systm cell is
   one 40px line, so this cell sets its own padding. */
[b-jhzrqs1xz7] .qp-cell { padding: 12px 15px; }
.qp-label[b-jhzrqs1xz7] { display: block; font: var(--text-sm); color: var(--lv7); }
/* A value this dataset sets, as opposed to one left to the engine default. */
[b-jhzrqs1xz7] .qp-row--set .qp-label { color: var(--lv8); font-weight: var(--med); }
.qp-help[b-jhzrqs1xz7] { display: block; font: var(--text-xs); color: var(--lv5); margin-top: 2px; }
.qp-control[b-jhzrqs1xz7] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; min-height: 28px; }
.qp-number[b-jhzrqs1xz7] { width: 110px; }
.qp-choice[b-jhzrqs1xz7] { width: 160px; }
/* Reads as the toggle's label does, so every control names its parameter the same way. */
.qp-param-name[b-jhzrqs1xz7] { font: var(--text-sm); color: var(--lv7); }
/* Keeps the restore button's place, so the row does not change height when a value is set. */
.qp-restore-placeholder[b-jhzrqs1xz7] { display: inline-block; width: 28px; height: 28px; }
.qp-advanced[b-jhzrqs1xz7] { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
/* The mode or the reranking changed while Advanced is closed. */
.qp-advanced-note[b-jhzrqs1xz7] { font: var(--text-xs); color: var(--lv6); }
.qp-error[b-jhzrqs1xz7] { color: var(--CSignal); font: var(--text-sm); margin-top: 10px; }
/* /Components/Datasets/RankingRulesTab.razor.rz.scp.css */
.boost-tab[b-mnlcs94kfs] { margin-top: 16px; }
.boost-intro[b-mnlcs94kfs] { color: var(--lv5); font: var(--text-sm); margin-bottom: 12px; }
.boost-rule-alert[b-mnlcs94kfs] { margin-top: 8px; }
.boost-summary[b-mnlcs94kfs] { color: var(--lv6); font: var(--text-sm); margin: 0 0 12px; display: flex; gap: 14px; flex-wrap: wrap; }
.boost-summary-expired[b-mnlcs94kfs] { color: var(--CSignal); }
.boost-rule--expired[b-mnlcs94kfs] { border-color: var(--CSignal); }
.boost-rules[b-mnlcs94kfs] { display: flex; flex-direction: column; gap: 12px; }
.boost-rule[b-mnlcs94kfs] {
    border: 1px solid var(--lv2);
    border-radius: var(--radius);
    padding: 16px;
    background: var(--lv1);
}
.boost-rule-head[b-mnlcs94kfs] { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.boost-grow[b-mnlcs94kfs] { flex: 1; }
.boost-value[b-mnlcs94kfs] { min-width: 160px; }
.boost-label[b-mnlcs94kfs] { color: var(--lv5); font: var(--text-xs); white-space: nowrap; }
.boost-w90[b-mnlcs94kfs] { width: 90px; }
.boost-w130[b-mnlcs94kfs] { width: 130px; }
.boost-w190[b-mnlcs94kfs] { width: 190px; }
.boost-conditions[b-mnlcs94kfs] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-left: 10px;
    border-left: 2px solid var(--lv2);
}
.boost-condition[b-mnlcs94kfs] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.boost-schedule[b-mnlcs94kfs] { margin-top: 12px; }
.boost-dates[b-mnlcs94kfs] { display: flex; gap: 20px; margin-top: 8px; }
.boost-date-label[b-mnlcs94kfs] { color: var(--lv5); font: var(--text-xs); display: block; margin-bottom: 2px; }
.boost-hint[b-mnlcs94kfs] { color: var(--lv4); font: var(--text-xs); display: block; margin-top: 4px; }
.boost-note[b-mnlcs94kfs] { color: var(--lv5); font: var(--text-xs); margin-top: 8px; }
.boost-error[b-mnlcs94kfs] { color: var(--CSignal); font: var(--text-sm); margin-top: 10px; }

/* A narrow screen. Nothing here is hidden or moved to another place, the rows are only told
   where to break, so that they break the same way every time:
     head       [switch] [name ..........] [delete]   then   Strength: [select] [status]
     condition  [field ..............] [delete]       then   between [min] and [max]
   The children are reordered with `order`, since the delete buttons come last in the markup.
   ::deep because the switch, the buttons and the chip are other components' elements. */
@media (max-width: 768px) {
    .boost-rule[b-mnlcs94kfs] { padding: 12px; }

    .boost-rule-head[b-mnlcs94kfs] { flex-wrap: wrap; }
    .boost-rule-head[b-mnlcs94kfs]  > * { order: 4; }
    .boost-rule-head[b-mnlcs94kfs]  > :first-child { order: 1; }
    .boost-rule-head[b-mnlcs94kfs]  > .boost-grow { order: 2; flex: 1 1 calc(100% - 110px); min-width: 0; }
    .boost-rule-head[b-mnlcs94kfs]  > :last-child { order: 3; }

    .boost-condition[b-mnlcs94kfs]  > * { order: 3; }
    .boost-condition[b-mnlcs94kfs]  > .boost-w190 { order: 1; flex: 1 1 calc(100% - 50px); width: auto; min-width: 0; }
    .boost-condition[b-mnlcs94kfs]  > .indx-btn { order: 2; }
    .boost-condition[b-mnlcs94kfs]  > .boost-value { flex: 1 1 120px; min-width: 0; }

    /* Two date pickers side by side when they fit, stacked when they do not, never past the card. */
    .boost-dates[b-mnlcs94kfs] { flex-wrap: wrap; gap: 12px 20px; }
    .boost-dates > div[b-mnlcs94kfs] { flex: 1 1 140px; min-width: 0; }
}

/* A rule's strength: one scale from Bury high to Boost high (Nov 2026), its current step named
   beside it with the direction's icon. Six equal columns under the slider, so each name sits
   under its step, and Bury and Boost over their halves. */
.boost-strength[b-mnlcs94kfs] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin: 0 0 12px 10px;
}

.boost-strength-now[b-mnlcs94kfs] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 120px;
    padding-top: 2px;
    font: var(--text-xs);
    font-weight: var(--med);
    color: var(--lv7);
}

.boost-strength-scale[b-mnlcs94kfs] {
    width: 300px;
    max-width: 100%;
}

.boost-strength-labels[b-mnlcs94kfs] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    font: var(--text-2xs);
    color: var(--lv5);
}

.boost-strength-labels > span[b-mnlcs94kfs] {
    text-align: center;
}

.boost-strength-labels > :first-child[b-mnlcs94kfs] {
    text-align: left;
}

.boost-strength-labels > :last-child[b-mnlcs94kfs] {
    text-align: right;
}

.boost-strength-sides[b-mnlcs94kfs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    font: var(--text-2xs);
    color: var(--lv4);
}

.boost-strength-sides > :last-child[b-mnlcs94kfs] {
    text-align: right;
}

@media (max-width: 640px) {
    .boost-strength[b-mnlcs94kfs] { flex-direction: column; gap: 6px; }
}
/* /Components/Datasets/ReadOnlyArea.razor.rz.scp.css */
/* The fieldset carries the disabled state only: no frame, no spacing of its own. */
.indx-readonly-area[b-xzgio9ri10] {
    border: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}
/* /Components/Datasets/RecordsTab.razor.rz.scp.css */
.records-tab[b-bkcrk8ahtm] { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }

.records-toolbar[b-bkcrk8ahtm] { align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 0; container: records-toolbar / inline-size; }
.records-search[b-bkcrk8ahtm] { flex: 1 1 200px; max-width: 320px; }
.records-order[b-bkcrk8ahtm] { display: inline-flex; align-items: center; gap: 6px; }
.records-end[b-bkcrk8ahtm] { display: inline-flex; align-items: center; gap: 8px; }
.records-count[b-bkcrk8ahtm] { color: var(--lv5); font: var(--text-xs); white-space: nowrap; font-variant-numeric: tabular-nums; }
.records-label[b-bkcrk8ahtm] { color: var(--lv5); font: var(--text-xs); white-space: nowrap; }
.records-note[b-bkcrk8ahtm] { color: var(--lv5); font: var(--text-sm); margin: 0; }
.records-faint[b-bkcrk8ahtm] { color: var(--lv5); font: var(--text-xs); margin: 0; }
.records-error[b-bkcrk8ahtm] { color: var(--CSignal); font: var(--text-xs); margin: 0; }
.records-spacer[b-bkcrk8ahtm] { flex: 1; }
/* One row holds the toolbar down to about 700px. Narrower, wrapping left the search on a line of
   its own in the middle with the count wherever it fell. So the search goes under the buttons, the
   full width; narrower still the count and the scan go under it too, just above the table they
   count. Measured on the toolbar, not the window: the side menu takes its share above 768px. */
@container records-toolbar (max-width: 700px) {
    .records-search[b-bkcrk8ahtm] { order: 1; flex: 1 1 100%; max-width: none; }
}
@container records-toolbar (max-width: 500px) {
    .records-end[b-bkcrk8ahtm] { order: 2; flex: 1 1 100%; justify-content: space-between; margin-left: 0; }
}

/* The filter, column and header menus: a systm Popover, each control a row of its own. */
.records-tab[b-bkcrk8ahtm]  .records-menu { width: 300px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
/* Labels from the left, as in a systm menu; a full-width button would centre them. */
.records-tab[b-bkcrk8ahtm]  .records-menu .indx-btn { justify-content: flex-start; }
.records-tab[b-bkcrk8ahtm]  .records-columns { width: 380px; max-height: 420px; overflow-y: auto; gap: 6px; }
/* A field in the Columns menu, its roles as Field configuration has them on the right. */
.records-column-row[b-bkcrk8ahtm] { display: flex; align-items: center; gap: 8px; min-width: 0; }
.records-roles[b-bkcrk8ahtm] { margin-left: auto; display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.records-menu-row[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.records-menu-pair[b-bkcrk8ahtm] { flex-direction: row; gap: 8px; }
.records-menu-actions[b-bkcrk8ahtm] { display: flex; justify-content: flex-start; }
/* A field's values, the commonest first: searched, not scrolled through by the thousand. */
.records-values[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 1px; max-height: 260px; overflow-y: auto; }
.records-value-text[b-bkcrk8ahtm] { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.records-filters[b-bkcrk8ahtm] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }

/* A column header: the name as the Key header is set, the menu a small button beside it, and
   under it, with a report, what the report says of the field. */
.records-head[b-bkcrk8ahtm], .records-key-head[b-bkcrk8ahtm] { vertical-align: middle; white-space: nowrap; }
.records-head-row[b-bkcrk8ahtm] { display: flex; align-items: center; gap: 2px; min-height: 30px; }
.records-head--num .records-head-row[b-bkcrk8ahtm] { justify-content: flex-end; }
.records-head-name[b-bkcrk8ahtm] { white-space: nowrap; }
/* Key and Matched lead with an icon; a little more room between it and the name. */
.records-key-head .records-head-name[b-bkcrk8ahtm] { margin-left: 5px; }
.records-head-sort[b-bkcrk8ahtm] { display: inline-flex; color: var(--lv6); }
.records-head-note[b-bkcrk8ahtm] { display: flex; align-items: center; gap: 4px; padding-bottom: 6px; font: var(--text-xs); font-weight: var(--reg); color: var(--lv5); white-space: nowrap; }
.records-head--num .records-head-note[b-bkcrk8ahtm] { justify-content: flex-end; }
.records-num[b-bkcrk8ahtm] { text-align: right; font-variant-numeric: tabular-nums; }
.records-missing[b-bkcrk8ahtm] { color: var(--lv4); font-style: italic; }
/* Something a search treats badly: the ink, medium, with the warning icon. Never a colour. */
.records-issue[b-bkcrk8ahtm] { display: inline-flex; align-items: center; gap: 4px; font: var(--text-xs); font-weight: var(--med); color: var(--lv8); white-space: nowrap; }
.records-head-note.records-issue[b-bkcrk8ahtm] { display: flex; }
.records-issue[b-bkcrk8ahtm]  svg, .records-key[b-bkcrk8ahtm]  svg { flex: none; }

/* The whole row opens its record in place, as a Search preview hit opens. */
.records-row[b-bkcrk8ahtm] { cursor: pointer; }
.records-row:hover > td[b-bkcrk8ahtm], .records-row:focus-visible > td[b-bkcrk8ahtm] { background: var(--lv1); }
.records-row:focus-visible[b-bkcrk8ahtm] { outline: none; }
.records-row--open > td[b-bkcrk8ahtm], .records-row--open:hover > td[b-bkcrk8ahtm] { background: var(--lv2); }
.records-key[b-bkcrk8ahtm] { display: inline-flex; align-items: center; gap: 4px; font: var(--text-xs); font-family: var(--font-mono); color: var(--lv5); white-space: nowrap; }
.records-fixed[b-bkcrk8ahtm] { display: inline-flex; color: var(--lv6); }
.records-cell[b-bkcrk8ahtm] { white-space: nowrap; }
/* A long value's tooltip: more of it than the standard measure takes. */
.records-tab[b-bkcrk8ahtm]  .indx-tooltip.records-tip { max-width: min(420px, calc(100vw - 32px)); font-weight: var(--reg); white-space: pre-wrap; }

/* An open record stays in view while the table scrolls sideways under it. The table's first
   column is sticky, and the open row's one cell is its first, so without the first rule the whole
   table-wide cell was sticky and the record slid off with the columns. Instead the cell scrolls,
   and the record inside it holds still at the frame's left edge, as wide as the frame shows
   (100cqw: the frame is the size container). */
.records-tab[b-bkcrk8ahtm]  .records-frame { container-type: inline-size; }
.records-expanded > td[b-bkcrk8ahtm] { position: static; background: var(--lv1); padding: 8px 0 12px; cursor: default; }
.records-expanded > td[b-bkcrk8ahtm]::before, .records-expanded > td[b-bkcrk8ahtm]::after { display: none; }
.records-detail[b-bkcrk8ahtm] {
    /* The frame runs into the page's gutter (BleedEnd, as Field configuration's table), so the
       record keeps the gutter clear on its right. */
    /* No wider than its cell either: the cell starts inside the table's left border, so a record as
       wide as the frame ended a pixel past the table's right edge and the frame scrolled by that much
       whenever the table itself fitted. */
    position: sticky; left: 0; box-sizing: border-box; width: 100cqw; max-width: 100%; padding: 0 calc(var(--page-gutter) + 20px) 0 15px;
    display: flex; flex-direction: column; gap: 10px; align-items: flex-start;
}
.records-groups[b-bkcrk8ahtm] { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px 24px; width: 100%; }
.records-json[b-bkcrk8ahtm] { margin: 0; font-family: var(--font-mono); font-size: 12px; line-height: 1.5; color: var(--lv7); white-space: pre-wrap; overflow-wrap: anywhere; width: 100%; }
.records-group[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding-top: 6px; border-top: 0.5px solid var(--lv3); }
.records-group-title[b-bkcrk8ahtm] { margin: 0; color: var(--lv7); font: var(--text-xs); font-weight: var(--med); }
.records-field[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.records-field-name[b-bkcrk8ahtm] { color: var(--lv5); font: var(--text-xs); font-family: var(--font-mono); }
.records-field-value[b-bkcrk8ahtm] { color: var(--lv8); font: var(--text-sm); overflow-wrap: anywhere; white-space: pre-wrap; }

.records-pager[b-bkcrk8ahtm] { display: flex; align-items: center; gap: 4px; }
.records-pager .records-count[b-bkcrk8ahtm] { margin-right: 8px; }

/* A search's hits: the fields the words were met in, and each word marked where a cell holds it as typed. */
.records-matched[b-bkcrk8ahtm] { font: var(--text-xs); color: var(--lv7); white-space: nowrap; }
.records-mark[b-bkcrk8ahtm] { background: var(--lv3); color: var(--lv8); border-radius: 2px; padding: 0 1px; }
/* On the dark theme lv3 hardly parts from a row's tone: a notch up. */
@media (prefers-color-scheme: dark) { :where(:root:not([data-theme="light"])) .records-mark[b-bkcrk8ahtm] { background: var(--lv4); } }
:where(:root[data-theme="dark"]) .records-mark[b-bkcrk8ahtm] { background: var(--lv4); }
.records-words[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 4px; width: 100%; padding-bottom: 6px; }
.records-word[b-bkcrk8ahtm] { display: flex; align-items: baseline; gap: 8px; font: var(--text-xs); }
.records-word-text[b-bkcrk8ahtm] { color: var(--lv8); font-weight: var(--med); }
.records-word--missing .records-word-text[b-bkcrk8ahtm] { color: var(--lv5); font-weight: var(--reg); text-decoration: line-through; }

/* The Table's ResizableColumns fix the widths and cut what overflows; a value stays on one line.
   The open record's cell is not a column: it wraps, and shows all of itself. */
.records-tab[b-bkcrk8ahtm]  .records-table .records-expanded > td { overflow: visible; white-space: normal; }

/* Cold storage under an opened record's fields: kept beside it, opened one item at a time. */
.records-cold[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 8px; width: 100%; padding-top: 6px; border-top: 0.5px solid var(--lv3); }
.records-cold-title[b-bkcrk8ahtm] { display: inline-flex; align-items: center; gap: 6px; }
.records-cold-item[b-bkcrk8ahtm] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.records-cold-head[b-bkcrk8ahtm] { display: flex; align-items: center; gap: 8px; min-width: 0; }
/* /Components/Datasets/SearchOrAskTab.razor.rz.scp.css */
.soa-tab[b-6zoel1088c] { margin-top: 0; }
/* The text and the chip as wide as a settings group; the row goes on to the page's right edge,
   where Observr's action sits (ObservrPageAction). */
.soa-intro[b-6zoel1088c] { display: flex; align-items: flex-start; gap: 10px; }
.soa-intro p[b-6zoel1088c] { flex: 0 1 510px; margin: 0 0 calc(var(--spacing) * 2); }
/* On a narrow screen the chip goes above the text, so the text gets the full width. */
@media (max-width: 768px) {
    .soa-intro[b-6zoel1088c] { flex-direction: column-reverse; }
    .soa-intro p[b-6zoel1088c] { flex: none; }
}
[b-6zoel1088c] .soa-table { max-width: 640px; margin-bottom: 24px; }
/* Two columns: the settings on the left, one under the other, as wide as a settings group; the
   tester on the right, sticky under the header, so it stays in view while a setting is changed.
   A container query, not a media query: the tab sits inside a page with its own gutters. On a
   narrow tab the two stack, the tester first. */
.soa-tab[b-6zoel1088c] { container-type: inline-size; }
.soa-layout[b-6zoel1088c] {
    display: grid;
    /* Equal halves: a settings group is never wider than 640px anyway, and the tester needs
       the room for an answer. */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0 24px;
    align-items: start;
    max-width: 1304px;
}
.soa-settings[b-6zoel1088c] { min-width: 0; }
.soa-group[b-6zoel1088c] { min-width: 0; break-inside: avoid; }
.soa-preview[b-6zoel1088c] {
    min-width: 0;
    position: sticky;
    /* Taller than the window it scrolls inside itself, so the field stays reachable. */
    max-height: calc(100dvh - var(--header-height, 60px) - 40px);
    overflow-y: auto;
    /* The page scrolls inside the shell's content area, which begins under the header, so the
       offset is the page's own top gap, not the header's height (measured: the header's height
       here put the tester 76px below the header's edge). */
    top: 20px;
}
@container (max-width: 899px) {
    .soa-layout[b-6zoel1088c] { grid-template-columns: minmax(0, 1fr); }
    .soa-preview[b-6zoel1088c] { position: static; order: -1; }
}
/* The widest windows: the settings in two balanced columns (multi-column, so a long group
   leaves no hole under a short one), the tester in a third. Three groups' widths plus the gaps. */
@container (min-width: 1500px) {
    .soa-layout[b-6zoel1088c] { grid-template-columns: 2fr 1fr; max-width: 1968px; }
    .soa-settings[b-6zoel1088c] { columns: 2; column-gap: 24px; column-fill: balance; }
}
[b-6zoel1088c] .soa-cell { padding: 12px 15px; }

.soa-label[b-6zoel1088c] { display: block; font: var(--text-sm); color: var(--lv7); }
[b-6zoel1088c] .soa-row--set .soa-label { color: var(--lv8); font-weight: var(--med); }
/* The tooltip around a name is inline-flex, which put the name in a line box of its own, below
   where the icon beside it is placed. As a block-level row of the name's width it sits as the name
   did alone. */
.soa-row-body[b-6zoel1088c]  .indx-tooltip-wrapper { display: flex; width: fit-content; }
/* A name with a fuller explanation in its tooltip: a dotted underline, as a definition reads. */
.soa-label--explained[b-6zoel1088c] { text-decoration: underline dotted var(--lv4); text-underline-offset: 3px; cursor: help; }
.soa-help[b-6zoel1088c] { display: block; font: var(--text-xs); color: var(--lv5); margin-top: 2px; }
.soa-control[b-6zoel1088c] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; min-height: 28px; }
.soa-control[b-6zoel1088c] >  * { min-width: 0; }
.soa-control[b-6zoel1088c]  textarea { width: 100%; }
.soa-select[b-6zoel1088c] { min-width: 260px; }
.soa-number[b-6zoel1088c] { width: 110px; }
.soa-error[b-6zoel1088c] { color: var(--CSignal); font: var(--text-sm); margin-top: 10px; }

/* The tester: a visitor's search box, drawn like the Search preview's panel, filling its column. */
.soa-try[b-6zoel1088c] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-sizing: border-box;
    margin-bottom: 24px;
    padding: 12px;
    background: var(--lv0);
    border: 0.5px solid var(--lv3);
    border-radius: var(--radius);
}
.soa-try-head[b-6zoel1088c] { display: flex; flex-direction: column; gap: 2px; margin-bottom: 2px; }
.soa-try-head-row[b-6zoel1088c] { display: flex; align-items: center; gap: 12px; }
/* The hits, as the judge reads them: title, section, one line of snippet. */
.soa-try-results[b-6zoel1088c] { display: flex; flex-direction: column; gap: 6px; }
.soa-try-results-head[b-6zoel1088c] { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.soa-try-hits[b-6zoel1088c] { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
.soa-try-hit[b-6zoel1088c] { font: var(--text-xs); color: var(--lv6); }
.soa-try-hit-title[b-6zoel1088c] { color: var(--lv8); font: var(--text-sm); }
.soa-try-hit-section[b-6zoel1088c] { margin-left: 8px; color: var(--lv5); }
.soa-try-hit-snippet[b-6zoel1088c] { display: block; color: var(--lv6); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soa-try-title[b-6zoel1088c] { font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.soa-try-off[b-6zoel1088c] { margin-top: 0; }
/* intrface's offer row: always this tall, so an offer appearing moves nothing under it. */
/* As tall as a micro button (30px), whatever it holds, so the offer arriving moves nothing. */
.soa-try-offer[b-6zoel1088c] { display: flex; align-items: center; gap: 10px; min-height: 30px; min-width: 0; flex-wrap: wrap; }
/* "No offer" drawn as StreamStatus draws its line, the flat spectrum where the spinner was. */
.soa-try-none[b-6zoel1088c] { display: flex; align-items: center; gap: 8px; font: var(--text-xs); color: var(--lv5); }
.soa-try-none-icon[b-6zoel1088c] { display: inline-flex; color: var(--lv4); }
.soa-try-hint[b-6zoel1088c] { display: inline-flex; align-items: center; gap: 4px; font: var(--text-xs); color: var(--lv4); }
.soa-kbd[b-6zoel1088c] { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; font: var(--text-2xs); color: var(--lv5); background: var(--lv2); border-radius: 3px; }
/* The judge's scores, quiet, with the tester's own tools at the end. */
.soa-try-scores[b-6zoel1088c] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 8px; border-top: 1px solid var(--lv2); }
.soa-try-spacer[b-6zoel1088c] { flex: 1; }
.soa-try-score[b-6zoel1088c] { display: inline-flex; flex-wrap: wrap; align-items: center; row-gap: 6px; font: var(--text-xs); color: var(--lv6); font-variant-numeric: tabular-nums; }
[b-6zoel1088c] .soa-offer--strong { background: var(--CPositive); color: var(--lv0); }
[b-6zoel1088c] .soa-offer--invite { background: var(--lv3); color: var(--lv8); }
[b-6zoel1088c] .soa-offer--none { background: var(--lv2); color: var(--lv6); }
.soa-state[b-6zoel1088c] {
    margin: 0;
    padding: 12px;
    background: var(--lv1);
    border-radius: 6px;
    font: var(--text-xs);
    font-family: var(--font-mono, monospace);
    color: var(--lv7);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-height: 360px;
    overflow: auto;
}
.soa-try-filters[b-6zoel1088c] { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
/* The answer on its way: the step, then skeleton lines where it will land, as the Agent panel. */
.soa-try-pending-lines[b-6zoel1088c] { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; max-width: 420px; }
/* The answer as a chat turn, as intrface's AskPanel shows it. */
.soa-try-turn[b-6zoel1088c] { display: flex; flex-direction: column; gap: 16px; padding-top: 12px; border-top: 1px solid var(--lv2); }
.soa-sources[b-6zoel1088c] { margin: 4px 0 0; padding-left: 20px; font: var(--text-xs); color: var(--lv6); }
.soa-key[b-6zoel1088c] { color: var(--lv5); margin-left: 6px; font-variant-numeric: tabular-nums; }

/* A setting's row: its icon beside the name, help and control. */
.soa-row[b-6zoel1088c] { display: flex; gap: 12px; align-items: flex-start; }
/* 14px: a pixl icon is a 7x5 grid, sharp only at a multiple of 7 (16 put each cell on 2.29 screen
   pixels, uneven on a 1x screen). Two pixels down to sit level with the name, as 16 did at one. */
.soa-icon[b-6zoel1088c] { color: var(--lv5); flex: none; margin-top: 2px; display: inline-flex; }
[b-6zoel1088c] .soa-row--set .soa-icon { color: var(--lv8); }
.soa-row-body[b-6zoel1088c] { flex: 1; min-width: 0; }

/* The 0 to 1 scale above the thresholds: nothing, invitation, offer. */
.soa-scale[b-6zoel1088c] { margin-top: 12px; }
/* A line its switch has turned off: still there, read as not in use. */
.soa-threshold--off .soa-threshold-label[b-6zoel1088c], .soa-threshold--off .soa-threshold-value[b-6zoel1088c] { color: var(--lv5); }
.soa-scale-bar[b-6zoel1088c] { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--lv2); }
.soa-scale-none[b-6zoel1088c] { background: var(--lv2); }
.soa-scale-hint[b-6zoel1088c] { background: var(--lv3); }
.soa-scale-invite[b-6zoel1088c] { background: var(--lv4); }
.soa-scale-strong[b-6zoel1088c] { background: var(--CPositive); }
.soa-scale-ticks[b-6zoel1088c] { position: relative; display: flex; justify-content: space-between; margin-top: 6px;
    font: var(--text-xs); color: var(--lv5); font-variant-numeric: tabular-nums; }
.soa-scale-mark[b-6zoel1088c] { position: absolute; transform: translateX(-50%); color: var(--lv7); }

/* One offer's pair of sliders. */
.soa-thresholds[b-6zoel1088c] { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.soa-threshold[b-6zoel1088c] { display: grid; grid-template-columns: 120px 1fr 40px; align-items: center; gap: 10px; width: 100%; }
.soa-threshold-label[b-6zoel1088c] { font: var(--text-xs); color: var(--lv6); }
.soa-threshold-value[b-6zoel1088c] { font: var(--text-sm); color: var(--lv8); font-variant-numeric: tabular-nums; text-align: right; }
.soa-threshold[b-6zoel1088c]  .soa-slider { width: 100%; }


/* Knowledge: the markdown as typed, and as it reads, below it. */
.soa-knowledge[b-6zoel1088c] { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.soa-knowledge-preview[b-6zoel1088c] { font: var(--text-sm); color: var(--lv7); padding: 10px 12px; background: var(--lv1); border: 0.5px solid var(--lv3); border-radius: var(--radius); }
.soa-knowledge-preview[b-6zoel1088c]  p { margin: 0 0 6px; }
.soa-knowledge-preview[b-6zoel1088c]  :last-child { margin-bottom: 0; }
.soa-knowledge-foot[b-6zoel1088c] { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.soa-knowledge-files[b-6zoel1088c] { display: flex; gap: 4px; }

/* The mode: the five side by side, and what the chosen one does under them, a size up from the
   other settings' help, since it is the setting that decides most. */
/* The full width up to its cap, whatever the help under it says: it sized to the text before. */
.soa-mode[b-6zoel1088c] { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 520px; }
.soa-mode-help[b-6zoel1088c] { margin: 0; font: var(--text-sm); color: var(--lv6); }

/* A judge's score in the tester: its name, the meter with its thresholds, its value, on one line. */
.soa-score[b-6zoel1088c] { display: inline-flex; align-items: center; gap: 6px; margin-right: 12px; white-space: nowrap; }
/* /Components/Datasets/SearchPreviewTab.razor.rz.scp.css */
/* The search box and the facets base. Stacked by default; side by side when THIS area is at
   least 900px wide, which is why it is a container query and not a media query: the preview
   sits inside a page with its own gutters and maximum width. */
.indx-search-layout[b-bf1s1vqlyd] {
    container-type: inline-size;
    margin-top: 20px;

    /* The height the preview may use: what is left of the window below the point where it
       starts. js/fill-viewport.js measures that point and keeps it in --fill-top, because what
       sits above belongs to other components and changes with the screen: on a phone the
       breadcrumb row wraps onto a second line, and a number written in here then left the page
       scrolling over nothing by exactly that row. Below the preview come the surface's bottom
       padding and the page gutter.

       Until the script has run (and if it never does) the fallback is the desktop measurement:
       126px of chrome plus the gutter.

       Both layouts are sized from this, so the box has ONE height whether it holds nothing,
       one hit or twenty-four. The hits scroll inside it. A box that grows with its hits jumps
       on the first keystroke and pushes the page into scrolling. */
    --preview-room: calc(100dvh - var(--fill-top, calc(126px + var(--page-gutter, 40px)))
                         - var(--page-gutter, 40px) - var(--spacing, 5px));
    --facets-stacked: 196px;
    --preview-gap: 8px;
}



.indx-search-panel[b-bf1s1vqlyd] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: var(--lv0);
    border: 0.5px solid var(--lv3);
    padding: 5px;
    box-sizing: border-box;
    /* Stacked: the room, less the facets base under it. Never so short that it is useless. */
    height: max(300px, calc(var(--preview-room) - var(--facets-stacked) - var(--preview-gap)));
}

.indx-search-bg-logo[b-bf1s1vqlyd] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 175px;
    height: 125px;
    color: var(--lv3);
    pointer-events: none;
    user-select: none;
}

.indx-perf-toolbar[b-bf1s1vqlyd] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
}


.indx-perf-result[b-bf1s1vqlyd] {
    font: var(--text-xs);
    color: var(--lv5);
    white-space: nowrap;
}

.indx-search-field-wrap[b-bf1s1vqlyd] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    /* The box is a fixed-height column. Without this the field is a shrinkable row: once the
       hits overflow the box, the shortfall is taken from every row, and the input got 8px
       shorter the moment a character was typed. Only the hit list may give way. */
    flex: 0 0 40px;
    border: 1px solid transparent;
    border-radius: 1px;
    box-sizing: border-box;
}

.indx-search-field-wrap:focus-within[b-bf1s1vqlyd] {
    border-color: transparent;
}

.indx-search-field-icon[b-bf1s1vqlyd] {
    position: absolute;
    left: 7px;
    display: flex;
    align-items: center;
    height: 100%;
    color: var(--lv4);
    pointer-events: none;
    transition: color 0.2s;
}

.indx-search-field-wrap:focus-within .indx-search-field-icon[b-bf1s1vqlyd] {
    color: var(--lv7);
}

.indx-search-field-input[b-bf1s1vqlyd] {
    width: 100%;
    height: 100%;
    padding: 0 56px 0 35px;
    font: var(--text-base);
    color: var(--lv8);
    caret-color: var(--lv7);
    background: none;
    border: none;
    border-radius: 1px;
    outline: none;
    box-sizing: border-box;
}

.indx-search-field-input[b-bf1s1vqlyd]::placeholder {
    color: var(--lv4);
    transition: opacity 0.2s;
}

.indx-search-field-input:focus[b-bf1s1vqlyd]::placeholder {
    opacity: 0;
}

.indx-search-field-input[b-bf1s1vqlyd]::selection {
    background: var(--lv3);
}

.indx-search-field-input[type="search"][b-bf1s1vqlyd] {
    -webkit-appearance: none;
    appearance: none;
}

.indx-search-field-input[b-bf1s1vqlyd]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    display: none;
}

.indx-search-clear[b-bf1s1vqlyd] {
    position: absolute;
    right: 4px;
    display: flex;
    align-items: center;
    height: 100%;
}

.indx-search-empty[b-bf1s1vqlyd] {
    flex: 0 0 auto;
    font: var(--text-sm);
    color: var(--lv4);
    margin-top: 8px;
}

/* The hits scroll inside the box and take what is left of its fixed height. */
.indx-search-results[b-bf1s1vqlyd] {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    scrollbar-color: var(--lv3) transparent;
}
.indx-search-result-item[b-bf1s1vqlyd] { flex: 0 0 auto; }
.indx-perf-toolbar[b-bf1s1vqlyd] { flex: 0 0 auto; }

.indx-search-result-item[b-bf1s1vqlyd] {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 8px 5px;
    border-bottom: 1px solid var(--lv3);
    font: var(--text-xs);
    color: var(--lv6);
}

.indx-search-result-key[b-bf1s1vqlyd] {
    color: var(--lv4);
    margin-right: 4px;
}

.indx-search-result-fields[b-bf1s1vqlyd] { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.indx-search-result-score[b-bf1s1vqlyd] {
    flex: none;
    font-variant-numeric: tabular-nums;
    color: var(--lv4);
    font: var(--text-xs);
    white-space: nowrap;
}
.indx-search-result-side[b-bf1s1vqlyd] {
    flex: none;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: 4px;
}
.indx-search-result-pin[b-bf1s1vqlyd] { display: flex; color: var(--lv7); }
.indx-search-not-ready[b-bf1s1vqlyd] { color: var(--lv5); margin-top: 16px; }

.indx-perf-sep[b-bf1s1vqlyd] { display: inline-block; width: 12px; }

/* ── Facets base ─────────────────────────────────────────────────────────────────────────────
   Fixed height, scrolling inside itself: whatever a search does to the facets, the page below
   and above stays where it is.

   A plain --lv1 ground with the search box's own hairline (0.5px --lv3), no shadow: one step off the page tone, enough to read as
   a base. The caption is the brightest thing on it (--lv7); the chips are a step darker than
   the ground (--lv2), since the page tone would vanish against --lv1.

   The caption mirrors the search field. That box is 0.5px border + 5px padding around a 40px
   row whose icon sits 7px inside a 1px transparent border and whose text starts 35px in. This
   base has the same border and padding, and its row is built the same way. */
.indx-facets[b-bf1s1vqlyd] {
    margin-top: var(--preview-gap);
    background: var(--lv1);
    border: 0.5px solid var(--lv3);
    color: var(--lv7);
    box-sizing: border-box;
    height: var(--facets-stacked);
    /* the same hairline and padding as the search box, so the caption lines up with its field */
    padding: 5px;
    display: flex;
    flex-direction: column;
}

.indx-facets-caption[b-bf1s1vqlyd] {
    flex: 0 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    height: 40px;
    border: 1px solid transparent;
    box-sizing: border-box;
}
.indx-facets-caption-icon[b-bf1s1vqlyd] {
    position: absolute;
    left: 7px;
    display: flex;
    align-items: center;
    height: 100%;
    color: var(--lv7);
}
.indx-facets-caption-text[b-bf1s1vqlyd] {
    padding-left: 35px;
    font: var(--text-base);
    color: var(--lv7);
}

/* The rows start flush with the caption icon's left edge: the icon sits 1px border + 7px in,
   so 8px here. The same on the right. */
.indx-facets-body[b-bf1s1vqlyd] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 2px 8px 8px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    scrollbar-color: var(--lv4) transparent;
}

.indx-facets-note[b-bf1s1vqlyd] { margin: 0; font: var(--text-xs); color: var(--lv5); }
.indx-facets-note strong[b-bf1s1vqlyd] { color: var(--lv7); font-weight: var(--med); }

.indx-facet-row[b-bf1s1vqlyd] { display: flex; align-items: baseline; gap: 10px; }
.indx-facet-field[b-bf1s1vqlyd] {
    flex: 0 0 120px;
    font: var(--text-xs);
    color: var(--lv5);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.indx-facet-values[b-bf1s1vqlyd] { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.indx-facet-value[b-bf1s1vqlyd] {
    display: inline-block;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}
.indx-facet-count[b-bf1s1vqlyd] { margin-left: 6px; color: var(--lv5); font-variant-numeric: tabular-nums; }
/* A filterable field's values are toggles (systm Chip with OnClick): the text in the plain chip's
   ink until picked, the count lighter on the picked chip's dark ground. */
.indx-facet-values[b-bf1s1vqlyd]  .indx-chip--toggle:not(.indx-chip--selected) { color: var(--lv7); }
.indx-facet-values[b-bf1s1vqlyd]  .indx-chip--selected .indx-facet-count { color: var(--lv4); }
.indx-facet-more[b-bf1s1vqlyd] { font: var(--text-xs); color: var(--lv5); white-space: nowrap; margin-left: 2px; }
/* A number field: its name over its histogram, at every width; the range's count after the name. */
.indx-facet-row--range[b-bf1s1vqlyd] { flex-direction: column; align-items: stretch; gap: 3px; }
.indx-facet-row--range .indx-facet-field[b-bf1s1vqlyd] { flex: 0 0 auto; }

/* On a phone the field name goes above its values, which then get the full width. */
@media (max-width: 768px) {
    .indx-facet-row[b-bf1s1vqlyd] { flex-direction: column; gap: 3px; }
    .indx-facet-field[b-bf1s1vqlyd] { flex: 0 0 auto; }
    .indx-facet-value[b-bf1s1vqlyd] { max-width: 150px; }
}

/* ── Wide: facets to the right of the box, both the full height of the room ──────────────────
   The base is laid over its stretched cell absolutely, so its content cannot make the row
   taller. In a narrow column the field name goes above its chips. */
@container (min-width: 900px) {
    /* The grid is an inner element: a container query cannot restyle its own container. */
    .indx-search-grid[b-bf1s1vqlyd] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: var(--preview-gap);
        align-items: stretch;
        height: max(350px, var(--preview-room));
    }
    .indx-search-panel[b-bf1s1vqlyd] { min-height: 0; height: 100%; }
    .indx-facets-cell[b-bf1s1vqlyd] { position: relative; min-height: 0; }
    .indx-facets[b-bf1s1vqlyd] { position: absolute; inset: 0; height: auto; margin-top: 0; }
    .indx-facet-row[b-bf1s1vqlyd] { flex-direction: column; gap: 3px; }
    .indx-facet-field[b-bf1s1vqlyd] { flex: 0 0 auto; }
    .indx-facet-value[b-bf1s1vqlyd] { max-width: 190px; }
}

/* ── A hit, and the document panel ───────────────────────────────────────────────────────────
   Hovering a hit shows its document where the facets are; clicking pins it. The panel takes the
   facets base's place rather than floating over the list: the list scrolls inside a box that
   clips, so a hover card would be cut off, and the base already has a fixed size, so nothing on
   the page moves when it changes. */
.indx-search-result-item[b-bf1s1vqlyd] { cursor: pointer; }
.indx-search-result-item:hover[b-bf1s1vqlyd],
.indx-search-result-item:focus-visible[b-bf1s1vqlyd] { background: var(--lv1); outline: none; }
.indx-search-result-item--pinned[b-bf1s1vqlyd] { background: var(--lv2); }

.indx-doc-unpin[b-bf1s1vqlyd] { margin-left: auto; padding-right: 2px; }

/* Rank, score and kind, spaced apart rather than separated by a dot. */
.indx-doc-meta[b-bf1s1vqlyd] { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; font: var(--text-xs); color: var(--lv5); font-variant-numeric: tabular-nums; }

.indx-doc-section[b-bf1s1vqlyd] { display: flex; flex-direction: column; gap: 8px; padding-top: 6px; border-top: 0.5px solid var(--lv3); }
.indx-doc-section-title[b-bf1s1vqlyd] { font: var(--text-xs); font-weight: var(--med); color: var(--lv7); display: flex; gap: 8px; align-items: baseline; }
.indx-doc-section-note[b-bf1s1vqlyd] { font-weight: var(--reg); color: var(--lv5); }

.indx-doc-field[b-bf1s1vqlyd] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.indx-doc-field-head[b-bf1s1vqlyd] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.indx-doc-field-name[b-bf1s1vqlyd] { font: var(--text-xs); color: var(--lv6); overflow-wrap: anywhere; }
.indx-doc-field-tag[b-bf1s1vqlyd] {
    font: var(--text-xs);
    color: var(--lv5);
    background: var(--lv2);
    padding: 0 5px;
    white-space: nowrap;
}
.indx-doc-value[b-bf1s1vqlyd] {
    font: var(--text-xs);
    color: var(--lv8);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.indx-doc-value + .indx-doc-value[b-bf1s1vqlyd] { padding-top: 3px; border-top: 0.5px dashed var(--lv3); }
.indx-doc-value--empty[b-bf1s1vqlyd] { color: var(--lv4); font-style: italic; }
.indx-doc-value-more[b-bf1s1vqlyd] { color: var(--lv5); }
.indx-doc-json[b-bf1s1vqlyd] { margin: 0; font: var(--text-xs); color: var(--lv7); white-space: pre-wrap; overflow-wrap: anywhere; }

/* "This search" over the facets (Nov 2026): what the search counted and why, in the doc panel's tones. */
.indx-search-explain[b-bf1s1vqlyd] {
    flex-direction: column;
    gap: 6px;
    padding: 4px 12px 12px;
}

/* Narrow first: the caption is one line, the kind of match and then the levels, cut at the end if
   it does not fit; the block under it with the notes is left out. Wide, below, it is the other
   way round. */
.indx-search-explain-caption[b-bf1s1vqlyd] {
    white-space: nowrap;
    overflow: hidden;
}

.indx-search-explain-caption .indx-facets-caption-text[b-bf1s1vqlyd] {
    flex: none;
}

.indx-search-explain-inline[b-bf1s1vqlyd] {
    display: inline-flex;
    gap: 4px;
    margin-left: 10px;
    min-width: 0;
    overflow: hidden;
}

.indx-search-explain-chip[b-bf1s1vqlyd] {
    display: inline-flex;
    flex: none;
}

.indx-search-explain-caption[b-bf1s1vqlyd]  .indx-tooltip-wrapper {
    flex: none;
}

.indx-search-explain-headline[b-bf1s1vqlyd] {
    display: inline-flex;
    align-items: center;
    gap: inherit;
}

/* "Records with every word": what the levels after it count. */
.indx-search-explain-label[b-bf1s1vqlyd] {
    flex: none;
    align-self: center;
    font: var(--text-xs);
    color: var(--lv5);
}

.indx-search-explain[b-bf1s1vqlyd] {
    display: none;
}

@container (min-width: 900px) {
    .indx-search-explain-inline[b-bf1s1vqlyd] { display: none; }
    .indx-search-explain[b-bf1s1vqlyd] { display: flex; }
}

.indx-search-explain-levels[b-bf1s1vqlyd] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}


.indx-search-explain-note[b-bf1s1vqlyd] {
    margin: 0;
    font: var(--text-xs);
    color: var(--lv5);
}

/* "How each word matched" in the document panel: a query word, then how and where it was met. */
.indx-doc-match[b-bf1s1vqlyd] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 2px 0;
    font: var(--text-xs);
}

.indx-doc-match-word[b-bf1s1vqlyd] {
    min-width: 80px;
    color: var(--lv8);
    font-weight: var(--med);
    overflow-wrap: anywhere;
}

.indx-doc-match-how[b-bf1s1vqlyd] {
    color: var(--lv6);
}

.indx-doc-match--missing .indx-doc-match-word[b-bf1s1vqlyd],
.indx-doc-match--missing .indx-doc-match-how[b-bf1s1vqlyd] {
    color: var(--lv4);
}
/* /Components/Datasets/StatisticsTab.razor.rz.scp.css */
/* Statistics dashboard tab. Tiles and tables sit on tone, never elevation — the indx design
   uses no box-shadows anywhere. Numbers wear text tokens, not series colors (dataviz rule:
   color belongs to marks; text stays ink). */

.stats-tab[b-4m5y1dbmu5] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    /* Room under the last table: the page's own bottom gutter is the width of a side one, and a
       table ending that close to the window's edge reads as cut off. */
    padding-bottom: calc(var(--spacing) * 8);
}

.stats-intro[b-4m5y1dbmu5] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.stats-intro p[b-4m5y1dbmu5] {
    color: var(--lv5);
    font: var(--text-sm);
    margin: 0;
    flex: 1;
}

.stats-empty[b-4m5y1dbmu5] {
    color: var(--text-secondary, #888);
    font-size: 13px;
    margin: 18px 0;
}

/* A chart's header: a small title at the left, its own settings at the right, air under it. */
.stats-chart-head[b-4m5y1dbmu5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
    margin-bottom: 8px;
}

.stats-chart-title[b-4m5y1dbmu5] {
    font: var(--text-sm);
    font-weight: var(--med);
    color: var(--lv7);
}


/* The sections' tabs, between the chart and the table they choose. */
.stats-sections[b-4m5y1dbmu5] {
    margin-top: 24px;
}

/* The loading skeleton: tiles, chart and rows, spaced like the page that replaces it. */
.stats-loading[b-4m5y1dbmu5] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.stats-loading-rows[b-4m5y1dbmu5] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding-top: 8px;
}

.stats-heading[b-4m5y1dbmu5] {
    font-size: 13px;
    font-weight: 600;
    margin: 10px 0 0;
}

/* The overview ends at the chart; the section bar starts the detail, so it stands apart. */
/* The orders read as words ("Highest click-through"); micro's content width crams them. */
.stats-view-select[b-4m5y1dbmu5] {
    width: 200px;
}

.stats-more[b-4m5y1dbmu5] {
    display: flex;
}

/* A section's view settings, above its table. */
.stats-view[b-4m5y1dbmu5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.stats-help[b-4m5y1dbmu5] {
    font-size: 12px;
    color: var(--text-secondary, #888);
    margin: 0;
}

.stats-tab[b-4m5y1dbmu5]  .stats-table td,
.stats-tab[b-4m5y1dbmu5]  .stats-table th {
    font-size: 12px;
}

/* The pinned query column wraps rather than widening: on a phone a long query would
   otherwise take the whole frame and leave the numbers nowhere to scroll into. A list with
   ResizableColumns has widths of its own and keeps each value on one line. */
.stats-tab[b-4m5y1dbmu5]  .stats-table:not(.indx-table-resizable) td:first-child {
    white-space: normal;
    overflow-wrap: anywhere;
    min-width: 12ch;
    max-width: 28ch;
}

.stats-muted[b-4m5y1dbmu5] {
    color: var(--lv4);
    font-style: italic;
}

.stats-tab[b-4m5y1dbmu5]  .stats-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* A tile's second figure (Search or ask: per offer, of the asks, time to first words): smaller,
   beside the value. */
.stats-tile-sub[b-4m5y1dbmu5] {
    font: var(--text-sm);
    color: var(--lv5);
    margin-left: 6px;
}

/* The Observr row under a query that found nothing: full width, no cell padding of its own. */
.stats-action[b-4m5y1dbmu5] { text-align: right; white-space: nowrap; }
[b-4m5y1dbmu5] .stats-observr-row td { padding-top: 0; }

/* Beside a section's controls while its list reloads: the rows stay until the new ones land. */
.stats-view-busy[b-4m5y1dbmu5] { display: inline-flex; align-items: center; gap: 6px; color: var(--lv4); font: var(--text-xs); }

/* The Overview section's tiles, then its pictures a third each; one under the other on a phone. */
.stats-overview-block[b-4m5y1dbmu5] { display: flex; flex-direction: column; gap: 8px; }
.stats-overview[b-4m5y1dbmu5] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    align-items: stretch;
}

.stats-overview-item[b-4m5y1dbmu5] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

/* The pictures on the Stat's own face (systm Stat: lv2, lv1 in the dark, its padding and
   radius), so the tiles and the charts read as one set rather than the charts floating on the
   page between them. The rows stretch, so a row of faces ends level. */
.stats-overview-item[b-4m5y1dbmu5] {
    padding: calc(var(--spacing) * 2);
    background: var(--lv2);
    border-radius: var(--radius);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-theme="light"])) .stats-overview-item[b-4m5y1dbmu5] {
        background: var(--lv1);
    }
}
:where(:root[data-theme="dark"]) .stats-overview-item[b-4m5y1dbmu5] {
    background: var(--lv1);
}


/* On the light face (lv2) the heatmap's empty cells, lv2 themselves, vanished: they take the
   page's tone there, and keep lv2 on the dark face, which is lv1. */
.stats-overview-item[b-4m5y1dbmu5]  .indx-heatmap-cell { background: var(--lv0); }
@media (prefers-color-scheme: dark) { :where(:root:not([data-theme="light"])) .stats-overview-item[b-4m5y1dbmu5]  .indx-heatmap-cell { background: var(--lv2); } }
:where(:root[data-theme="dark"]) .stats-overview-item[b-4m5y1dbmu5]  .indx-heatmap-cell { background: var(--lv2); }

.stats-overview-item .stats-chart-head[b-4m5y1dbmu5] { margin-top: 0; margin-bottom: 0; }

/* Balance on the face. A row of faces is as tall as its tallest picture, so a short one (the
   languages) sat pinned under its help with the face's rest empty: the picture sits in the middle
   of the room the title and help leave, at its own size. */
/* ::deep: the pictures are other components' elements, which the page's scope never reaches. */
.stats-overview-item > .stats-help[b-4m5y1dbmu5] +  * { margin-top: auto; }
.stats-overview-item[b-4m5y1dbmu5] >  :last-child { margin-bottom: auto; }
.stats-overview-item .stats-help[b-4m5y1dbmu5] { margin-bottom: 6px; }

/* The pictures are drawn for the page's lv0: their faint lines (the clock's guides, the radar's
   rings and axes, the chart's midline and its hover band) are lv2, and so are the waffle's empty
   cells. On the light face, lv2 itself, they vanished, on the dark one, lv1, they all but did.
   On the face the lines go a step up and the empty cells take the page's tone, as the heatmap's. */
.stats-overview-item[b-4m5y1dbmu5]  .indx-radial-guide,
.stats-overview-item[b-4m5y1dbmu5]  .indx-radar-ring,
.stats-overview-item[b-4m5y1dbmu5]  .indx-radar-axis { stroke: var(--lv3); }
.stats-overview-item[b-4m5y1dbmu5]  .indx-radar-rim { stroke: var(--lv4); }
.stats-overview-item[b-4m5y1dbmu5]  .indx-waffle-cell { background: var(--lv0); }
@media (prefers-color-scheme: dark) { :where(:root:not([data-theme="light"])) .stats-overview-item[b-4m5y1dbmu5]  .indx-waffle-cell { background: var(--lv2); } }
:where(:root[data-theme="dark"]) .stats-overview-item[b-4m5y1dbmu5]  .indx-waffle-cell { background: var(--lv2); }

/* A chart on the face drops its own box (lv0 with a line), made to set the plot off the page: on
   the face it was a box within a box. The plot is the face, as the heatmap's and the clock's are. */
.stats-overview-item[b-4m5y1dbmu5]  .indx-chart {
    background: transparent;
    border-color: transparent;
    --chart-column-hover: var(--lv3);
    --chart-midline: var(--lv3);
}

/* The clock and the radar, centred in their third; the busiest hour's tile in the clock's hollow. */
.stats-clock[b-4m5y1dbmu5],
.stats-centred[b-4m5y1dbmu5] { display: flex; justify-content: center; }
[b-4m5y1dbmu5] .stats-clock-centre { text-align: center; background: transparent; padding: 0; align-items: center; }
[b-4m5y1dbmu5] .stats-clock-centre .indx-stat-value { font: var(--text-lg); font-weight: 300; }

/* The Search or ask pictures, between the tiles and the tables. */
.stats-ask-panels[b-4m5y1dbmu5] { margin: 6px 0 10px; }

/* The typing figures under their chart: four small tiles, two by two. */
.stats-typing-figures[b-4m5y1dbmu5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.stats-typing-figures[b-4m5y1dbmu5]  .indx-stat-value { font: var(--text-lg); font-weight: 300; }

/* The thirds hold a 220px dial or a 24-column heatmap each; under about 1400px of window (the
   side column and the gutters take 300) they would touch, so two columns, then one. */
@media (max-width: 1400px) {
    .stats-overview[b-4m5y1dbmu5] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .stats-overview[b-4m5y1dbmu5] { grid-template-columns: minmax(0, 1fr); }
}

/* A second table in a view (Questions: the ones asked again), titled as a setting group is. */
.stats-subhead[b-4m5y1dbmu5] {
    margin: 32px 0 4px;
    font: var(--text-sm);
    font-weight: var(--med);
    color: var(--lv7);
}

/* Needs: a list in the tables' style, the title a ghost Button that opens the need in a Modal:
   how its visits ended, how it was asked, where it landed. */
.stats-need-open[b-4m5y1dbmu5]  .indx-btn { justify-content: flex-start; max-width: 100%; text-align: left; }
/* A need's modal holds a table of five columns, the last a sentence: the systm modal's 480px
   squeezed it into a column of words. */
[b-4m5y1dbmu5] .stats-need-modal { max-width: 1040px; width: 92vw; }
.stats-need[b-4m5y1dbmu5] { display: flex; flex-direction: column; gap: 16px; }
.stats-need-visits[b-4m5y1dbmu5] { display: inline-flex; align-items: center; gap: 8px; }
.stats-need-count[b-4m5y1dbmu5] { font-variant-numeric: tabular-nums; color: var(--lv6); }
.stats-need-why[b-4m5y1dbmu5] { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.stats-need-score[b-4m5y1dbmu5] { font-variant-numeric: tabular-nums; color: var(--lv6); white-space: nowrap; }
.stats-need-more[b-4m5y1dbmu5] { margin-left: 6px; }

/* The languages waffle in the middle of its face, as the clock and the radar: the grid and its
   legend each centred, the legend's rows too. */
.stats-waffle[b-4m5y1dbmu5]  .indx-waffle-grid-wrap { align-self: center; }
.stats-waffle[b-4m5y1dbmu5]  .indx-waffle-legend { justify-content: center; }
.stats-overview-item[b-4m5y1dbmu5]  .indx-heatmap { align-self: center; }

/* The browsing paths: a board of one height, canvas or list filling it, a step from the table
   under it; full screen fills the screen with it, the panel included. */
.stats-paths[b-4m5y1dbmu5] { position: relative; height: 460px; margin: 8px 0 24px; border-radius: var(--radius); overflow: hidden; }
.stats-paths:fullscreen[b-4m5y1dbmu5] { height: 100vh; margin: 0; border-radius: 0; background: var(--lv0); }
.stats-paths[b-4m5y1dbmu5]  .indx-tree-canvas { height: 100%; }
.stats-paths[b-4m5y1dbmu5]  .indx-tree-list-wrap { height: 100%; overflow: auto; box-sizing: border-box; }
.stats-paths-head[b-4m5y1dbmu5] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* A step clicked: a panel over the board's right edge, as the categories' is. */
.stats-paths[b-4m5y1dbmu5]  .stats-path-panel {
    position: absolute; top: 12px; right: 12px; width: 320px; max-width: calc(100% - 24px);
    max-height: calc(100% - 24px); overflow: auto; scrollbar-gutter: stable; display: flex; flex-direction: column; gap: 10px; z-index: 2;
}
.stats-path-panel-head[b-4m5y1dbmu5] { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.stats-path-panel-title[b-4m5y1dbmu5] { font: var(--text-sm); color: var(--lv8); }
.stats-path-panel-route[b-4m5y1dbmu5] { font: var(--text-xs); color: var(--lv5); margin-top: 2px; }
.stats-path-panel-stats[b-4m5y1dbmu5] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.stats-path-panel-sub[b-4m5y1dbmu5] { font: var(--text-xs); color: var(--lv5); }
.stats-path-list[b-4m5y1dbmu5] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font: var(--text-xs); color: var(--lv7); }
.stats-path-list li[b-4m5y1dbmu5] { display: flex; justify-content: space-between; gap: 8px; }
.stats-path-list li > span:first-child[b-4m5y1dbmu5] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stats-path-count[b-4m5y1dbmu5] { color: var(--lv5); font-variant-numeric: tabular-nums; flex: none; }
.stats-path-note[b-4m5y1dbmu5] { margin: 0; font: var(--text-xs); color: var(--lv5); }

.stats-paths-total[b-4m5y1dbmu5] { margin-left: 8px; font: var(--text-xs); color: var(--lv5); }

/* On a phone the panel would cover the board: docked along its bottom instead, as the categories'
   is, the tree still in sight above it. */
@media (max-width: 720px) {
    .stats-paths[b-4m5y1dbmu5]  .stats-path-panel { left: 12px; right: 12px; width: auto; top: auto; bottom: 12px; max-height: 60%; }
}

/* A found score below the dataset's line: the list missed what was asked. In the ink and
   heavier, not in a colour: a low score is a finding, not an error. */
.stats-tab[b-4m5y1dbmu5]  .stats-num.stats-low { color: var(--lv8); font-weight: var(--med); }
/* /Components/Datasets/StatusTab.razor.rz.scp.css */

.status-heading[b-s6mpfb5c4h] { margin-top: 8px; margin-bottom: 6px; }
.status-heading--section[b-s6mpfb5c4h] { margin-top: 24px; }
.status-help[b-s6mpfb5c4h] { font: var(--text-sm); color: var(--lv5); margin: 0 0 10px; }
.status-heading--observr[b-s6mpfb5c4h] { display: flex; align-items: center; gap: 8px; margin-top: 32px; margin-bottom: 14px; }
/* The bar under the heading stands a little further from the cards than the Statistics bar from its tiles. */
.status-tab[b-s6mpfb5c4h]  .indx-context-bar { margin-bottom: 16px; }
.status-heading--observr > span[b-s6mpfb5c4h] { display: inline-flex; }


.status-alert[b-s6mpfb5c4h] { color: var(--CSignal); }

/* Last error: the message itself, then one quiet line saying what it is. */
.status-last-error-text[b-s6mpfb5c4h] { display: block; overflow-wrap: anywhere; }
.status-last-error-help[b-s6mpfb5c4h] { display: block; margin-top: 4px; color: var(--lv5); }
/* Heading with its action on the same line; the heading keeps its own margins. */
.status-heading-row[b-s6mpfb5c4h] { display: flex; align-items: center; gap: 8px; margin-top: 8px; margin-bottom: 6px; }
.status-heading-row .status-heading[b-s6mpfb5c4h] { margin: 0; }
/* /Components/Datasets/SynonymsTab.razor.rz.scp.css */
.syn-tab[b-5hhn5ubopl] { margin-top: 16px; }

.syn-intro[b-5hhn5ubopl] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}
.syn-intro p[b-5hhn5ubopl] { color: var(--lv5); font: var(--text-sm); margin: 0; flex: 1; }

.syn-chips[b-5hhn5ubopl] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.syn-chip[b-5hhn5ubopl] { cursor: pointer; }
.syn-chip--static[b-5hhn5ubopl] { cursor: default; }
.syn-row-actions[b-5hhn5ubopl] { text-align: right; white-space: nowrap; width: 1%; }
.syn-cap-note[b-5hhn5ubopl] { color: var(--lv4); font: var(--text-xs); margin-top: 8px; }
.syn-error[b-5hhn5ubopl] { color: var(--CSignal); font: var(--text-sm); margin-top: 10px; }
.syn-error--modal[b-5hhn5ubopl] { margin: 0; }

.syn-modal[b-5hhn5ubopl] { display: flex; flex-direction: column; gap: 14px; min-width: 380px; }
.syn-label[b-5hhn5ubopl] { color: var(--lv5); font: var(--text-xs); display: block; margin-bottom: 4px; }
.syn-hint[b-5hhn5ubopl] { color: var(--lv4); font: var(--text-xs); display: block; margin-top: 4px; }
/* /Components/Datasets/UploadFlow.razor.rz.scp.css */
.up-top4[b-kq5cdbtimd] { margin-top: 4px; }
.up-top8[b-kq5cdbtimd] { margin-top: 8px; }
.up-top16[b-kq5cdbtimd] { margin-top: 16px; }
.up-row[b-kq5cdbtimd] { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.up-intro[b-kq5cdbtimd] { color: var(--lv5); margin-top: 16px; }
.up-narrow[b-kq5cdbtimd] { max-width: 560px; }
.up-hint[b-kq5cdbtimd] { font: var(--text-xs); color: var(--lv4); }
.up-help[b-kq5cdbtimd] { font: var(--text-xs); color: var(--lv5); }
/* Events the reader must not miss (engine error, a cancelled wake being disposed, the analyze
   warning) are systm Alerts; this only keeps them to a readable line length. */
.up-alert[b-kq5cdbtimd] { max-width: 680px; }
.up-error[b-kq5cdbtimd] { color: var(--CSignal); margin-top: 4px; }
.up-error--wide[b-kq5cdbtimd] { margin: 4px 0 8px; max-width: 680px; }

/* The Error panel's escapes sit on one row: download, replace, and delete last. They wrap on a
   narrow window rather than pushing delete off the edge. */
.up-actions[b-kq5cdbtimd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
/* /Components/Datasets/WebhooksTab.razor.rz.scp.css */
.wh-tab[b-0hrl7921it] { margin-top: 16px; }
.wh-intro[b-0hrl7921it] { color: var(--lv5); font: var(--text-sm); margin: 0 0 12px; max-width: 72ch; }
.wh-error[b-0hrl7921it] { color: var(--CSignal); font: var(--text-sm); margin: 0; }

.wh-num[b-0hrl7921it] { text-align: right; white-space: nowrap; width: 1%; }
.wh-row[b-0hrl7921it] { cursor: pointer; }
.wh-row:hover td[b-0hrl7921it] { background: var(--lv1); }
.wh-row--selected td[b-0hrl7921it] { background: var(--lv2); }
.wh-held-count[b-0hrl7921it] { display: inline-flex; align-items: center; gap: 4px; }

.wh-detail[b-0hrl7921it] { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; }
.wh-title[b-0hrl7921it] { font: var(--text-lg); margin: 0; }
.wh-subtitle[b-0hrl7921it] { font: var(--text-md); margin: 8px 0 0; }

.wh-grid[b-0hrl7921it] {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 8px 16px;
    align-items: center;
    font: var(--text-sm);
}
.wh-label[b-0hrl7921it] { color: var(--lv5); font: var(--text-xs); }
.wh-hint[b-0hrl7921it] { color: var(--lv4); font: var(--text-xs); display: block; margin-top: 4px; }
.wh-query[b-0hrl7921it] { white-space: pre-wrap; word-break: break-word; }
code[b-0hrl7921it] { font-family: var(--font-mono); }

.wh-actions[b-0hrl7921it], .wh-held-actions[b-0hrl7921it] { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.wh-held-actions[b-0hrl7921it] { margin-top: 8px; }
.wh-row-actions[b-0hrl7921it] { text-align: right; white-space: nowrap; width: 1%; }

.wh-call-detail[b-0hrl7921it] { white-space: pre-wrap; color: var(--lv5); font: var(--text-xs); max-width: 48ch; }
.wh-call-detail--bad[b-0hrl7921it] { color: var(--CSignal); }

.wh-form[b-0hrl7921it] { min-width: 420px; }

@media (max-width: 640px) {
    .wh-grid[b-0hrl7921it] { grid-template-columns: minmax(0, 1fr); gap: 2px 0; }
    .wh-grid .wh-label[b-0hrl7921it] { margin-top: 8px; }
    .wh-form[b-0hrl7921it] { min-width: 0; }
}

.wh-calls-head[b-0hrl7921it] { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.wh-calls-head .wh-subtitle[b-0hrl7921it] { margin: 0; }

.wh-held-names[b-0hrl7921it] { font-weight: 500; }
.wh-details[b-0hrl7921it] { margin-top: 4px; }
.wh-details .wh-grid[b-0hrl7921it] { padding-top: 8px; }
/* /Components/Shared/ConfirmButton.razor.rz.scp.css */
.indx-confirm-row[b-n4fo42wp5d] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.indx-confirm-prompt[b-n4fo42wp5d] {
    font: var(--text-xs);
    color: var(--lv5);
}
/* /Components/Shared/ConfirmModal.razor.rz.scp.css */
.cm-consequences[b-935un8qamb] {
    margin: 0;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font: var(--text-sm);
    color: var(--lv6);
}
/* /Components/Shared/GetStarted.razor.rz.scp.css */
/* The card at the foot of the column: a surface a shade up, the panel's trigger, as wide as the
   column. The Popover's anchor and trigger are inline spans: here they take the full width. */
.getstarted[b-mx0rnfj4gh] { display: block; width: 100%; }
.getstarted[b-mx0rnfj4gh]  .indx-popover-anchor, .getstarted[b-mx0rnfj4gh]  .indx-popover-trigger { display: block; width: 100%; }
.getstarted-trigger[b-mx0rnfj4gh] { all: unset; box-sizing: border-box; display: block; width: 100%; cursor: pointer; }
.getstarted-trigger:focus-visible .getstarted-card[b-mx0rnfj4gh], .getstarted-trigger:focus-visible .getstarted-railbutton[b-mx0rnfj4gh] { outline: 1px solid var(--lv6); outline-offset: 1px; }
.getstarted-card[b-mx0rnfj4gh] { display: flex; flex-direction: column; gap: 10px; padding: 10px 12px 12px; background: var(--lv1); border: 1px solid var(--lv2); border-radius: var(--radius); }
.getstarted-trigger:hover .getstarted-card[b-mx0rnfj4gh] { border-color: var(--lv3); }
.getstarted-card-head[b-mx0rnfj4gh] { display: flex; align-items: center; gap: 8px; }
.getstarted-card-title[b-mx0rnfj4gh] { font: var(--text-sm); color: var(--lv8); flex: 1; }
.getstarted-count[b-mx0rnfj4gh] { font: var(--text-xs); color: var(--lv5); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Folded to the rail: a 30px button like the rail's items, the icon over a short row of cells. */
.getstarted--rail[b-mx0rnfj4gh] { width: auto; }
.getstarted--rail[b-mx0rnfj4gh]  .indx-popover-anchor, .getstarted--rail[b-mx0rnfj4gh]  .indx-popover-trigger { width: auto; }
.getstarted-railbutton[b-mx0rnfj4gh] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 30px; padding: 6px 0; border-radius: var(--radius); }
.getstarted-trigger:hover .getstarted-railbutton[b-mx0rnfj4gh] { background: var(--lv2); }
.getstarted-railsteps[b-mx0rnfj4gh] { display: block; width: 20px; }

/* The panel. */
/* The panel on lv2 with a line round it, so it stands apart from the page behind it. */
.getstarted[b-mx0rnfj4gh]  .getstarted-popover { padding: 0; background: var(--lv2); border: 1px solid var(--lv3); }
.getstarted-panel[b-mx0rnfj4gh] { width: 380px; max-width: calc(100vw - 32px); display: flex; flex-direction: column; gap: 14px; padding: 16px; }
.getstarted-head[b-mx0rnfj4gh] { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.getstarted-title[b-mx0rnfj4gh] { font: var(--text-base); font-weight: var(--med); color: var(--lv8); }
.getstarted-line[b-mx0rnfj4gh] { margin: -8px 0 0; font: var(--text-sm); color: var(--lv5); }
.getstarted-group[b-mx0rnfj4gh] { display: flex; flex-direction: column; gap: 2px; }
.getstarted-group-head[b-mx0rnfj4gh] { padding: 4px 0 6px; font: var(--text-xs); color: var(--lv5); }
.getstarted-step[b-mx0rnfj4gh] { all: unset; box-sizing: border-box; display: flex; align-items: flex-start; gap: 12px; padding: 8px; margin: 0 -8px; border-radius: var(--radius); cursor: pointer; }
.getstarted-step:hover[b-mx0rnfj4gh] { background: var(--lv2); }
.getstarted-step:focus-visible[b-mx0rnfj4gh] { outline: 1px solid var(--lv6); }
.getstarted-step > :last-child[b-mx0rnfj4gh] { margin-top: 4px; flex: none; }
.getstarted-mark[b-mx0rnfj4gh] { flex: none; width: 16px; height: 18px; display: grid; place-items: center; }
.getstarted-step-text[b-mx0rnfj4gh] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.getstarted-step-title[b-mx0rnfj4gh] { display: flex; align-items: center; gap: 8px; font: var(--text-sm); color: var(--lv8); }
.getstarted-step-line[b-mx0rnfj4gh] { font: var(--text-xs); color: var(--lv5); }
.getstarted-step--done .getstarted-step-title[b-mx0rnfj4gh] { color: var(--lv5); }
.getstarted-foot[b-mx0rnfj4gh] { display: flex; justify-content: flex-end; }

/* The Pro teaser: a surface a step down, the last thing in the first user's list. */
.getstarted-teaser[b-mx0rnfj4gh] { display: flex; gap: 12px; padding: 12px; border: 1px solid var(--lv3); border-radius: var(--radius); background: var(--lv0); }
.getstarted-teaser-icon[b-mx0rnfj4gh] { flex: none; padding-top: 1px; }
.getstarted-teaser-text[b-mx0rnfj4gh] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
/* /Components/Shared/SearchOrAskHealth.razor.rz.scp.css */
.soa-health-dim[b-kbkvo9a1jy] { color: var(--lv5); }
/* /Components/Systm/AgentButton.razor.rz.scp.css */
.agent-button[b-zq3crmq763] { position: relative; display: inline-flex; }
/* /Components/Systm/AgentPanel.razor.rz.scp.css */
/* The panel fills its column (app.css .shell-agent) and the chat fills the panel. */
[b-mhrlxpiu9z] .agent-chat { height: 100%; min-height: 0; border-radius: 0; }

/* The head is the header's height, with the same edge, so the two read as one bar. */
.agent-head[b-mhrlxpiu9z] { display: flex; align-items: center; gap: 8px; height: var(--header-height); box-sizing: border-box; padding: 0 0 0 4px; border-bottom: 1px solid var(--lv2); }
[b-mhrlxpiu9z] .agent-chat .indx-chat-header { padding-top: 0; }
[b-mhrlxpiu9z] .agent-chat .indx-chat-thread { overscroll-behavior: contain; }
/* The title is the conversation's first question, cut to the head's width. */
.agent-title[b-mhrlxpiu9z] { display: inline-flex; align-items: center; gap: 7px; min-width: 0; font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.agent-title-text[b-mhrlxpiu9z] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* The icon keeps its 14 px: as a flex item it was what gave way to a long title. */
.agent-title[b-mhrlxpiu9z]  svg { flex: none; }

/* The input with where it is about above it: one chip, quiet. */
.agent-compose[b-mhrlxpiu9z] { display: flex; flex-direction: column; gap: 6px; }
.agent-context-chip[b-mhrlxpiu9z] { display: inline-flex; max-width: 100%; }

/* What Observr keeps of a long conversation's earlier part: its summary, where the turns end for it. */
.agent-summary[b-mhrlxpiu9z] { margin: 4px 0 8px; padding: 10px 12px; border: 1px dashed var(--lv3); border-radius: var(--radius); font: var(--text-xs); color: var(--lv6);
    display: flex; flex-direction: column; gap: 4px; white-space: pre-wrap; }
.agent-summary-head[b-mhrlxpiu9z] { color: var(--lv5); font-weight: var(--med); }

/* Where Observr's memory of a long conversation starts, when it has no summary of what is above. */
.agent-forgotten[b-mhrlxpiu9z] { margin: 4px 0; padding: 6px 0; border-top: 1px dashed var(--lv3); font: var(--text-2xs); color: var(--lv5); }

/* The History: one row a conversation, the current one on the raised tone. The list and its rows
   keep their height (flex: none): the thread is a scrolling flex column, and squeezed to fit it a
   row's wrapped title ran over the next row (Nov 2026). A long title stops at two lines. */
.agent-history[b-mhrlxpiu9z] { display: flex; flex-direction: column; flex: none; }
.agent-history-row[b-mhrlxpiu9z] { display: flex; flex-direction: column; align-items: flex-start; flex: none; gap: 2px; padding: 9px 10px; border: 0; border-radius: var(--radius);
    background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.agent-history-row:hover[b-mhrlxpiu9z], .agent-history-row--current[b-mhrlxpiu9z] { background: var(--lv1); }
.agent-history-title[b-mhrlxpiu9z] { font: var(--text-sm); color: var(--lv8); overflow-wrap: anywhere; max-width: 100%;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.agent-history-meta[b-mhrlxpiu9z] { font: var(--text-2xs); color: var(--lv5); }
.agent-note[b-mhrlxpiu9z] { margin: 8px 0 0; font: var(--text-xs); color: var(--lv5); }

/* The input's head: where it is about, and the notes beside it. */
.agent-compose-head[b-mhrlxpiu9z] { display: flex; align-items: center; gap: 6px; }
.agent-notes-link[b-mhrlxpiu9z] { margin-left: auto; }
.agent-notes-link[b-mhrlxpiu9z]  .indx-btn { color: var(--lv5); }

/* The notes Observr keeps about the dataset. */
.agent-notes[b-mhrlxpiu9z] { display: flex; flex-direction: column; margin-top: 6px; }
.agent-note-row[b-mhrlxpiu9z] { display: flex; align-items: flex-start; gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--lv2); }
.agent-note-text[b-mhrlxpiu9z] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; font: var(--text-sm); color: var(--lv7); overflow-wrap: anywhere; }
.agent-note-add[b-mhrlxpiu9z] { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.agent-note-add[b-mhrlxpiu9z]  .indx-input-wrapper, .agent-note-add[b-mhrlxpiu9z]  .indx-input { flex: 1; min-width: 0; }
.agent-spacer[b-mhrlxpiu9z] { flex: 1; }
.agent-error[b-mhrlxpiu9z] { margin: 0; font: var(--text-xs); color: var(--CSignal); }
.agent-allowance[b-mhrlxpiu9z] { margin: 0; font: var(--text-xs); color: var(--lv5); }
.agent-decided[b-mhrlxpiu9z] { display: inline-flex; align-items: center; gap: 6px; font: var(--text-xs); color: var(--lv5); }

/* History: every turn before the exchange under way, a tone back. */
[b-mhrlxpiu9z] .agent-past { opacity: 0.55; }

/* A turn asked on another page: where, before the text. */
.agent-where[b-mhrlxpiu9z] { display: block; font: var(--text-2xs); color: var(--lv5); margin-bottom: 2px; }

/* The proposals inside a turn: the list's margins were made for a page, not a 340px column. */
[b-mhrlxpiu9z] .indx-chat-assistant-body .ofl { max-width: none; }
[b-mhrlxpiu9z] .indx-chat-assistant-body .ofl-item { margin: 0; padding: 10px 12px; }
[b-mhrlxpiu9z] .indx-chat-assistant-body .ofl-item--open { background: var(--lv2); }
[b-mhrlxpiu9z] .indx-chat-assistant-body .ofl-text { max-width: none; }

/* The answer's own markup: paragraphs and lists at the chat's size. */
[b-mhrlxpiu9z] .indx-chat-assistant-body ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
[b-mhrlxpiu9z] .indx-chat-assistant-body li { line-height: 1.45; }
[b-mhrlxpiu9z] .indx-chat-assistant-body code { font-family: var(--font-mono); font-size: 0.92em; background: var(--lv2); padding: 0 4px; border-radius: 3px; }

/* The answer on its way: the status line, then skeleton lines in the shape of the answer. */
.agent-pending-lines[b-mhrlxpiu9z] { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; max-width: 420px; }
/* /Components/Systm/NotificationPanel.razor.rz.scp.css */
.notif-wrapper[b-xygo2pulqh] {
    position: relative;
    display: inline-flex;
}

/* Bell trigger — override nav-bell so badge positioning works */
.notif-trigger[b-xygo2pulqh] {
    position: relative;
}

.notif-trigger--active[b-xygo2pulqh] {
    background: var(--lv2);
    color: var(--lv8);
}

.notif-badge[b-xygo2pulqh] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 7px;
    height: 7px;
    border-radius: 0;
    background: var(--CSignal);
    pointer-events: none;
}

.notif-trigger--has-unread[b-xygo2pulqh] {
    color: var(--lv8);
}

/* Backdrop */
/* Panel: the Popover's, on the canvas tone with a hairline, flush to its edges. */
.notif-wrapper[b-xygo2pulqh]  .notif-panel {
    width: 320px;
    padding: 0;
    background: var(--lv0);
    border: 1px solid var(--lv3);
    overflow: hidden;
}

.notif-panel-header[b-xygo2pulqh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lv2);
}

.notif-panel-title[b-xygo2pulqh] {
    font: var(--text-xs);
    font-weight: var(--semi);
    color: var(--lv7);
}

.notif-mark-all[b-xygo2pulqh] {
    font: var(--text-xs);
    color: var(--lv5);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}

.notif-mark-all:hover[b-xygo2pulqh] {
    color: var(--lv7);
}


.notif-list[b-xygo2pulqh] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 360px;
    overflow-y: auto;
}

.notif-row[b-xygo2pulqh] {
    display: flex;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lv2);
    cursor: pointer;
    transition: background 80ms ease;
}

.notif-row:last-child[b-xygo2pulqh] {
    border-bottom: none;
}

.notif-row:hover[b-xygo2pulqh] {
    background: var(--lv1);
}

.notif-row--unread[b-xygo2pulqh] {
    background: var(--lv1);
}

.notif-dot-col[b-xygo2pulqh] {
    width: 8px;
    display: flex;
    align-items: flex-start;
    padding-top: 4px;
    flex-shrink: 0;
}

.notif-dot[b-xygo2pulqh] {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background: var(--CTeal);
    flex-shrink: 0;
}

.notif-content[b-xygo2pulqh] {
    flex: 1;
    min-width: 0;
}

.notif-title[b-xygo2pulqh] {
    font: var(--text-xs);
    font-weight: var(--med);
    color: var(--lv7);
    margin: 0 0 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.notif-body[b-xygo2pulqh] {
    font: var(--text-xs);
    color: var(--lv5);
    margin: 0 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.notif-time[b-xygo2pulqh] {
    font-size: 10px;
    color: var(--lv4);
    margin: 0;
}

.notif-panel-footer[b-xygo2pulqh] {
    padding: 10px 16px;
    border-top: 1px solid var(--lv2);
    text-align: center;
}

.notif-panel-footer a[b-xygo2pulqh] {
    font: var(--text-xs);
    color: var(--lv5);
    text-decoration: none;
}

.notif-panel-footer a:hover[b-xygo2pulqh] {
    color: var(--lv7);
}

/* From the foot of the side column: above the bell, opening to the right. */

/* One that goes somewhere when opened (NotificationLinks): the hand, as for a link. */
.notif-row--link[b-xygo2pulqh] { cursor: pointer; }
/* /Components/Systm/ObservrFindingList.razor.rz.scp.css */
.ofl[b-pex6r30lar] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; max-width: 860px; }
.ofl-item[b-pex6r30lar] { display: flex; flex-direction: column; gap: 8px; padding: 16px; margin: 0 -16px; border-bottom: 1px solid var(--lv2); border-radius: var(--radius); }
/* An open finding waits for a decision: lifted one level, so it stands out from the history. */
.ofl-item--open[b-pex6r30lar] { background: var(--lv1); border-bottom-color: transparent; margin-bottom: 4px; }
.ofl-item--open .ofl-text[b-pex6r30lar] { color: var(--lv8); }
.ofl-head[b-pex6r30lar] { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.ofl-kind[b-pex6r30lar] { display: inline-flex; align-items: center; color: var(--lv6); }
.ofl-title[b-pex6r30lar] { font: var(--text-sm); font-weight: var(--med); color: var(--lv8); }
.ofl-where[b-pex6r30lar] { display: inline-flex; align-items: center; gap: 2px; font: var(--text-xs); color: var(--lv5); }
.ofl-spacer[b-pex6r30lar] { flex: 1; }
.ofl-time[b-pex6r30lar] { font: var(--text-xs); color: var(--lv5); }
.ofl-text[b-pex6r30lar] { margin: 0; font: var(--text-sm); line-height: 1.55; color: var(--lv7); max-width: 720px; display: flex; flex-direction: column; gap: 8px; }
.ofl-text[b-pex6r30lar]  p { margin: 0; }
.ofl-text[b-pex6r30lar]  ul { margin: 0; padding-left: 18px; }
.ofl-text[b-pex6r30lar]  code { font-family: var(--font-mono); font-size: 0.92em; background: var(--lv2); padding: 0 4px; border-radius: 3px; }
.ofl-item--proposals[b-pex6r30lar] { padding: 8px 10px; }
/* The proposals: a block of their own on the next tone, a small heading, each change a sentence
   with the field or the terms as chips, its reason under it. */
.ofl-proposals[b-pex6r30lar] { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; margin-top: 4px; background: var(--lv2); border-radius: var(--radius); }
.ofl-proposals-head[b-pex6r30lar] { font: var(--text-2xs); font-weight: var(--med); text-transform: uppercase; letter-spacing: 0.04em; color: var(--lv5); }
.ofl-proposal[b-pex6r30lar] { display: flex; align-items: flex-start; gap: 8px; max-width: 760px; }
.ofl-proposal-body[b-pex6r30lar] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ofl-sentence[b-pex6r30lar] { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font: var(--text-sm); color: var(--lv8); line-height: 1.5; }
.ofl-label[b-pex6r30lar] { font: var(--text-xs); color: var(--lv5); }
.ofl-why[b-pex6r30lar] { font: var(--text-xs); color: var(--lv5); line-height: 1.5; }
/* A ticket to Indx as it will go: the owner reads it before the Yes sends it. */
.ofl-ticket[b-pex6r30lar] { display: block; margin: 4px 0; padding: 8px 10px; border-left: 2px solid var(--lv3); font: var(--text-xs); color: var(--lv7); white-space: pre-wrap; overflow-wrap: anywhere; }
.ofl-actions[b-pex6r30lar] { display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.ofl-failure[b-pex6r30lar] { margin-top: 6px; }

/* The grid: cards on the Status page, two across, one on a phone. Every card sits on lv1 whatever
   its status; an open one is told by its chip and its buttons, since the whole grid is the
   page's content rather than a history to pick the open ones out of. */
.ofl--grid[b-pex6r30lar] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: none; }
.ofl--grid .ofl-item[b-pex6r30lar] { margin: 0; padding: 14px 16px; background: var(--lv1); border-bottom: none; }
.ofl--grid .ofl-item--open[b-pex6r30lar] { margin-bottom: 0; }
.ofl--grid .ofl-text[b-pex6r30lar] { max-width: none; }
.ofl--grid .ofl-actions[b-pex6r30lar] { margin-top: auto; padding-top: 4px; }
@media (max-width: 760px) { .ofl--grid[b-pex6r30lar] { grid-template-columns: minmax(0, 1fr); } }
/* /Components/Teams/GetStartedWelcome.razor.rz.scp.css */
.welcome[b-1dho4khvba] { margin-bottom: 16px; }
/* /Components/Teams/ObservrDatasetsTable.razor.rz.scp.css */
/* The table's shape while it loads. */
.odt-loading[b-7y97pycnm0] { display: flex; flex-direction: column; gap: 18px; padding-top: 12px; }
.odt-loading-row[b-7y97pycnm0] { display: grid; grid-template-columns: 2fr 1fr 1fr 2fr; gap: 24px; align-items: center; }
/* /Components/Teams/TeamKeys.razor.rz.scp.css */
/* Team keys, on Manage team. Same look as the personal key page (Account/Pages/ApiKey.razor.css),
   whose scoped styles do not reach here. */
.tk-block[b-b3di4hjc2a] { margin-bottom: 12px; }
.tk-muted[b-b3di4hjc2a] { color: var(--lv5); }
.tk-suffix[b-b3di4hjc2a] { margin-left: 8px; color: var(--lv5); font: 12px var(--font-mono); }
.tk-expired[b-b3di4hjc2a] { color: var(--CSignal); }

[b-b3di4hjc2a] .tk-reveal { margin-bottom: calc(var(--spacing) * 4); }
.tk-reveal-scope[b-b3di4hjc2a] { display: block; margin-bottom: 8px; }
.tk-token[b-b3di4hjc2a] {
    display: block;
    padding: 10px 12px;
    background: var(--lv0);
    border-radius: var(--radius);
    font: 12px/1.5 var(--font-mono);
    color: var(--lv8);
    overflow-wrap: anywhere;
    user-select: all;
}
.tk-reveal-actions[b-b3di4hjc2a] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.tk-code[b-b3di4hjc2a] {
    margin: 12px 0 0;
    padding: 12px 14px;
    background: var(--lv0);
    border-radius: var(--radius);
    font: 12px/1.6 var(--font-mono);
    overflow-x: auto;
}

/* The frame is systm Table's, with ResizableColumns: every cell keeps to one line, and the access
   description, the longest, fills what the others leave. */
.tk-scope[b-b3di4hjc2a] { color: var(--lv6); }
.tk-actions[b-b3di4hjc2a] { text-align: right; white-space: nowrap; }
/* Show key and Revoke side by side, at the right. ConfirmButton renders a block of its own, which
   dropped below an inline Show key and to the left. */
.tk-row-actions[b-b3di4hjc2a] { display: flex; gap: 4px; align-items: center; justify-content: flex-end; }

.tk-field[b-b3di4hjc2a] { display: flex; flex-direction: column; gap: 6px; }
.tk-label[b-b3di4hjc2a] { font: var(--text-xs); color: var(--lv6); }
.tk-help[b-b3di4hjc2a] { margin: 0; font: var(--text-xs); color: var(--lv5); }
.tk-radios[b-b3di4hjc2a] { display: flex; gap: 20px; flex-wrap: wrap; }
.tk-datasets[b-b3di4hjc2a] { display: flex; flex-direction: column; gap: 6px; padding: 8px 0 0 2px; }
/* /Components/Teams/TeamObservrDatasetsView.razor.rz.scp.css */
.tod-heading[b-twfsmd0ffh] { display: flex; align-items: center; gap: 12px; }
.tod-heading h2[b-twfsmd0ffh] { flex: 1; }
/* /Components/Teams/TeamObservrView.razor.rz.scp.css */
/* The heading with the Datasets dialog's button at its end. */
.tov-heading[b-cg53jghyy5] { display: flex; align-items: center; gap: 12px; }
.tov-heading h2[b-cg53jghyy5] { flex: 1; }

/* Four numbers over the content, then the bar and the cards, as the Statistics page is built. */
[b-cg53jghyy5] .tov-stats { margin: 8px 0 20px; }
.tov-bar[b-cg53jghyy5] { margin-bottom: 16px; }

/* The first visit, in the shape of the console's other empty pages: icon, a line, a detail. */
/* /Components/Teams/TeamSettingsView.razor.rz.scp.css */
.indx-confirm-typed[b-bbq1pekydv] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

/* Member row actions at the right edge. ConfirmButton renders a block of its own, which a
   text-align: right cell does not move. */
.ts-row-actions[b-bbq1pekydv] { display: flex; justify-content: flex-end; }
/* /Pages/ConsolePage.razor.rz.scp.css */
/* The no-team page's one action: the name and its button on a line, centred under the empty state. */
.noteam-create[b-6qoza7ksuj] { display: flex; align-items: flex-start; justify-content: center; gap: 8px; flex-wrap: wrap; }
.noteam-name[b-6qoza7ksuj] { display: block; width: 240px; max-width: 100%; }
/* /Shared/ConsoleBreadcrumb.razor.rz.scp.css */
.indx-console-header[b-1u6qm7cqwt] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.indx-console-trailing[b-1u6qm7cqwt] {
    display: flex;
    align-items: center;
}

.indx-console-dialog[b-1u6qm7cqwt] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: min(360px, 80vw);
}

.indx-console-dialog-actions[b-1u6qm7cqwt] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* /Shared/ConsoleSideMenu.razor.rz.scp.css */
/* The Sidebar's footer in the admin area: the version, quiet, and under it a newer release as a
   ghost micro Button, the security one in the ink (as SideMenu drew them under the group). */
.side-foot[b-etxeyq03eu] { display: flex; flex-direction: column; min-width: 0; }
.side-foot-note[b-etxeyq03eu] { padding: 0 10px; font: var(--text-2xs); color: var(--lv4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-foot-update[b-etxeyq03eu] { padding: 4px 0 0; }
.side-foot-update[b-etxeyq03eu]  .indx-btn { color: var(--lv6); }
.side-foot-update[b-etxeyq03eu]  .indx-btn:hover, .side-foot-update-security[b-etxeyq03eu]  .indx-btn { color: var(--lv8); }
/* /Shared/SideMenu.razor.rz.scp.css */
.side-menu[b-7woib2nayt] { display: flex; flex-direction: column; gap: 18px; padding: 16px 10px; }
.side-menu-group[b-7woib2nayt] { display: flex; flex-direction: column; gap: 2px; }
.side-menu-title[b-7woib2nayt] { padding: 0 10px 4px; font: var(--text-2xs); font-weight: var(--med); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lv4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Menu items are systm Buttons; styled from the container because a class passed to the component
   replaces its own classes (Blazor attribute splat), not merges with them. */
.side-menu-item[b-7woib2nayt]  .indx-btn { width: 100%; justify-content: flex-start; }
.side-menu-note[b-7woib2nayt] { padding: 6px 10px 0; font: var(--text-2xs); color: var(--lv4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* A newer release under the version: a ghost micro Button, the security one in the ink. */
.side-menu-update[b-7woib2nayt] { padding: 4px 0 0; }
.side-menu-update[b-7woib2nayt]  .indx-btn { color: var(--lv6); }
.side-menu-update[b-7woib2nayt]  .indx-btn:hover, .side-menu-update-security[b-7woib2nayt]  .indx-btn { color: var(--lv8); }
.side-menu-badge[b-7woib2nayt] { margin-left: auto; font: var(--text-2xs); font-weight: var(--med); padding: 0 5px; border-radius: 3px; background: var(--CSignal); color: var(--lv0); }
.side-menu-experimental[b-7woib2nayt] { display: inline-flex; margin-left: auto; color: var(--lv5); }

/* Narrow: the column is a bar at the foot of the window (see app.css), and the menu one row that scrolls sideways. */
@media (max-width: 768px) {
    .side-menu[b-7woib2nayt] { flex-direction: row; gap: 8px; padding: 0; overflow-x: auto; min-width: 0; flex: 1; }
    .side-menu-group[b-7woib2nayt] { flex-direction: row; gap: 2px; }
    .side-menu-title[b-7woib2nayt], .side-menu-note[b-7woib2nayt], .side-menu-update[b-7woib2nayt] { display: none; }
    .side-menu-item[b-7woib2nayt]  .indx-btn { width: auto; white-space: nowrap; }
}