[hidden] {
    display: none !important;
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.knowledge-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--green);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.knowledge-link:hover {
    color: #62a914;
}

.analyzer-home-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    align-items: end;
    gap: 52px;
    padding: 26px 0 48px;
}

.analyzer-home-hero h1 {
    margin-bottom: 22px;
}

.analyzer-home-hero h1 span {
    color: var(--green);
}

.analyzer-home-hero > div > p:last-child {
    max-width: 780px;
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.65;
}

.home-local-badge {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px;
    border: 1px solid #d7e6c8;
    border-radius: 19px;
    background: #edf6df;
    color: var(--green-dark, #294b37);
}

.home-local-badge b,
.home-local-badge span {
    display: block;
}

.home-local-badge b {
    margin-bottom: 4px;
    font-size: 14px;
}

.home-local-badge span {
    color: #667567;
    font-size: 12px;
    line-height: 1.5;
}

.analyzer-tools {
    padding: 34px;
    border: 1px solid var(--line);
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--shadow);
}

.home-section-heading {
    align-items: end;
    margin-bottom: 22px;
}

.analyzer-tool-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.analyzer-tool-card {
    position: relative;
    display: flex;
    min-height: 280px;
    flex-direction: column;
    padding: 25px;
    overflow: hidden;
    border: 1px solid #e3e9e4;
    border-radius: 20px;
    background: #f8faf7;
    color: var(--ink);
    text-decoration: none;
    transition: transform .2s, border-color .2s, box-shadow .2s;
}

.analyzer-tool-card:hover {
    border-color: #b9cda9;
    box-shadow: 0 16px 38px rgba(24, 47, 37, .09);
    transform: translateY(-3px);
}

.analyzer-tool-card-primary {
    background: var(--ink);
    color: #fff;
}

.analyzer-tool-card-primary h2 {
    color: #fff;
}

.tool-card-icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 25px;
    place-items: center;
    border-radius: 14px;
    background: #e9f4dd;
    color: var(--green);
}

.analyzer-tool-card-primary .tool-card-icon {
    background: var(--lime);
    color: var(--ink);
}

.tool-card-status {
    position: absolute;
    top: 25px;
    right: 25px;
    padding: 5px 8px;
    border-radius: 99px;
    background: #edf1ee;
    color: #758078;
    font-size: 10px;
    font-weight: 800;
}

.analyzer-tool-card-primary .tool-card-status {
    background: rgba(255, 255, 255, .11);
    color: #cfdbd4;
}

.analyzer-tool-card h2 {
    margin-bottom: 9px;
    font-size: 24px;
}

.analyzer-tool-card > p {
    max-width: 530px;
    margin-bottom: 25px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}

.analyzer-tool-card-primary > p {
    color: #aebbb5;
}

.tool-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    padding-top: 17px;
    border-top: 1px solid #e1e7e2;
    font-size: 12px;
}

.analyzer-tool-card-primary .tool-card-footer {
    border-top-color: rgba(255, 255, 255, .13);
}

.tool-card-footer b {
    color: #6e7b73;
}

.analyzer-tool-card-primary .tool-card-footer b {
    color: var(--lime);
}

.tool-card-footer i {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--green);
    font-style: normal;
    font-weight: 850;
}

.analyzer-tool-card-primary .tool-card-footer i {
    color: #fff;
}

.home-workflow {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    margin-top: 28px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--line);
}

.home-workflow > div {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    padding: 20px;
    background: #fff;
}

.home-workflow span {
    grid-row: span 2;
    color: #80b73e;
    font-size: 11px;
    font-weight: 900;
}

.home-workflow b {
    font-size: 13px;
}

.home-workflow small {
    color: var(--muted);
    font-size: 11px;
}

@media (max-width: 1240px) {
    .privacy-pill {
        display: none;
    }
}

@media (max-width: 980px) {
    .topbar {
        height: auto;
        min-height: 76px;
        flex-wrap: wrap;
        gap: 9px;
        padding-block: 11px;
    }

    .topbar-actions {
        width: 100%;
        gap: 18px;
        overflow-x: auto;
        padding: 1px 0 4px;
    }

    .analyzer-home-hero {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .home-local-badge {
        max-width: 520px;
    }
}

@media (max-width: 720px) {
    .analyzer-tools {
        padding: 20px;
    }

    .analyzer-tool-grid,
    .home-workflow {
        grid-template-columns: 1fr;
    }

    .analyzer-tool-card {
        min-height: 265px;
        padding: 21px;
    }

    .tool-card-status {
        top: 21px;
        right: 21px;
    }
}

/* Opportunities: explainable priorities from Yandex search history */
.opportunities-toolbar > form:first-child {
    display: grid;
    grid-template-columns: minmax(190px, 1.35fr) repeat(4, minmax(135px, .8fr)) minmax(180px, 1fr) auto;
    gap: 12px;
    align-items: end;
    flex: 1 1 100%;
}

.opportunities-toolbar label {
    min-width: 0;
}

.opportunities-list {
    display: grid;
    gap: 18px;
}

.opportunity-card {
    border: 1px solid #dfe7db;
    border-left: 5px solid #aebaa8;
    border-radius: 20px;
    background: #fff;
    padding: 24px;
    box-shadow: 0 12px 30px rgba(33, 48, 38, .055);
}

.opportunity-card.priority-high { border-left-color: #c05c4d; }
.opportunity-card.priority-medium { border-left-color: #d4a436; }
.opportunity-card.priority-low { border-left-color: #79ad39; }
.opportunity-card.priority-unscored { border-left-color: #91a09a; }

.opportunity-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.opportunity-heading {
    min-width: 0;
}

.opportunity-heading h3 {
    margin: 12px 0 4px;
    font-size: clamp(1.14rem, 1.7vw, 1.45rem);
    line-height: 1.28;
    font-weight: 620;
}

.opportunity-heading h3 a {
    color: #202b31;
    text-decoration: none;
}

.opportunity-heading h3 a:hover { color: #659d1c; }

.opportunity-heading > small {
    display: block;
    color: #748078;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.opportunity-url {
    display: block;
    max-width: min(760px, 70vw);
    overflow: hidden;
    color: #66736b;
    font-size: .78rem;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.opportunity-url:hover { color: #5f951c; }

.opportunity-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.opportunity-badges span {
    padding: 5px 9px;
    border-radius: 999px;
    background: #f1f5ef;
    color: #657066;
    font-size: .77rem;
    font-weight: 560;
}

.opportunity-badges .priority-badge {
    background: #eaf6d9;
    color: #4d7f13;
}

.priority-high .opportunity-badges .priority-badge { background: #fbe8e5; color: #9d4338; }
.priority-medium .opportunity-badges .priority-badge { background: #fff3d5; color: #8b6815; }
.priority-unscored .opportunity-badges .priority-badge { background: #edf1ef; color: #56645d; }

.opportunity-score {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
}

.opportunity-score b {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #edf7de;
    color: #558d12;
    font-size: 1.45rem;
    font-weight: 650;
}

.opportunity-score span {
    color: #758078;
    font-size: .76rem;
    line-height: 1.35;
}

.opportunity-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin: 22px 0 17px;
    overflow: hidden;
    border: 1px solid #e3e9e0;
    border-radius: 14px;
    background: #e3e9e0;
}

.opportunity-metrics > span {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 13px 15px;
    background: #f9fbf8;
}

.opportunity-metrics small,
.opportunity-metrics em {
    color: #778179;
    font-size: .75rem;
    font-style: normal;
}

.opportunity-metrics b {
    color: #26322d;
    font-size: .98rem;
    font-weight: 610;
}

.opportunity-recommendation {
    margin: 0;
    color: #4f5d54;
    line-height: 1.65;
}

.opportunity-recommendation b {
    color: #2e3b34;
    font-weight: 620;
}

.opportunity-context {
    display: grid;
    grid-template-columns: 1.25fr 1fr .8fr .8fr;
    gap: 1px;
    margin: 20px 0 14px;
    overflow: hidden;
    border: 1px solid #e3e9e0;
    border-radius: 14px;
    background: #e3e9e0;
}

.opportunity-context > div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 12px 14px;
    background: #f9fbf8;
}

.opportunity-context small { color: #778179; font-size: .72rem; }
.opportunity-context b { color: #26322d; font-size: .86rem; font-weight: 620; }

.opportunity-sections,
.opportunity-evidence-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.opportunity-block {
    padding: 14px 15px;
    border: 1px solid #e4eae1;
    border-radius: 13px;
    background: #fbfcfa;
}

.opportunity-block h4 {
    margin: 0 0 8px;
    color: #526058;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.opportunity-block p { margin: 5px 0; color: #3f4c44; font-size: .84rem; line-height: 1.5; }
.opportunity-protect { border-color: #eadcad; background: #fffaf0; }
.opportunity-protect h4 { color: #806321; }
.opportunity-evidence-grid { margin-top: 14px; }

.opportunity-provenance {
    margin-top: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    background: #f3f6f3;
}

.opportunity-provenance p { margin: 4px 0; color: #657168; font-size: .75rem; line-height: 1.45; }

.opportunity-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 17px;
    padding-top: 15px;
    border-top: 1px solid #e4eae1;
}

.opportunity-source-links { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.opportunity-source-links a { color: #5b9218; font-size: .79rem; font-weight: 620; text-decoration: none; }
.opportunity-accept-state { display: flex; align-items: center; gap: 10px; color: #4d7f13; font-size: .79rem; font-weight: 650; }
.opportunity-accept-state a { color: inherit; }
.opportunity-permission-note { color: #778179; font-size: .76rem; }

.opportunity-card details {
    margin-top: 17px;
    border-top: 1px solid #e4eae1;
    padding-top: 15px;
}

.opportunity-card summary {
    width: max-content;
    cursor: pointer;
    color: #5b9218;
    font-weight: 590;
}

.opportunity-explanation {
    display: grid;
    grid-template-columns: minmax(220px, .85fr) minmax(340px, 1.35fr);
    gap: 26px;
    margin-top: 18px;
}

.opportunity-facts > span {
    display: block;
    margin-bottom: 8px;
    color: #6b766e;
    font-size: .76rem;
    font-weight: 650;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.opportunity-facts p {
    margin: 5px 0;
    color: #3f4c44;
}

.opportunity-score-parts {
    display: grid;
    gap: 9px;
}

.opportunity-score-parts > div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 3px 12px;
    align-items: center;
    color: #536058;
    font-size: .82rem;
}

.opportunity-score-parts b {
    color: #568d14;
    font-weight: 620;
}

.opportunity-score-parts i {
    grid-column: 1 / -1;
    display: block;
    height: 4px;
    overflow: hidden;
    border-radius: 99px;
    background: #edf1eb;
}

.opportunity-score-parts i::before {
    content: '';
    display: block;
    width: var(--score-part);
    height: 100%;
    border-radius: inherit;
    background: #79b62b;
}

@media (max-width: 1180px) {
    .opportunities-toolbar > form:first-child {
        grid-template-columns: repeat(3, minmax(170px, 1fr));
    }
}

@media (max-width: 760px) {
    .opportunities-toolbar > form:first-child,
    .opportunity-metrics,
    .opportunity-explanation,
    .opportunity-context,
    .opportunity-sections,
    .opportunity-evidence-grid {
        grid-template-columns: 1fr;
    }

    .opportunity-card {
        padding: 18px;
    }

    .opportunity-card > header {
        align-items: flex-start;
    }

    .opportunity-footer { align-items: stretch; flex-direction: column; }
    .opportunity-footer form .button { width: 100%; }
    .opportunity-url { max-width: 76vw; }

    .opportunity-score span {
        display: none;
    }
}

.factor-hero {
    align-items: end;
}

.factor-intro {
    max-width: 760px;
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}

.factor-hero form {
    display: grid;
    justify-items: end;
    gap: 7px;
}

.factor-hero form small {
    color: var(--muted);
    font-size: 9px;
}

.source-update-notice {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    padding: 14px 16px;
    border-radius: 12px;
    background: #edf7ef;
}

.source-update-notice div,
.source-update-notice small {
    display: block;
}

.source-update-notice small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 9px;
}

.factor-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}

.factor-summary article {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: white;
}

.factor-summary b,
.factor-summary span {
    display: block;
}

.factor-summary b {
    color: var(--green);
    font-size: 24px;
}

.factor-summary span {
    color: var(--muted);
    font-size: 9px;
}

.factor-filters {
    display: flex;
    align-items: end;
    gap: 10px;
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: white;
}

.factor-filters label {
    min-width: 210px;
    margin: 0;
}

.factor-filters > a {
    padding: 11px 4px;
    color: var(--muted);
    font-size: 10px;
}

.factor-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.factor-card {
    padding: 17px;
    border: 1px solid var(--line);
    border-top: 3px solid #4285f4;
    border-radius: 13px;
    background: white;
}

.factor-card.factor-yandex {
    border-top-color: #fc3f1d;
}

.factor-card-top,
.factor-card footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.factor-card-top span,
.factor-card footer span,
.factor-card footer a {
    padding: 4px 7px;
    border-radius: 99px;
    background: #f0f3f1;
    color: #5e6962;
    font-size: 8px;
    text-decoration: none;
}

.factor-card .engine-badge {
    background: var(--ink);
    color: white;
    font-weight: 800;
}

.factor-card .kind-spam_risk {
    background: #f9e8e3;
    color: #984d38;
}

.factor-card .kind-documented_signal,
.factor-card .kind-requirement {
    background: #e5f3e9;
    color: #286548;
}

.factor-card h2 {
    margin: 14px 0 7px;
    font-size: 17px;
}

.factor-card > p {
    min-height: 42px;
    margin: 0 0 14px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.55;
}

.factor-card footer a {
    margin-left: auto;
    color: var(--green);
}

.source-section {
    margin-top: 24px;
}

.source-section a {
    color: var(--green);
    text-decoration: none;
}

.source-error {
    display: block;
    max-width: 420px;
    margin-top: 4px;
    color: #984d38;
    font-size: 8px;
}

.source-status {
    display: inline-block;
    padding: 4px 7px;
    border-radius: 99px;
    background: #edf1ee;
    font-size: 8px;
    font-weight: 750;
}

.source-status.status-ok {
    background: #e5f3e9;
    color: #286548;
}

.source-status.status-changed,
.source-status.status-error {
    background: #f9e8e3;
    color: #984d38;
}

@media (max-width: 800px) {
    .topbar-actions,
    .factor-filters {
        align-items: stretch;
        flex-direction: column;
    }

    .privacy-pill,
    .knowledge-link {
        display: none;
    }

    .factor-summary,
    .factor-list {
        grid-template-columns: 1fr;
    }
}

/* Provider-neutral SEO-site source management reuses project cards and form controls. */
.seo-site-card { grid-template-columns: 1fr auto; }
.seo-site-card small.is-error { display: block; margin-top: 5px; color: var(--red); }
.seo-site-sources-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 19px; color: var(--ink); text-decoration: none; }
.seo-site-sources-link span { color: var(--muted); font-size: 11px; }
.seo-site-sources-link:hover { border-color: #a5b7ac; }
.seo-site-sources > div { padding: 16px 19px; border-top: 1px solid var(--line); }
.resource-provider-block { display: grid; gap: 10px; }
.resource-provider-block + .resource-provider-block { margin-top: 14px; }
.resource-row { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(360px, 1.4fr) auto; align-items: end; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.resource-row form, .resource-bind-form { display: flex; align-items: end; gap: 8px; margin: 0; }
.resource-row select, .resource-bind-form select { padding: 8px 10px; }
.resource-row .access-check { margin: 0; align-self: center; }
.resource-bind-form { margin: 12px 19px; }
@media (max-width: 800px) {
    .resource-row { grid-template-columns: 1fr; }
    .resource-row form, .resource-bind-form { align-items: stretch; flex-direction: column; }
    .seo-site-sources-link { align-items: flex-start; flex-direction: column; }
}

/* Explicit provider-resource selection for an SEO-site. */
.source-picker-stack { display: grid; gap: 12px; min-width: 0; max-width: 100%; }
.source-picker-with-sync { display: grid; gap: 0; min-width: 0; }
.source-picker-with-sync > .source-resource-picker { border-radius: 15px 15px 0 0; }
.source-picker-with-sync > .source-sync-control { border-top: 0; border-radius: 0 0 15px 15px; }
.source-picker-intro { margin: 0; color: var(--muted); font-size: 13px; }
.source-resource-picker { display: grid; gap: 12px; min-width: 0; max-width: 100%; padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.source-resource-picker-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.source-resource-picker-heading > div { display: grid; gap: 3px; min-width: 0; }
.source-resource-picker-heading span:first-child { color: var(--muted); font-size: 11px; font-weight: 650; letter-spacing: .03em; text-transform: uppercase; }
.source-resource-picker-heading b { overflow-wrap: anywhere; font-size: 15px; }
.source-resource-picker-heading small { color: var(--muted); }
.source-binding-state { flex: 0 0 auto; padding: 5px 9px; border-radius: 99px; background: #edf0ef; color: #66706b; font-size: 11px; font-weight: 700; }
.source-binding-state.is-ready { background: #e4f5e8; color: var(--green-dark); }
.source-resource-picker form { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(260px, 1.6fr) auto; align-items: end; gap: 9px; min-width: 0; max-width: 100%; margin: 0; }
.source-resource-picker label { display: grid; gap: 5px; min-width: 0; }
.source-resource-picker label > span { color: var(--muted); font-size: 11px; font-weight: 650; }
.source-resource-picker input, .source-resource-picker select { width: 100%; min-width: 0; max-width: 100%; }
.source-resource-picker-note, .source-resource-picker-empty, .source-resource-no-results { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.source-resource-no-results { grid-column: 1 / -1; color: var(--red); }
.source-advanced-settings { border-top: 1px solid var(--line); }
.source-advanced-settings > summary { padding: 13px 0 0; cursor: pointer; color: var(--green-dark); font-size: 12px; font-weight: 650; }
.source-advanced-settings > p { margin: 9px 0 12px; color: var(--muted); font-size: 11px; }
.dashboard-provider-heading { flex-wrap: wrap; }
.dashboard-source-settings { margin-left: auto; }
.source-sync-control { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 13px; background: #f8faf8; }
.source-sync-control form { flex: 0 0 auto; margin: 0; }
.source-sync-button { min-height: 38px; padding: 8px 12px; white-space: nowrap; }
.source-sync-button[aria-busy="true"] { cursor: wait; opacity: .72; }
.source-sync-copy { display: grid; gap: 2px; min-width: 0; color: var(--ink); font-size: 12px; line-height: 1.35; }
.source-sync-copy b { overflow-wrap: anywhere; font-weight: 650; }
.source-sync-copy small { color: var(--muted); }
.source-sync-copy .is-attention { color: #876615; }
.source-sync-copy .is-error { color: var(--red); }
.dashboard-provider-panel > .source-sync-control { margin-top: 12px; }
@media (max-width: 800px) {
    .source-resource-picker form { grid-template-columns: 1fr; }
    .source-resource-picker form .button { width: 100%; }
    .source-resource-picker-heading { align-items: flex-start; flex-direction: column; }
    .dashboard-source-settings { margin-left: 0; }
    .source-sync-control { align-items: stretch; flex-direction: column; }
    .source-sync-control form, .source-sync-button { width: 100%; }
}

/* Personal Cabinet external connections */
.metrica-connection-body,
.metrica-counter-list,
.metrica-bindings {
    display: grid;
    gap: 12px;
}

.metrica-connection-body {
    grid-column: 1 / -1;
}

.metrica-counter,
.metrica-binding-row {
    display: grid;
    grid-template-columns: minmax(220px, 2fr) minmax(170px, 1fr) minmax(210px, auto) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid var(--line);
}

.metrica-counter > div,
.metrica-binding-row > div {
    display: grid;
    gap: 3px;
}

.metrica-counter small,
.metrica-binding-row small {
    color: var(--muted);
}

.metrica-counter.is-unavailable {
    opacity: .62;
}

.metrica-sync-form,
.metrica-binding-row form {
    display: flex;
    align-items: center;
    gap: 8px;
}

.metrica-sync-form select,
.metrica-binding-row select {
    min-height: 40px;
}

.metrica-bindings h4 {
    margin: 8px 0 0;
}

@media (max-width: 900px) {
    .metrica-counter,
    .metrica-binding-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .metrica-sync-form,
    .metrica-binding-row form {
        flex-wrap: wrap;
    }
}

.edit-site {
    margin-top: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.quality-pill {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 12px 0 -2px;
    color: var(--green);
}

.quality-pill b {
    font-size: 18px;
}

.quality-pill span {
    color: var(--muted);
    font-size: 10px;
}

.domain-refresh-form {
    margin-top: 4px;
}

.domain-refresh-form .text-button {
    color: var(--muted);
    font-size: 9px;
}

.score-explainer {
    display: grid;
    gap: 4px;
    margin-bottom: 15px;
    padding: 14px 16px;
    border-left: 3px solid var(--lime);
    border-radius: 6px 12px 12px 6px;
    background: #fff;
}

.score-explainer b {
    font-size: 12px;
}

.score-explainer span {
    color: var(--muted);
    font-size: 10px;
}

.domain-table td small,
.domain-table td b {
    display: block;
}

.domain-table td small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
}

.score-number {
    color: var(--green);
    font-size: 16px;
}

.score-notes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 14px;
}

.score-notes-grid article {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}

.score-notes-grid h3 {
    margin-bottom: 3px;
}

.score-notes-grid span {
    color: #455149;
    font-size: 10px;
}

.score-notes-grid span::before {
    content: '→';
    margin-right: 5px;
    color: var(--green);
}

.score-notes-grid small {
    margin-top: 5px;
    color: #9a5d45;
    font-size: 8px;
}

.edit-site summary {
    color: var(--muted);
    cursor: pointer;
    font-size: 11px;
}

.edit-site form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 10px;
}

.edit-site input {
    padding: 9px 10px;
    font-size: 11px;
}

.edit-site button {
    padding: 0 12px;
    border: 0;
    border-radius: 8px;
    background: var(--green);
    color: white;
    cursor: pointer;
    font-size: 11px;
    font-weight: 750;
}

.edit-site small {
    display: block;
    margin-top: 7px;
    color: var(--muted);
    font-size: 9px;
}

.metric-guide {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 15px;
}

.crawl-stats {
    margin: 8px 0 2px;
    color: var(--muted);
    font-size: 9px;
}

.metric-guide div {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}

.metric-guide b,
.metric-guide span {
    display: block;
}

.metric-guide b {
    margin-bottom: 5px;
    font-size: 12px;
}

.metric-guide span {
    color: var(--muted);
    font-size: 10px;
}

.report-warning {
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #e7d39b;
    border-radius: 10px;
    background: #fff8e7;
    color: #755b18;
    font-size: 11px;
}

.forms-inventory {
    padding: 18px;
    border-top: 1px solid var(--line);
    background: #f8faf8;
}

.forms-inventory h3 {
    margin-bottom: 12px;
}

.forms-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.forms-grid article {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: white;
}

.forms-grid article div,
.forms-grid article small {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.forms-grid article span,
.forms-grid article small {
    color: var(--muted);
    font-size: 9px;
}

.forms-grid article p {
    margin: 9px 0;
    color: var(--green);
    font-size: 11px;
    font-weight: 750;
}

.forms-grid article small + small {
    margin-top: 5px;
}

@media (max-width: 800px) {
    .metric-guide,
    .forms-grid,
    .score-notes-grid {
        grid-template-columns: 1fr;
    }
}

.compare-picker {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr) auto;
    align-items: end;
    gap: 12px;
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: white;
}

.compare-picker label {
    margin: 0;
}

.versus {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin-bottom: 2px;
    border-radius: 50%;
    background: var(--ink);
    color: var(--lime);
    font-size: 10px;
    font-weight: 850;
}

.pair-heading {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    margin: 14px 0;
    padding: 18px 22px;
    border-radius: 15px;
    background: var(--ink);
    color: white;
    text-align: center;
}

.pair-heading div {
    display: flex;
    flex-direction: column;
}

.pair-heading small {
    color: var(--lime);
    font-size: 9px;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.pair-heading b {
    margin-top: 3px;
    font-size: 18px;
}

.pair-heading > span {
    color: #9fada6;
    font-size: 10px;
}

.comparison-highlights {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 24px;
}

.comparison-highlights span {
    padding: 11px 13px;
    border-left: 3px solid var(--lime);
    border-radius: 5px 10px 10px 5px;
    background: white;
    color: #455149;
    font-size: 11px;
}

.comparison-subtitle {
    margin: 24px 0 10px;
}

.pair-metrics-table td:nth-child(n+2) {
    min-width: 145px;
}

.delta,
.verdict,
.similarity-score,
.no-pair,
.page-type {
    display: inline-block;
    padding: 4px 7px;
    border-radius: 6px;
    background: #edf1ee;
    font-size: 9px;
    font-weight: 750;
    white-space: nowrap;
}

.delta.is-zero,
.verdict-similar,
.similarity-score {
    background: #e3f3e8;
    color: #286548;
}

.verdict-base {
    background: #e9f0fa;
    color: #315f91;
}

.verdict-competitor {
    background: #fff0db;
    color: #805815;
}

.page-comparison-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin: 34px 0 12px;
}

.page-comparison-heading h3 {
    margin-bottom: 5px;
}

.page-comparison-heading p {
    max-width: 700px;
    margin: 0;
    color: var(--muted);
    font-size: 10px;
}

.pair-counts {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: end;
}

.pair-counts span {
    padding: 5px 8px;
    border-radius: 99px;
    background: #e6ece8;
    font-size: 9px;
}

.page-comparison-table {
    min-width: 1280px;
}

.paired-urls {
    min-width: 260px;
}

.paired-urls a,
.paired-urls span {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 5px;
    padding: 3px 0;
    color: var(--green);
    font-size: 10px;
    text-decoration: none;
}

.paired-urls i {
    color: #89958e;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    text-transform: uppercase;
}

.metric-pair {
    min-width: 95px;
}

.metric-pair b,
.metric-pair small {
    display: block;
    white-space: nowrap;
}

.metric-pair small {
    margin-top: 3px;
    font-size: 8px;
}

.metric-pair .is-similar {
    color: #2c744f;
}

.metric-pair .is-different {
    color: #a05827;
}

.unmatched-pair {
    background: #fbfaf6;
}

.no-pair {
    background: #f6e9e6;
    color: #8c433a;
}

@media (max-width: 850px) {
    .compare-picker {
        grid-template-columns: 1fr;
    }

    .versus {
        display: none;
    }

    .pair-heading,
    .comparison-highlights {
        grid-template-columns: 1fr;
    }

    .page-comparison-heading {
        align-items: start;
        flex-direction: column;
    }

    .pair-counts {
        justify-content: start;
    }
}

/* Visual system inspired by pd-s.ru */
:root {
    --ink: #232c35;
    --muted: #69747f;
    --line: #edf0f2;
    --paper: #f8f9fa;
    --white: #fff;
    --green: #6eb116;
    --green-dark: #579508;
    --lime: #e9f7d5;
    --red: #b74a3d;
    --shadow: 0 8px 40px rgba(35, 44, 53, .055);
    --shadow-green: 0 10px 32px rgba(110, 177, 22, .27);
}

html {
    scroll-behavior: smooth;
}

body {
    background:
        radial-gradient(circle at 92% 5%, rgba(205, 237, 164, .2), transparent 24rem),
        var(--paper);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

::selection {
    background: #dff3c3;
    color: var(--ink);
}

.ui-icon {
    display: inline-block;
    flex: 0 0 auto;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: middle;
}

a {
    color: var(--green-dark);
    text-decoration-color: rgba(110, 177, 22, .35);
    text-underline-offset: 3px;
}

.topbar {
    height: 86px;
    padding: 0 clamp(26px, 3vw, 56px);
    border-bottom: 1px solid #f2f3f4;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 4px 24px rgba(35, 44, 53, .025);
}

.brand {
    gap: 13px;
    color: var(--ink);
    letter-spacing: -.025em;
}

.brand-mark {
    display: block;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: transparent;
    box-shadow: 0 8px 24px rgba(110, 177, 22, .22);
}

.brand b {
    display: block;
    font-size: 19px;
    line-height: 1.05;
}

.brand i {
    color: var(--green);
    font-style: normal;
}

.brand small {
    margin-top: 4px;
    color: #9aa1a7;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .13em;
}

.topbar-actions {
    gap: 10px;
}

.knowledge-link,
.privacy-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 14px;
    border-radius: 60px;
    font-size: 10px;
    font-weight: 750;
    text-decoration: none;
}

.knowledge-link {
    border: 1px solid #dfe7d5;
    background: white;
    color: var(--ink);
}

.knowledge-link:hover {
    border-color: var(--green);
    color: var(--green-dark);
}

.privacy-pill {
    background: #eff8e4;
    color: var(--green-dark);
}

.privacy-pill span {
    display: none;
}

.shell {
    width: 100%;
    max-width: none;
    padding: 48px clamp(26px, 3vw, 56px) 90px;
}

h1,
h2,
h3,
h4 {
    color: var(--ink);
    font-family: inherit;
}

h1 {
    margin-bottom: 20px;
    font-family: inherit;
    font-size: clamp(40px, 5vw, 60px);
    font-weight: 750;
    line-height: 1.08;
    letter-spacing: -.045em;
}

h1 span {
    color: var(--green);
}

h2 {
    font-size: 27px;
    font-weight: 750;
    letter-spacing: -.035em;
}

h3 {
    font-weight: 720;
}

.eyebrow {
    margin-bottom: 11px;
    color: var(--green-dark);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
}

.hero,
.project-hero {
    position: relative;
    overflow: hidden;
    padding: 48px 50px;
    border: 1px solid #f0f2f3;
    border-radius: 32px;
    background: rgba(255, 255, 255, .92);
    box-shadow: var(--shadow);
}

.hero::after,
.project-hero::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: -90px;
    right: -70px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(164, 218, 91, .2), rgba(164, 218, 91, 0) 70%);
    pointer-events: none;
}

.hero > *,
.project-hero > * {
    position: relative;
    z-index: 1;
}

.hero {
    align-items: center;
    margin-bottom: 24px;
}

.hero-copy {
    max-width: 760px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.8;
}

.hero-stat {
    display: grid;
    grid-template-columns: auto auto;
    gap: 3px 12px;
    min-width: 190px;
    padding: 19px 23px;
    border: 1px solid #e5eadf;
    border-left: 1px solid #e5eadf;
    border-radius: 22px;
    background: #f8fcef;
}

.hero-stat .ui-icon {
    align-self: center;
    color: var(--green);
}

.hero-stat strong {
    color: var(--ink);
    font-family: inherit;
    font-size: 39px;
    font-weight: 750;
}

.hero-stat span {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 10px;
}

.grid-main {
    gap: 18px;
}

.panel,
.site-card,
.project-card,
.site-details,
.compare-picker,
.score-notes-grid article,
.factor-summary article,
.factor-card,
.metric-guide div {
    border: 1px solid #f0f2f3;
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--shadow);
}

.panel-form {
    padding: 34px;
}

.panel-heading,
.section-heading {
    margin-bottom: 24px;
}

.step-badge,
.section-heading > span {
    border-color: #e4e8e1;
    background: #fafcf8;
    color: var(--green-dark);
}

label > span {
    color: #3f4850;
    font-size: 11px;
}

input,
textarea,
select {
    min-height: 48px;
    border: 1px solid #e2e6e8;
    border-radius: 15px;
    background: #fafbfb;
    color: var(--ink);
    font-size: 13px;
}

input::placeholder,
textarea::placeholder {
    color: #a2a9ae;
}

input:focus,
textarea:focus,
select:focus {
    border-color: #8fc941;
    box-shadow: 0 0 0 4px rgba(110, 177, 22, .11);
}

.button {
    min-height: 48px;
    gap: 9px;
    border-radius: 60px;
    padding: 12px 22px;
    font-size: 12px;
    font-weight: 750;
}

.button:hover {
    transform: translateY(-2px);
}

.button-primary {
    background: var(--green);
    color: #fff;
    box-shadow: var(--shadow-green);
}

.button-primary:hover {
    background: var(--green-dark);
}

.button-primary span,
.button-primary .ui-icon {
    color: #fff;
}

.button-secondary {
    border: 1px solid var(--green);
    background: white;
    color: var(--green-dark);
}

.button-secondary:hover {
    background: #f7fbf1;
}

.explainer {
    padding: 34px;
    border-color: #e5edd9;
    background: linear-gradient(145deg, #f7fced, #fff 72%);
    color: var(--ink);
}

.explainer .eyebrow {
    color: var(--green-dark);
}

.feature-list li {
    padding: 17px 0 17px 45px;
    border-bottom: 1px solid #e7ecdf;
}

.feature-list li::before {
    display: grid;
    place-items: center;
    top: 16px;
    width: 29px;
    height: 29px;
    border-radius: 50%;
    background: var(--green);
    color: white;
}

.feature-list span {
    color: var(--muted);
}

.note {
    border: 1px solid #e2ebd7;
    border-radius: 16px;
    background: white;
    color: var(--muted);
}

.projects-section,
.report-section {
    margin-top: 28px;
    padding: 28px;
    border: 1px solid #f0f2f3;
    border-radius: 28px;
    background: rgba(255, 255, 255, .9);
    box-shadow: var(--shadow);
}

.project-card {
    padding: 20px 24px;
    border-radius: 20px;
    box-shadow: none;
}

.project-card:hover {
    border-color: #bbd895;
    box-shadow: 0 10px 30px rgba(35, 44, 53, .06);
    transform: translateY(-2px);
}

.circle-arrow {
    background: var(--green);
    color: white;
}

.breadcrumbs {
    margin-bottom: 20px;
    color: #949ca2;
}

.breadcrumbs a {
    color: var(--green-dark);
}

.project-hero {
    align-items: center;
    padding-bottom: 42px;
    border-bottom: 1px solid #f0f2f3;
}

.chips span,
.pair-counts span {
    border: 1px solid #e6eadf;
    background: #f7faF3;
    color: #66705f;
}

.site-grid {
    gap: 16px;
}

.site-manager {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(360px, .85fr);
    gap: 30px;
    align-items: center;
    margin-top: 28px;
    padding: 26px 28px;
    border: 1px solid #e7eddf;
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--shadow-soft);
}

.site-manager h2 {
    margin: 5px 0 8px;
    font-size: clamp(22px, 2.2vw, 31px);
}

.site-manager > div > p:last-child {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

.add-site-form {
    padding: 18px;
    border-radius: 20px;
    background: #f5faef;
}

.add-site-form label {
    display: block;
    margin-bottom: 8px;
    color: var(--ink);
    font-size: 11px;
    font-weight: 800;
}

.add-site-form > div {
    display: flex;
    gap: 9px;
}

.add-site-form input {
    min-width: 0;
    flex: 1 1 auto;
    height: 48px;
    padding: 0 14px;
    border: 1px solid #dfe7d5;
    border-radius: 14px;
    background: #fff;
    font-size: 13px;
}

.add-site-form .button {
    flex: 0 0 auto;
    min-height: 48px;
}

.site-limit-note {
    padding: 18px;
    border-radius: 18px;
    background: #f8eee9;
    color: #8e503e;
    font-size: 12px;
    line-height: 1.5;
}

.site-role {
    margin-bottom: 4px;
    color: #8b969f;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.remove-site-form,
.primary-site-note {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.remove-site-form button {
    padding: 0;
    border: 0;
    background: transparent;
    color: #a65645;
    cursor: pointer;
    font-size: 10px;
    font-weight: 750;
}

.remove-site-form button:hover {
    color: #823e31;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.primary-site-note {
    color: #8c969d;
    font-size: 9px;
}

.site-card {
    padding: 21px;
    border-radius: 24px;
}

.site-card.status-complete {
    border-top: 3px solid var(--green);
}

.site-icon {
    border-radius: 50%;
    background: #eff8e5;
    color: var(--green-dark);
    font-family: inherit;
    font-weight: 800;
}

.site-card a {
    color: var(--green-dark);
}

.status-complete .status {
    background: #eaf6dc;
    color: var(--green-dark);
}

.quality-pill,
.score-number,
.text-button {
    color: var(--green-dark);
}

.text-button:hover {
    color: var(--green);
}

.table-wrap {
    border-color: #edf0f1;
    border-radius: 22px;
    box-shadow: none;
}

table {
    font-size: 11px;
}

th,
td {
    padding: 14px 16px;
    border-bottom-color: #edf0f1;
}

th {
    background: #f7f9f6;
    color: #78827a;
}

.site-details {
    border-radius: 20px;
    box-shadow: none;
}

.compare-picker {
    border-radius: 22px;
    box-shadow: none;
}

.versus {
    background: var(--green);
    color: white;
}

.pair-heading {
    border-radius: 24px;
    background: linear-gradient(135deg, #263139, #34414a);
}

.pair-heading small {
    color: #bde77f;
}

.comparison-highlights span {
    border-left-color: var(--green);
    border-radius: 8px 16px 16px 8px;
    background: #f8fbed;
}

.score-explainer {
    border-left-color: var(--green);
    border-radius: 10px 18px 18px 10px;
    background: #f8fbed;
}

.factor-hero form {
    position: relative;
    z-index: 1;
}

.factor-summary article,
.factor-card {
    border-radius: 24px;
}

.factor-summary b {
    color: var(--green);
}

.factor-filters {
    border-radius: 22px;
    box-shadow: var(--shadow);
}

.factor-card {
    border-top: 1px solid #f0f2f3;
}

.factor-card.factor-google {
    box-shadow: inset 0 3px #4285f4, var(--shadow);
}

.factor-card.factor-yandex {
    box-shadow: inset 0 3px #fc3f1d, var(--shadow);
}

.factor-card .engine-badge {
    background: var(--ink);
}

.factor-card footer a,
.source-section a {
    color: var(--green-dark);
}

.source-update-notice,
.scan-notice {
    border-color: #dceabe;
    border-radius: 20px;
    background: #f5fbe9;
}

.spinner {
    border-color: #d6e8bd;
    border-top-color: var(--green);
}

.flash,
.errors,
.report-warning {
    border-radius: 18px;
}

.flash {
    background: #eaf6dc;
    color: #497d0d;
}

.recommendations-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: max-content;
    margin-top: 10px;
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
}

.recommendations-link:hover {
    color: var(--green);
}

.recommendations-report {
    border-color: #deedcb;
    background:
        radial-gradient(circle at 100% 0, rgba(143, 210, 31, .13), transparent 32%),
        rgba(255, 255, 255, .96);
}

.recommendations-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 22px;
    padding: 16px 18px;
    border-radius: 18px;
    background: #f1f8e8;
    color: #526050;
}

.recommendations-note > svg {
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--green);
}

.recommendations-note p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
}

.recommendations-note b {
    color: var(--ink);
}

.recommendations-grid {
    display: grid;
    grid-template-columns: minmax(300px, 960px);
    gap: 16px;
}

.recommendation-card {
    overflow: hidden;
    border: 1px solid #edf0eb;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(35, 44, 53, .055);
}

.recommendation-card header {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 18px 20px;
    border-bottom: 1px solid #eff2ec;
}

.recommendation-card header > div:nth-child(2) {
    min-width: 0;
    margin-right: auto;
}

.recommendation-card h3 {
    overflow: hidden;
    margin: 0;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.recommendation-card header small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
}

.recommendation-card header > span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 800;
}

.recommendation-item {
    display: grid;
    grid-template-columns: 26px 1fr;
    gap: 10px;
    align-items: start;
    margin: 0 20px;
    padding: 14px 0;
    border-bottom: 1px solid #f1f3ef;
}

.recommendation-item:last-of-type {
    border-bottom: 0;
}

.recommendation-item i {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #eef7e3;
    color: var(--green-dark);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.recommendation-item p,
.recommendation-empty p {
    margin: 2px 0 0;
    color: #4e5962;
    font-size: 13px;
    line-height: 1.5;
}

.recommendation-item h4 {
    margin: 6px 0 0;
    color: var(--ink);
    font-size: 15px;
    line-height: 1.35;
}

.recommendation-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.recommendation-meta span,
.recommendation-meta small {
    display: inline-flex;
    align-items: center;
    min-height: 23px;
    padding: 4px 8px;
    border-radius: 30px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.recommendation-meta span {
    background: #eff7e5;
    color: var(--green-dark);
}

.recommendation-meta small {
    background: #f4f5f6;
    color: var(--muted);
}

.recommendation-item em {
    display: block;
    margin-top: 8px;
    padding: 9px 11px;
    border-radius: 11px;
    background: #f7f8f6;
    color: #69737b;
    font-size: 11px;
    font-style: normal;
    line-height: 1.45;
}

.recommendation-item.tone-high i,
.recommendation-item.tone-high .recommendation-meta span {
    background: #f9e9e4;
    color: #a14f38;
}

.recommendation-item.tone-context i,
.recommendation-item.tone-context .recommendation-meta span {
    background: #edf3f7;
    color: #4c7086;
}

.recommendation-item.tone-strength i,
.recommendation-item.tone-strength .recommendation-meta span {
    background: #e7f6d5;
    color: #4c8b08;
}

.recommendation-empty {
    margin: 20px;
    padding: 18px;
    border-radius: 18px;
    background: #f5faef;
}

.recommendation-empty b {
    color: var(--green-dark);
    font-size: 13px;
}

.recommendation-card footer {
    margin: 0 20px 18px;
    padding-top: 13px;
    border-top: 1px solid #f1e7e2;
    color: #945a45;
    font-size: 11px;
    line-height: 1.45;
}

.audit-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
    gap: 34px;
    align-items: center;
    padding: 42px;
    border: 1px solid #edf0eb;
    border-radius: 32px;
    background:
        radial-gradient(circle at 96% 4%, rgba(143, 210, 31, .17), transparent 34%),
        #fff;
    box-shadow: var(--shadow-soft);
}

.audit-shell {
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
}

.audit-hero h1 {
    max-width: 780px;
    margin-bottom: 18px;
}

.audit-hero-copy > p:not(.eyebrow) {
    max-width: 770px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.7;
}

.audit-capabilities {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.audit-capabilities span {
    padding: 7px 11px;
    border: 1px solid #e5eadf;
    border-radius: 40px;
    background: #fafcf8;
    color: #65705e;
    font-size: 10px;
    font-weight: 750;
}

.audit-form {
    padding: 25px;
    border: 1px solid #e5ecd9;
    border-radius: 24px;
    background: #f4faec;
}

.audit-form label {
    display: block;
    margin-bottom: 8px;
    color: var(--ink);
    font-size: 12px;
    font-weight: 800;
}

.audit-form input {
    width: 100%;
    height: 52px;
    padding: 0 15px;
    border: 1px solid #dce7cf;
    border-radius: 15px;
    background: #fff;
    font-size: 13px;
}

.audit-form .button {
    width: 100%;
    margin-top: 11px;
}

.audit-form small {
    display: block;
    margin-top: 12px;
    color: #7d8876;
    font-size: 9px;
    line-height: 1.5;
}

.audit-notice {
    margin-top: 18px;
}

.audit-history-link { margin-top: 16px; }
.audit-history-hero { margin-bottom: 30px; }
.audit-history-hero h1 { margin-bottom: 10px; }
.audit-history-hero p:last-child { margin: 0; color: var(--muted); }
.audit-run-history { margin-top: 28px; }
.audit-run-list { display: grid; gap: 10px; }
.audit-run-card { padding: 18px 20px; border-left: 4px solid #d9e1dc; box-shadow: 0 8px 24px rgba(24,47,37,.045); }
.audit-run-card.is-success { border-left-color: #75b928; }
.audit-run-card.is-failed { border-left-color: var(--red); }
.audit-run-card header,.audit-run-card footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.audit-run-card header > div { min-width: 0; }
.audit-run-site,.audit-run-card time { display: block; }
.audit-run-site { color: var(--ink); font-size: 15px; font-weight: 800; }
.audit-run-card time { margin-top: 2px; color: var(--muted); font-size: 10px; }
.audit-run-url { overflow: hidden; margin: 11px 0; color: var(--green-dark); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.audit-run-summary { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 8px; margin: 0; }
.audit-run-summary > div { min-width: 0; padding: 10px 12px; border-radius: 11px; background: #f5f7f5; }
.audit-run-summary dt { color: var(--muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.audit-run-summary dd { margin: 3px 0 0; font-size: 13px; font-weight: 750; }
.audit-run-summary small { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; font-weight: 500; }
.audit-run-card footer { justify-content: flex-end; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.audit-run-card footer .button { padding: 9px 13px; font-size: 11px; }
.audit-run-error { margin: 10px 0 0; color: var(--red); font-size: 11px; }
.audit-run-failed { max-width: 760px; margin: 40px auto; padding: 34px; }
.audit-run-failed > .style-status { float: right; }
.audit-run-failed h1 { margin-bottom: 14px; font-size: 42px; }
.audit-run-failed > p:not(.eyebrow) { color: var(--muted); }
.audit-run-failed dl { display: grid; gap: 9px; margin: 24px 0; }
.audit-run-failed dl div { padding: 12px 14px; border-radius: 12px; background: #f5f7f5; }
.audit-run-failed dt { color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
.audit-run-failed dd { overflow-wrap: anywhere; margin: 3px 0 0; font-size: 13px; }

@media (max-width: 650px) {
    .audit-run-summary { grid-template-columns: 1fr; }
    .audit-run-card header,.audit-run-card footer { align-items: flex-start; flex-direction: column; }
    .audit-run-card footer .button { width: 100%; }
    .audit-run-failed { margin-top: 20px; padding: 24px; }
    .audit-run-failed h1 { font-size: 34px; }
}

.audit-overview {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(340px, auto);
    gap: 28px;
    align-items: center;
    margin-top: 28px;
    padding: 28px 32px;
    border: 1px solid #e9eee3;
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--shadow-soft);
}

.audit-score {
    display: grid;
    place-items: center;
    width: 132px;
    height: 132px;
    border-radius: 50%;
    background: conic-gradient(var(--green) calc(var(--audit-score) * 1%), #edf1e9 0);
}

.audit-score::before {
    content: '';
    grid-area: 1 / 1;
    width: 104px;
    height: 104px;
    border-radius: 50%;
    background: #fff;
}

.audit-score > div {
    z-index: 1;
    display: grid;
    grid-area: 1 / 1;
    text-align: center;
}

.audit-score b {
    color: var(--ink);
    font-size: 38px;
    line-height: 1;
}

.audit-score span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 750;
    text-transform: uppercase;
}

.audit-overview-copy h2 {
    margin: 4px 0 5px;
    font-size: 28px;
}

.audit-overview-copy > a {
    display: block;
    overflow: hidden;
    max-width: 620px;
    color: var(--green-dark);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.audit-score-basis {
    display: block;
    margin-top: 8px;
    color: var(--green-dark);
    font-size: 9px;
}

.audit-overview-copy > p {
    max-width: 680px;
    margin: 9px 0 0;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.5;
}

.audit-score-limitation {
    display: block;
    max-width: 680px;
    margin-top: 6px;
    color: #7c867f;
    font-size: 9px;
    line-height: 1.45;
}

.audit-confidence-summary {
    display: grid;
    gap: 3px;
    max-width: 680px;
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #f3f6f1;
    color: #5f6c62;
    font-size: 9px;
}

.audit-confidence-summary b { color: var(--ink); font-size: 10px; }
.audit-confidence-summary small { color: #7c867f; line-height: 1.4; }

.audit-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(70px, 1fr));
    gap: 8px;
}

.audit-stats div {
    display: grid;
    gap: 3px;
    min-width: 78px;
    padding: 13px;
    border-radius: 16px;
    background: #f5f6f5;
    text-align: center;
}

.audit-stats b {
    font-size: 22px;
}

.audit-stats span {
    color: var(--muted);
    font-size: 8px;
    font-weight: 750;
    text-transform: uppercase;
}

.audit-stats .is-pass { background: #edf7e1; color: #4e8b0d; }
.audit-stats .is-warn { background: #fff5d9; color: #936d12; }
.audit-stats .is-fail { background: #f9e8e3; color: #a14f38; }
.audit-stats .is-info { background: #edf3f7; color: #53748a; }

.audit-stats small {
    color: #7c867f;
    font-size: 9px;
    line-height: 1.35;
}

.audit-stats .audit-score-summary,
.audit-stats .audit-coverage-summary {
    align-content: center;
}

.audit-score-explanation {
    grid-column: 1 / -1;
    padding-top: 14px;
    border-top: 1px solid #edf1e9;
}

.audit-score-explanation p {
    max-width: 980px;
    margin: 0;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.5;
}

.audit-page-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.audit-page-summary article {
    min-width: 0;
    padding: 17px;
    border: 1px solid #eef0ec;
    border-radius: 20px;
    background: #fff;
}

.audit-page-summary span {
    display: block;
    margin-bottom: 6px;
    color: var(--green-dark);
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.audit-page-summary b {
    display: -webkit-box;
    overflow: hidden;
    color: var(--ink);
    font-size: 11px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.audit-recommendations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 13px;
}

.audit-recommendation {
    padding: 18px;
    border: 1px solid #edf0eb;
    border-radius: 21px;
    background: #fff;
}

.audit-recommendation > div {
    display: flex;
    align-items: center;
    gap: 7px;
}

.audit-recommendation > div span,
.audit-recommendation > div small {
    padding: 4px 7px;
    border-radius: 30px;
    background: #f0f5e9;
    color: var(--green-dark);
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.audit-recommendation.is-fail > div span {
    background: #f8e5df;
    color: #a24c36;
}

.audit-recommendation h3 {
    margin: 10px 0 6px;
    font-size: 14px;
}

.audit-recommendation p {
    margin: 0;
    color: #56616a;
    font-size: 11px;
    line-height: 1.55;
}

.audit-recommendation em {
    display: block;
    margin-top: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #f7f8f6;
    color: #748078;
    font-size: 9px;
    font-style: normal;
    line-height: 1.45;
}

.audit-recommendation .audit-confidence,
.audit-check .audit-confidence {
    display: block;
    margin-top: 6px;
    color: #5e7162;
    font-size: 8px;
    font-weight: 800;
}

.audit-recommendation .audit-limitation,
.audit-check .audit-limitation {
    display: block;
    margin-top: 4px;
    color: #7a8380;
    font-size: 9px;
    font-weight: 500;
    line-height: 1.45;
}

.audit-supporting-heading {
    margin: 28px 0 12px;
}

.audit-supporting-heading h3 { margin: 4px 0 0; font-size: 18px; }
.audit-supporting-group + .audit-supporting-group { margin-top: 20px; }
.audit-supporting-group > h4 { margin: 0 0 9px; color: #59665d; font-size: 11px; }

.audit-groups {
    display: grid;
    gap: 11px;
}

.audit-group {
    overflow: hidden;
    border: 1px solid #e9ede5;
    border-radius: 19px;
    background: #fff;
}

.audit-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 17px 19px;
    cursor: pointer;
    list-style: none;
}

.audit-group > summary::-webkit-details-marker { display: none; }
.audit-group > summary b { display: block; font-size: 14px; }
.audit-group > summary span { color: var(--muted); font-size: 9px; }
.audit-group > summary em { padding: 5px 8px; border-radius: 30px; background: #f1f5ed; color: #607056; font-size: 8px; font-style: normal; font-weight: 800; }

.audit-checks {
    border-top: 1px solid #edf0eb;
}

.audit-check {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 11px;
    align-items: start;
    padding: 14px 19px;
    border-bottom: 1px solid #f0f2ef;
}

.audit-check:last-child { border-bottom: 0; }

.audit-status {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #edf7e1;
    color: #4e8b0d;
    font-size: 12px;
    font-weight: 900;
}

.audit-check.is-warn .audit-status { background: #fff3d2; color: #936d12; }
.audit-check.is-fail .audit-status { background: #f8e4de; color: #a14f38; }
.audit-check.is-info .audit-status { background: #edf3f7; color: #53748a; }
.audit-check.is-not_applicable .audit-status { background: #f2f3f1; color: #777f79; }

.audit-check h3 { margin: 1px 0 4px; font-size: 12px; }
.audit-impact { display: inline-block; margin-left: 5px; color: #7d887f; font-size: 8px; font-weight: 750; }
.audit-check p { overflow-wrap: anywhere; margin: 0; color: #5d6870; font-size: 10px; line-height: 1.45; }
.audit-check small { display: block; margin-top: 5px; color: #8b6434; font-size: 9px; line-height: 1.45; }
.audit-check > em { color: #88918a; font-size: 8px; font-style: normal; font-weight: 800; text-transform: uppercase; }

.audit-empty {
    display: grid;
    grid-template-columns: 1.2fr repeat(4, 1fr);
    gap: 12px;
    margin-top: 28px;
}

.audit-empty > div,
.audit-empty article {
    padding: 20px;
    border: 1px solid #edf0eb;
    border-radius: 22px;
    background: #fff;
}

.audit-empty > div { background: #eef7e3; }
.audit-empty > div svg { color: var(--green); }
.audit-empty h2 { margin: 11px 0 7px; font-size: 19px; }
.audit-empty h3 { margin: 0 0 7px; font-size: 13px; }
.audit-empty p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }

/* Readable typography: supporting text should remain legible on dense reports. */
.brand small {
    font-size: 10px;
}

.knowledge-link,
.privacy-pill,
.eyebrow,
.hero-stat span,
.button,
.feature-list span,
.note,
.project-card p,
.project-card time,
.breadcrumbs,
.chips span,
.scan-notice small,
.site-card a,
.muted,
.site-error,
.site-details summary span,
.delete-form button,
.factor-intro,
.factor-hero form small,
.source-update-notice small,
.factor-summary span,
.factor-filters > a,
.factor-card > p,
.quality-pill span,
.domain-refresh-form .text-button,
.score-explainer span,
.score-notes-grid span,
.edit-site summary,
.edit-site input,
.edit-site button,
.edit-site small,
.crawl-stats,
.metric-guide span,
.report-warning,
.forms-grid article span,
.forms-grid article small,
.pair-heading small,
.pair-heading > span,
.comparison-highlights span,
.page-comparison-heading p,
.paired-urls a,
.paired-urls span,
.metric-pair small,
.site-manager > div > p:last-child,
.add-site-form label,
.site-limit-note,
.remove-site-form button,
.primary-site-note,
.recommendation-card header small,
.recommendation-meta span,
.recommendation-meta small,
.recommendation-item em,
.recommendation-card footer {
    font-size: 12px;
}

label > span,
input,
textarea,
select,
.add-site-form input,
.text-button,
.recommendations-link,
.recommendation-item p,
.recommendation-empty p {
    font-size: 14px;
}

.step-badge,
.section-heading > span,
.status,
.mini-stats span,
th,
.factor-card-top span,
.factor-card footer span,
.factor-card footer a,
.source-error,
.source-status,
.score-notes-grid small,
.versus,
.delta,
.verdict,
.similarity-score,
.no-pair,
.page-type,
.pair-counts span,
.paired-urls i,
.site-role,
.recommendation-meta span,
.recommendation-meta small {
    font-size: 11px;
}

table {
    font-size: 13px;
}

td small,
.factor-cell span,
.issues span {
    font-size: 12px;
}

.audit-hero-copy > p:not(.eyebrow) {
    font-size: 16px;
}

.audit-capabilities span,
.audit-form small,
.audit-overview-copy > p:last-child,
.audit-recommendation em,
.audit-group > summary span,
.audit-check small,
.audit-empty p {
    font-size: 12px;
}

.audit-form label,
.audit-overview-copy > a,
.audit-recommendation p,
.audit-check p {
    font-size: 13px;
}

.audit-form input,
.audit-check h3,
.audit-empty h3 {
    font-size: 14px;
}

.audit-score span,
.audit-stats span,
.audit-page-summary span,
.audit-recommendation > div span,
.audit-recommendation > div small,
.audit-group > summary em,
.audit-check > em {
    font-size: 11px;
}

.audit-page-summary b {
    font-size: 13px;
}

.audit-recommendation h3,
.audit-group > summary b {
    font-size: 15px;
}

.audit-item-details {
    margin-top: 12px;
    border: 1px solid #e4eadf;
    border-radius: 13px;
    background: #fbfcfa;
}

.audit-item-details > summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    color: var(--green-dark);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    list-style: none;
}

.audit-item-details > summary::-webkit-details-marker {
    display: none;
}

.audit-item-details > summary::before {
    content: '+';
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #e9f5dc;
    font-size: 14px;
    line-height: 1;
}

.audit-item-details[open] > summary::before {
    content: '−';
}

.audit-item-details > summary b {
    min-width: 23px;
    margin-left: auto;
    padding: 2px 7px;
    border-radius: 20px;
    background: #edf2e8;
    color: #65705f;
    font-size: 11px;
    text-align: center;
}

.audit-item-details ol {
    max-height: 430px;
    overflow: auto;
    margin: 0;
    padding: 0;
    border-top: 1px solid #e8ece5;
    list-style: none;
}

.audit-item-details li {
    display: grid;
    grid-template-columns: minmax(105px, auto) minmax(0, 1fr);
    gap: 4px 10px;
    padding: 11px 12px;
    border-bottom: 1px solid #edf0eb;
}

.audit-item-details li:last-child {
    border-bottom: 0;
}

.audit-item-details li > span {
    color: #59645d;
    font-size: 12px;
    font-weight: 800;
}

.audit-item-details code {
    overflow-wrap: anywhere;
    color: #34403a;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 12px;
    white-space: normal;
}

.audit-item-details li > small {
    grid-column: 2;
    margin: 0;
    color: #768079;
    font-size: 12px;
    line-height: 1.45;
}

.audit-item-details .audit-item-details-more {
    display: block;
    color: #7d6941;
    font-size: 12px;
}

.positions-query-recommendation-list {
    max-height: 430px;
    overflow: auto;
    margin: 0;
    padding: 0;
    border-top: 1px solid #e8ece5;
}

.positions-query-recommendation-list > div {
    display: grid;
    grid-template-columns: minmax(150px, auto) minmax(0, 1fr);
    gap: 4px 10px;
    padding: 11px 12px;
    border-bottom: 1px solid #edf0eb;
}

.positions-query-recommendation-list > div:last-child {
    border-bottom: 0;
}

.positions-query-recommendation-list dt {
    color: #59645d;
    font-size: 12px;
    font-weight: 600;
}

.positions-query-recommendation-list dd {
    margin: 0;
    color: #768079;
    font-size: 12px;
    line-height: 1.45;
}

.positions-query-recommendation-list a {
    overflow-wrap: anywhere;
}

@media (max-width: 620px) {
    .audit-item-details li {
        grid-template-columns: 1fr;
    }

    .audit-item-details li > small {
        grid-column: 1;
    }

    .positions-query-recommendation-list > div {
        grid-template-columns: 1fr;
    }
}

/* Winners / losers */
.trends-toolbar > form:first-child {
    display: grid;
    grid-template-columns: minmax(170px, 1.1fr) minmax(125px, .7fr) repeat(2, minmax(135px, .72fr)) minmax(150px, .85fr) repeat(3, minmax(135px, .75fr)) minmax(190px, 1.1fr) auto;
    gap: 10px;
    align-items: end;
    width: 100%;
}

.trends-toolbar label {
    min-width: 0;
}

.trends-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.trends-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.trends-column {
    overflow: hidden;
    border: 1px solid #e0e7dc;
    border-radius: 18px;
    background: #f9fbf7;
}

.trends-column > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid #e0e7dc;
    background: #f3f8ed;
}

.trends-column.is-declining > header {
    background: #fcf3f1;
}

.trends-column > header h3,
.trends-column > header p {
    margin: 0;
}

.trends-column > header h3 {
    color: #304038;
    font-size: 1.08rem;
    font-weight: 650;
}

.trends-column > header p {
    margin-top: 4px;
    color: #758078;
    font-size: .78rem;
}

.trends-column > header > b {
    min-width: 34px;
    padding: 5px 9px;
    border-radius: 99px;
    background: #dff0ca;
    color: #528516;
    font-size: .84rem;
    text-align: center;
}

.trends-column.is-declining > header > b {
    background: #f5ded9;
    color: #a24b41;
}

.trend-card {
    padding: 20px 22px;
    border-bottom: 1px solid #e3e9df;
    background: #fff;
}

.trend-card:last-child {
    border-bottom: 0;
}

.trend-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.trend-card-heading > div:first-child {
    min-width: 0;
}

.trend-card-heading > div:first-child > span {
    display: block;
    margin-bottom: 5px;
    color: #748078;
    font-size: .69rem;
    font-weight: 610;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.trend-card-heading h3 {
    margin: 0;
    overflow-wrap: anywhere;
    color: #29372f;
    font-size: .94rem;
    font-weight: 620;
    line-height: 1.4;
}

.trend-card-heading h3 a {
    color: var(--green-dark);
}

.trend-score {
    flex: 0 0 auto;
    min-width: 67px;
    text-align: right;
}

.trend-score b,
.trend-score small {
    display: block;
}

.trend-score b {
    color: #64a51a;
    font-size: 1.25rem;
    font-weight: 670;
}

.is-declining .trend-score b {
    color: #b05248;
}

.trend-score small {
    margin-top: 1px;
    color: #879189;
    font-size: .65rem;
}

.trend-card-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 16px;
}

.trend-card-metrics > span {
    padding: 10px 11px;
    border: 1px solid #e7ece4;
    border-radius: 10px;
    background: #fafcf9;
}

.trend-card-metrics small,
.trend-card-metrics b,
.trend-card-metrics em {
    display: block;
}

.trend-card-metrics small {
    color: #7a857e;
    font-size: .68rem;
}

.trend-card-metrics b {
    margin-top: 2px;
    color: #334139;
    font-size: .85rem;
    font-weight: 620;
}

.trend-card-metrics em {
    margin-top: 2px;
    color: #7d8881;
    font-size: .69rem;
    font-style: normal;
}

.trend-card-metrics em.is-up {
    color: #609a1d;
}

.trend-card-metrics em.is-down {
    color: #ae5147;
}

.trend-signal {
    margin: 14px 0 0;
    color: #5d6962;
    font-size: .79rem;
    line-height: 1.55;
}

.trend-signal b {
    color: #3a493f;
    font-weight: 630;
}

.trend-card details {
    margin-top: 12px;
    border-top: 1px solid #e7ece4;
}

.trend-card details summary {
    padding-top: 11px;
    color: var(--green-dark);
    cursor: pointer;
    font-size: .76rem;
    font-weight: 600;
}

.trend-card details > div {
    padding-top: 8px;
}

.trend-card details p {
    margin: 0 0 7px;
    color: #68746c;
    font-size: .75rem;
    line-height: 1.5;
}

.trend-card details p b {
    color: #455249;
    font-weight: 620;
}

.trend-column-empty {
    padding: 28px 22px;
    color: #77827b;
    font-size: .82rem;
}

@media (max-width: 1550px) {
    .trends-toolbar > form:first-child {
        grid-template-columns: repeat(5, minmax(150px, 1fr));
    }
}

@media (max-width: 1050px) {
    .trends-columns {
        grid-template-columns: 1fr;
    }

    .trends-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .trends-toolbar > form:first-child {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }
}

@media (max-width: 700px) {
    .trends-summary,
    .trends-toolbar > form:first-child {
        grid-template-columns: 1fr;
    }

    .trend-card {
        padding: 18px;
    }
}

/* Accounts and access control */
.access-shell { min-height: 60vh; display: grid; place-items: center; }
.access-card { width: min(100%, 480px); }
.access-card h1 { margin-bottom: 0; font-size: 48px; }
.access-check { display: flex; align-items: flex-start; gap: 10px; margin: 10px 0; }
.access-check input { width: auto; margin-top: 4px; }
.access-check > span { display: block; margin: 0; font-weight: 650; }
.account-hero h1 { font-size: clamp(36px, 5vw, 56px); }
.account-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 22px; }
.account-status { display: inline-flex; padding: 5px 9px; border-radius: 99px; background: #fff0ee; color: var(--red); font-size: 11px; font-weight: 800; }
.account-status.is-active { background: #e4f5e8; color: var(--green); }
.account-details { display: grid; grid-template-columns: 110px 1fr; gap: 10px; margin: 0; font-size: 13px; }
.account-details dt { color: var(--muted); }
.account-details dd { margin: 0; font-weight: 700; }
.account-placeholder { margin-top: 26px; padding: 16px; border-radius: 12px; background: var(--paper); }
.account-placeholder p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.account-form { display: grid; gap: 22px; }
.account-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
.access-options { display: grid; gap: 5px; margin-top: 20px; }
.access-options > b { margin-bottom: 5px; }
.account-actions { display: flex; gap: 10px; }
.topbar-actions form { margin: 0; }
.account-connections { margin-top: 22px; }
.connection-list { display: grid; gap: 12px; margin-top: 16px; }
.connection-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.connection-card h3 { margin: 9px 0 4px; font-size: 17px; }
.connection-card p { margin: 0 0 7px; color: var(--muted); font-size: 13px; }
.connection-card small { display: block; margin-top: 4px; color: var(--muted); }
.connection-card small.is-error { color: var(--red); }
.connection-actions { display: flex; min-width: 220px; align-items: flex-end; flex-direction: column; gap: 9px; }
.connection-actions > span { color: var(--muted); font-size: 12px; }
.connection-reconnect-form { display: grid; width: min(100%, 340px); gap: 9px; }
.connection-reconnect-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; }
.connection-reconnect-form input { width: 100%; }
@media (max-width: 800px) {
    .account-grid, .account-fields { grid-template-columns: 1fr; }
    .connection-card { flex-direction: column; }
    .connection-actions { width: 100%; min-width: 0; align-items: flex-start; }
}

/* Personal Cabinet entity, provider and resource states */
.account-seo-sites,
.account-profile,
.comparison-projects-panel,
.account-connections {
    padding: 28px;
}

.account-section-copy {
    max-width: 760px;
    margin: -13px 0 20px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.55;
}

.account-entity-list {
    gap: 10px;
}

.account-entity-main {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.account-entity-main > b {
    font-size: 16px;
    font-weight: 650;
}

.entity-type,
.connection-state,
.resource-state {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    border-radius: 99px;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.2;
}

.entity-type {
    margin-bottom: 2px;
    padding: 4px 8px;
    letter-spacing: .02em;
}

.entity-type.is-seo-site {
    background: #e8f3dd;
    color: var(--green-dark);
}

.entity-type.is-comparison {
    background: #e9edf3;
    color: #465568;
}

.account-entity-meta,
.resource-state-list,
.external-resource-state {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.account-entity-meta {
    margin-top: 4px;
}

.account-entity-meta span {
    color: var(--muted);
    font-size: 12px;
}

.account-entity-meta span + span::before {
    margin-right: 6px;
    content: "·";
}

.seo-site-card {
    border-left: 4px solid #8abf4e;
    background: #fbfdf9;
}

.comparison-project-card {
    grid-template-columns: 1fr auto;
    border-left: 4px solid #718197;
    background: #f7f9fc;
}

.comparison-project-card:hover {
    border-color: #9eabb9;
    border-left-color: #55677d;
}

.comparison-project-card .circle-arrow {
    background: #55677d;
}

.account-empty-state {
    padding: 18px;
    border: 1px dashed #dce2df;
    border-radius: 16px;
    background: #fafbfa;
}

.account-empty-state p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.workspace-resource-candidates {
    display: grid;
    gap: 14px;
    margin-top: 20px;
    padding: 18px;
    border: 1px solid #dce9d2;
    border-radius: 16px;
    background: #f8fcf5;
    scroll-margin-top: 20px;
}

.workspace-resource-candidates h3,
.workspace-resource-candidates p {
    margin: 0;
}

.workspace-resource-candidates > div:first-child > p:last-child {
    margin-top: 5px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
}

.workspace-resource-candidates .metrica-counter {
    grid-template-columns: minmax(0, 1fr) auto;
}

.workspace-resource-candidates .metrica-counter.is-return-target {
    margin: 0 -10px;
    padding: 12px 10px;
    border-radius: 12px;
    background: #eef8e7;
}

.resource-row-summary {
    display: grid;
    min-width: 0;
    gap: 5px;
}

.resource-row-summary small {
    overflow-wrap: anywhere;
    color: var(--muted);
}

.resource-state-list {
    margin-top: 3px;
}

.resource-state {
    padding: 4px 7px;
    background: #f0f2f1;
    color: #616a66;
}

.resource-state.is-role {
    background: #edf1f5;
    color: #526172;
}

.resource-state.is-active {
    background: #e4f5e8;
    color: var(--green-dark);
}

.resource-state.is-archived,
.resource-state.is-excluded {
    background: #fff0e3;
    color: #8a5d2e;
}

.connection-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px 24px;
    border-left: 4px solid #d8ddda;
    padding: 18px 20px;
}

.connection-card.is-connected {
    border-left-color: #70ae37;
}

.connection-card.is-attention {
    border-left-color: #d5963d;
}

.connection-summary h3 {
    font-weight: 650;
}

.connection-state {
    padding: 5px 9px;
    background: #edf0ef;
    color: #66706b;
}

.connection-state.is-connected {
    background: #e4f5e8;
    color: var(--green-dark);
}

.connection-state.is-attention {
    background: #fff0dc;
    color: #8b5c1e;
}

.connection-state.is-disconnected {
    background: #fff0ee;
    color: var(--red);
}

.connection-actions {
    min-width: 180px;
}

.connection-actions form {
    margin: 0;
}

.connection-help,
.connection-resources {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
}

.connection-help summary,
.connection-resources summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 14px;
    cursor: pointer;
    color: var(--green-dark);
    font-size: 13px;
    font-weight: 650;
}

.connection-help summary small,
.connection-resources summary small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 450;
}

.connection-help-body {
    display: grid;
    gap: 14px;
    margin-top: 13px;
    padding: 16px;
    border-radius: 14px;
    background: #f7f9f6;
    color: #4c5651;
    font-size: 13px;
}

.connection-help-body ol {
    display: grid;
    gap: 7px;
    margin: 0;
    padding-left: 20px;
}

.connection-help-body code {
    overflow-wrap: anywhere;
}

.connection-help-permissions {
    display: grid;
    gap: 5px;
}

.connection-help-permissions .resource-state-list {
    margin: 0;
}

.connection-help-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 0;
}

.connection-help-privacy,
.account-footnote {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.connection-token-form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    align-items: end;
    gap: 10px;
    max-width: 620px;
}

.connection-token-form label {
    display: grid;
    gap: 5px;
}

.connection-resources[open] summary {
    margin-bottom: 4px;
}

.connection-resources .metrica-counter-list {
    gap: 0;
}

.connection-resources .metrica-counter {
    grid-template-columns: minmax(220px, 1fr) auto;
}

.external-resource-state {
    margin-top: 5px;
}

.account-footnote {
    margin-top: 16px;
}

@media (max-width: 800px) {
    .account-seo-sites,
    .account-profile,
    .comparison-projects-panel,
    .account-connections {
        padding: 20px;
    }

    .connection-card {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 16px;
    }

    .connection-actions {
        width: 100%;
        min-width: 0;
        align-items: flex-start;
    }

    .connection-help,
    .connection-resources {
        grid-column: 1;
    }

    .connection-help summary,
    .connection-resources summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }


    .workspace-resource-candidates .metrica-counter {
        grid-template-columns: 1fr;
    }

    .workspace-resource-candidates .button {
        width: 100%;
    }

    .connection-token-form {
        grid-template-columns: 1fr;
    }

    .connection-token-form .button {
        width: 100%;
    }

    .connection-resources .metrica-counter {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .connection-resources .metrica-sync-form {
        width: 100%;
        justify-content: space-between;
    }

    .account-entity-meta span + span::before {
        content: none;
    }
}

/* CTR baseline and opportunities */
.ctr-toolbar > form:first-child {
    display: grid;
    grid-template-columns: minmax(170px, 1.1fr) repeat(6, minmax(135px, .75fr)) minmax(190px, 1.1fr) auto;
    gap: 10px;
    align-items: end;
    width: 100%;
}

.ctr-toolbar label {
    min-width: 0;
}

.ctr-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ctr-baseline-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(130px, 1fr));
    gap: 10px;
}

.ctr-baseline-grid article {
    padding: 16px;
    border: 1px solid #dfe7db;
    border-radius: 13px;
    background: #fbfcfa;
}

.ctr-baseline-grid article.is-insufficient {
    background: #f7f8f6;
    opacity: .78;
}

.ctr-baseline-grid header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.ctr-baseline-grid header span {
    color: #5f6c64;
    font-size: .72rem;
    line-height: 1.35;
}

.ctr-baseline-grid header b {
    color: #4f8612;
    font-size: 1rem;
    font-weight: 660;
    white-space: nowrap;
}

.ctr-baseline-grid > article > i {
    display: block;
    height: 7px;
    margin-top: 13px;
    overflow: hidden;
    border-radius: 99px;
    background: #e7ece3;
}

.ctr-baseline-grid > article > i span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #91ca49, #5f9e16);
}

.ctr-baseline-grid p {
    margin: 12px 0 4px;
    color: #45534a;
    font-size: .75rem;
}

.ctr-baseline-grid small {
    display: block;
    color: #7b867e;
    font-size: .68rem;
    line-height: 1.4;
}

.ctr-opportunity-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.ctr-opportunity-card {
    padding: 22px;
    border: 1px solid #dfe7db;
    border-left: 4px solid #9cbd72;
    border-radius: 15px;
    background: #fff;
}

.ctr-opportunity-card.priority-high {
    border-left-color: #d56d5f;
}

.ctr-opportunity-card.priority-medium {
    border-left-color: #d6a74c;
}

.ctr-opportunity-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.ctr-opportunity-card > header > div:first-child {
    min-width: 0;
}

.ctr-opportunity-card > header span {
    display: block;
    margin-bottom: 5px;
    color: #7b867e;
    font-size: .68rem;
    font-weight: 610;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.ctr-opportunity-card h3 {
    margin: 0;
    overflow-wrap: anywhere;
    color: #2f3d35;
    font-size: .98rem;
    font-weight: 630;
    line-height: 1.4;
}

.ctr-opportunity-card h3 a {
    color: var(--green-dark);
}

.ctr-potential {
    flex: 0 0 auto;
    text-align: right;
}

.ctr-potential b,
.ctr-potential small {
    display: block;
}

.ctr-potential b {
    color: #619f19;
    font-size: 1.28rem;
    font-weight: 670;
}

.ctr-potential small {
    color: #818c84;
    font-size: .65rem;
}

.ctr-opportunity-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 17px;
}

.ctr-opportunity-metrics > span {
    padding: 10px;
    border-radius: 9px;
    background: #f6f8f4;
}

.ctr-opportunity-metrics small,
.ctr-opportunity-metrics b,
.ctr-opportunity-metrics em {
    display: block;
}

.ctr-opportunity-metrics small {
    color: #7b867e;
    font-size: .67rem;
}

.ctr-opportunity-metrics b {
    margin-top: 2px;
    color: #39473e;
    font-size: .84rem;
    font-weight: 630;
}

.ctr-opportunity-metrics em {
    color: #7e8981;
    font-size: .67rem;
    font-style: normal;
}

.ctr-opportunity-card > p {
    margin: 15px 0 0;
    color: #5e6a62;
    font-size: .8rem;
    line-height: 1.55;
}

.ctr-opportunity-card > p b {
    color: #3d4b42;
    font-weight: 630;
}

.ctr-opportunity-card details {
    margin-top: 13px;
    border-top: 1px solid #e5ebe2;
}

.ctr-opportunity-card summary {
    padding-top: 11px;
    color: var(--green-dark);
    cursor: pointer;
    font-size: .75rem;
    font-weight: 610;
}

.ctr-opportunity-card details div {
    padding-top: 8px;
}

.ctr-opportunity-card details p {
    margin: 0 0 7px;
    color: #69756d;
    font-size: .75rem;
    line-height: 1.5;
}

.ctr-opportunity-card details p b {
    color: #46534a;
    font-weight: 620;
}

@media (max-width: 1500px) {
    .ctr-toolbar > form:first-child {
        grid-template-columns: repeat(5, minmax(150px, 1fr));
    }

    .ctr-baseline-grid {
        grid-template-columns: repeat(4, minmax(150px, 1fr));
    }
}

@media (max-width: 1000px) {
    .ctr-toolbar > form:first-child {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }

    .ctr-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ctr-opportunity-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .ctr-toolbar > form:first-child,
    .ctr-summary,
    .ctr-baseline-grid {
        grid-template-columns: 1fr;
    }

    .ctr-opportunity-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 92px;
    padding: 26px;
    background: #242b31;
    color: #c7cdd1;
    font-size: 12px;
}

.footer img {
    width: 30px;
    height: 30px;
}

.footer b {
    color: white;
}

@media (max-width: 900px) {
    .audit-hero,
    .audit-overview {
        grid-template-columns: 1fr;
    }

    .audit-score {
        width: 112px;
        height: 112px;
    }

    .audit-score::before {
        width: 88px;
        height: 88px;
    }

    .audit-page-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .audit-empty {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-manager {
        grid-template-columns: 1fr;
    }

    .hero,
    .project-hero {
        padding: 38px;
    }

    .hero-stat {
        display: none;
    }
}

@media (max-width: 620px) {
    .topbar {
        height: 76px;
    }

    .topbar-actions {
        display: none;
    }

    .brand-mark {
        width: 40px;
        height: 40px;
    }

    .brand b {
        font-size: 16px;
    }

    .shell {
        padding: 26px 14px 60px;
    }

    .site-manager {
        padding: 22px;
        border-radius: 24px;
    }

    .audit-hero {
        padding: 24px;
        border-radius: 24px;
    }

    .audit-page-summary,
    .audit-empty {
        grid-template-columns: 1fr;
    }

    .audit-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .audit-check {
        grid-template-columns: 26px minmax(0, 1fr);
    }

    .audit-check > em {
        display: none;
    }

    .add-site-form > div {
        align-items: stretch;
        flex-direction: column;
    }

    .hero,
    .project-hero,
    .projects-section,
    .report-section {
        padding: 24px;
        border-radius: 24px;
    }

    h1 {
        font-size: 37px;
    }

    .panel,
    .site-card {
        border-radius: 22px;
    }

    .panel-form,
    .explainer {
        padding: 24px;
    }
}

/* Yandex Webmaster positions */
.positions-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 34px;
    padding: 38px 42px;
    border: 1px solid #edf0eb;
    border-radius: 30px;
    background: radial-gradient(circle at 95% 5%, rgba(143, 210, 31, .17), transparent 31%), #fff;
    box-shadow: var(--shadow);
}

.positions-hero h1 {
    margin-bottom: 14px;
}

.positions-hero > div:first-child > p:last-child {
    max-width: 850px;
    margin: 0;
    color: var(--muted);
    font-size: 16px;
}

.positions-source-status {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 250px;
    padding: 18px 20px;
    border: 1px solid #eadfd9;
    border-radius: 20px;
    background: #fbf3ef;
    color: #985943;
}

.positions-source-status.is-connected {
    border-color: #dce9cc;
    background: #f1f8e8;
    color: var(--green-dark);
}

.positions-source-status b,
.positions-source-status span {
    display: block;
}

.positions-source-status b {
    font-size: 14px;
}

.positions-source-status span {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
}

.positions-connect-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    max-width: 1280px;
    margin: 24px auto 0;
}

.positions-setup,
.positions-token-panel {
    padding: 30px;
}

.positions-setup ol {
    display: grid;
    gap: 9px;
    margin: 0 0 22px;
    padding-left: 22px;
    color: #58635d;
    font-size: 14px;
}

.positions-setup code {
    overflow-wrap: anywhere;
    font-size: 12px;
}

.positions-client-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 13px;
}

.positions-client-form label {
    margin: 0;
}

.positions-token-panel > p {
    color: var(--muted);
    font-size: 14px;
}

.positions-privacy {
    display: flex;
    gap: 9px;
    margin-top: 16px;
    padding: 12px 14px;
    border-radius: 13px;
    background: #f4f8ef;
    color: #697563;
    font-size: 12px;
}

.positions-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-top: 22px;
    padding: 20px;
    border: 1px solid #edf0eb;
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--shadow);
    flex-wrap: wrap;
}

.positions-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(145px, .7fr) 110px minmax(180px, .8fr) minmax(180px, .8fr) auto;
    align-items: end;
    gap: 10px;
    flex: 1 1 auto;
    width: 100%;
}

.positions-filters label {
    min-width: 0;
    margin: 0;
}

.positions-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    width: 100%;
    justify-content: flex-end;
    padding-top: 3px;
}

.report-pdf-action {
    white-space: nowrap;
}

.report-action-toolbar {
    padding: 14px 16px;
}

.report-action-toolbar .positions-toolbar-actions {
    padding-top: 0;
}

.positions-site-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 22px;
    padding: 24px 28px;
    border: 1px solid #edf0eb;
    border-radius: 24px;
    background: #fff;
}

.positions-site-heading h2 {
    margin-bottom: 4px;
}

.positions-site-heading a {
    font-size: 13px;
}

.positions-site-meta {
    display: flex;
    align-items: center;
    justify-content: end;
    flex-wrap: wrap;
    gap: 8px 13px;
    color: var(--muted);
    font-size: 12px;
}

.positions-site-meta > span {
    padding: 6px 9px;
    border-radius: 30px;
    background: #f1f3f2;
}

.positions-site-meta > span.is-ok {
    background: #eaf6dc;
    color: var(--green-dark);
}

.positions-site-meta > span.is-error {
    background: #f9e7e2;
    color: #9c4c39;
}

.positions-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.positions-summary article {
    padding: 18px 20px;
    border: 1px solid #edf0eb;
    border-radius: 19px;
    background: #fff;
}

.positions-summary span,
.positions-summary b {
    display: block;
}

.positions-summary span {
    color: var(--muted);
    font-size: 12px;
}

.positions-summary b {
    margin-top: 4px;
    font-size: 27px;
}

.positions-summary article.is-up b,
.position-change.is-up,
.position-cell small.is-up {
    color: #4f8d10;
}

.positions-summary article.is-down b,
.position-change.is-down,
.position-cell small.is-down {
    color: #b0523d;
}

.positions-calendar-section {
    margin-top: 18px;
    padding: 25px;
    border: 1px solid #edf0eb;
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--shadow);
}

.positions-calendar-wrap {
    max-height: 70vh;
    overflow: auto;
    border: 1px solid #e9ede8;
    border-radius: 17px;
}

.positions-calendar {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12px;
}

.positions-calendar th,
.positions-calendar td {
    min-width: 68px;
    padding: 8px 6px;
    border-right: 1px solid #eef1ed;
    border-bottom: 1px solid #eef1ed;
    text-align: center;
    vertical-align: middle;
}

.positions-calendar th {
    position: sticky;
    z-index: 3;
    top: 0;
    height: 57px;
    background: #f7f9f6;
}

.positions-calendar th b,
.positions-calendar th small {
    display: block;
}

.positions-calendar th small {
    margin-top: 2px;
    color: #9aa19c;
    font-size: 11px;
}

.positions-calendar .positions-query-column {
    position: sticky;
    z-index: 2;
    left: 0;
    width: 310px;
    min-width: 310px;
    max-width: 310px;
    background: #fff;
    text-align: left;
}

.positions-calendar thead .positions-query-column,
.positions-calendar thead .positions-total-column {
    z-index: 5;
    background: #f7f9f6;
}

.positions-calendar .positions-total-column {
    position: sticky;
    z-index: 2;
    left: 310px;
    min-width: 74px;
    background: #fbfcfb;
}

.positions-query-column > b,
.positions-query-column > a,
.positions-query-column > small {
    display: block;
}

.positions-query-column > b,
.positions-query-column > a {
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.positions-query-link {
    color: #27312c;
    font-weight: 800;
    text-decoration-color: #a8cf7d;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.positions-query-link:hover {
    color: #62a914;
}

.positions-query-column > small {
    margin-top: 3px;
    color: #929a95;
    font-size: 11px;
}

.position-cell {
    display: grid;
    place-items: center;
    min-height: 42px;
    padding: 4px;
    border-radius: 9px;
    background: #f2f4f2;
}

.position-cell b {
    font-size: 13px;
}

.position-cell small {
    font-size: 11px;
    font-weight: 800;
}

.position-cell.is-top3,
.positions-legend i.is-top3 { background: #dff2c9; color: #397608; }
.position-cell.is-top10,
.positions-legend i.is-top10 { background: #edf6df; color: #598426; }
.position-cell.is-top30,
.positions-legend i.is-top30 { background: #fff3cf; color: #896511; }
.position-cell.is-low,
.positions-legend i.is-low { background: #f8e9e4; color: #a0523d; }
.position-cell.is-empty { color: #a8aeaa; }

.position-change {
    font-size: 12px;
    font-weight: 850;
}

.positions-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 13px;
    color: #69736d;
    font-size: 11px;
}

.positions-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.positions-legend i {
    width: 13px;
    height: 13px;
    border-radius: 4px;
}

.positions-legend small {
    margin-left: auto;
    font-size: 11px;
}

.positions-empty {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 20px;
    padding: 24px;
    border: 1px dashed #dfe6d7;
    border-radius: 20px;
    background: #f7faF3;
    color: var(--green-dark);
}

.positions-empty h3,
.positions-empty p {
    margin: 0;
}

.positions-empty p {
    margin-top: 4px;
    color: var(--muted);
    font-size: 13px;
}

.positions-connection-settings {
    max-width: 760px;
    margin-top: 20px;
    color: var(--muted);
    font-size: 12px;
}

.positions-connection-settings summary {
    cursor: pointer;
    font-weight: 800;
}

.positions-connection-settings > div {
    margin-top: 10px;
    padding: 14px;
    border-radius: 14px;
    background: #fff;
}

.positions-connection-settings p {
    margin-bottom: 7px;
}

@media (max-width: 1100px) {
    .positions-toolbar,
    .positions-site-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .positions-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .positions-site-meta {
        justify-content: start;
    }
}

@media (max-width: 760px) {
    .positions-hero,
    .positions-connect-grid {
        grid-template-columns: 1fr;
    }

    .positions-hero {
        padding: 26px;
    }

    .positions-source-status {
        min-width: 0;
    }

    .positions-client-form,
    .positions-filters,
    .positions-summary {
        grid-template-columns: 1fr;
    }

    .positions-toolbar-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .positions-toolbar-actions .button,
    .positions-toolbar-actions form {
        width: 100%;
    }

    .positions-calendar .positions-query-column {
        width: 220px;
        min-width: 220px;
        max-width: 220px;
    }

    .positions-calendar .positions-total-column {
        left: 220px;
    }
}

/* Style guide and shared loading feedback */

.operation-progress {
    position: fixed;
    z-index: 1000;
    right: 20px;
    bottom: 20px;
    width: min(430px, calc(100vw - 32px));
    padding: 18px;
    border: 1px solid #d9e4d1;
    border-radius: 18px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 22px 70px rgba(24, 47, 37, .2);
    color: var(--ink);
}

.operation-progress-heading {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: start;
    gap: 11px;
}

.operation-progress-heading b,
.operation-progress-heading p {
    display: block;
    margin: 0;
}

.operation-progress-heading b {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
}

.operation-progress-heading p {
    margin-top: 3px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
}

.operation-progress-heading time {
    color: var(--green);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.operation-progress-spinner,
.progress-button-spinner {
    display: inline-block;
    flex: 0 0 auto;
    border: 2px solid #dce8d4;
    border-top-color: #6cab25;
    border-radius: 50%;
    animation: operation-spin .8s linear infinite;
}

.operation-progress-spinner {
    width: 20px;
    height: 20px;
    margin-top: 1px;
}

.progress-button-spinner {
    width: 14px;
    height: 14px;
}

.operation-progress-track {
    height: 5px;
    margin: 15px 0 10px;
    overflow: hidden;
    border-radius: 99px;
    background: #e9eee6;
}

.operation-progress-track span {
    display: block;
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #80bd34, #b9df61);
    animation: operation-progress 1.25s ease-in-out infinite;
}

.operation-progress > small {
    display: block;
    color: #717b75;
    font-size: 13px;
    line-height: 1.4;
}

body.is-processing {
    cursor: progress;
}

body.is-processing form[aria-busy="true"] {
    opacity: .72;
}

@keyframes operation-spin {
    to { transform: rotate(360deg); }
}

@keyframes operation-progress {
    from { transform: translateX(-120%); }
    to { transform: translateX(250%); }
}

.type-guide-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    align-items: end;
    gap: 48px;
    padding: 24px 0 44px;
}

.type-guide-hero h1 {
    max-width: 850px;
    margin: 0 0 22px;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: clamp(40px, 4.4vw, 60px);
    font-weight: 700;
    letter-spacing: -.045em;
    line-height: 1.04;
}

.type-guide-hero h1 span {
    color: #6cac21;
}

.type-guide-overline {
    margin: 0 0 10px;
    color: #5d941d;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.type-guide-lead {
    max-width: 72ch;
    margin: 0;
    color: #5f6a64;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.65;
}

.type-guide-decision {
    padding: 23px;
    border: 1px solid #d6e4ca;
    border-radius: 19px;
    background: #eff7e5;
}

.type-guide-decision b,
.type-guide-decision span,
.type-guide-decision small {
    display: block;
}

.type-guide-decision b {
    font-size: 15px;
    font-weight: 600;
}

.type-guide-decision span {
    margin-top: 7px;
    color: #4d8610;
    font-size: 21px;
    font-weight: 600;
}

.type-guide-decision small {
    margin-top: 10px;
    color: #667366;
    font-size: 13px;
    line-height: 1.5;
}

.type-guide-principles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    margin-bottom: 18px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--line);
}

.type-guide-principles article {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    padding: 22px;
    background: #fff;
}

.type-guide-principles article > span {
    color: #69a824;
    font-size: 13px;
    font-weight: 600;
}

.type-guide-principles b {
    display: block;
    font-size: 16px;
    font-weight: 600;
}

.type-guide-principles p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.55;
}

.type-guide-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.type-guide-panel {
    margin-top: 18px;
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 12px 42px rgba(24, 47, 37, .05);
}

.type-guide-panel > header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.type-guide-panel > header h2 {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.15;
}

.type-guide-panel > header > span {
    flex: 0 0 auto;
    color: #758078;
    font-size: 13px;
}

.type-scale-list {
    display: grid;
    gap: 0;
}

.type-scale-list > div {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 14px;
    padding: 17px 0;
    border-top: 1px solid #edf0ec;
}

.type-scale-list code {
    color: #66815a;
    font-size: 12px;
}

.type-scale-list strong,
.type-scale-list p {
    display: block;
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.type-scale-list small {
    color: #7e8982;
    font-size: 12px;
    text-align: right;
}

.type-sample-display { font-size: 34px; font-weight: 700; letter-spacing: -.035em; line-height: 1.08; }
.type-sample-h1 { font-size: 29px; font-weight: 700; letter-spacing: -.025em; line-height: 1.15; }
.type-sample-h2 { font-size: 24px; font-weight: 600; letter-spacing: -.02em; line-height: 1.2; }
.type-sample-h3 { font-size: 20px; font-weight: 600; line-height: 1.3; }
.type-sample-body { max-width: 48ch; font-size: 16px; font-weight: 400; line-height: 1.55; }
.type-sample-meta { color: #6d7871; font-size: 13px; font-weight: 500; line-height: 1.45; }

.type-weight-list {
    display: grid;
    gap: 10px;
}

.type-weight-list p {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin: 0;
    padding: 13px 15px;
    border-radius: 12px;
    background: #f7f9f6;
    font-size: 16px;
}

.type-weight-list span {
    width: 34px;
    color: #70a832;
    font-size: 12px;
    font-weight: 500;
}

.type-weight-list .is-regular { font-weight: 400; }
.type-weight-list .is-medium { font-weight: 500; }
.type-weight-list .is-semibold { font-weight: 600; }
.type-weight-list .is-bold { font-weight: 700; }

.type-guide-note {
    margin-top: 22px;
    padding: 18px;
    border-left: 3px solid #92c950;
    border-radius: 0 13px 13px 0;
    background: #f4f8ef;
}

.type-guide-note b {
    font-size: 14px;
    font-weight: 600;
}

.type-guide-note p,
.type-guide-copy {
    max-width: 72ch;
    margin: 6px 0 0;
    color: #657068;
    font-size: 15px;
    line-height: 1.6;
}

.type-query-demo {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr) 100px 110px;
    align-items: center;
    gap: 0;
    margin-top: 22px;
    overflow: hidden;
    border: 1px solid #e4eae2;
    border-radius: 15px;
}

.type-query-demo > div {
    min-width: 0;
    min-height: 76px;
    padding: 15px 17px;
    border-right: 1px solid #e8ede7;
    background: #fbfcfa;
}

.type-query-demo > div:last-child {
    border-right: 0;
}

.type-query-position,
.type-query-change {
    display: grid;
    align-content: center;
    text-align: center;
}

.type-query-position small,
.type-query-change small {
    color: #78827c;
    font-size: 12px;
}

.type-query-position b,
.type-query-change b {
    margin-top: 3px;
    font-size: 21px;
    font-weight: 700;
}

.type-query-change.is-up b {
    color: #4f8d10;
}

.type-action-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.type-action-row .button {
    font-size: 14px;
    font-weight: 600;
}

.type-action-row > a {
    color: var(--green);
    font-size: 14px;
    font-weight: 600;
    text-underline-offset: 3px;
}

.type-status {
    padding: 7px 10px;
    border-radius: 99px;
    background: #eaf6dc;
    color: #43770d;
    font-size: 13px;
    font-weight: 500;
}

.type-reading-example {
    max-width: 72ch;
    margin-top: 30px;
    padding-top: 24px;
    border-top: 1px solid #e8ece8;
}

.type-reading-example h3 {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 600;
}

.type-reading-example p {
    margin: 0;
    color: #59655e;
    font-size: 16px;
    line-height: 1.6;
}

.style-guide-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 18px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(24, 47, 37, .04);
}

.style-guide-nav a {
    padding: 9px 13px;
    border-radius: 10px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.style-guide-nav a:hover,
.style-guide-nav a:focus-visible {
    background: #eef4ea;
    color: var(--green);
}

.style-guide-foundations {
    margin-top: 0;
}

.style-token-grid,
.style-foundation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.style-token-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    min-width: 0;
    padding: 15px;
    border: 1px solid #e6ebe6;
    border-radius: 15px;
    background: #fbfcfa;
}

.style-swatch {
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    box-shadow: inset 0 0 0 1px rgba(23, 32, 28, .1);
}

.style-swatch.is-ink { background: var(--ink); }
.style-swatch.is-green { background: var(--green); }
.style-swatch.is-lime { background: var(--lime); }
.style-swatch.is-paper { background: linear-gradient(135deg, var(--paper) 0 50%, #fff 50%); }

.style-token-card b,
.style-token-card code,
.style-token-card small {
    display: block;
}

.style-token-card b {
    font-size: 14px;
    font-weight: 600;
}

.style-token-card code {
    margin-top: 3px;
    color: #64815b;
    font-size: 11px;
}

.style-token-card small,
.style-foundation-grid small,
.style-component-card > small {
    margin-top: 7px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}

.style-foundation-grid {
    margin-top: 12px;
}

.style-foundation-grid article {
    padding: 16px;
    border-left: 3px solid #b4d88f;
    border-radius: 0 13px 13px 0;
    background: #f7faf5;
}

.style-foundation-grid .type-guide-overline {
    margin-bottom: 6px;
    font-size: 11px;
}

.style-foundation-grid b,
.style-foundation-grid small {
    display: block;
}

.style-foundation-grid b {
    font-size: 16px;
    font-weight: 600;
}

.style-guide-components,
.style-guide-rules {
    scroll-margin-top: 24px;
}

.style-component-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.style-component-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid #e3e9e3;
    border-radius: 17px;
    background: #fbfcfa;
}

.style-component-card-wide {
    grid-column: span 2;
}

.style-component-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 15px;
}

.style-component-heading > span {
    font-size: 15px;
    font-weight: 600;
}

.style-component-heading code {
    color: #6c7e70;
    font-size: 11px;
    white-space: nowrap;
}

.style-demo-panel {
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 9px 24px rgba(24, 47, 37, .05);
}

.style-demo-panel .eyebrow {
    margin: 0 0 7px;
    color: #609a1d;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.style-demo-panel h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
}

.style-demo-panel > p:not(.eyebrow),
.style-component-card > p {
    margin: 7px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.55;
}

.style-demo-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 17px;
    padding-top: 12px;
    border-top: 1px solid #edf0ec;
    color: var(--muted);
    font-size: 12px;
}

.style-status,
.style-status-list > span {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
}

.style-status.is-success { background: #eaf6dc; color: #43770d; }
.style-status.is-info { background: #eef3ef; color: #58655e; }
.style-status.is-warning { background: #fff2d4; color: #8a6111; }
.style-status.is-danger { background: #fbe9e7; color: var(--red); }

.style-status-list {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    min-height: 35px;
}

.style-kpi-demo {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #e4eae2;
    border-radius: 14px;
    background: #fff;
}

.style-kpi-demo > div {
    padding: 14px;
    border-left: 1px solid #e8ede7;
}

.style-kpi-demo > div:first-child { border-left: 0; }
.style-kpi-demo small,
.style-kpi-demo b { display: block; }
.style-kpi-demo small { color: var(--muted); font-size: 12px; }
.style-kpi-demo b { margin-top: 4px; font-size: 21px; font-weight: 700; }
.style-kpi-demo .is-up b { color: #4f8d10; }
.style-kpi-demo .is-down b { color: var(--red); }

.style-form-demo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    padding: 14px;
    border: 1px solid #e4eae2;
    border-radius: 14px;
    background: #fff;
}

.style-form-demo label,
.style-form-demo label > span { display: block; }
.style-form-demo label { margin-bottom: 0; }
.style-form-demo label > span { margin-bottom: 5px; color: #56615b; font-size: 12px; font-weight: 500; }
.style-form-demo select { width: 100%; min-height: 38px; padding: 8px 28px 8px 10px; border: 1px solid #dce4dd; border-radius: 9px; background: #fff; color: var(--ink); font: inherit; font-size: 13px; }
.style-form-demo .button { align-self: end; min-height: 38px; margin: 0; padding: 8px 13px; font-size: 13px; }

.style-table-demo {
    overflow-x: auto;
    border: 1px solid #e2e8e2;
    border-radius: 14px;
    background: #fff;
}

.style-table-demo table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    font-size: 13px;
}

.style-table-demo th,
.style-table-demo td {
    padding: 11px 13px;
    border-bottom: 1px solid #e9eee9;
    text-align: left;
}

.style-table-demo th { color: #647068; background: #f7f9f6; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.style-table-demo tr:last-child td { border-bottom: 0; }
.style-table-demo td > small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.style-table-demo a { color: var(--green); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.style-table-demo td > b { font-weight: 600; }
.style-positive { color: #4f8d10; font-weight: 600; }
.style-negative { color: var(--red); font-weight: 600; }

.style-guide-rules ol {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 0;
    padding: 1px;
    overflow: hidden;
    list-style: none;
    border-radius: 15px;
    background: var(--line);
    counter-reset: style-rules;
}

.style-guide-rules li {
    position: relative;
    min-height: 116px;
    padding: 19px 19px 19px 52px;
    background: #fff;
    counter-increment: style-rules;
}

.style-guide-rules li::before {
    position: absolute;
    top: 19px;
    left: 19px;
    color: #6ca425;
    content: "0" counter(style-rules);
    font-size: 12px;
    font-weight: 600;
}

.style-guide-rules b,
.style-guide-rules span { display: block; }
.style-guide-rules b { font-size: 15px; font-weight: 600; }
.style-guide-rules span { margin-top: 6px; color: var(--muted); font-size: 13px; line-height: 1.5; }

@media (max-width: 980px) {
    .type-guide-hero,
    .type-guide-layout {
        grid-template-columns: 1fr;
    }

    .type-guide-decision {
        max-width: 560px;
    }

    .type-guide-principles {
        grid-template-columns: 1fr;
    }

    .type-query-demo {
        grid-template-columns: 1fr 1fr;
    }

    .type-query-demo > div:nth-child(2) {
        border-right: 0;
    }

    .type-query-demo > div:nth-child(n + 3) {
        border-top: 1px solid #e8ede7;
    }

    .style-token-grid,
    .style-foundation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .operation-progress {
        right: 16px;
        bottom: 16px;
    }

    .type-guide-hero h1 {
        font-size: 36px;
    }

    .type-guide-panel {
        padding: 21px;
    }

    .type-guide-panel > header,
    .type-scale-list > div {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .type-guide-panel > header {
        flex-direction: column;
    }

    .type-scale-list small {
        text-align: left;
    }

    .type-query-demo {
        grid-template-columns: 1fr;
    }

    .type-query-demo > div {
        border-top: 1px solid #e8ede7;
        border-right: 0;
    }

    .type-query-demo > div:first-child {
        border-top: 0;
    }

    .style-guide-nav {
        gap: 4px;
    }

    .style-guide-nav a {
        padding: 8px 10px;
        font-size: 13px;
    }

    .style-token-grid,
    .style-foundation-grid,
    .style-component-grid,
    .style-guide-rules ol {
        grid-template-columns: 1fr;
    }

    .style-component-card-wide {
        grid-column: auto;
    }

    .style-component-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .style-form-demo {
        grid-template-columns: 1fr;
    }

    .style-form-demo .button {
        width: 100%;
    }

    .style-kpi-demo > div {
        padding: 12px 10px;
    }

    .style-kpi-demo b {
        font-size: 18px;
    }

    .style-guide-rules li {
        min-height: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .operation-progress-spinner,
    .progress-button-spinner,
    .operation-progress-track span {
        animation-duration: 2.4s;
    }
}

.positions-section-nav {
    display: flex;
    gap: 8px;
    margin: 15px 0 24px;
    padding: 5px;
    width: fit-content;
    border: 1px solid #dfe7dc;
    border-radius: 13px;
    background: #f5f8f3;
}

.positions-section-nav a {
    padding: 9px 15px;
    border-radius: 9px;
    color: #536058;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.positions-section-nav a.is-active {
    background: #fff;
    color: #27312c;
    box-shadow: 0 2px 9px rgba(39, 49, 44, .09);
}

.site-section-nav {
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
}

.site-nav-group {
    position: relative;
}

.site-nav-group summary {
    display: block;
    padding: 9px 15px;
    border-radius: 9px;
    color: #536058;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    list-style: none;
}

.site-nav-group summary::-webkit-details-marker {
    display: none;
}

.site-nav-group.is-active summary,
.site-nav-group[open] summary {
    color: #27312c;
}

.site-nav-group.is-active summary {
    background: #fff;
    box-shadow: 0 2px 9px rgba(39, 49, 44, .09);
}

.site-nav-menu {
    position: absolute;
    z-index: 10;
    top: calc(100% + 7px);
    left: 0;
    display: grid;
    min-width: 240px;
    padding: 7px;
    border: 1px solid #dfe7dc;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(39, 49, 44, .14);
}

.positions-section-nav .site-nav-menu a,
.site-nav-menu span {
    padding: 9px 10px;
    font-size: 13px;
    font-weight: 500;
}

.site-nav-menu span {
    color: #77827b;
}

.site-nav-all-tools {
    margin-left: auto;
}

.site-switcher {
    min-width: 180px;
}

.clusters-toolbar {
    align-items: end;
}

.clusters-toolbar > form:first-child {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    gap: 12px;
    align-items: end;
}

.clusters-toolbar label {
    min-width: 135px;
}

.clusters-toolbar .clusters-search {
    flex: 1;
    min-width: 220px;
}

.clusters-table-wrap {
    overflow-x: auto;
    border: 1px solid #e1e8de;
    border-radius: 14px;
}

.clusters-table {
    width: 100%;
    min-width: 1030px;
    border-collapse: collapse;
}

.clusters-table th,
.clusters-table td {
    padding: 14px 13px;
    border-bottom: 1px solid #e7ece5;
    text-align: left;
    vertical-align: top;
}

.clusters-table th {
    background: #f5f8f3;
    color: #59655e;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.clusters-table td:not(:first-child) {
    white-space: nowrap;
}

.clusters-table td > small {
    display: block;
    margin-top: 4px;
}

.clusters-label-cell {
    width: 38%;
    min-width: 330px;
}

.clusters-label-cell > strong {
    display: block;
    color: #27312c;
    font-size: 15px;
    font-weight: 650;
}

.clusters-label-cell details {
    margin-top: 7px;
    color: #657169;
}

.clusters-label-cell summary {
    color: #5e9817;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.clusters-label-cell ul {
    margin: 8px 0 3px;
    padding-left: 18px;
}

.clusters-label-cell li {
    margin: 3px 0;
    font-size: 13px;
}

.cannibalization-toolbar {
    align-items: end;
}

.cannibalization-toolbar > form:first-child {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    gap: 12px;
    align-items: end;
}

.cannibalization-toolbar label {
    min-width: 150px;
}

.cannibalization-list {
    display: grid;
    gap: 13px;
}

.cannibalization-card {
    padding: 21px;
    border: 1px solid #e1e8de;
    border-left: 4px solid #a7b0aa;
    border-radius: 16px;
    background: #fff;
}

.cannibalization-card.severity-high {
    border-left-color: #b94d39;
}

.cannibalization-card.severity-medium {
    border-left-color: #d39a28;
}

.cannibalization-card.severity-low {
    border-left-color: #7d9a64;
}

.cannibalization-card > header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 24px;
}

.cannibalization-card header h3 {
    margin: 10px 0 0;
    color: #27312c;
    font-size: 19px;
    font-weight: 650;
}

.cannibalization-card header small {
    margin-left: 8px;
    color: #758078;
}

.severity-badge {
    display: inline-block;
    padding: 5px 8px;
    border-radius: 99px;
    background: #eef2ec;
    color: #657169;
    font-size: 11px;
    font-weight: 700;
}

.severity-high .severity-badge {
    background: #faece8;
    color: #a33e2d;
}

.severity-medium .severity-badge {
    background: #fff4d9;
    color: #9a6810;
}

.confidence-score {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 112px;
}

.confidence-score b {
    color: #5f9819;
    font-size: 29px;
    font-weight: 650;
}

.confidence-score span {
    color: #7b867f;
    font-size: 10px;
    line-height: 1.25;
}

.cannibalization-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.cannibalization-metrics span {
    padding: 7px 10px;
    border-radius: 9px;
    background: #f5f8f3;
    color: #68746c;
    font-size: 12px;
}

.cannibalization-metrics b {
    color: #303b35;
    font-weight: 650;
}

.cannibalization-card details {
    padding-top: 13px;
    border-top: 1px solid #e7ece5;
}

.cannibalization-card summary {
    color: #5e9817;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.evidence-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 15px;
}

.evidence-grid > div {
    padding: 13px;
    border-radius: 11px;
    background: #f7f9f6;
}

.evidence-grid span {
    color: #6b9f2c;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.evidence-grid p {
    margin: 6px 0 0;
    color: #4f5b54;
    font-size: 13px;
    line-height: 1.5;
}

.evidence-limitation {
    margin: 12px 0;
    color: #7a857e;
    font-size: 12px;
}

.cannibalization-urls {
    display: grid;
    gap: 7px;
}

.cannibalization-urls > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 15px;
    padding: 9px 11px;
    border: 1px solid #e5ebe2;
    border-radius: 9px;
}

.cannibalization-urls a {
    overflow-wrap: anywhere;
    color: #558d13;
    font-size: 12px;
}

.cannibalization-urls span {
    flex: 0 0 auto;
    color: #77827b;
    font-size: 11px;
}

@media (max-width: 720px) {
    .positions-section-nav {
        width: 100%;
    }

    .positions-section-nav a {
        flex: 1;
        text-align: center;
    }

    .site-nav-all-tools {
        margin-left: 0;
    }

    .site-nav-menu {
        position: fixed;
        right: 18px;
        left: 18px;
        min-width: 0;
    }

    .evidence-grid {
        grid-template-columns: 1fr;
    }

    .cannibalization-card > header,
    .cannibalization-urls > div {
        align-items: start;
        flex-direction: column;
    }
}

@media (max-width: 800px) {
    .topbar {
        height: 76px;
        min-height: 76px;
        flex-wrap: nowrap;
    }

    .topbar-actions {
        display: none;
    }
}

/* Shared query exclusions */
.exclusions-controls {
    display: grid;
    grid-template-columns: minmax(240px, .4fr) minmax(0, 1.6fr);
    gap: 18px;
    margin: 22px 0;
    padding: 21px;
    border: 1px solid #e5ebe2;
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--shadow);
}

.exclusions-controls label {
    min-width: 0;
    margin: 0;
}

.exclusion-add-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, .8fr) minmax(180px, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.exclusions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.exclusions-panel {
    padding: 24px;
    border: 1px solid #e2e9df;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(33, 48, 38, .05);
}

.exclusions-panel .section-heading {
    margin-bottom: 8px;
}

.exclusions-help {
    min-height: 48px;
    margin: 0 0 16px;
    color: #6e7a72;
    font-size: .86rem;
    line-height: 1.55;
}

.exclusion-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 0;
    border-top: 1px solid #e9eee7;
}

.exclusion-row b,
.exclusion-row small {
    display: block;
}

.exclusion-row b {
    color: #2b3731;
    font-size: 1rem;
    font-weight: 620;
}

.exclusion-row small {
    margin-top: 3px;
    color: #77827b;
}

.exclusion-row button {
    border: 0;
    background: transparent;
    color: #a34d40;
    font-size: .82rem;
    cursor: pointer;
}

.exclusions-empty {
    padding: 18px;
    border-radius: 12px;
    background: #f6f8f5;
    color: #758078;
    text-align: center;
}

@media (max-width: 1080px) {
    .exclusions-controls,
    .exclusions-grid {
        grid-template-columns: 1fr;
    }

    .exclusion-add-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .exclusion-add-form {
        grid-template-columns: 1fr;
    }
}

/* Page-level search analytics */
.pages-toolbar > form:first-child {
    display: grid;
    grid-template-columns: minmax(190px, 1.2fr) repeat(4, minmax(125px, .72fr)) minmax(180px, 1fr) auto;
    gap: 11px;
    align-items: end;
    width: 100%;
}

.pages-toolbar label { min-width: 0; }

.pages-table-wrap,
.page-queries-table-wrap {
    overflow-x: auto;
    border: 1px solid #e1e8de;
    border-radius: 15px;
}

.pages-table,
.page-queries-table {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
}

.pages-table th,
.pages-table td,
.page-queries-table th,
.page-queries-table td {
    padding: 14px 13px;
    border-bottom: 1px solid #e6ece3;
    text-align: left;
    vertical-align: top;
}

.pages-table th,
.page-queries-table th {
    background: #f5f8f3;
    color: #5d6961;
    font-size: .73rem;
    font-weight: 650;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.pages-table td,
.page-queries-table td {
    color: #435048;
    font-size: .86rem;
}

.pages-table td small,
.page-queries-table td small {
    display: block;
    margin-top: 4px;
    color: #78837c;
}

.pages-table td .is-up,
.pages-table td .is-down {
    display: block;
    white-space: nowrap;
}

.page-url-cell {
    width: 29%;
    min-width: 300px;
}

.page-url-cell > a {
    display: block;
    overflow-wrap: anywhere;
    color: #2c3832;
    font-weight: 610;
    line-height: 1.45;
}

.page-url-cell small a {
    color: #639b20;
    font-weight: 520;
}

.page-score {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #edf7de;
    color: #548b12;
    font-size: 1rem;
    font-weight: 660;
    text-decoration: none;
}

.page-detail-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 34px 40px;
    border: 1px solid #e6ecdf;
    border-radius: 26px;
    background: linear-gradient(115deg, #fff 0%, #fff 66%, #eff8df 100%);
    box-shadow: var(--shadow);
}

.page-detail-hero h1 {
    margin: 7px 0 12px;
}

.page-detail-hero > div > a {
    overflow-wrap: anywhere;
    color: #5c9419;
}

.page-detail-score {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
}

.page-detail-score b {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: #fff;
    color: #5b9517;
    font-size: 1.7rem;
    box-shadow: 0 10px 25px rgba(80, 126, 31, .12);
}

.page-detail-score span {
    color: #69756d;
    font-size: .8rem;
    line-height: 1.45;
}

.pages-detail-summary {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-top: 22px;
}

.page-queries-table {
    min-width: 980px;
}

.page-queries-table td:first-child {
    min-width: 270px;
}

@media (max-width: 1350px) {
    .pages-toolbar > form:first-child {
        grid-template-columns: repeat(3, minmax(170px, 1fr));
    }

    .pages-detail-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .pages-toolbar > form:first-child,
    .pages-detail-summary {
        grid-template-columns: 1fr;
    }

    .page-detail-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 25px;
    }
}

/* Queries entering and leaving the Yandex Webmaster report */
.positions-report-changes {
    margin-top: 22px;
    padding: 27px;
    border: 1px solid #e0e7dc;
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--shadow);
}

.positions-report-changes .section-heading {
    margin-bottom: 18px;
}

.positions-report-changes-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.positions-report-change {
    overflow: hidden;
    border: 1px solid #e1e8de;
    border-radius: 15px;
    background: #fbfcfa;
}

.positions-report-change summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    cursor: pointer;
    list-style: none;
}

.positions-report-change summary::-webkit-details-marker {
    display: none;
}

.positions-report-change summary > span {
    display: flex;
    align-items: center;
    gap: 10px;
}

.positions-report-change summary i {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #eaf5db;
    color: #5b9517;
    font-size: 1rem;
    font-style: normal;
    font-weight: 650;
}

.positions-report-change.is-left summary i {
    background: #fae9e6;
    color: #a84a40;
}

.positions-report-change summary strong {
    color: #2c3832;
    font-size: .91rem;
    font-weight: 620;
}

.positions-report-change summary > b {
    min-width: 31px;
    padding: 4px 8px;
    border-radius: 99px;
    background: #edf2e9;
    color: #536059;
    font-size: .82rem;
    font-weight: 650;
    text-align: center;
}

.positions-report-change ul {
    max-height: 390px;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    list-style: none;
    border-top: 1px solid #e4eae1;
}

.positions-report-change li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 18px;
    border-bottom: 1px solid #e8ede5;
}

.positions-report-change li:last-child {
    border-bottom: 0;
}

.positions-report-change li > div:first-child {
    min-width: 0;
}

.positions-report-change li a,
.positions-report-change li div > span {
    display: block;
    overflow-wrap: anywhere;
    color: #314039;
    font-size: .87rem;
    font-weight: 590;
    line-height: 1.4;
}

.positions-report-change li a {
    color: var(--green-dark);
}

.positions-report-change li small {
    display: block;
    margin-top: 4px;
    color: #7a857e;
    font-size: .73rem;
    line-height: 1.35;
}

.positions-report-change-position {
    flex: 0 0 auto;
    min-width: 92px;
    text-align: right;
}

.positions-report-change-position b {
    color: #29362f;
    font-size: 1rem;
    font-weight: 650;
}

.positions-report-change-position small {
    max-width: 130px;
}

.positions-report-change > p {
    margin: 0;
    padding: 18px;
    border-top: 1px solid #e4eae1;
    color: #6c7871;
    font-size: .82rem;
}

.positions-report-changes-note {
    margin: 16px 0 0;
    color: #6f7b74;
    font-size: .78rem;
    line-height: 1.55;
}

@media (max-width: 900px) {
    .positions-report-changes-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .positions-report-changes {
        padding: 20px;
    }

    .positions-report-change li {
        gap: 10px;
        padding: 13px 15px;
    }

    .positions-report-change-position {
        min-width: 72px;
    }
}
/* Missing landing pages */
.missing-page-list { display: grid; gap: 16px; }
.missing-page-card { padding: 22px; border: 1px solid var(--line, #dce3e8); border-left: 4px solid #9aa9b3; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(24, 39, 50, .06); }
.missing-page-card.severity-high { border-left-color: #d75b52; }
.missing-page-card.severity-medium { border-left-color: #d6a63a; }
.missing-page-card header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.missing-page-card header span { color: #61717c; font-size: .83rem; font-weight: 600; text-transform: uppercase; letter-spacing: .045em; }
.missing-page-card h3 { margin: 5px 0 0; font-size: clamp(1.15rem, 2vw, 1.45rem); font-weight: 650; }
.missing-page-score { min-width: 82px; text-align: center; padding: 9px 12px; border-radius: 14px; background: #eef8db; color: #253419; }
.missing-page-score b { display: block; font-size: 1.55rem; line-height: 1; }
.missing-page-score small { display: block; margin-top: 4px; font-size: .72rem; }
.missing-page-metrics { display: grid; grid-template-columns: repeat(6, minmax(105px, 1fr)); gap: 10px; margin: 18px 0; }
.missing-page-metrics span { padding: 11px 12px; border-radius: 12px; background: #f5f7f8; }
.missing-page-metrics small, .missing-page-metrics em { display: block; color: #6d7a82; font-size: .78rem; font-style: normal; }
.missing-page-metrics b { display: block; margin-top: 3px; font-size: 1rem; font-weight: 650; }
.missing-page-card details { margin-top: 14px; }
.missing-page-card summary { cursor: pointer; color: #4f681b; font-weight: 600; }
.missing-page-details { padding: 13px 0 0 16px; border-left: 2px solid #dce8c4; }
.missing-page-details h4 { margin: 16px 0 5px; font-size: .9rem; }
.missing-page-details p { margin: 6px 0; overflow-wrap: anywhere; }
@media (max-width: 1100px) { .missing-page-metrics { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 650px) { .missing-page-metrics { grid-template-columns: repeat(2, 1fr); } .missing-page-card { padding: 17px; } }
/* Consolidated SEO tasks */
.seo-task-list { display: grid; gap: 16px; }
.seo-task-card { padding: 22px; border: 1px solid #dde4e8; border-left: 4px solid #9aa9b3; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(24,39,50,.06); }
.seo-task-card.priority-high { border-left-color: #d75b52; } .seo-task-card.priority-medium { border-left-color: #d6a63a; }
.seo-task-card.status-done { opacity: .68; border-left-color: #7aa943; }
.seo-task-card header, .seo-task-card footer { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.seo-task-card header span { color:#65747d; font-size:.82rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.seo-task-card h3 { margin:5px 0 0; font-size:1.25rem; font-weight:650; }
.task-score { min-width:76px; padding:9px 12px; text-align:center; border-radius:13px; background:#eef8db; }
.task-score b,.task-score small { display:block; } .task-score b { font-size:1.45rem; line-height:1; } .task-score small { margin-top:4px; font-size:.73rem; }
.task-source-tags { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }
.task-source-tags span { padding:5px 9px; border-radius:999px; background:#edf2f4; color:#52636d; font-size:.78rem; font-weight:600; }
.task-recommendation { padding:14px 16px; border-radius:13px; background:#f5f9ed; }
.seo-task-card details { margin:13px 0; } .seo-task-card summary { cursor:pointer; color:#4f681b; font-weight:600; }
.seo-task-card details div { padding:10px 0 0 16px; border-left:2px solid #dce8c4; }
.seo-task-card footer { align-items:center; padding-top:14px; border-top:1px solid #e5eaed; color:#6d7a82; font-size:.86rem; }
.seo-task-card footer form { display:flex; gap:8px; align-items:center; } .seo-task-card footer select { min-width:130px; }
@media(max-width:700px){.seo-task-card header,.seo-task-card footer{align-items:stretch;flex-direction:column}.seo-task-card footer form{width:100%}.seo-task-card footer select{flex:1}}
/* Search analytics dashboard */
.dashboard-period-note { margin:14px 0; color:#667680; font-size:.9rem; }
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(5,minmax(145px,1fr)); gap:12px; margin:18px 0; }
.dashboard-kpi-grid article { padding:18px; border:1px solid #dfe6e9; border-radius:16px; background:#fff; box-shadow:0 8px 24px rgba(24,39,50,.05); }
.dashboard-kpi-grid span,.dashboard-kpi-grid small,.dashboard-kpi-grid b { display:block; }
.dashboard-kpi-grid span { color:#667680; font-size:.84rem; } .dashboard-kpi-grid b { margin:5px 0; font-size:1.7rem; font-weight:650; }
.dashboard-kpi-grid small { color:#75838b; font-size:.8rem; } .dashboard-kpi-grid small.is-up { color:#4f7c21; } .dashboard-kpi-grid small.is-down { color:#b64c45; }
.dashboard-main-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:16px; margin:16px 0; }
.dashboard-panel { padding:20px; border:1px solid #dfe6e9; border-radius:18px; background:#fff; box-shadow:0 9px 27px rgba(24,39,50,.055); }
.position-bars { display:grid; gap:13px; margin-top:14px; }.position-bars>div { display:grid; grid-template-columns:65px 1fr 45px; align-items:center; gap:10px; }.position-bars i { height:10px; border-radius:10px; overflow:hidden; background:#e9eef0; }.position-bars i b { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#94bd41,#c5df78); }.position-bars strong { text-align:right; font-weight:650; }
.dashboard-signal-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.dashboard-signal-grid > * { padding:14px; border-radius:13px; background:#f4f7f8; color:inherit; text-decoration:none; }.dashboard-signal-grid b,.dashboard-signal-grid span { display:block; }.dashboard-signal-grid b { font-size:1.3rem; }.dashboard-signal-grid span { margin-top:3px; color:#687780; font-size:.8rem; }
.dashboard-columns { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.dashboard-list { display:grid; gap:4px; }.dashboard-list>a { display:flex; align-items:center; gap:10px; padding:11px 4px; border-bottom:1px solid #e9edef; color:inherit; text-decoration:none; }.dashboard-list>a:last-child { border-bottom:0; }.dashboard-list div { min-width:0; flex:1; }.dashboard-list b,.dashboard-list small { display:block; }.dashboard-list b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.9rem; font-weight:600; }.dashboard-list small { margin-top:3px; color:#718089; font-size:.76rem; }.dashboard-list strong { color:#516d1f; font-size:.9rem; }.priority-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#9aa9b3; }.priority-dot.priority-high { background:#d75b52; }.priority-dot.priority-medium { background:#d6a63a; }
@media(max-width:1100px){.dashboard-kpi-grid{grid-template-columns:repeat(3,1fr)}.dashboard-columns{grid-template-columns:1fr 1fr}.dashboard-main-grid{grid-template-columns:1fr}}
@media(max-width:700px){.dashboard-kpi-grid{grid-template-columns:1fr 1fr}.dashboard-columns{grid-template-columns:1fr}.dashboard-signal-grid{grid-template-columns:1fr}}
/* Portfolio cards and site insight reports */
.compact-page-hero,.positions-hero.is-compact { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 28px 18px; }
.compact-page-hero h1,.positions-hero.is-compact h1 { margin:4px 0 7px; font-size:clamp(1.8rem,3vw,2.7rem); font-weight:650; }
.compact-page-hero h1 span { color:#759b2e; }.compact-page-hero p,.positions-hero.is-compact p { max-width:760px; margin:0; }
.report-header-actions { display:flex; flex-wrap:wrap; gap:9px; }
.site-report-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.site-report-card { padding:18px; border:1px solid #dfe6e9; border-top:4px solid #9aa9b3; border-radius:17px; background:#fff; box-shadow:0 8px 24px rgba(24,39,50,.055); }.site-report-card.readiness-ready{border-top-color:#7fa639}.site-report-card.readiness-insufficient{border-top-color:#d59d3e}
.site-report-card header,.site-report-card footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }.site-report-card header span { color:#6d7b83; font-size:.76rem; }.site-report-card h2 { margin:3px 0 0; font-size:1.15rem; font-weight:650; overflow-wrap:anywhere; }.readiness-dot{width:10px;height:10px;border-radius:50%;background:#9aa9b3}.readiness-ready .readiness-dot{background:#7fa639}.readiness-insufficient .readiness-dot{background:#d59d3e}
.site-card-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin:15px 0; }.site-card-kpis span { min-width:0; padding:8px; border-radius:10px; background:#f4f7f8; }.site-card-kpis small,.site-card-kpis b { display:block; }.site-card-kpis small { color:#718089; font-size:.68rem; }.site-card-kpis b { margin-top:3px; font-size:.9rem; font-weight:650; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.site-card-meta { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }.site-card-meta span { padding:4px 7px; border-radius:999px; background:#edf2f4; color:#60707a; font-size:.71rem; }.site-report-card footer { padding-top:12px; border-top:1px solid #e8edef; }.site-report-card footer>a:first-child { color:#5e712f; font-size:.82rem; }
.dashboard-site-portfolio { display:flex; gap:10px; margin:10px 0 18px; padding-bottom:6px; overflow-x:auto; scrollbar-width:thin; }.dashboard-site-card { min-width:230px; max-width:230px; border:1px solid #dfe6e9; border-radius:14px; background:#fff; overflow:hidden; }.dashboard-site-card.is-active { border-color:#8bae47; box-shadow:0 0 0 2px rgba(139,174,71,.16); }.dashboard-site-main { display:block; padding:12px; color:inherit; text-decoration:none; }.dashboard-site-main header { display:flex; align-items:center; gap:7px; }.dashboard-site-main header i { width:8px;height:8px;border-radius:50%;background:#9aa9b3}.dashboard-site-card.readiness-ready header i{background:#7fa639}.dashboard-site-card.readiness-insufficient header i{background:#d59d3e}.dashboard-site-main header b { max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.88rem; font-weight:650; }.dashboard-site-main>div { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:10px; }.dashboard-site-main span { font-size:.82rem; font-weight:600; }.dashboard-site-main small { display:block; margin-bottom:2px; color:#73818a; font-size:.62rem; font-weight:400; }.dashboard-site-card footer { display:flex; justify-content:space-between; padding:7px 12px; background:#f5f7f8; color:#6a7881; font-size:.68rem; }.dashboard-site-card footer a { color:#516d1f; font-weight:600; }.dashboard-selected-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:12px 0 8px; }.dashboard-selected-heading h2 { margin:2px 0 0; font-size:1.4rem; }.dashboard-selected-heading>span { color:#718089; font-size:.8rem; }
.search-dashboard-hero.is-compact { padding-bottom:10px; }.dashboard-kpi-grid { margin:10px 0; gap:9px; }.dashboard-kpi-grid article { padding:13px 15px; }.dashboard-kpi-grid b { font-size:1.42rem; }.dashboard-main-grid { margin:10px 0; gap:10px; }.dashboard-panel { padding:16px; }.dashboard-columns { gap:10px; }
.report-verdict { margin:14px 0; padding:22px; border:1px solid #dfe6e9; border-left:5px solid #9aa9b3; border-radius:17px; background:#fff; }.report-verdict.tone-growth,.report-verdict.tone-stable { border-left-color:#7fa639; }.report-verdict.tone-attention { border-left-color:#d59d3e; }.report-verdict h2 { margin:10px 0 6px; font-size:1.45rem; }.report-verdict p { margin:0 0 8px; }.report-verdict>small { color:#6e7c84; }.report-readiness { display:flex; align-items:center; gap:12px; }.report-readiness i { width:180px;height:8px;border-radius:8px;background:#e7ecee;overflow:hidden}.report-readiness i b{display:block;height:100%;border-radius:inherit;background:#8fb747}.report-readiness span{color:#62727b;font-size:.78rem}
.report-kpi-strip { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin:14px 0; }.report-kpi-strip article { padding:13px; border-radius:13px; background:#f4f7f8; }.report-kpi-strip span,.report-kpi-strip b,.report-kpi-strip small { display:block; }.report-kpi-strip span { color:#6e7c84;font-size:.74rem}.report-kpi-strip b{margin:4px 0;font-size:1.25rem;font-weight:650}.report-kpi-strip small{font-size:.7rem;color:#7a878e}.report-kpi-strip small.is-up{color:#557f26}.report-kpi-strip small.is-down{color:#b45048}
.report-data-gaps,.report-task-section { margin:18px 0; padding:19px; border:1px solid #dfe6e9; border-radius:17px; background:#fff; }.report-gap-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }.report-gap-grid article { padding:14px; border-radius:12px; background:#fff8e9; }.report-gap-grid h3 { margin:0 0 6px;font-size:.96rem}.report-gap-grid p{margin:0 0 7px;font-size:.84rem}.report-gap-grid small{display:block;color:#756d5b;font-size:.74rem}.report-gap-grid a{display:inline-flex;align-items:center;gap:4px;margin-top:10px;color:#596e27;font-size:.78rem;font-weight:600}
.report-insight-columns { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:18px 0; }.report-insight-section { min-width:0; border:1px solid #dfe6e9; border-top:4px solid #9aa9b3;border-radius:17px;background:#fff;overflow:hidden}.report-insight-section.insight-strengths{border-top-color:#7fa639}.report-insight-section.insight-attention{border-top-color:#d56a59}.report-insight-section.insight-growth{border-top-color:#75a9b6}.report-insight-section>header{position:relative;padding:16px;border-bottom:1px solid #e7ecee}.report-insight-section>header h2{margin:3px 0 0;font-size:1.25rem}.report-insight-section>header>span{position:absolute;right:15px;top:15px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#edf2f4;font-weight:650}.report-insight-section>div>section{padding:15px;border-bottom:1px solid #e8edef}.report-insight-section>div>section:last-child{border-bottom:0}.report-insight-section h3{margin:0 0 6px;font-size:.98rem}.report-insight-section p{margin:0 0 11px;font-size:.84rem}.report-insight-section dl{margin:0}.report-insight-section dt{margin-top:8px;color:#62727b;font-size:.7rem;font-weight:650;text-transform:uppercase;letter-spacing:.04em}.report-insight-section dd{margin:3px 0 0;font-size:.79rem}.report-no-signal{color:#687780}
.report-task-list { display:grid;gap:7px}.report-task-list>article{display:flex;align-items:flex-start;gap:10px;padding:12px;border-radius:12px;background:#f5f7f8}.report-task-list>article>div{flex:1}.report-task-list h3{margin:0 0 4px;font-size:.92rem}.report-task-list p{margin:0 0 4px;font-size:.8rem}.report-task-list small{color:#6d7b83;font-size:.72rem}.report-task-list>article>b{color:#526d20;font-size:1rem}
@media(max-width:1100px){.site-report-card-grid{grid-template-columns:repeat(2,1fr)}.report-insight-columns{grid-template-columns:1fr}.report-gap-grid{grid-template-columns:repeat(2,1fr)}.report-kpi-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.compact-page-hero,.positions-hero.is-compact,.dashboard-selected-heading{align-items:flex-start;flex-direction:column}.site-report-card-grid,.report-gap-grid{grid-template-columns:1fr}.site-card-kpis{grid-template-columns:repeat(2,1fr)}.report-kpi-strip{grid-template-columns:repeat(2,1fr)}}
/* Compact desktop home dashboard */
@media (min-width: 1180px) {
    .analyzer-home-hero {
        grid-template-columns: minmax(0, 1fr) 275px;
        align-items: center;
        gap: 28px;
        padding: 12px 0 20px;
    }

    .shell .analyzer-home-hero h1 {
        max-width: none;
        margin: 5px 0 10px;
        font-size: 2.55rem;
        line-height: 1.04;
    }

    .shell .analyzer-home-hero h1 br {
        display: none;
    }

    .shell .analyzer-home-hero > div > p:last-child {
        max-width: 910px;
        font-size: .91rem;
        line-height: 1.48;
    }

    .home-local-badge {
        gap: 10px;
        padding: 14px 16px;
        border-radius: 14px;
    }

    .analyzer-home-hero .home-local-badge b {
        margin-bottom: 2px;
        font-size: .82rem;
    }

    .analyzer-home-hero .home-local-badge span {
        font-size: .72rem;
        line-height: 1.35;
    }

    .analyzer-tools {
        padding: 20px;
        border-radius: 20px;
    }

    .home-section-heading {
        margin-bottom: 13px;
    }

    .home-section-heading h2 {
        margin-top: 2px;
        font-size: 1.45rem;
    }

    .analyzer-tool-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
    }

    .analyzer-tool-card {
        min-height: 188px;
        padding: 15px;
        border-radius: 15px;
    }

    .analyzer-tool-card:hover {
        transform: translateY(-2px);
    }

    .tool-card-icon {
        width: 36px;
        height: 36px;
        margin-bottom: 12px;
        border-radius: 10px;
    }

    .tool-card-icon .ui-icon {
        width: 20px;
        height: 20px;
    }

    .tool-card-status {
        top: 14px;
        right: 14px;
        max-width: calc(100% - 66px);
        padding: 4px 7px;
        overflow: hidden;
        font-size: .58rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .analyzer-tool-grid .analyzer-tool-card h2 {
        margin-bottom: 5px;
        font-size: 1.04rem;
        line-height: 1.2;
    }

    .analyzer-tool-grid .analyzer-tool-card > p {
        display: -webkit-box;
        margin-bottom: 10px;
        overflow: hidden;
        font-size: .74rem;
        line-height: 1.4;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .analyzer-tool-card .tool-card-footer {
        gap: 8px;
        padding-top: 9px;
        font-size: .66rem;
    }

    .tool-card-footer b,
    .tool-card-footer i {
        min-width: 0;
    }

    .tool-card-footer b {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tool-card-footer i {
        gap: 3px;
        white-space: nowrap;
    }

    .home-workflow {
        margin-top: 14px;
        border-radius: 14px;
    }

    .home-workflow > div {
        padding: 12px 14px;
    }
}

@media (min-width: 721px) and (max-width: 1179px) {
    .analyzer-tool-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .analyzer-tool-card {
        min-height: 225px;
    }
}

/* Shared horizontal filters for desktop reports */
@media (min-width: 901px) {
    .positions-toolbar {
        align-items: flex-end;
        flex-direction: row;
        gap: 12px;
        padding: 16px;
    }

    .positions-toolbar > form:first-child {
        display: flex;
        flex: 1 1 760px;
        align-items: flex-end;
        flex-wrap: wrap;
        gap: 10px;
        width: auto;
        grid-template-columns: none;
    }

    .positions-toolbar > form:first-child label {
        flex: 1 1 145px;
        width: auto;
        min-width: 135px;
        max-width: 230px;
        margin: 0;
    }

    .positions-toolbar > form:first-child label > span {
        margin-bottom: 5px;
        white-space: nowrap;
    }

    .positions-toolbar > form:first-child .clusters-search,
    .positions-toolbar > form:first-child .ctr-query-filter {
        flex: 2 1 230px;
        max-width: 360px;
    }

    .positions-toolbar > form:first-child input,
    .positions-toolbar > form:first-child select {
        min-height: 46px;
    }

    .positions-toolbar > form:first-child > .button,
    .positions-toolbar > form:first-child > button {
        flex: 0 0 auto;
        min-height: 46px;
        white-space: nowrap;
    }

    .positions-toolbar > form:not(:first-child) {
        flex: 0 0 auto;
        margin-left: auto;
    }

    .positions-toolbar > form:not(:first-child) .button,
    .positions-toolbar > form:not(:first-child) button {
        min-height: 46px;
        white-space: nowrap;
    }
}

@media (min-width: 901px) and (max-width: 1179px) {
    .positions-toolbar > form:first-child {
        flex-basis: 100%;
    }
}

/* Alice AI visibility report */
.alice-import-panel,
.alice-dynamics-section,
.alice-query-section,
.alice-sources {
    margin-top: 18px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--shadow-soft);
}

.alice-import-panel > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
    font-weight: 600;
}

.alice-import-panel > summary span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.alice-import-panel > summary small {
    color: var(--muted);
    font-weight: 400;
}

.alice-import-panel form {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    align-items: end;
    gap: 14px;
    margin-top: 20px;
}

.alice-import-panel label {
    display: grid;
    gap: 6px;
}

.alice-file-field,
.alice-notes-field {
    grid-column: span 3;
}

.alice-file-field small {
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.4;
}

.alice-sov-chart {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    min-height: 220px;
    padding: 16px 4px 0;
    overflow-x: auto;
}

.alice-sov-chart > div {
    display: grid;
    flex: 1 0 52px;
    grid-template-rows: auto 150px auto;
    gap: 7px;
    min-width: 52px;
    text-align: center;
}

.alice-sov-chart span,
.alice-sov-chart strong {
    font-size: .78rem;
}

.alice-sov-chart i {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    border-radius: 9px;
    background: #f1f4ef;
}

.alice-sov-chart i b {
    display: block;
    width: 64%;
    min-height: 2px;
    border-radius: 7px 7px 0 0;
    background: linear-gradient(180deg, #8bcb35, var(--green));
}

.alice-report-grid {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(240px, 1fr);
    gap: 18px;
}

.alice-query-table th:nth-child(1) { width: 32%; }
.alice-query-table th:nth-child(2) { width: 14%; }
.alice-query-table th:nth-child(3) { width: 25%; }
.alice-query-table th:nth-child(4) { width: 29%; }

.alice-mentioned {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .76rem;
    background: #f0f2f2;
    color: var(--muted);
}

.alice-mentioned.tone-yes { background: #eef8df; color: #4c8107; }
.alice-mentioned.tone-no { background: #fff0eb; color: #ad493a; }

.alice-sources ol {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.alice-sources li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.alice-sources li:last-child { border-bottom: 0; }
.alice-sources li b { color: var(--green-dark); }

@media (max-width: 1100px) {
    .alice-import-panel form { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
    .alice-report-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .alice-import-panel form { grid-template-columns: 1fr; }
    .alice-file-field,
    .alice-notes-field { grid-column: auto; }
}

@media (max-width: 1350px) and (min-width: 801px) {
    .topbar-tool-link { display: none; }
}

@media (max-width: 800px) {
    .topbar { flex-wrap: nowrap; }
    .brand { flex-shrink: 0; }
    .brand small { display: none; }
    .brand b { white-space: nowrap; font-size: 15px; }
    .topbar-actions { display: flex; width: auto; flex-direction: row; justify-content: flex-end; gap: 5px; }
    .topbar-tool-link { display: none; }
    .knowledge-link.account-link { display: inline-flex; flex-shrink: 0; padding: 7px 9px; }
    .admin-users-link { display: none; }
}

/* Root workspace: SeoSite portfolio, source facts and separate comparisons */
.home-workspace-hero {
    align-items: center;
    padding-bottom: 28px;
}

.shell .home-workspace-hero h1 {
    max-width: none;
}

.home-portfolio-summary {
    display: grid;
    min-width: 270px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #dce7d5;
    border-radius: 18px;
    background: #fff;
}

.home-portfolio-summary > div {
    padding: 17px 19px;
}

.home-portfolio-summary > div + div {
    border-left: 1px solid var(--line);
}

.home-portfolio-summary strong,
.home-portfolio-summary span {
    display: block;
}

.home-portfolio-summary strong {
    color: var(--green-dark);
    font-size: 25px;
    font-weight: 650;
    line-height: 1;
}

.home-portfolio-summary span {
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.3;
}

.home-workspace-grid,
.home-sidebar {
    display: grid;
    gap: 18px;
}

.home-workspace-grid {
    grid-template-columns: minmax(0, 1fr) clamp(260px, 19vw, 300px);
    align-items: start;
}

.home-sites-panel,
.home-tasks-panel,
.home-updates-panel,
.home-comparisons-panel {
    padding: 24px;
}

.home-site-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
}

.home-sites-toolbar {
    --home-sites-control-height: 42px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(185px, .55fr) auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 14px;
}

.home-sites-toolbar label {
    min-width: 0;
    margin: 0;
}

.home-sites-toolbar label > span:first-child {
    color: var(--muted);
    font-size: 10px;
    font-weight: 650;
}

.home-sites-toolbar input,
.home-sites-toolbar select {
    height: var(--home-sites-control-height);
    min-height: var(--home-sites-control-height);
    padding: 9px 11px;
    border-radius: 11px;
    font-size: 12px;
}

.home-sites-search-control {
    position: relative;
    display: block;
    margin-bottom: 0;
}

.home-sites-search-control .ui-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 11px;
    color: #87948d;
    transform: translateY(-50%);
    pointer-events: none;
}

.home-sites-search-control input {
    padding-left: 35px;
}

.home-sites-view {
    display: flex;
    align-items: center;
    height: var(--home-sites-control-height);
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f7f9f7;
}

.home-sites-view button {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #87948d;
    cursor: pointer;
}

.home-sites-view button:hover,
.home-sites-view button:focus-visible,
.home-sites-view button.is-active {
    background: #fff;
    color: var(--green);
    box-shadow: 0 2px 8px rgba(24, 47, 37, .08);
}

.home-sites-view button:focus-visible {
    outline: 2px solid rgba(138, 191, 78, .3);
    outline-offset: 1px;
}

.home-site-grid.is-list {
    grid-template-columns: 1fr;
}

.home-seo-site-card[hidden] {
    display: none;
}

.home-sites-list-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 14px;
}

.home-sites-list-footer p {
    margin: 0;
    color: var(--muted);
    font-size: 11px;
}

.home-sites-more {
    min-height: 40px;
    padding: 9px 16px;
}

.home-search-empty {
    margin-top: 14px;
}

@media (min-width: 981px) {
    .home-site-grid.is-list .home-seo-site-card {
        display: grid;
        min-height: 0;
        grid-template-columns: minmax(190px, .7fr) minmax(300px, 1.3fr) minmax(135px, .55fr);
        grid-template-rows: auto auto;
        align-items: center;
        gap: 6px 20px;
    }

    .home-site-grid.is-list .home-seo-site-card > header {
        grid-column: 1;
        grid-row: 1;
    }

    .home-site-grid.is-list .home-site-identity {
        grid-column: 1;
        grid-row: 2;
        margin: 0;
    }

    .home-site-grid.is-list .home-source-statuses {
        grid-column: 2;
        grid-row: 1 / span 2;
        margin: 0;
    }

    .home-site-grid.is-list .home-seo-site-card > footer {
        grid-column: 3;
        grid-row: 1 / span 2;
        align-self: stretch;
        align-items: center;
        padding: 0 0 0 18px;
        border-top: 0;
        border-left: 1px solid #e3e9df;
    }
}

.home-seo-site-card {
    display: flex;
    min-width: 0;
    min-height: 205px;
    flex-direction: column;
    padding: 17px;
    border: 1px solid #e1e8dd;
    border-top: 4px solid #8abf4e;
    border-radius: 17px;
    background: #fbfdf9;
}

.home-seo-site-card.needs-attention {
    border-top-color: #d69a3c;
    background: #fffdf7;
}

.home-seo-site-card > header,
.home-seo-site-card > footer,
.home-comparison-card,
.home-section-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.home-seo-site-card .circle-arrow {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    background: var(--green);
    color: #fff;
}

.home-site-card-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

.home-favorite-form {
    margin: 0;
}

.home-favorite-toggle {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 1px solid #dce4d8;
    border-radius: 50%;
    background: #fff;
    color: #829087;
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, color .18s ease;
}

.home-favorite-toggle:hover,
.home-favorite-toggle:focus-visible {
    border-color: #8abf4e;
    color: var(--green);
}

.home-favorite-toggle:focus-visible {
    outline: 3px solid rgba(138, 191, 78, .22);
    outline-offset: 2px;
}

.home-favorite-toggle.is-active {
    border-color: #b9d992;
    background: #edf7df;
    color: #62a914;
}

.home-favorite-toggle.is-active .ui-icon {
    fill: currentColor;
}

.home-site-identity {
    margin: 13px 0;
}

.home-site-identity h3 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 18px;
    font-weight: 650;
}

.home-site-identity p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.home-source-statuses {
    display: grid;
    gap: 8px;
    margin: 0 0 14px;
}

.home-source-statuses > div {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 8px;
}

.home-source-statuses dt,
.home-source-statuses dd {
    min-width: 0;
    margin: 0;
    font-size: 11px;
    line-height: 1.35;
}

.home-source-statuses dt {
    color: #52605a;
    font-weight: 650;
}

.home-source-statuses dd {
    color: var(--muted);
    text-align: right;
}

.home-seo-site-card > footer {
    align-items: flex-end;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #e3e9df;
}

.home-seo-site-card > footer a,
.home-section-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 650;
    text-decoration: none;
}

.home-seo-site-card > footer span,
.home-seo-site-card > footer small {
    color: var(--muted);
    font-size: 11px;
}

.home-seo-site-card > footer small {
    color: #8b5c1e;
    text-align: right;
}

.home-empty-state {
    grid-column: 1 / -1;
}

.home-sidebar {
    grid-template-columns: 1fr;
}

.home-updates-panel h2,
.home-tasks-panel h2,
.home-comparisons-panel h2 {
    font-size: 21px;
}

.home-task-heading { align-items: flex-start; margin-bottom: 10px; }
.home-task-list { display: grid; gap: 7px; }
.home-task-empty { margin: 0; font-size: 12px; }

.home-task-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
}

.home-task-actions .button {
    min-height: 34px;
    padding: 7px 10px;
    font-size: 11px;
}

.home-task-actions .home-section-link { margin-top: 0; }

.home-updates-heading {
    align-items: flex-start;
    margin-bottom: 10px;
}

.search-update-filter {
    display: flex;
    align-items: center;
    gap: 3px;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 10px;
    padding: 3px;
    border: 1px solid #e3e9df;
    border-radius: 999px;
    background: #f6f8f5;
    overflow-x: auto;
}

.search-update-filter a {
    flex: 0 0 auto;
    padding: 5px 9px;
    border-radius: 999px;
    color: #65716a;
    font-size: 10px;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
}

.search-update-filter a:hover,
.search-update-filter a:focus-visible,
.search-update-filter a.is-active {
    background: #fff;
    color: var(--green-dark);
    box-shadow: 0 1px 4px rgba(31, 41, 36, .08);
}

.home-updates-list {
    display: grid;
    gap: 8px;
}

.home-update-card {
    display: grid;
    gap: 5px;
    padding: 12px 13px;
    border: 1px solid #e6e1d2;
    border-left: 3px solid #aab3ae;
    border-radius: 12px;
    background: #fffcf3;
    color: var(--ink);
    text-decoration: none;
}

.home-update-card.is-google { border-left-color: #4285f4; }
.home-update-card.is-yandex { border-left-color: #e43b36; }

.home-update-card:hover,
.home-update-card:focus-visible {
    border-color: #d8c58d;
    transform: translateY(-1px);
}

.home-update-card:focus-visible {
    outline: 2px solid rgba(138, 191, 78, .35);
    outline-offset: 2px;
}

.home-update-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.home-update-engine,
.home-update-status {
    font-size: 9px;
    font-weight: 750;
    line-height: 1.2;
}

.home-update-engine {
    color: #4b5650;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.home-update-card.is-google .home-update-engine { color: #2466c2; }
.home-update-card.is-yandex .home-update-engine { color: #b62d29; }

.home-update-status {
    color: #65716a;
    text-align: right;
}

.home-update-card b {
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

.home-update-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.45;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.home-update-card small {
    color: var(--muted);
    font-size: 10px;
}

.home-updates-empty {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 19px;
    padding: 16px;
    border-radius: 14px;
    background: #f4f7f4;
    color: #63706a;
}

.home-updates-empty .ui-icon {
    flex: 0 0 auto;
    color: #7a8780;
}

.home-updates-empty b {
    color: #445149;
    font-size: 13px;
    font-weight: 650;
}

.home-updates-empty p {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.5;
}

.home-comparison-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.home-comparison-card {
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid #e0e5eb;
    border-left: 4px solid #718197;
    border-radius: 13px;
    background: #f7f9fc;
    color: var(--ink);
    text-decoration: none;
}

.home-comparison-card > span,
.home-comparison-card b,
.home-comparison-card small {
    display: block;
    min-width: 0;
}

.home-comparison-card b {
    overflow: hidden;
    font-size: 13px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-comparison-card small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
}

.home-comparison-card .ui-icon {
    flex: 0 0 auto;
    color: #55677d;
}

.home-section-link {
    width: fit-content;
    margin-top: 14px;
}

.search-updates-hero { margin-bottom: 16px; }
.search-updates-hero p:last-child { max-width: 720px; margin-bottom: 0; }
.search-update-history-filter { margin-bottom: 16px; }

.search-update-history {
    display: grid;
    gap: 12px;
}

.search-update-history-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .75fr);
    gap: 12px;
    align-items: start;
}

.search-update-history-item > .home-update-card:only-child { grid-column: 1 / -1; }

.search-update-review {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid #e3e9df;
    border-radius: 12px;
    background: #f8faf7;
}

.search-update-review label,
.search-update-review label > span {
    display: grid;
    gap: 5px;
}

.search-update-review label > span {
    color: #59645e;
    font-size: 11px;
    font-weight: 650;
}

.search-update-review select { width: 100%; }

.search-update-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.search-update-review-actions .button {
    min-height: 36px;
    padding: 8px 11px;
    font-size: 11px;
}

.search-update-review-meta {
    align-self: center;
    margin: 0;
    padding: 12px;
    border-radius: 12px;
    background: #f4f7f4;
    color: var(--muted);
    font-size: 12px;
}

/* Personal SEO task manager */
.user-tasks-hero,
.user-task-detail-hero {
    align-items: center;
    margin-bottom: 16px;
}

.user-tasks-hero p:last-child,
.user-task-detail-hero p:last-child {
    max-width: 680px;
    margin-bottom: 0;
}

.user-task-views {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    overflow-x: auto;
}

.user-task-views a {
    flex: 0 0 auto;
    padding: 8px 13px;
    border: 1px solid #dfe6dc;
    border-radius: 999px;
    background: #fff;
    color: #5f6c65;
    font-size: 12px;
    font-weight: 650;
    text-decoration: none;
}

.user-task-views a:hover,
.user-task-views a:focus-visible,
.user-task-views a.is-active {
    border-color: #b9d992;
    background: #edf7df;
    color: var(--green-dark);
}

.user-task-toolbar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: end;
    gap: 14px;
    margin-bottom: 18px;
    padding: 12px 14px;
}

.user-task-filters {
    display: grid;
    grid-template-columns: minmax(190px, 1fr) minmax(145px, .65fr) minmax(125px, .45fr) auto auto;
    align-items: end;
    gap: 10px;
    min-width: 0;
}

.user-task-filters label,
.user-task-create label,
.user-task-edit-panel label,
.user-task-comment-form label {
    display: grid;
    min-width: 0;
    gap: 5px;
    margin: 0;
}

.user-task-filters label > span:first-child,
.user-task-create label > span:first-child,
.user-task-edit-panel label > span:first-child,
.user-task-comment-form label > span:first-child {
    color: #59645e;
    font-size: 11px;
    font-weight: 650;
}

.user-task-filters label em,
.user-task-create label em,
.user-task-edit-panel label em {
    color: var(--muted);
    font-size: 10px;
    font-style: normal;
    font-weight: 450;
}

.user-task-filters input,
.user-task-filters select,
.user-task-filters .button {
    min-height: 42px;
}

.user-task-filters > a {
    align-self: center;
    color: var(--green-dark);
    font-size: 12px;
}

.user-task-search-control { position: relative; display: block; }
.user-task-search-control .ui-icon {
    position: absolute;
    top: 50%;
    left: 11px;
    color: #87948d;
    transform: translateY(-50%);
    pointer-events: none;
}
.user-task-search-control input { width: 100%; padding-left: 35px; }

.user-tasks-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(290px, 27vw, 360px);
    gap: 16px;
    align-items: start;
}

.user-task-create,
.user-task-edit-panel,
.user-task-comments { padding: 22px; }
.user-task-results .section-heading { margin-bottom: 12px; }
.user-task-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.user-task-list > .account-empty-state { grid-column: 1 / -1; }

.user-seo-task-card {
    display: grid;
    min-width: 0;
    min-height: 188px;
    gap: 8px;
    padding: 15px 16px;
    border: 1px solid #e0e6e2;
    border-left: 4px solid #d6a63a;
    border-radius: 13px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
}

.user-seo-task-card.priority-high { border-left-color: #d75b52; }
.user-seo-task-card.priority-low { border-left-color: #7aa943; }
.user-seo-task-card.status-completed { opacity: .72; border-left-color: #8c9a92; }
.user-seo-task-card.status-deferred { border-left-color: #8c9a92; background: #f8faf9; }
.user-seo-task-card.is-overdue { background: #fffafa; }
.user-seo-task-card:hover,
.user-seo-task-card:focus-visible { border-color: #b9c9b3; transform: translateY(-1px); }
.user-seo-task-card:focus-visible { outline: 3px solid rgba(138, 191, 78, .2); outline-offset: 2px; }

.user-task-card-top,
.user-task-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.user-task-priority,
.user-task-status {
    font-size: 10px;
    font-weight: 700;
}
.user-seo-task-card:not(.is-compact) .user-task-priority {
    padding: 4px 8px;
    border-radius: 999px;
    line-height: 1;
}
.priority-high .user-task-priority { color: #a23d35; }
.priority-medium .user-task-priority { color: #8a6818; }
.priority-low .user-task-priority { color: #517c24; }
.user-seo-task-card:not(.is-compact).priority-high .user-task-priority { background: #fff0ed; color: #b83e36; }
.user-seo-task-card:not(.is-compact).priority-medium .user-task-priority { background: #fff7df; }
.user-seo-task-card:not(.is-compact).priority-low .user-task-priority { background: #eef8e5; }
.user-task-card-top > .ui-icon { color: #77857e; }
.user-seo-task-card:not(.is-compact) .user-task-status {
    padding: 4px 8px;
    border-radius: 999px;
    background: #f0f3f1;
    white-space: nowrap;
}
.user-task-status { color: #59645e; }
.user-seo-task-card:not(.is-compact).status-in_progress .user-task-status { background: #eaf4fd; color: #1768a5; }
.user-seo-task-card:not(.is-compact).status-completed .user-task-status { background: #edf7e8; color: #477729; }

.user-seo-task-card > b {
    overflow-wrap: anywhere;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.35;
}

.user-seo-task-card > p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.user-task-site {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    color: #52615a;
    font-size: 11px;
}

.user-task-card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 8px;
    border-top: 1px solid #edf0ee;
}

.user-task-card-bottom time {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--muted);
    font-size: 10px;
}
.user-seo-task-card.is-overdue .user-task-card-bottom time { color: #b83e36; font-weight: 650; }

.user-task-meta {
    color: var(--muted);
    font-size: 10px;
}
.user-task-meta time { text-align: right; }
.user-seo-task-card.is-overdue .user-task-meta time { color: #a23d35; font-weight: 650; }

.user-seo-task-card.is-compact {
    min-height: 0;
    gap: 5px;
    padding: 10px 11px;
    border-left-width: 3px;
}
.user-seo-task-card.is-compact > b { font-size: 12px; }
.user-seo-task-card.is-compact .user-task-priority { text-transform: uppercase; letter-spacing: .05em; }
.user-seo-task-card.is-compact .user-task-priority,
.user-seo-task-card.is-compact .user-task-status,
.user-seo-task-card.is-compact .user-task-meta { font-size: 9px; }

.user-task-create form,
.user-task-edit-panel form,
.user-task-comment-form { display: grid; gap: 12px; }
.user-task-create textarea,
.user-task-edit-panel textarea,
.user-task-comment-form textarea { resize: vertical; }
.user-task-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

.user-task-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e4e9e6;
}
.user-task-pagination a { color: var(--green-dark); font-size: 12px; font-weight: 650; text-decoration: none; }
.user-task-pagination span,
.user-task-pagination small { color: var(--muted); font-size: 11px; }

.user-task-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 16px;
    align-items: start;
}

.user-task-comment-list { display: grid; gap: 8px; }
.user-task-comment-list article {
    padding: 12px 13px;
    border: 1px solid #e4e9e6;
    border-radius: 12px;
    background: #f8faf8;
}
.user-task-comment-list header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.user-task-comment-list header b { font-size: 12px; }
.user-task-comment-list time { color: var(--muted); font-size: 10px; }
.user-task-comment-list p { margin: 7px 0 0; white-space: pre-wrap; font-size: 12px; line-height: 1.5; }
.user-task-comment-form { margin-top: 14px; padding-top: 14px; border-top: 1px solid #e4e9e6; }

@media (max-width: 980px) {
    .home-workspace-grid { grid-template-columns: 1fr; }
    .home-site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .user-tasks-layout,
    .user-task-detail-layout { grid-template-columns: 1fr; }
    .user-task-toolbar { grid-template-columns: 1fr; align-items: stretch; }
    .user-task-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .user-task-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .topbar { padding-inline: 14px; }
    .home-workspace-hero { gap: 18px; padding-top: 8px; }
    .home-portfolio-summary { width: 100%; min-width: 0; }
    .home-sites-panel,
    .home-tasks-panel,
    .home-updates-panel,
    .home-comparisons-panel { padding: 18px; }
    .home-site-grid,
    .home-sidebar,
    .home-comparison-list { grid-template-columns: 1fr; }
    .home-sites-toolbar { grid-template-columns: 1fr auto; }
    .home-sites-search { grid-column: 1 / -1; }
    .home-seo-site-card { min-height: 195px; }
    .search-update-history-item { grid-template-columns: 1fr; }
    .search-update-review-actions .button { width: 100%; }
    .user-tasks-hero,
    .user-task-detail-hero { align-items: flex-start; }
    .user-tasks-hero .button,
    .user-task-detail-hero .button { width: 100%; }
    .user-task-toolbar { padding: 10px; }
    .user-task-filters { grid-template-columns: 1fr; }
    .user-task-list { grid-template-columns: 1fr; }
    .user-task-form-row { grid-template-columns: 1fr; }
    .user-task-card-top,
    .user-task-meta { align-items: flex-start; }
    .user-task-meta { flex-direction: column; gap: 3px; }
    .user-task-meta time { text-align: left; }
    .home-task-actions { align-items: flex-start; flex-direction: column; }
    .home-source-statuses > div { grid-template-columns: 1fr; gap: 2px; }
    .home-source-statuses dd { text-align: left; }
    .home-sites-list-footer { align-items: stretch; flex-direction: column; }
    .home-sites-more { width: 100%; }
}

/* SeoSite overview dashboard */
.search-dashboard-hero { margin-bottom: 12px; }
.dashboard-source-inline { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.dashboard-source-inline span { padding: 5px 9px; border-radius: 999px; background: #edf1ee; color: var(--muted); font-size: 11px; font-weight: 650; }
.dashboard-source-inline span.is-ready { background: #e4f5e8; color: var(--green); }
.dashboard-hero-period { flex: 0 0 auto; padding-left: 22px; border-left: 1px solid var(--line); text-align: right; }
.dashboard-hero-period span,.dashboard-hero-period b { display: block; }
.dashboard-hero-period span { color: var(--muted); font-size: 11px; }
.dashboard-hero-period b { margin-top: 3px; font-size: 14px; font-weight: 650; }
.dashboard-attention { margin: 0 0 12px; background: #fff6dc; color: #735711; }
.dashboard-toolbar { margin-bottom: 12px; }
.dashboard-toolbar > form { display: flex; align-items: end; gap: 10px; width: 100%; }
.dashboard-toolbar label { min-width: 150px; margin: 0; }
.dashboard-toolbar label:first-child { flex: 1 1 230px; }
.dashboard-toolbar .button { min-height: 46px; }
.dashboard-custom-period { display: flex; align-items: end; gap: 8px; }
.dashboard-custom-period[hidden] { display: none; }
.dashboard-custom-period label { min-width: 135px; }
.dashboard-fact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-bottom: 10px; }
.dashboard-fact { min-width: 0; padding: 13px 15px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.dashboard-fact span,.dashboard-fact b,.dashboard-fact small { display: block; }
.dashboard-fact span { color: var(--muted); font-size: 11px; }
.dashboard-fact b { margin: 3px 0; font-size: 15px; font-weight: 650; }
.dashboard-fact small { color: #7c8781; font-size: 11px; line-height: 1.4; }
.dashboard-provider-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dashboard-provider-panel { min-width: 0; padding: 17px; box-shadow: 0 9px 27px rgba(24,47,37,.045); }
.dashboard-provider-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.dashboard-provider-heading .positions-source-status { min-width: 0; margin: 0; }
.dashboard-provider-heading .resource-state-list { justify-content: flex-end; }
.dashboard-provider-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 14px; margin: 13px 0 4px; padding-top: 11px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.dashboard-provider-meta b { color: var(--ink); font-weight: 600; }
.site-access-badges { display: inline-flex; flex-wrap: wrap; gap: 4px; vertical-align: middle; margin-left: 6px; }
.site-access-badges .entity-type { white-space: nowrap; }
.dashboard-read-source-form { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin: 10px 0; }
.dashboard-read-source-form label { display: grid; gap: 4px; min-width: min(220px, 100%); }
.dashboard-provider-panel .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-provider-panel .dashboard-kpi-grid article { min-width: 0; box-shadow: none; }
.dashboard-provider-panel .dashboard-kpi-grid b { overflow-wrap: anywhere; }
.dashboard-goal-selection { display: grid; gap: 10px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 13px; background: #f8faf8; }
.dashboard-goal-selection p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.dashboard-goal-selection form { display: flex; align-items: end; gap: 8px; flex-wrap: wrap; }
.dashboard-goal-selection label { flex: 1 1 210px; margin: 0; }
.dashboard-goal-selection .button { min-height: 42px; }
.dashboard-goal-facts { display: flex; align-items: baseline; gap: 9px 16px; flex-wrap: wrap; font-size: 13px; }
.dashboard-goal-facts strong { flex-basis: 100%; }
.dashboard-goal-facts small { color: var(--muted); }
.dashboard-chart-panel { margin-top: 10px; padding: 18px; }
.dashboard-chart-heading { align-items: flex-start; gap: 20px; margin-bottom: 10px; }
.dashboard-chart-heading h2 { font-size: 20px; }
.dashboard-chart-heading p:last-child { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.dashboard-chart-metrics { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.dashboard-chart-source-group { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.dashboard-chart-source-group > span { color: var(--muted); font-size: 11px; font-weight: 650; white-space: nowrap; }
.dashboard-chart-metrics button { padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--muted); font: inherit; font-size: 11px; font-weight: 650; cursor: pointer; }
.dashboard-chart-metrics button:hover:not(:disabled),.dashboard-chart-metrics button.is-active { border-color: var(--green); background: #edf5ef; color: var(--green); }
.dashboard-chart-metrics button:disabled { opacity: .42; cursor: not-allowed; }
.dashboard-chart-stage { min-height: 280px; display: grid; place-items: center; overflow: hidden; border-radius: 13px; background: linear-gradient(180deg,#fbfcfb,#f5f8f5); }
.dashboard-chart-stage > p { margin: 0; color: var(--muted); font-size: 12px; }
.dashboard-chart-stage svg { display: block; width: 100%; height: 280px; }
.dashboard-chart-gridline { stroke: #dfe6e1; stroke-width: 1; }
.dashboard-chart-axis { fill: #748079; font: 11px Inter,ui-sans-serif,system-ui,sans-serif; }
.dashboard-chart-line { fill: none; stroke: var(--green); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.dashboard-chart-point { fill: #fff; stroke: var(--green); stroke-width: 2; }
.dashboard-chart-footer { display: flex; justify-content: space-between; gap: 16px; padding-top: 9px; color: var(--muted); font-size: 11px; }
.dashboard-chart-footer span:first-child { color: var(--ink); font-weight: 650; }
.dashboard-secondary-grid { margin-top: 10px; }
.dashboard-empty-copy { margin: 14px 0 0; color: var(--muted); font-size: 12px; }

@media (max-width: 980px) {
    .dashboard-toolbar > form { flex-wrap: wrap; }
    .dashboard-toolbar label:first-child { flex-basis: 100%; }
    .dashboard-provider-grid { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
    .search-dashboard-hero { align-items: flex-start; }
    .dashboard-hero-period { width: 100%; padding: 10px 0 0; border-top: 1px solid var(--line); border-left: 0; text-align: left; }
    .dashboard-toolbar > form,.dashboard-custom-period { display: grid; grid-template-columns: 1fr; width: 100%; }
    .dashboard-toolbar label,.dashboard-custom-period label { min-width: 0; width: 100%; }
    .dashboard-fact-grid,.dashboard-provider-panel .dashboard-kpi-grid { grid-template-columns: 1fr; }
    .dashboard-provider-heading,.dashboard-chart-heading,.dashboard-chart-footer { align-items: flex-start; flex-direction: column; }
    .dashboard-chart-metrics { justify-content: flex-start; }
    .dashboard-chart-stage,.dashboard-chart-stage svg { min-height: 235px; height: 235px; }
}

/* SeoSite Timeline and dashboard note markers */
.dashboard-chart-actions { display: grid; justify-items: end; gap: 8px; }
.dashboard-timeline-link { padding: 7px 10px; font-size: 11px; }
.dashboard-chart-event-line { stroke: #a47c2b; stroke-width: 1; stroke-dasharray: 4 5; opacity: .48; }
.dashboard-chart-event { color: #725313; cursor: pointer; outline: none; }
.dashboard-chart-event circle { fill: #fff7dc; stroke: #8a671d; stroke-width: 2; }
.dashboard-chart-event path { fill: none; stroke: #725313; stroke-width: 1.5; stroke-linecap: round; }
.dashboard-chart-event:hover circle,.dashboard-chart-event:focus circle { fill: #f3d978; stroke-width: 3; }
.dashboard-chart-event-detail { display: grid; gap: 4px; margin-top: 10px; padding: 12px 14px; border: 1px solid #ead9a7; border-radius: 12px; background: #fffbef; }
.dashboard-chart-event-detail[hidden] { display: none; }
.dashboard-chart-event-detail > div { display: flex; justify-content: space-between; gap: 12px; color: #725313; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.dashboard-chart-event-detail b { font-size: 14px; }
.dashboard-chart-event-detail p { margin: 0; color: #46504a; font-size: 12px; white-space: pre-wrap; }
.dashboard-chart-event-detail small { color: var(--muted); }

.timeline-hero { margin-bottom: 18px; }
.timeline-legend { display: grid; grid-template-columns: 10px auto; align-items: center; gap: 2px 8px; min-width: 230px; padding: 12px 14px; border: 1px solid #ead9a7; border-radius: 13px; background: #fffbef; }
.timeline-legend > span { grid-row: 1 / span 2; width: 10px; height: 10px; border: 2px solid #8a671d; border-radius: 50%; background: #fff7dc; }
.timeline-legend b { font-size: 12px; }
.timeline-legend small { color: var(--muted); font-size: 10px; }
.timeline-layout { display: grid; grid-template-columns: minmax(270px,.7fr) minmax(0,1.3fr); align-items: start; gap: 16px; }
.timeline-compose { position: sticky; top: 16px; padding: 22px; }
.timeline-compose .section-heading { margin-bottom: 18px; }
.timeline-compose label { margin-bottom: 14px; }
.timeline-author { margin: -2px 0 14px; color: var(--muted); font-size: 11px; }
.timeline-readonly { padding: 22px; }
.timeline-readonly p:last-child { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.timeline-stream { position: relative; min-width: 0; }
.timeline-stream::before { position: absolute; z-index: -1; top: 74px; bottom: 28px; left: 19px; width: 1px; background: #dccb99; content: ''; }
.timeline-stream > .section-heading { margin: 0 0 12px; }
.timeline-note { position: relative; margin-bottom: 10px; padding: 18px 20px 18px 46px; box-shadow: 0 9px 27px rgba(24,47,37,.045); }
.timeline-note-marker { position: absolute; top: 22px; left: 13px; width: 13px; height: 13px; border: 3px solid #8a671d; border-radius: 50%; background: #fff7dc; box-shadow: 0 0 0 5px var(--paper); }
.timeline-note header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.timeline-note header > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.timeline-note time { font-size: 12px; font-weight: 750; }
.timeline-note header small { color: var(--muted); font-size: 10px; }
.timeline-manual-badge { padding: 3px 7px; border-radius: 999px; background: #fff3c8; color: #725313; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.timeline-note h3 { margin-bottom: 6px; font-size: 16px; }
.timeline-note > p { margin: 0; color: #56615b; font-size: 12px; white-space: pre-wrap; }
.timeline-edit { margin-top: 14px; border-top: 1px solid var(--line); }
.timeline-edit summary { width: fit-content; padding-top: 10px; color: var(--green); font-size: 11px; font-weight: 750; cursor: pointer; }
.timeline-edit form { margin-top: 12px; }
.timeline-edit label { margin-bottom: 10px; }
.timeline-delete { text-align: right; }
.timeline-delete button { border: 0; background: transparent; color: var(--red); font: inherit; font-size: 11px; font-weight: 650; cursor: pointer; }
.timeline-empty { display: flex; align-items: center; gap: 14px; padding: 24px; color: var(--muted); }
.timeline-empty h3 { color: var(--ink); }
.timeline-empty p { margin: 3px 0 0; font-size: 12px; }

@media (max-width: 820px) {
    .timeline-layout { grid-template-columns: 1fr; }
    .timeline-compose { position: static; }
}

@media (max-width: 650px) {
    .dashboard-chart-actions { justify-items: start; width: 100%; }
    .dashboard-chart-event-detail > div,.timeline-note header { flex-direction: column; }
    .timeline-legend { width: 100%; min-width: 0; }
    .timeline-note { padding: 16px 16px 16px 40px; }
    .timeline-note-marker { left: 10px; }
    .timeline-stream::before { left: 16px; }
}

/* The same permission-scoped header navigation becomes an in-flow mobile menu. */
.account-form .field-error { display: block; margin: 6px 0 12px; color: var(--red); font-size: 12px; font-weight: 650; line-height: 1.4; }
.account-form [aria-invalid="true"] { border-color: var(--red); }
.mobile-menu-toggle,.topbar-actions .mobile-only-link { display: none; }

@media (max-width: 800px) {
    .topbar {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        height: auto;
        min-height: 76px;
        align-items: center;
        gap: 0 12px;
        padding-block: 12px;
    }
    .topbar .brand { min-width: 0; }
    .mobile-menu-toggle {
        display: inline-flex;
        width: 44px;
        height: 44px;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--line);
        border-radius: 11px;
        background: #fff;
        color: var(--ink);
        cursor: pointer;
    }
    .mobile-menu-toggle[aria-expanded="true"] { border-color: var(--green); color: var(--green); }
    .topbar .topbar-actions { display: none; }
    .topbar .topbar-actions.is-mobile-open {
        display: flex;
        grid-column: 1 / -1;
        width: 100%;
        max-height: min(65vh, 560px);
        min-width: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        overflow-x: hidden;
        overflow-y: auto;
        margin-top: 12px;
        padding: 12px 0 2px;
        border-top: 1px solid var(--line);
    }
    .topbar .topbar-actions.is-mobile-open .knowledge-link,
    .topbar .topbar-actions.is-mobile-open .mobile-only-link {
        display: flex;
        min-height: 46px;
        align-items: center;
        gap: 9px;
        padding: 10px 12px;
        border-radius: 9px;
        color: var(--ink);
        font-size: 14px;
        white-space: normal;
    }
    .topbar .topbar-actions.is-mobile-open .knowledge-link:hover { background: #f0f6eb; color: var(--green); }
    .topbar .topbar-actions.is-mobile-open form { width: 100%; }
    .topbar .topbar-actions.is-mobile-open .text-button {
        width: 100%;
        min-height: 46px;
        padding: 10px 12px;
        text-align: left;
        font-size: 14px;
    }
}