.co-ct-search-page {
    --page-max-width: var(--co-max-width);
    --page-gutter: var(--co-rem-space-2);

    padding-bottom: var(--co-rem-space-4);
}

.co-ct-search-page .explainer-section {
    margin-top: 1.75rem;
}

.co-ct-search-page .query-row {
    display: grid;
    gap: var(--gap-control);
}

.co-ct-search-page .form-actions-desktop {
    display: none;
}

.co-ct-search-page .scope-explainer {
    --scope-explainer-content-width: 68rem;

    background: var(--surface-subtle);
    padding-block: 1.25rem;
    padding-inline: var(--page-band-inline-padding);
}

.co-ct-search-page .explainer-section h2 {
    margin: 0 0 0.5rem;
    font-size: var(--font-size-title);
}

.co-ct-search-page .explainer-section p {
    margin: 0;
    max-width: var(--scope-explainer-content-width, 68rem);
    color: var(--text);
}

.co-ct-search-page .explainer-section p + p {
    margin-top: 0.75rem;
}

.co-ct-search-page .dedup-hash-term {
    border: 1px solid var(--line);
    border-radius: var(--radius-chip);
    background: var(--surface-subtle);
    color: var(--text);
    font-family: var(--font-mono);
    font-size: var(--font-size-chip);
    padding: 0.0625rem 0.25rem;
    overflow-wrap: anywhere;
}

.co-ct-search-page .scope-example-list {
    display: grid;
    grid-template-columns: minmax(11rem, max-content) minmax(0, 1fr);
    gap: 0.5rem 1.125rem;
    max-width: var(--scope-explainer-content-width);
    margin: 0;
}

.co-ct-search-page .scope-example-list dd {
    display: grid;
    gap: 0.375rem;
    margin: 0;
}

.co-ct-search-page .scope-example-row {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: var(--gap-small);
}

.co-ct-search-page .scope-example-label {
    font-size: var(--font-size-label);
    font-weight: 600;
}

.co-ct-search-page .scope-example-values {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.co-ct-search-page .scope-example-list code {
    border: 1px solid var(--line);
    border-radius: var(--radius-chip);
    background: var(--surface);
    font-family: var(--font-mono);
    font-size: var(--font-size-chip);
    padding: var(--chip-padding-block) var(--chip-padding-inline);
    overflow-wrap: anywhere;
}

@media (width > 56rem) {
    .co-ct-search-page .query-row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
    }

    .co-ct-search-page .form-actions-desktop {
        display: flex;
    }

    .co-ct-search-page .form-actions-mobile {
        display: none;
    }
}

@media (width <= 33rem) {
    .co-ct-search-page .scope-example-list,
    .co-ct-search-page .scope-example-row {
        grid-template-columns: 1fr;
        gap: 0.1875rem;
    }

    .co-ct-search-page .scope-example-list {
        gap: 0.25rem;
    }

    .co-ct-search-page .scope-example-list dd:not(:last-child) {
        margin-bottom: 0.625rem;
    }
}